/* =============================================================================
   HKU KYS — Anket ekranları
   -----------------------------------------------------------------------------
   Herkese açık doldurma sayfası + tasarım + sonuç panosu.

   🔴 Renk/ölçü değerleri BURADA TANIMLANMAZ: hepsi hku-modern.css'teki HKU
   tokenlarından gelir. Sabit renk yazılsaydı tema değişiminde bu sayfa geride
   kalır ve sistemin geri kalanından kopardı.
   ⚠️ z-index yazılmaz; katman ölçeği hku-modern.css :root içindedir (Batch 113).
   ============================================================================= */

/* --- Herkese açık sayfa iskeleti ---------------------------------------- */
.hku-anket-sayfa {
    background: var(--hku-bg-soft);
    color: var(--hku-text);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    margin: 0;
}

.hku-anket-ust {
    background: #fff;
    border-bottom: 1px solid var(--hku-card-border);
    padding: .9rem 1.25rem;
}

.hku-anket-logo {
    height: 38px;
    width: auto;
}

.hku-anket-govde {
    flex: 1 1 auto;
    width: 100%;
    max-width: 820px;
    margin: 0 auto;
    padding: 1.5rem 1rem 3rem;
}

.hku-anket-alt {
    padding: 1rem 1.25rem;
    text-align: center;
    font-size: .82rem;
    color: var(--hku-text-muted);
    border-top: 1px solid var(--hku-card-border);
    background: #fff;
}

/* --- Anket başlığı ------------------------------------------------------- */
.hku-anket-baslik {
    background: #fff;
    border: 1px solid var(--hku-card-border);
    border-top: 4px solid var(--hku-primary);
    border-radius: var(--hku-radius);
    padding: 1.25rem 1.4rem;
    margin-bottom: 1.1rem;
    box-shadow: var(--hku-shadow-sm);
}

.hku-anket-baslik h1 {
    font-size: 1.3rem;
    font-weight: 700;
    margin: 0 0 .4rem;
    color: var(--hku-primary);
}

.hku-anket-baslik p {
    margin: 0;
    color: var(--hku-text-muted);
    font-size: .93rem;
    white-space: pre-line;
}

/* --- Soru kartı ---------------------------------------------------------- */
.hku-soru {
    background: #fff;
    border: 1px solid var(--hku-card-border);
    border-radius: var(--hku-radius);
    padding: 1.1rem 1.3rem;
    margin-bottom: .9rem;
    box-shadow: var(--hku-shadow-sm);
}

/* Hatalı soru: sol kenarda kırmızı şerit — göz doğrudan oraya gider. */
.hku-soru.hatali {
    border-color: var(--hku-danger);
    border-left: 4px solid var(--hku-danger);
}

.hku-soru-metin {
    font-weight: 600;
    font-size: 1rem;
    margin-bottom: .2rem;
}

.hku-soru-aciklama {
    color: var(--hku-text-muted);
    font-size: .87rem;
    margin-bottom: .75rem;
}

.hku-soru-zorunlu {
    color: var(--hku-danger);
    margin-left: .15rem;
}

.hku-soru-hata {
    color: var(--hku-danger);
    font-size: .86rem;
    margin-top: .5rem;
    display: block;
}

/* --- Likert matrisi ------------------------------------------------------ */
/* Dar ekranda tablo kendi içinde kayar; sayfa gövdesi yatay kaymaz. */
.hku-matris-sarmal {
    overflow-x: auto;
}

.hku-matris {
    width: 100%;
    border-collapse: collapse;
    font-size: .92rem;
}

.hku-matris th,
.hku-matris td {
    padding: .55rem .5rem;
    border-bottom: 1px solid var(--hku-card-border);
    text-align: center;
    vertical-align: middle;
}

.hku-matris th:first-child,
.hku-matris td:first-child {
    text-align: left;
    min-width: 220px;
}

.hku-matris thead th {
    background: var(--hku-thead-bg);
    font-weight: 600;
    color: var(--hku-text-muted);
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .02em;
}

.hku-matris tbody tr:hover {
    background: var(--hku-bg-soft);
}

