/* Burs Yönetimi 7 — öğrenci portalı.
 *
 * Mobil öncelikli yazılmıştır: öğrenciler bu ekranlara çoğunlukla telefondan,
 * çoğu zaman zayıf bağlantıyla girer. Bu yüzden tek sütun akış, büyük dokunma
 * hedefleri ve iOS'ta odaklanınca yakınlaştırmayı önleyen 16px giriş yazısı
 * esastır. Geniş ekran, dar ekranın üstüne eklenir; tersi değil.
 *
 * Renkler site temasından bağımsız olsun diye değişkenle tanımlanır; kurum
 * kendi rengini tek yerden değiştirebilir.
 */

/* Portal sayfası tema içinde de tek bir iş akışı olarak kalmalı. Odak
   başvurudadır; temanın yan sütunu masaüstünde formu gereksiz daraltmamalı,
   sabit mobil araçları da sayfaya yatay kaydırma eklememelidir. Kurallar
   body sınıfıyla sınırlandığı için sitenin diğer sayfalarını etkilemez. */
body.bys-portal-page,
body.bys-portal-page #safirPage {
    max-width: 100%;
    overflow-x: clip;
}

/* Portal yalnız Safir temasında çalışmıyor. Blok temaları içerik alanına
   masaüstü content-size değerini min-width gibi taşıyabiliyor; çocuk yüzde
   100 olsa bile telefon ekranından geniş hesaplanıyor ve body'deki clip
   yalnız hatayı gizliyor. Yaygın WordPress içerik katmanlarını viewport'a
   bağlamak başlık, bilgi kutusu ve alanların birlikte kırpılmasını önler. */
body.bys-portal-page :is(.wp-site-blocks, main, .wp-block-post-content, .entry-content) {
    box-sizing: border-box;
    max-width: 100%;
    min-width: 0;
}

body.bys-portal-page :is(.wp-block-post-title, .entry-title) {
    width: auto;
    /* WordPress blok teması iki marjı !important ile auto yapıyor; içerik
       genişliği viewport'tan büyük olduğunda sağ marj negatife dönüşüyor. */
    margin-inline: 0 !important;
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
}

@media (min-width: 768px) {
    body.bys-portal-page #aside {
        display: none;
    }

    body.bys-portal-page .innerContainer.main {
        display: block;
    }

    body.bys-portal-page #content.contentBox {
        float: none;
        width: 100%;
        max-width: none;
    }

    body.bys-portal-page .bys-portal,
    body.bys-portal-page .bys-form-embed {
        max-width: 760px;
    }
}

.bys-portal,
.bys-form-embed {
    --bys-p-brand: #1d3f6e;
    --bys-p-brand-soft: #eef4fb;
    --bys-p-ink: #1c2430;
    --bys-p-ink-soft: #4a5566;
    --bys-p-line: #d8dde5;
    --bys-p-surface: #fff;
    /* Soft yeşil zeminde 4.5:1 eşiğini geçmesi için bir tık koyu. */
    --bys-p-ok: #147a3a;
    --bys-p-ok-soft: #e8f6ec;
    --bys-p-warn: #b45309;
    --bys-p-warn-soft: #fffaf2;
    --bys-p-bad: #b91c1c;
    --bys-p-bad-soft: #fdeceb;

    /* Dokunma hedefi en az 44px olmalı (WCAG 2.5.5). */
    --bys-p-touch: 44px;
    --bys-p-radius: 10px;

    /* Seçim kutusunun kendi çizdiğimiz oku. Veri URI'si içindeki renk
       değişkenle yazılamaz; bu yüzden ok TEK yerde tanımlanır ve iki
       seçici de buradan okur. Kurum rengini değiştirdiğinde tek satır
       güncellenir. */
    --bys-p-select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23556' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
}

.bys-portal {
    max-width: 640px;
    width: 100%;
    box-sizing: border-box;
    margin: 0 auto;
    padding: 1rem;
    color: var(--bys-p-ink);
    line-height: 1.55;
}

/* Portal rastgele bir WordPress temasının içerik kolonunda çalışır. Uzun
   adresler ve tema tarafından atanmış min-width değerleri dar ekranda kartı
   dışarı itmemeli. */
.bys-portal *,
.bys-portal *::before,
.bys-portal *::after {
    box-sizing: border-box;
    min-width: 0;
}

.bys-portal p,
.bys-portal a,
.bys-portal dd,
.bys-portal li {
    overflow-wrap: anywhere;
}

.bys-portal h2 { margin-top: 0; line-height: 1.3; }
.bys-portal h3 { line-height: 1.35; }

/* ---------- Kartlar ---------- */

.bys-portal-card {
    background: var(--bys-p-surface);
    border: 1px solid var(--bys-p-line);
    border-radius: var(--bys-p-radius);
    padding: 1rem;
    margin: 1rem 0;
}

@media (min-width: 480px) {
    .bys-portal-card { padding: 1.25rem 1.5rem; }
}

@media (max-width: 479px) {
    /* Başlık ve form aynı tema sütununu kullanır. Viewport genişliğini
       yeniden hesaplamak tema iç boşluğunu yok sayıp sağa taşır. */
    body.bys-portal-page .wp-block-post-title {
        width: auto;
        max-width: 100%;
        overflow-wrap: anywhere;
    }

    /* İç içe alignfull bloklarında negatif marj ve ikinci tema padding'i
       öğrenci formunu iki kez daraltmasın. Dış tema boşluğu korunur. */
    body.bys-portal-page .wp-block-post-content.alignfull {
        margin-inline: 0 !important;
        padding-inline: 0;
    }

    .bys-portal {
        width: 100%;
        max-width: 100%;
        padding-inline: .75rem;
    }

    /* Başvuruya Başla ve Başvurularım girişinde sayfanın sağ altındaki
       sabit site araçları son düğmenin üstünü örtebilir. Boşluk yalnız bu
       iki kısa giriş ekranında bırakılır; uzun Gravity Forms ekranına ve
       oturum içindeki Başvurularım sayfasına eklenmez. */
    .bys-start:not(.bys-form-shell),
    .bys-login {
        padding-bottom: 5.5rem;
    }
}

/* ---------- Formlar ---------- */

.bys-portal .bys-portal-form { display: grid; gap: .75rem; margin: 1rem 0; }

.bys-portal .bys-portal-form label {
    font-weight: 600;
    font-size: .95rem;
    display: block;
    margin-bottom: .25rem;
}