.hku-matris tr.hatali td:first-child {
    color: var(--hku-danger);
    font-weight: 600;
}

/* --- Ölçek (puan / NPS) -------------------------------------------------- */
.hku-olcek {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    align-items: center;
}

.hku-olcek-uc {
    font-size: .82rem;
    color: var(--hku-text-muted);
}

.hku-olcek label {
    border: 1px solid var(--hku-border);
    border-radius: var(--hku-radius-sm);
    padding: .4rem .7rem;
    cursor: pointer;
    background: #fff;
    min-width: 2.4rem;
    text-align: center;
}

.hku-olcek input:checked + label,
.hku-olcek label.secili {
    background: var(--hku-primary);
    border-color: var(--hku-primary);
    color: #fff;
}

/* --- İlerleme ------------------------------------------------------------ */
.hku-anket-ilerleme {
    position: sticky;
    top: 0;
    background: var(--hku-bg-soft);
    padding: .5rem 0 .75rem;
}

.hku-anket-ilerleme-cubuk {
    height: 6px;
    border-radius: 3px;
    background: var(--hku-card-border);
    overflow: hidden;
}

.hku-anket-ilerleme-dolu {
    height: 100%;
    background: var(--hku-primary);
    transition: width .25s ease;
}

.hku-anket-ilerleme-metin {
    font-size: .8rem;
    color: var(--hku-text-muted);
    margin-top: .3rem;
}

/* --- Gönderim alanı ------------------------------------------------------ */
.hku-anket-gonder {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-top: 1.1rem;
}

.hku-anket-durum {
    font-size: .9rem;
}

.hku-anket-durum.basarili { color: var(--hku-success); }
.hku-anket-durum.hata { color: var(--hku-danger); }

/* --- Bilgi kutusu (kapalı / teşekkür) ------------------------------------ */
.hku-anket-bilgi {
    background: #fff;
    border: 1px solid var(--hku-card-border);
    border-radius: var(--hku-radius);
    padding: 2.2rem 1.6rem;
    text-align: center;
    box-shadow: var(--hku-shadow-sm);
}

.hku-anket-bilgi i {
    font-size: 2.6rem;
    color: var(--hku-primary);
    margin-bottom: .8rem;
    display: block;
}

.hku-anket-bilgi h2 {
    font-size: 1.15rem;
    font-weight: 700;
    margin-bottom: .5rem;
}

.hku-anket-bilgi p {
    color: var(--hku-text-muted);
    margin: 0;
    white-space: pre-line;
}

/* --- Tasarım ekranı ------------------------------------------------------ */
.hku-tasarim-soru {
    border: 1px solid var(--hku-card-border);
    border-radius: var(--hku-radius);
    padding: .9rem 1.1rem;
    margin-bottom: .7rem;
    background: #fff;
}

.hku-tasarim-soru-ust {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}

.hku-tasarim-tip {
    font-size: .78rem;
    color: var(--hku-text-muted);
    text-transform: uppercase;
    letter-spacing: .03em;
}

.hku-tasarim-kilit {
    border-left: 4px solid var(--hku-warning);
}

/* --- Sonuç panosu -------------------------------------------------------- */
.hku-sonuc-cubuk {
    height: 22px;
    background: var(--hku-bg-soft);
    border-radius: var(--hku-radius-sm);
    overflow: hidden;
    position: relative;
}

.hku-sonuc-dolu {
    height: 100%;
    background: var(--hku-primary);
}

.hku-sonuc-satir {
    display: grid;
    grid-template-columns: minmax(140px, 1fr) 2fr auto;
    gap: .6rem;
    align-items: center;
    margin-bottom: .35rem;
    font-size: .9rem;
}

.hku-sonuc-adet {
    color: var(--hku-text-muted);
    font-size: .85rem;
    white-space: nowrap;
}

.hku-sonuc-metinler {
    max-height: 320px;
    overflow-y: auto;
}

.hku-sonuc-metin {
    border-left: 3px solid var(--hku-card-border);
    padding: .4rem .7rem;
    margin-bottom: .4rem;
    background: var(--hku-bg-soft);
    border-radius: 0 var(--hku-radius-sm) var(--hku-radius-sm) 0;
    font-size: .9rem;
    white-space: pre-line;
}