/* Kapsayıcı sınıf bilerek yazılır: portal, kendi CSS'ini getiren rastgele
   bir temanın içinde çiziliyor. Tema form alanlarını çoğu kez daha yüksek
   özgüllükle hedefler (ör. `form input[type="text"]` → 0,1,2); bizim
   `.bys-portal-form input` kuralı 0,1,1 kaldığı için eziliyordu ve yazı
   boyutu 14px'e düşüyordu. `.bys-portal` eklenince 0,2,1 olur ve tema
   kuralını geçer — !important'a gerek kalmaz. */
.bys-portal .bys-portal-form :is(input, select, textarea) {
    width: 100%;
    box-sizing: border-box;
    /* 16px altı yazı iOS'ta odaklanınca sayfayı yakınlaştırır. */
    font-size: 16px;
    min-height: var(--bys-p-touch);
    padding: .6rem .75rem;
    /* Denetim kenarlığı WCAG 1.4.11 uyarınca en az 3:1 olmalı; #9aa3b0
       beyaz üzerinde 2.55:1 idi ve alan sınırı güneşte görünmüyordu. */
    border: 1px solid #878e99;
    border-radius: 8px;
    background: #fff;
    color: var(--bys-p-ink);
}

.bys-portal .bys-portal-form textarea { min-height: 6rem; line-height: 1.5; }

.bys-portal .bys-portal-form input:focus,
.bys-portal .bys-portal-form select:focus,
.bys-portal .bys-portal-form textarea:focus {
    outline: 3px solid rgba(29, 63, 110, .35);
    outline-offset: 1px;
    border-color: var(--bys-p-brand);
}

/* Dosya seçimi telefonda en zor adımdır; hedefi büyük tutulur. */
.bys-portal .bys-portal-form input[type="file"] {
    padding: .6rem;
    background: var(--bys-p-brand-soft);
    border-style: dashed;
}

/* ---------- Düğmeler ---------- */

.bys-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--bys-p-touch);
    background: var(--bys-p-brand);
    color: #fff;
    border: 0;
    border-radius: 8px;
    padding: .65rem 1.25rem;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
}

/* Dar ekranda düğme tam genişlik: başparmakla ıskalanmaz. */
@media (max-width: 479px) {
    .bys-button { width: 100%; }
}