/* --- Dar ekran ----------------------------------------------------------- */
@media (max-width: 575.98px) {
    .hku-anket-govde { padding: 1rem .75rem 2rem; }
    .hku-soru { padding: .9rem 1rem; }
    .hku-sonuc-satir { grid-template-columns: 1fr; }
    .hku-matris th:first-child,
    .hku-matris td:first-child { min-width: 160px; }
}

/* --- NPS kırılımı ---------------------------------------------------------
   🔴 Renk tek başına anlam taşımaz: her parçanın METNİ de aralığı söyler
   ("Tavsiye eden (9-10)"). Renk körü bir okuyucu için renk bir SÜSTÜR. */
.hku-nps {
    border-top: 1px solid var(--hku-card-border);
    padding-top: .9rem;
}

.hku-nps-skor {
    display: flex;
    align-items: baseline;
    gap: .5rem;
    margin-bottom: .6rem;
}

.hku-nps-kirilim {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-bottom: .4rem;
}

.hku-nps-parca {
    font-size: .85rem;
    padding: .25rem .6rem;
    border-radius: var(--hku-radius-sm);
    border-left: 3px solid var(--hku-border);
    background: var(--hku-bg-soft);
}

.hku-nps-parca.nps-tavsiye { border-left-color: var(--hku-success); }
.hku-nps-parca.nps-kararsiz { border-left-color: var(--hku-warning); }
.hku-nps-parca.nps-kotumser { border-left-color: var(--hku-danger); }

/* Anket sayfası footer'ının ikinci satırı (teknik destek).
   ⚠️ `hku-footer-sub` KULLANILMADI: ölçüldü (2026-09-26), o sınıf hiçbir CSS
   dosyasında tanımlı değil — ölü sınıf kullanmak stilin sessizce uygulanmaması
   demektir. */
.hku-anket-alt-destek {
    margin-top: .25rem;
    font-size: .78rem;
    opacity: .85;
}

.hku-anket-alt-destek a {
    color: inherit;
    text-decoration: underline;
}

/* --- Dönem etiketi + KVKK aydınlatması --------------------------------------
   🔴 KVKK bloğu açıklamanın içinde DEĞİL, ayrı ve kenarlıklı: aydınlatma metni
   uzun bir paragrafın ortasında kaybolursa "gösterildi" sayılamaz.
   `<details open>` ile açık gelir; katılımcı isterse katlar — ama varsayılan
   AÇIK, çünkü kapalı bir aydınlatma gösterilmemiş aydınlatmadır. */
.hku-anket-donem {
    display: inline-block;
    font-size: .8rem;
    font-weight: 600;
    color: var(--hku-primary);
    background: var(--hku-bg-soft);
    border-radius: var(--hku-radius-sm);
    padding: .15rem .55rem;
    margin-bottom: .5rem;
}

.hku-anket-kvkk {
    background: #fff;
    border: 1px solid var(--hku-card-border);
    border-left: 4px solid var(--hku-primary);
    border-radius: var(--hku-radius);
    padding: .85rem 1.1rem;
    margin-bottom: 1.1rem;
    box-shadow: var(--hku-shadow-sm);
}

.hku-anket-kvkk > summary {
    cursor: pointer;
    font-weight: 600;
    font-size: .92rem;
    color: var(--hku-primary);
}

.hku-anket-kvkk > p {
    margin: .6rem 0 0;
    font-size: .86rem;
    color: var(--hku-text-muted);
    white-space: pre-line;
}

/* --- Bölüm başlığı (doldurma sayfası) --------------------------------------
   Bölüm bir SORU değildir: kart görünümü almaz, akışı ikiye ayıran bir başlıktır. */
.hku-anket-bolum {
    margin: 1.4rem 0 .7rem;
    padding-bottom: .4rem;
    border-bottom: 2px solid var(--hku-primary);
}

.hku-anket-bolum h2 {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--hku-primary);
    margin: 0;
}

.hku-anket-bolum p {
    margin: .3rem 0 0;
    font-size: .87rem;
    color: var(--hku-text-muted);
}