.bys-button:hover { background: #16325a; color: #fff; }
.bys-button:focus-visible { outline: 3px solid rgba(29, 63, 110, .45); outline-offset: 2px; }
.bys-button-secondary { background: #5a6472; }
.bys-button-secondary:hover { background: #48515d; }
.bys-button:disabled,
.bys-button:disabled:hover { opacity: .55; cursor: not-allowed; background: #5a6472; }

.bys-button[aria-busy="true"] { opacity: .7; cursor: progress; }

/* ---------- Bilgi kutuları ---------- */

.bys-portal-notice {
    background: var(--bys-p-brand-soft);
    border-left: 4px solid var(--bys-p-brand);
    padding: .75rem 1rem;
    margin: .75rem 0;
    border-radius: 6px;
}

.bys-portal-notice-error {
    background: var(--bys-p-bad-soft);
    border-left-color: var(--bys-p-bad);
}

.bys-portal-notice-success {
    background: var(--bys-p-ok-soft);
    border-left-color: var(--bys-p-ok);
}

.bys-temporary-code {
    font-size: 1.25rem;
    letter-spacing: .12em;
    font-weight: 700;
}

/* ---------- Başvuru özeti ---------- */

.bys-portal-summary { display: grid; gap: .75rem; margin: 0; }

@media (min-width: 480px) {
    .bys-portal-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.bys-portal-summary dt {
    font-size: .8rem;
    color: var(--bys-p-ink-soft);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.bys-portal-summary dd { margin: .15rem 0 0; font-size: 1.05rem; }

/* ---------- Sizden istenenler ---------- */

.bys-requested { border-left: 4px solid var(--bys-p-warn); }

.bys-requested-item {
    border: 1px solid #e6d9c2;
    background: var(--bys-p-warn-soft);
    border-radius: var(--bys-p-radius);
    padding: 1rem;
    margin: 1rem 0;
}

.bys-requested-item h4 { margin: 0 0 .5rem; font-size: 1.05rem; }
.bys-requested-note { margin: 0 0 .5rem; }

.bys-requested-source {
    margin: 0 0 .6rem;
    font-size: .95rem;
    line-height: 1.55;
    color: var(--bys-p-ink-soft);
}

/* Resmî bağlantı bir düğme gibi görünür: telefonda kaçırılmaz. */
.bys-requested-source a {
    display: inline-block;
    min-height: var(--bys-p-touch);
    line-height: var(--bys-p-touch);
    font-weight: 600;
}

.bys-requested-item .bys-portal-form { margin-top: 1rem; }

/* ---------- Mesajlar ---------- */

.bys-portal-messages { list-style: none; padding: 0; margin: 0; }

.bys-message {
    border: 1px solid var(--bys-p-line);
    border-radius: 8px;
    padding: .75rem .9rem;
    margin: .75rem 0;
}

.bys-message-admin { background: #f6f9ff; }
.bys-message-applicant { background: #f8fff5; }
.bys-message-system, .bys-message-system p { color: #5a6472; font-style: italic; }

.bys-message-meta {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: .35rem;
    font-size: .82rem;
    color: var(--bys-p-ink-soft);
    margin: 0 0 .35rem;
}

/* Gövde artık satır satır <p> olarak çizilir; pre-line satır sonlarını
   ikinci kez boşluğa çevirip araları açıyordu. */
.bys-message-body { margin: 0 0 .4rem; }

.bys-portal-attachments {
    list-style: none;
    padding: 0;
    margin: .5rem 0 0;
    font-size: .9rem;
}

.bys-portal-attachments a {
    display: inline-block;
    min-height: var(--bys-p-touch);
    line-height: var(--bys-p-touch);
    font-weight: 600;
}

/* ---------- Belge listesi ---------- */

.bys-document-replacement {
    margin: 1rem 0 1.25rem;
    padding: 1rem;
    border: 2px solid var(--bys-p-brand);
    border-radius: var(--bys-p-radius);
    background: #f5f8ff;
    box-shadow: 0 3px 12px rgba(21, 58, 99, .08);
}

.bys-document-replacement-kicker {
    margin: 0 0 .25rem;
    color: var(--bys-p-brand);
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.bys-document-replacement h4 { margin: 0 0 .5rem; font-size: 1.08rem; }
.bys-document-replacement > p:not(.bys-document-replacement-kicker) { margin: 0 0 .75rem; }
.bys-document-replacement .bys-portal-form { margin-top: .75rem; }

.bys-portal-document-list-heading { margin: 0 0 .35rem; }

.bys-portal-documents { list-style: none; padding: 0; margin: 0; }

.bys-portal-documents li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    padding: .7rem 0;
    border-bottom: 1px solid #eceef1;
    flex-wrap: wrap;
}

.bys-portal-documents li:last-child { border-bottom: 0; }

.bys-portal-document-main {
    display: grid;
    gap: .25rem;
    min-width: 0;
}

.bys-portal-document-links {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem .75rem;
    align-items: center;
    font-size: .9rem;
}

.bys-portal-document-links a {
    display: inline-flex;
    align-items: center;
    min-height: var(--bys-p-touch);
    color: var(--bys-p-brand);
    font-weight: 600;
}

.bys-document-replace-link {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: var(--bys-p-touch);
    color: var(--bys-p-brand);
    font-size: .9rem;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: .16em;
}

.bys-document-replacement:target {
    outline: 3px solid rgba(21, 58, 99, .2);
    outline-offset: 3px;
}

/* Durum yalnız renkle değil metinle de anlatılır (renk körlüğü). */
.bys-doc-verified { color: var(--bys-p-ok); font-weight: 600; }
.bys-doc-invalid { color: var(--bys-p-bad); font-weight: 600; }

/* ---------- Sonuç kartı ---------- */

.bys-result-card {
    border: 2px solid var(--bys-p-brand);
    border-radius: var(--bys-p-radius);
    padding: 1.25rem 1rem;
    text-align: center;
    margin: 1rem 0;
}

.bys-result-positive { border-color: var(--bys-p-ok); background: var(--bys-p-ok-soft); }
.bys-result-negative { border-color: var(--bys-p-bad); background: var(--bys-p-bad-soft); }
.bys-result-text { font-size: 1.2rem; font-weight: 700; line-height: 1.4; }

/* ---------- Rozetler ---------- */

.bys-badge {
    display: inline-block;
    padding: .2rem .65rem;
    border-radius: 999px;
    font-size: .85rem;
    font-weight: 600;
    background: #eceef1;
    color: var(--bys-p-ink-soft);
}

.bys-badge-positive { background: #d9f0d9; color: #14612a; }
.bys-badge-reserve  { background: #fdf3d7; color: #6b4e00; }
.bys-badge-negative { background: #f8d7da; color: #8a1f2a; }
.bys-badge-review   { background: #dbe9fb; color: #1a3763; }

/* ---------- Erişilebilirlik yardımcıları ---------- */

.bys-portal .screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
}

@media (prefers-reduced-motion: reduce) {
    .bys-portal * { transition: none !important; animation: none !important; }
}

/* Sonuç sayfası yazdırıldığında yalnız içerik kalsın. */
@media print {
    .bys-portal-form, .bys-button { display: none; }
    .bys-portal-card { border: 1px solid #999; break-inside: avoid; }
}

/* Dosya seçimi geri bildirimi (portal.js tarafından doldurulur). */
.bys-file-report {
    margin: .4rem 0 0;
    font-size: .9rem;
    color: var(--bys-p-ink-soft);
}

.bys-file-report-error {
    color: var(--bys-p-bad);
    font-weight: 600;
}

.bys-file-clear {
    min-height: var(--bys-p-touch);
    width: fit-content;
    padding: .5rem .8rem;
    border: 1px solid var(--bys-p-line);
    border-radius: 7px;
    background: #fff;
    color: var(--bys-p-brand);
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}

.bys-file-clear:hover { background: var(--bys-p-brand-soft); }
.bys-file-clear:focus-visible { outline: 3px solid rgba(29, 63, 110, .35); outline-offset: 2px; }

/* ---------- Mesaj gövdesi: kalıp mı, insan mı? ----------
   Öğrenci de kalıp cümle duvarıyla karşılaşmasın: yöneticinin kendi
   yazdığı asıl cümle ayrı bir kutuda öne çıkar. */

.bys-portal .bys-message-body p { margin: 0 0 .35rem; }
.bys-portal .bys-message-body p:last-child { margin-bottom: 0; }

.bys-portal .bys-msg-intro,
.bys-portal .bys-msg-closing,
.bys-portal .bys-msg-system {
    color: var(--bys-p-ink-soft);
    font-size: .92rem;
}

.bys-portal .bys-msg-item { font-weight: 650; }

.bys-portal .bys-msg-authored,
.bys-portal .bys-msg-note {
    font-weight: 600;
    background: var(--bys-p-brand-soft);
    border-left: 3px solid var(--bys-p-brand);
    padding: .5rem .7rem;
    border-radius: 6px;
    margin: .35rem 0;
}

.bys-portal .bys-msg-source,
.bys-portal .bys-msg-link { color: var(--bys-p-ink-soft); font-size: .9rem; }

.bys-portal .bys-msg-tag {
    font-weight: 700;
    font-size: .72rem;
    text-transform: uppercase;
    color: var(--bys-p-ink-soft);
    margin-right: .3rem;
}

/* ---- Başvuruya Başla: temel bilgiler adımı ----
   Ekran öğrencinin gördüğü ilk sayfa; ne yapacağı ve bunun ne anlama
   geldiği yazıyla anlatılır. Boş bir kutu ve tek düğme, öğrenciyi
   "yanlış sayfaya mı geldim" sorusuyla baş başa bırakıyordu. */
.bys-portal-kicker {
    margin: 0 0 .15rem;
    font-size: .8rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--bys-p-brand);
    font-weight: 600;
}

.bys-portal-lede {
    margin: 0 0 1rem;
    color: var(--bys-p-ink-soft);
}

.bys-portal-info,
.bys-portal-recap {
    margin: 0 0 1rem;
    padding: .75rem .9rem;
    background: var(--bys-p-brand-soft);
    border-radius: var(--bys-p-radius);
    color: var(--bys-p-ink-soft);
    font-size: .95rem;
}

/* Alanın altındaki açıklama etikete değil, girdiye bitişik durmalı. */
.bys-portal-hint {
    display: block;
    margin: -.5rem 0 .9rem;
    color: var(--bys-p-ink-soft);
    font-size: .875rem;
}

/* Onay kutusu ile metni aynı satırda başlatır; metin uzunsa girinti korunur.
   Form içindeki genel `label { display:block }` ve alan kuralı (tam genişlik,
   44px yükseklik) bu satırı eziyor, kutu metnin ilk satırıyla hizalanmıyordu;
   kurallar bu yüzden form kapsayıcısıyla birlikte yazılır. */
.bys-portal-check,
.bys-portal .bys-portal-form .bys-portal-check {
    display: flex;
    gap: .6rem;
    align-items: flex-start;
    margin: .5rem 0 1rem;
    font-size: .95rem;
    line-height: 1.5;
    font-weight: 400;
}

.bys-portal-check input[type="checkbox"],
.bys-portal .bys-portal-form .bys-portal-check input[type="checkbox"] {
    flex: 0 0 auto;
    width: 1.15rem;
    height: 1.15rem;
    min-height: 0;
    margin: calc((1.5em - 1.15rem) / 2) 0 0;
    padding: 0;
}

/* Öğrencinin kanal bazlı duyuru tercihleri tema fieldset boşluklarına
   bırakılmaz; mevcut onay kutusu bileşeniyle aynı hizada kalır. */
.bys-choice-group {
    margin: 1rem 0;
    padding: 0;
    border: 0;
}

.bys-choice-group legend {
    margin-bottom: .5rem;
    color: var(--bys-p-ink);
    font-weight: 650;
}

.bys-choice-group .bys-portal-check {
    margin: .4rem 0;
}

.bys-portal-privacy {
    margin: 0 0 1rem;
}
/* Formun içinde metin ve onay kutusu tek bir adım gibi art arda durur. */
.bys-portal .bys-portal-form .bys-portal-privacy { margin: 1rem 0 0; }
.bys-portal .bys-portal-form .bys-privacy-disclosure { margin-bottom: .25rem; }

.bys-privacy-disclosure {
    margin: .6rem 0;
    border: 1px solid var(--bys-p-line);
    border-radius: var(--bys-p-radius);
    background: #fff;
}

.bys-privacy-disclosure > summary {
    padding: .75rem .9rem;
    cursor: pointer;
    color: var(--bys-p-brand);
    font-weight: 650;
}

.bys-privacy-disclosure > div {
    padding: 0 .9rem .85rem;
    color: var(--bys-p-ink-soft);
    font-size: .9rem;
}

.bys-privacy-disclosure > div p {
    margin: .7rem 0 0;
}

/* "Kodu yeniden gönder" ikincil bir eylemdir; ana düğmeyle yarışmamalı. */
.bys-portal-inline {
    margin-top: .75rem;
}

/* Oturum süresi bildirimi: uyarı değil bilgi tonunda; öğrenciyi
   telaşlandırmadan "süren var ama sonsuz değil" demeli. */
.bys-session-note {
    margin: 1.25rem 0 .5rem;
    padding: .7rem .9rem;
    background: var(--bys-p-warn-soft);
    border-left: 3px solid var(--bys-p-warn);
    border-radius: var(--bys-p-radius);
    font-size: .95rem;
}

/* Başvuru formu sayfasının altına eklenen bölüm formun kendisinden
   ayrılmalı; yoksa çıkış düğmesi formun bir parçası gibi okunur. */
.bys-form-footer {
    margin-top: 1.5rem;
    padding-top: 1rem;
    border-top: 1px solid var(--bys-p-line);
}

.bys-start-ready {
    border-left: 3px solid var(--bys-p-brand);
}

/* Başlangıç ekranındaki belge rehberi: her belge ayrı, büyük dokunma
   hedefli satırdır. Zorunluluk yalnız renkle değil açık etiketle anlatılır. */
.bys-readiness { padding: 0; overflow: hidden; }
.bys-form-gate > .bys-readiness { margin-bottom: 1.25rem; }
/* Nüfus kaydı önceliği ilk ekranda öğrencinin ilk okuduğu şeydir. */
.bys-portal .bys-eligibility-notice { margin: 0 0 1rem; background: var(--bys-p-warn-soft); border-left-color: #b86e00; }
.bys-portal .bys-eligibility-notice p { margin: 0; }
.bys-readiness > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    min-height: var(--bys-p-touch);
    padding: 1rem;
    cursor: pointer;
    color: var(--bys-p-brand);
    list-style: none;
}
/* Tarayıcı üçgeni temaya göre başlığın üstünde tek başına kalıyordu; yerine
   satırın sağında dönen tek bir ok çizilir. */
.bys-readiness summary::-webkit-details-marker { display: none; }
.bys-readiness-item > summary { list-style: none; }
.bys-readiness > summary::after,
.bys-readiness-item > summary::after {
    content: "";
    flex: 0 0 auto;
    width: .55rem;
    height: .55rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: translateY(-25%) rotate(45deg);
    transition: transform .15s ease;
    opacity: .7;
}
.bys-readiness[open] > summary::after,
.bys-readiness-item[open] > summary::after { transform: translateY(25%) rotate(-135deg); }
@media (prefers-reduced-motion: reduce) {
    .bys-readiness > summary::after,
    .bys-readiness-item > summary::after { transition: none; }
}
.bys-readiness > summary > span { display: grid; gap: .15rem; }
.bys-readiness > summary strong { font-size: 1.05rem; }
.bys-readiness > summary small { color: var(--bys-p-ink-soft); font-weight: 400; }
.bys-readiness > summary:focus-visible,
.bys-readiness-item > summary:focus-visible { outline: 3px solid rgba(29, 63, 110, .35); outline-offset: -3px; }
.bys-readiness-intro,
.bys-readiness-tip { margin: 0; padding: .9rem 1rem; color: var(--bys-p-ink-soft); }
.bys-readiness-list { border-top: 1px solid var(--bys-p-line); }
.bys-readiness-item { margin: 0; border-bottom: 1px solid var(--bys-p-line); background: #fff; }
.bys-readiness-item > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    min-height: var(--bys-p-touch);
    padding: .65rem 1rem;
    cursor: pointer;
    font-weight: 650;
}
.bys-readiness-item[open] > summary { background: var(--bys-p-brand-soft); }
/* Satırın açılabildiği yalnız okla anlaşılmıyordu: sağda "Ayrıntı" yazar,
   açıkken "Kapat" olur; fareyle üzerine gelince satır belirginleşir. */
.bys-readiness-hint { margin: 0; padding: 0 1rem .9rem; color: var(--bys-p-brand); font-weight: 600; }
.bys-readiness-more { flex: 0 0 auto; color: var(--bys-p-brand); font-size: .85rem; font-weight: 650; }
.bys-readiness-item[open] .bys-readiness-more { font-size: 0; }
.bys-readiness-item[open] .bys-readiness-more::before { content: "Kapat"; font-size: .85rem; }
.bys-readiness-item > summary:hover { background: var(--bys-p-brand-soft); }
.bys-readiness-item > summary:hover .bys-readiness-more { text-decoration: underline; }
.bys-readiness-status {
    flex: 0 0 auto;
    margin-left: auto;
    padding: .2rem .55rem;
    border-radius: 999px;
    background: #e8ebef;
    color: var(--bys-p-ink-soft);
    font-size: .78rem;
    font-weight: 650;
}
.bys-readiness-status-always { background: var(--bys-p-warn-soft); color: #6b3f00; }
.bys-readiness-status-optional { background: #e8ebef; color: var(--bys-p-ink-soft); }
.bys-readiness-status-own { background: var(--bys-p-brand-soft); color: var(--bys-p-brand); }
.bys-readiness-group {
    margin: 0;
    padding: 1rem 1rem .5rem;
    color: var(--bys-p-ink);
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.bys-readiness-content { padding: 0 1rem .85rem; color: var(--bys-p-ink-soft); }
.bys-readiness-content p { margin: .7rem 0 0; }
.bys-readiness-link { display: inline-flex; align-items: center; min-height: var(--bys-p-touch); font-weight: 650; }
.bys-readiness-tip { background: var(--bys-p-brand-soft); color: var(--bys-p-ink); }
@media (max-width: 480px) {
    .bys-readiness-item > summary { align-items: center; gap: .5rem; }
    .bys-readiness-status { white-space: nowrap; }
    /* Dar ekranda belge adı sıkışmasın: "Ayrıntı" yazısı yerine üstteki
       yönlendirme cümlesi ve ok yeterlidir. */
    .bys-readiness-more { display: none; }
}

/* ---- Doğum yeri il / ilçe ----
   Bağlı iki seçim kutusu asıl metin alanının üstüne konur; metin alanı
   yalnız "listede yok / yurt dışı" seçilince görünür. Betik çalışmazsa
   metin alanı zaten yerindedir ve form eskisi gibi doldurulur. */
/* Her seçici kendi alanının içindedir; kutu tek satır kaplar ve altındaki
   asıl alanla arasında nefes bırakır. */
.bys-place-wrap {
    display: block;
    margin-bottom: .35rem;
}

/* ---- Cevap alanlarının görünümü ----
 *
 * Kurum "ızgara görünümü tüm soru cevaplarında var, yazılar okunamıyor"
 * dedi. İl/ilçe kutularında aynı şikâyet vardı ve orada görünümü baştan
 * sona tanımlayarak çözüldü; burada aynısı formun bütün cevap alanlarına
 * uygulanıyor.
 *
 * Kaynağı aramak yerine ETKİSİZ KILINIYOR, çünkü kaynak kurumdan kuruma
 * değişiyor: temanın form öğelerine verdiği desenli arka plan, Gravity
 * Forms 2.9 temasının kendi çizimi, ya da tarayıcının devre dışı alan
 * görünümü. Hepsinin sonucu aynı: öğrenci cevabını okuyamıyor.
 *
 * Kapsam DAR: yalnız öğrenci portalındaki başvuru formu. Sitenin geri
 * kalanına, temanın kendi formlarına dokunulmaz.
 *
 * !important bilerek: bu kurallar tema kurallarıyla yarışıyor ve yarışı
 * kaybettiklerinde alan okunamaz hâle geliyor. */
.bys-form-embed .gform_wrapper :is(
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    input[type="number"],
    input[type="url"],
    textarea
) {
    background-image: none !important;
    background-color: var(--bys-p-surface) !important;
    color: var(--bys-p-ink) !important;
    text-shadow: none !important;
    opacity: 1 !important;
}

/* Form teması gerçek başvuru alanını portal başlığının KARDEŞİ olarak çizer;
   bu nedenle kurallar `.bys-form-embed` üzerinden sahiplenilir. Tüm metin
   ve açılır alanlar doğum tarihi kutusuyla aynı, güneşte de görünen denetim
   kenarlığını kullanır. */
.bys-form-embed .gform_wrapper :is(
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    input[type="number"],
    input[type="url"],
    select,
    textarea
) {
    min-height: var(--bys-p-touch);
    border: 1px solid #878e99 !important;
    border-radius: 8px !important;
    background-color: var(--bys-p-surface) !important;
    color: var(--bys-p-ink) !important;
    font-size: 16px;
    box-shadow: none !important;
}

.bys-form-embed .gform_wrapper :is(input, select, textarea):focus {
    border-color: var(--bys-p-brand) !important;
    /* Gravity Forms Orbital bazı denetimlerde outline: 0 !important yazar.
       Klavye odağı bu nedenle aynı önem düzeyinde geri alınır. */
    outline: 3px solid rgba(29, 63, 110, .45) !important;
    outline-offset: 2px !important;
}

/* Seçim kutusu tek blokta sıfırlanır ve kendi okunabilir oku çizilir. */
.bys-form-embed .gform_wrapper select {
    padding-right: 2rem;
    background-color: var(--bys-p-surface) !important;
    color: var(--bys-p-ink) !important;
    text-shadow: none !important;
    opacity: 1 !important;
    background-image: var(--bys-p-select-arrow) !important;
    background-repeat: no-repeat !important;
    background-position: right .7rem center !important;
    background-size: 10px 6px !important;
    -webkit-appearance: none;
    appearance: none;
}

/* Açılan listenin satırları da okunur olmalı. */
.bys-form-embed .gform_wrapper select option {
    background-color: var(--bys-p-surface);
    color: var(--bys-p-ink);
}

/* Seçenek satırları (radyo / onay kutusu) ve etiketleri. */
.bys-form-embed .gform_wrapper .gfield_radio label,
.bys-form-embed .gform_wrapper .gfield_checkbox label,
.bys-form-embed .gform_wrapper .gchoice label {
    background-image: none !important;
    color: var(--bys-p-ink) !important;
}

/* Nüfus belgesi yanlış seçildiğinde eksik ebeveyn kaydı haftalar sonra
   fark ediliyor. Dört e-Devlet seçimi dosya alanının açıklamasında tek bir
   okunabilir kontrol kartıdır; yeni bir genel yama katmanı değildir. */
.bys-form-embed .gform_wrapper .bys-edevlet-rule,
.bys-form-embed .gform_wrapper .bys-population-guide,
.bys-form-embed .gform_wrapper .bys-identity-guide,
.bys-form-embed .gform_wrapper .bys-income-guide {
    display: grid;
    gap: .35rem;
    margin-top: .35rem;
    padding: .75rem;
    border: 1px solid #b9c7d8;
    border-left: 4px solid var(--bys-p-brand);
    border-radius: var(--bys-p-radius);
    background: #f5f8fc;
    color: var(--bys-p-ink);
}

/* Belgeler bölümünün genel kuralı: her yükleme alanını etkilediği için
   uyarı rengiyle ayrışır. */
.bys-form-embed .gform_wrapper .bys-edevlet-rule {
    border-color: #e3c38a;
    border-left-color: #b86e00;
    background: #fff8ec;
}
.bys-form-embed .gform_wrapper .bys-edevlet-rule > span { display: block; }

.bys-form-embed .gform_wrapper .bys-population-guide > span,
.bys-form-embed .gform_wrapper .bys-identity-guide > span,
.bys-form-embed .gform_wrapper .bys-income-guide > span {
    display: block;
}

.bys-form-embed .gform_wrapper .bys-population-guide__warning,
.bys-form-embed .gform_wrapper .bys-identity-guide__warning,
.bys-form-embed .gform_wrapper .bys-income-guide__warning {
    margin-top: .2rem;
    color: #713b00;
    font-weight: 600;
}

/* Doğru / yanlış kadraj örneği. Gravity Forms açıklaması SVG'yi süzdüğü için
   çizim yalnız span ve CSS ile kurulur. Koyu zemin, öğrenciye kartı koyu bir
   yüzeye koymasını da gösterir. */
.bys-form-embed .gform_wrapper .bys-identity-shot {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .6rem;
    margin: .45rem 0 .2rem;
}

.bys-form-embed .gform_wrapper .bys-identity-shot__item {
    display: grid !important;
    gap: .3rem;
    justify-items: center;
    text-align: center;
}

.bys-form-embed .gform_wrapper .bys-identity-shot__frame {
    position: relative;
    display: block !important;
    width: 100%;
    max-width: 9.5rem;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border: 3px solid #007017;
    border-radius: 8px;
    background: #2c3338;
}

.bys-form-embed .gform_wrapper .bys-identity-shot__card {
    position: absolute;
    display: block !important;
    left: 14%;
    top: 21%;
    width: 72%;
    height: 58%;
    border-radius: 6px;
    background: #eaf2fb;
    box-shadow: inset 0 0 0 2px #2271b1;
}

.bys-form-embed .gform_wrapper .bys-identity-shot__card::before,
.bys-form-embed .gform_wrapper .bys-identity-shot__card::after {
    content: "";
    position: absolute;
    left: 11%;
    height: 11%;
    border-radius: 2px;
    background: #8fa9c7;
}

.bys-form-embed .gform_wrapper .bys-identity-shot__card::before {
    top: 26%;
    width: 56%;
}

.bys-form-embed .gform_wrapper .bys-identity-shot__card::after {
    top: 52%;
    width: 40%;
}

.bys-form-embed .gform_wrapper .bys-identity-shot__item--bad .bys-identity-shot__frame {
    border-color: #b32d2e;
}

/* Yanlış örnekte kart sağ kenardan ve alttan taşar: tam da istenmeyen çekim. */
.bys-form-embed .gform_wrapper .bys-identity-shot__item--bad .bys-identity-shot__card {
    left: 36%;
    top: 30%;
    width: 80%;
    height: 66%;
}

.bys-form-embed .gform_wrapper .bys-identity-shot__caption {
    display: block !important;
    font-size: .85rem;
    font-weight: 700;
    line-height: 1.3;
    color: #007017;
}

.bys-form-embed .gform_wrapper .bys-identity-shot__item--bad .bys-identity-shot__caption {
    color: #b32d2e;
}

.bys-form-embed .gform_wrapper .bys-identity-guide__faces > span {
    display: block;
    padding: .65rem;
    margin: .4rem 0;
    border: 2px dashed var(--bys-p-brand);
    border-radius: var(--bys-p-radius);
    background: #fff;
}

.bys-form-embed .gform_wrapper .bys-population-guide a {
    width: fit-content;
    margin-top: .2rem;
    font-weight: 600;
}

/* Bu kutular eklentinin kendi ürettiği alanlardır; görünümleri temaya ya da
   Gravity Forms temasına BIRAKILMAZ.

   Kurum "il/ilçe kutularında ızgaralı görünüm var, yazılar okunamıyor"
   dedi. Sebep hangi taraftan gelirse gelsin (temanın select'lere verdiği
   desenli arka plan, GF temasının kendi çizimi, tarayıcının devre dışı
   görünümü) sonuç aynı: öğrenci doğum yerini seçemiyor. Bu yüzden görünüm
   burada BAŞTAN SONA tanımlanır ve devralınan hiçbir şeye güvenilmez.

   !important bilerek kullanıldı: bu kurallar tema kurallarıyla yarışıyor ve
   yarışı kaybettiklerinde alan okunamaz hâle geliyor. */
.bys-place-select {
    width: 100%;
    min-height: var(--bys-p-touch);
    padding: .5rem 2rem .5rem .6rem;
    border: 1px solid #878e99 !important;
    border-radius: var(--bys-p-radius);
    /* iOS'ta 16px altındaki yazı odaklanınca sayfayı yakınlaştırır. */
    font-size: 16px;
    /* Desenli/aktarılmış arka planı kesin olarak siler; ok işareti
       kendi çizdiğimizdir. */
    background-color: var(--bys-p-surface) !important;
    background-image: var(--bys-p-select-arrow) !important;
    background-repeat: no-repeat !important;
    background-position: right .7rem center !important;
    background-size: 10px 6px !important;
    color: var(--bys-p-ink) !important;
    -webkit-appearance: none;
    appearance: none;
    opacity: 1 !important;
    text-shadow: none !important;
}

/* Açılan listenin kendisi de okunur olmalı: bazı temalar option'lara
   saydam ya da desenli arka plan veriyor. */
.bys-place-select option {
    background-color: var(--bys-p-surface);
    color: var(--bys-p-ink);
}

/* Devre dışı biçim KALDIRILDI: kutu artık hiç devre dışı bırakılmıyor.
   Tarayıcı devre dışı seçim kutusunu taralı çizip bozuk bir alan
   izlenimi veriyordu. */

.bys-place-wrap [hidden] {
    display: none !important;
}

/* Doğrulanmış kimlik alanı: Başvuruya Başla adımında OTP ile teyit edildi.
   Görsel kilit yalnız açıklayıcıdır — asıl denetim sunucuda, gönderim
   sırasında yapılır. Alan devre dışı BIRAKILMAZ: devre dışı alan
   gönderilmez ve zorunluluk denetimi hatalı biçimde başarısız olur. */
.bys-verified-locked input,
.bys-verified-locked select {
    background: var(--bys-p-brand-soft, #eef4fb);
    cursor: not-allowed;
}

.bys-verified-locked .gfield_label::after {
    content: ' · doğrulandı';
    font-weight: 400;
    font-size: .85em;
    color: var(--bys-p-ok, #147a3a);
}

/* Başvuru formu kabuğu: başlık, oturum notu ve çıkış düğmesi formun
   üstünde durur. Öğrenci uzun formu doldurmaya başlamadan önce süresini
   ve "sonra devam edebilirim" seçeneğini görmelidir. */
.bys-form-shell {
    padding-bottom: 0;
}

.bys-form-shell .bys-session-note {
    margin: 1rem 0 .75rem;
}

.bys-form-shell .bys-session-note p {
    margin: .35rem 0 0;
    font-weight: 400;
}

.bys-form-shell .bys-logout {
    margin: 0 0 .5rem;
}

/* Gravity Forms kendi genişliğini kullanır; portal kabuğuyla aynı
   hizada dursun. */
.bys-form-embed {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 640px;
    margin: 0 auto;
    padding: 0 1rem 1rem;
}

/* Gravity Forms'un varsayılan üst uyarısı hangi alanların hatalı olduğunu
   söylemiyordu. Sunucu tarafından üretilen bağlantılı hata özeti görünür,
   taranabilir ve klavye odağında belirgin kalır. */
.bys-form-embed .bys-validation-summary {
    margin: 0 0 1.25rem;
    padding: 1rem 1.1rem;
    border: 2px solid var(--bys-p-bad);
    border-radius: var(--bys-p-radius);
    background: var(--bys-p-bad-soft);
    color: #7f1d1d;
}

.bys-form-embed .bys-validation-summary p,
.bys-form-embed .bys-validation-summary ul {
    margin: .45rem 0 0;
}

.bys-form-embed .bys-validation-summary a {
    color: #7f1d1d;
    font-weight: 700;
    text-decoration: underline;
}

.bys-form-embed .gfield_error {
    padding: .75rem;
    border-left: 4px solid var(--bys-p-bad);
    background: #fff8f8;
}

/* Gönderim sırasında bekleme göstergesi: ekran donmuş gibi görünmesin,
   öğrenci Gönder'e tekrar basmasın. */
.bys-upload-progress {
    margin: .75rem 0 0;
    padding: .8rem .95rem;
    background: var(--bys-p-brand-soft, #eef4fb);
    border-left: 3px solid var(--bys-p-brand, #1d3f6e);
    border-radius: var(--bys-p-radius, 10px);
    font-size: .95rem;
}

.bys-upload-progress p {
    margin: 0;
}

.bys-upload-progress p + p {
    margin-top: .4rem;
    color: var(--bys-p-ink-soft, #4a5566);
    font-size: .9rem;
}

/* Süre bütçesi uyarısı: hata değil, seçenek sunar (sarı ton). */
.bys-file-warning {
    margin-top: .75rem;
    padding: .65rem .75rem;
    border: 1px solid #d97706;
    border-radius: 6px;
    background: #fffbeb;
    color: #92400e;
    font-size: .9rem;
    line-height: 1.5;
}

.bys-file-error {
    margin-top: .5rem;
    padding: .65rem .75rem;
    border: 1px solid #dc2626;
    border-radius: 6px;
    background: #fff5f5;
    color: #991b1b;
    font-size: .9rem;
    font-weight: 600;
    line-height: 1.45;
}

.bys-form-embed input[type="file"][aria-invalid="true"] {
    outline: 2px solid #dc2626;
    outline-offset: 2px;
}

/* Kayıtlı iletişim bilgisi: düzeltme formunun üstündeki özet. */
.bys-portal .bys-contact-current {
    margin: 0 0 1rem;
    padding: .75rem 1rem;
    border: 1px solid var(--bys-p-line);
    border-radius: var(--bys-p-radius);
    background: var(--bys-p-brand-soft);
    display: grid;
    gap: .5rem;
}

.bys-portal .bys-contact-current > div {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    justify-content: space-between;
}

.bys-portal .bys-contact-current dt {
    margin: 0;
    color: var(--bys-p-ink-soft);
    font-size: .9rem;
}

.bys-portal .bys-contact-current dd {
    margin: 0;
    font-weight: 600;
    /* Rakamlar eşit genişlikte olsun; öğrenci numarasını hane hane
       karşılaştırabilsin. */
    font-variant-numeric: tabular-nums;
}

/* Takip kartı: adresler ayarlardan gelir, sayıları değişkendir. */
.bys-portal .bys-social-links {
    list-style: none;
    margin: 1rem 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.bys-portal .bys-social-links a {
    display: inline-block;
    /* Dokunma hedefi: parmakla açılabilir olmalı (WCAG 2.5.8). */
    min-height: var(--bys-p-touch);
    line-height: var(--bys-p-touch);
    padding: 0 1rem;
    border: 1px solid var(--bys-p-line);
    border-radius: var(--bys-p-radius);
    background: var(--bys-p-surface);
    color: var(--bys-p-brand);
    text-decoration: none;
    font-weight: 600;
}

.bys-portal .bys-social-links a:hover,
.bys-portal .bys-social-links a:focus {
    background: var(--bys-p-brand-soft);
}


/* Yükleme kalitesi uyarısı.
   Engelleyici değil, yönlendirici: öğrenci belgeyi seçtiği anda ne
   yapacağını görür ve isterse yine de gönderir. */
/* Kod geçerlilik sayacı: kod kutusunun hemen üstünde, dikkat çekici ama
   uyarı değil. Süre bitince kırmızıya döner. */
.bys-portal-code-countdown {
    margin: .35rem 0 .6rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: var(--bys-p-ink-soft);
}

.bys-portal-code-countdown.is-expired {
    color: #a00;
}

/* Kriz kapısı: kod ekranda gösterildiğinde. */
.bys-portal-screen-code {
    margin: .5rem 0;
    padding: .75rem .9rem;
    border: 1px solid var(--bys-p-line);
    border-radius: .35rem;
    background: var(--bys-p-brand-soft);
}

.bys-portal-screen-code-value {
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: .12em;
    font-variant-numeric: tabular-nums;
}

.bys-upload-quality {
    /* Önizleme ile uyarı YAN YANA durur: öğrenci "şu görüntüde şu sorun var"
       ilişkisini tek bakışta kurar. Dar ekranda alt alta iner. */
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: .75rem;
    margin: .5rem 0 0;
    font-size: .92rem;
    line-height: 1.45;
}

.bys-upload-preview-title {
    flex-basis: 100%;
    font-weight: 600;
    color: var(--bys-p-ink-soft);
}

.bys-upload-quality-text {
    flex: 1 1 14rem;
    min-width: 12rem;
}

/* Eksik sayfa/yüz satırı kalite uyarısının ALTINDA durur: ikisi farklı
   sorunlardır, biri diğerini gizlerse öğrenci yalnız birini düzeltir. */
.bys-upload-quality-parts {
    flex-basis: 100%;
    font-weight: 600;
}

/* Aidiyet uyarısı kalite uyarısından AYRI durur ve daha görünürdür: belgenin
   okunaklılığı ile belgenin kime ait olduğu farklı sorulardır. */
.bys-upload-identity {
    flex-basis: 100%;
    font-weight: 600;
    color: #7a0000;
}

/* Tartışmasız bozuk dosya: uyarı değil, engel. Sarı ile aynı görünürse
   öğrenci "yine de gider" sanır ve okunamayan belgeyle bekler. */
.bys-upload-quality.is-blocked {
    padding: .6rem .75rem;
    border-left: 4px solid #a00;
    border-radius: .25rem;
    background: #fdecea;
    color: #7a0000;
}

.bys-upload-quality.is-warn {
    padding: .6rem .75rem;
    border-left: 4px solid #b26a00;
    border-radius: .25rem;
    background: #fff6e5;
    color: #6b3f00;
}

/* Ön izleme: seçilen dosyanın küçük bir kopyası. Yüklenen dosya değişmez;
   amaç yanlış dosya seçimini göndermeden önce yakalamak. */
.bys-portal-document-preview {
    flex-basis: 100%;
    width: 100%;
    min-width: 0;
}

.bys-portal-document-preview summary {
    cursor: pointer;
    padding: 0.5rem 0;
}

.bys-portal-document-preview iframe {
    display: block;
    width: 100%;
    height: min(65vh, 620px);
    min-height: 280px;
    border: 1px solid var(--bys-p-line);
    border-radius: 8px;
    background: #fff;
}

.bys-upload-preview {
    display: block;
    /* 160 piksellik küçük resimde eğrilik ve kesik kenar görünmüyordu;
       uyarının kanıtı görünmeyince uyarı da inandırıcı olmuyor. */
    max-width: 240px;
    max-height: 240px;
    margin: 0;
    border: 1px solid #d4d4d4;
    border-radius: .25rem;
    background: #fff;
}

@media (max-width: 600px) {
    .bys-upload-preview {
        max-width: 45vw;
        max-height: 45vw;
    }
}

/* Çok sayfalı PDF'in küçük resmi ilk sayfadır; not kendi satırında durur. */
.bys-upload-preview-note {
    flex-basis: 100%;
    font-size: .88rem;
    color: var(--bys-p-ink-soft);
}

.bys-upload-preview-list {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: flex-start;
}

/* Mesaj kutusunun üstündeki sık sorulan sorular (MessageIssuePool). */
.bys-portal-faq {
    margin: 1rem 0;
    padding: .75rem 1rem;
    border: 1px solid #d0d7de;
    border-radius: 8px;
    background: #f8fafc;
}

.bys-portal-faq > summary,
.bys-portal-faq-item > summary {
    cursor: pointer;
    font-weight: 700;
}

.bys-portal-faq-item {
    margin: .4rem 0;
    padding: .4rem .6rem;
    border-radius: 6px;
    background: #fff;
}

.bys-portal-faq-item > summary {
    font-weight: 600;
}

.bys-portal-faq-answer p {
    margin: .35rem 0;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.bys-portal-faq-hint {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    padding: .5rem .75rem;
    border-left: 4px solid #2271b1;
    border-radius: 4px;
    background: #eef5fb;
}

.bys-portal-faq-hint[hidden] {
    display: none;
}

/* E-posta yazım önerisi: alanın hemen altında, yalnız bilgi. */
.bys-email-typo-hint {
    display: block;
    margin-top: .3rem;
}
.bys-email-typo-hint[hidden] { display: none; }
.bys-link-button {
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
    font: inherit;
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
}

/* Vukuatlı nüfus örnek kutusu ve kritik kurallar (GÜSİAD ile aynı, 25.10.2026). */
/* Kritik belge kuralları hem hazırlık rehberinde hem formda aynı renkte. */
.bys-document-important {
    color: var(--bys-p-bad, #b91c1c);
    font-weight: 700;
}

.bys-population-guide__example {
    margin: 10px 0;
    padding: 10px 12px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    background: #fff;
}

.bys-population-guide__example > summary {
    cursor: pointer;
    font-weight: 700;
}

/* Örnek kutusunun başlığı: hangi belgenin örneği olduğu ilk bakışta okunsun. */
.bys-population-guide__title {
    display: block;
    font-size: 1.05em;
    color: var(--bys-p-ink, #1d2327);
}

.bys-population-guide__example > summary:focus-visible {
    outline: 3px solid #1d3f6e;
    outline-offset: 3px;
}

.bys-population-guide__example img {
    display: block;
    width: 100%;
    max-width: 600px;
    height: auto;
    margin: 8px 0;
    border: 1px solid #d4dce7;
    border-radius: 8px;
}

.bys-population-guide__example a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
}