/* Worker yerleşimi ve bileşenleri: Peak & Ghost panelinin biçimiyle (üst çubuk, kart, düğme, tablo, hareket).
   Renk, yazı ve ölçü değişkenleri tema.css'ten gelir; burada renk kodu ve yazı tipi adı yoktur. */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; }
html, body { margin: 0; }
body {
  background: var(--zemin); color: var(--metin);
  font: var(--boy-govde)/var(--satir-govde) var(--font-govde); letter-spacing: -.003em; -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, p, ul, ol, dl, dd, fieldset, legend { margin: 0; padding: 0; }
ul, ol { list-style: none; }
fieldset { border: 0; min-width: 0; }
a { color: var(--vurgu-metin); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
h1 { font: 800 var(--boy-h1)/1.05 var(--font-baslik); letter-spacing: -.03em; text-transform: uppercase; margin: 6px 0 10px; text-wrap: balance; }
h2 { font: 650 var(--boy-h2)/1.25 var(--font-baslik); letter-spacing: -.015em; margin: 40px 0 14px; }
/* bölüm içi küçük başlık: paneldeki .ust-etiket */
h3 { font: 600 var(--boy-etiket)/1.3 var(--font-govde); letter-spacing: .08em; text-transform: uppercase; color: var(--soluk); margin-bottom: 10px; }
h4 { font: 600 var(--boy-h3)/1.3 var(--font-baslik); margin-bottom: 12px; }
.soluk { color: var(--soluk); }
.kucuk { font-size: var(--boy-kucuk); }
.sag { text-align: right; }
:focus-visible { outline: 3px solid var(--odak-rengi); outline-offset: 2px; }

/* üst çubuk: paneldeki .bas (yapışkan, yarı saydam, bulanık) */
.ust {
  position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 26px;
  height: var(--ust-yukseklik); padding: 0 var(--sayfa-kenar);
  background: var(--bas-zemin); backdrop-filter: saturate(1.8) blur(22px); -webkit-backdrop-filter: saturate(1.8) blur(22px);
  border-bottom: 1px solid var(--bas-cizgi);
}
.logo { font: 600 var(--boy-logo) var(--font-baslik); color: var(--metin); letter-spacing: -.02em; white-space: nowrap; }
.logo:hover { text-decoration: none; }
.logo span { color: var(--soluk); font-weight: 500; margin-left: 6px; }
.logo::before { content: ""; display: inline-block; width: 24px; height: 19px; margin-right: 9px; vertical-align: -3px; background: var(--isaret) center / contain no-repeat; }
.logo { text-transform: uppercase; font-weight: 800; }
.logo span { text-transform: none; }
h1 em, .vurgu-kelime { font-family: var(--font-vurgu); font-style: italic; font-weight: 400; text-transform: none; letter-spacing: -.01em; color: var(--vurgu-metin); font-size: 1.06em; }
.menu { display: flex; gap: 4px; flex: 1; height: 100%; }
.menu a {
  display: flex; align-items: center; margin: 12px 0; padding: 0 12px; border-radius: var(--r-hap);
  color: var(--soluk); font-size: var(--boy-menu); white-space: nowrap;
  transition: background var(--sure) var(--yay), color var(--sure) var(--yay);
}
.menu a:hover { background: var(--yuzey2); color: var(--metin); text-decoration: none; }
.menu a.etkin { background: var(--yuzey2); color: var(--metin); font-weight: 600; }
.sayac {
  font-size: 11px; font-weight: 600; background: var(--kotu); color: var(--zemin); border-radius: var(--r-hap);
  padding: 0 6px; margin-left: 5px; line-height: 17px;
}
.kim { display: flex; align-items: center; gap: 10px; white-space: nowrap; margin-left: auto; }
.kim form { display: inline; }
.kim-ad { color: var(--metin2); font-size: var(--boy-dugme); }

main { max-width: var(--sayfa-en); margin: 0 auto; padding: 48px var(--sayfa-kenar) 160px; }
main.genis { max-width: 1320px; }

/* düğmeler: paneldeki .dug (hap biçimi; basınca küçülür) */
button, .dugme { font: inherit; cursor: pointer; }
.dugme, button.dugme, .ana, a.dugme.ana, .duz {
  display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; border: 1px solid transparent;
  border-radius: var(--r-hap); padding: 7px 16px; font: 550 var(--boy-dugme) var(--font-govde);
  transition: transform var(--sure-kisa) var(--yay), background var(--sure) var(--yay), opacity var(--sure);
}
.dugme:active, .ana:active, .duz:active { transform: scale(.96); }
.dugme:hover, .ana:hover, .duz:hover { text-decoration: none; }
/* ikincil: .dug.cerceve */
.dugme, button.dugme { background: var(--yuzey2); color: var(--metin); }
.dugme:hover { background: var(--cizgi); color: var(--metin); }
/* ana eylem: .dug.vurgu (panelde "+ Yeni marka" düğmesi) */
.ana, a.dugme.ana { background: var(--vurgu); color: var(--vurgu-ust); }
.ana:hover, a.dugme.ana:hover { background: color-mix(in srgb, var(--vurgu) 85%, var(--metin)); color: var(--vurgu-ust); }
.ana.buyuk { padding: 13px 34px; font-size: var(--boy-lede); min-width: 220px; justify-content: center; }
/* sessiz: .dug.hayalet */
.duz { background: transparent; color: var(--soluk); padding: 5px 9px; }
.duz:hover { background: var(--yuzey2); color: var(--metin); }
button:disabled, .dugme:disabled { opacity: .45; cursor: default; }
button:disabled:active { transform: none; }

/* küçük etiketler: paneldeki .rozet */
.hap {
  display: inline-block; padding: 1px 9px; border-radius: var(--r-hap); font-size: var(--boy-etiket); font-weight: 550;
  background: var(--yuzey2); color: var(--metin2); white-space: nowrap; vertical-align: middle;
}
.hap.ornek, .hap.saat, .hap.bekler { background: var(--saat-zemin); color: var(--saat); }
.hap.risk { background: var(--risk-zemin); color: var(--risk); }
.nokta { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--soluk); flex: none; }
.risk .nokta { background: var(--risk); }
.saat .nokta { background: var(--saat); }
.sakin .nokta { background: var(--vurgu); }

.bilgi, .hata { padding: 10px 16px; border-radius: var(--r-ic); margin-bottom: 20px; }
.bilgi { background: var(--iyi-zemin); color: var(--iyi); }
.hata { background: var(--risk-zemin); color: var(--risk); }
.hata ul { list-style: disc; margin: 6px 0 0 20px; }
.hata li { margin-top: 2px; }

/* giriş alanları: panelle aynı */
label { display: block; font-weight: 500; }
input, select, textarea {
  display: block; width: 100%; margin-top: 6px; padding: 7px 10px; font: inherit; color: var(--metin);
  background: var(--yuzey); border: 1px solid var(--cizgi2); border-radius: var(--r-alan);
}
input:focus, select:focus, textarea:focus { outline: 2px solid var(--vurgu-acik); border-color: var(--vurgu); }
input[type=checkbox], input[type=radio] { display: inline; width: auto; margin: 0; }
textarea { resize: vertical; line-height: 1.55; }

/* giriş */
.giris { max-width: 384px; margin: 12vh auto 0; background: var(--yuzey); padding: 32px; border-radius: var(--r); box-shadow: var(--golge); }
.giris h1 { margin-bottom: 8px; }
.giris form { display: grid; gap: 16px; margin-top: 24px; }
.giris .ana { justify-content: center; padding: 10px 16px; }
.bos { text-align: center; padding: 40px; color: var(--soluk); }
.bos h1 { color: var(--metin); }
.bos p { margin-top: 16px; }

/* Bugün */
.tarih { font-size: var(--boy-etiket); letter-spacing: .08em; text-transform: uppercase; color: var(--soluk); font-weight: 600; }
.bugun { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 48px; align-items: start; }
.brifing { font: 400 var(--boy-lede)/1.5 var(--font-govde); color: var(--soluk); margin: 0 0 28px; max-width: 640px; text-wrap: pretty; }
.brifing strong { color: var(--metin); font-weight: 600; }
/* sıradaki iş: paneldeki .odak (çerçevesiz, vurgu zeminli şerit) */
.siradaki { background: var(--vurgu-acik); border-radius: var(--r); padding: 24px 28px 28px; }
.siradaki.risk { background: var(--risk-zemin); }
.siradaki.saat { background: var(--saat-zemin); }
.siradaki.bitti { background: var(--iyi-zemin); }
.etiket { font: 600 var(--boy-etiket) var(--font-govde); letter-spacing: .08em; text-transform: uppercase; color: var(--soluk); margin-bottom: 12px; }
.tur-adi { display: flex; align-items: center; gap: 8px; font-weight: 600; color: var(--metin2); }
.siradaki h2 { font: 700 28px/1.15 var(--font-baslik); letter-spacing: -.02em; margin: 6px 0 8px; }
.neden { font-size: var(--boy-lede); color: var(--metin2); }
.siradaki form { margin-top: 22px; }
.sonra, .bugun-sayi { background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); padding: 18px 20px 16px; }
.bugun-sayi { margin-top: 16px; }
.sonra h3 span { text-transform: none; letter-spacing: 0; font-weight: 400; margin-left: 4px; }
.kuyruk .ks a {
  display: grid; grid-template-columns: auto 1fr; column-gap: 10px; align-items: baseline;
  padding: 10px 8px; margin: 0 -8px; border-radius: var(--r-ic); color: inherit;
  transition: background var(--sure) var(--yay);
}
.kuyruk .ks + .ks { border-top: 1px solid var(--cizgi); }
.kuyruk .ks a:hover { background: var(--yuzey2); text-decoration: none; }
.ks-ad { font-weight: 600; }
.ks-tur { grid-column: 2; color: var(--soluk); font-size: var(--boy-kucuk); }
.haplar { grid-column: 2; display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.ks.gri { opacity: .55; }
.daha { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--cizgi); font-weight: 500; }
.sonra > .soluk { margin-top: 10px; }
.mini { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 12px; }
.mini dt { font-size: 12.5px; color: var(--soluk); }
.mini dd { font: 700 var(--boy-rakam)/1.1 var(--font-baslik); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }

/* Görev */
.geri { margin-bottom: 14px; font-weight: 500; font-size: var(--boy-dugme); }
.gorev-bas { margin-bottom: 24px; }
.gorev-bas h1 { margin: 4px 0 6px; }
.gorev { display: grid; grid-template-columns: minmax(288px, 368px) minmax(0, 1fr); gap: 28px; align-items: start; }
.musteri-karti {
  background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); padding: 20px;
  position: sticky; top: calc(var(--ust-yukseklik) + 16px); max-height: calc(100vh - var(--ust-yukseklik) - 32px); overflow: auto;
}
.uyari-bandi { background: var(--risk-zemin); color: var(--risk); padding: 10px 14px; border-radius: var(--r-ic); font-weight: 500; margin-bottom: 16px; }
.telefon { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.tel-no { font: 700 24px/1.2 var(--font-baslik); font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.tel-no.yok { color: var(--risk); font-size: 17px; }
.bilgi-listesi { margin: 16px 0 0; display: grid; gap: 6px; }
.bilgi-listesi div { display: grid; grid-template-columns: 104px 1fr; gap: 8px; }
.bilgi-listesi dt { color: var(--soluk); }
.kart-bolum { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--cizgi); }
.buyuk-satir { font-weight: 600; font-size: var(--boy-lede); }
.urunler { margin-top: 8px; }
.urunler li { padding: 2px 0; }
.adres { margin-top: 8px; color: var(--metin2); }
.suphe { margin-top: 10px; padding: 8px 12px; background: var(--saat-zemin); color: var(--saat); border-radius: var(--r-ic); }
.gecmis li { display: grid; gap: 1px; padding: 8px 0; font-size: 14px; }
.gecmis li + li { border-top: 1px solid var(--cizgi); }
.alinti { color: var(--metin2); font-style: italic; }
.musteri-karti > .kucuk { margin-top: 16px; }

/* kart: paneldeki .kutu (çerçevesiz, gölgeli) */
.bolum { background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); padding: 18px 20px; margin-bottom: 16px; }
.adimlar ol { counter-reset: adim; display: grid; gap: 8px; }
.adimlar ol li { counter-increment: adim; display: grid; grid-template-columns: 28px 1fr; }
.adimlar ol li::before { content: counter(adim); font-weight: 600; color: var(--soluk); font-variant-numeric: tabular-nums; }
.hatirlatma { margin-top: 14px; padding: 9px 14px; background: var(--yuzey2); border-radius: var(--r-ic); color: var(--metin2); }
.hatirlatma strong { font-weight: 600; }
details { margin-top: 14px; }
summary { cursor: pointer; color: var(--vurgu-metin); font-weight: 500; width: fit-content; }
details[open] > :not(summary) { animation: belir var(--sure-ac) var(--yay) both; }
.soylenmez { list-style: disc; margin: 8px 0 0 20px; color: var(--metin2); display: grid; gap: 4px; }
.teklif-yok { color: var(--metin2); }
.ipucu { font-weight: 600; margin-bottom: 12px; }
.teklifler { counter-reset: teklif; display: grid; gap: 10px; margin-bottom: 12px; }
.teklifler li { counter-increment: teklif; padding: 10px 14px 10px 40px; background: var(--yuzey2); border-radius: var(--r-ic); position: relative; }
.teklifler li::before { content: counter(teklif); position: absolute; left: 14px; top: 10px; font-weight: 600; color: var(--soluk); }
.teklifler li.bekliyor { color: var(--metin2); }
.teklifler li.onayli { background: var(--iyi-zemin); }
.kayit-yeri { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; background: transparent; box-shadow: none; border: 1px dashed var(--cizgi2); }

.sonuc-formu .bolum h3 { display: flex; align-items: center; gap: 8px; color: var(--metin); font: 600 var(--boy-h3)/1.3 var(--font-baslik); letter-spacing: 0; text-transform: none; margin-bottom: 14px; }
.no { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--metin); color: var(--zemin); font-size: 12.5px; }
.kutular { display: grid; grid-template-columns: repeat(auto-fill, minmax(184px, 1fr)); gap: 10px; }
/* seçim kutusu: paneldeki .kunye-oge zemini; seçilince vurgu */
.kutu {
  position: relative; display: block; padding: 12px 14px; min-height: 64px; border: 1.5px solid transparent;
  border-radius: var(--r-ic); background: var(--yuzey2); cursor: pointer; font-weight: 400;
  transition: background var(--sure) var(--yay), border-color var(--sure) var(--yay), transform var(--sure-kisa) var(--yay);
}
.kutu input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.kutu-b { display: block; font-weight: 600; }
.kutu-a { display: block; font-size: var(--boy-kucuk); color: var(--soluk); margin-top: 2px; }
.kutu:hover { background: var(--cizgi); }
.kutu:active { transform: scale(.98); }
.kutu:has(input:checked) { border-color: var(--vurgu); background: var(--vurgu-acik); }
.kutu:has(input:focus-visible) { outline: 3px solid var(--odak-rengi); outline-offset: 2px; }
.kutu.aramayin:has(input:checked) { border-color: var(--risk); background: var(--risk-zemin); }
.kutu.kucuk { min-height: 0; padding: 5px 13px; display: inline-block; margin: 0 6px 6px 0; border-radius: var(--r-hap); font-size: var(--boy-dugme); }
.kutu.kucuk .kutu-b { font-weight: 500; }
.secmeli { margin-top: 16px; }
.secmeli legend { font-weight: 500; margin-bottom: 8px; }
.alan { margin-top: 16px; max-width: 448px; }
.sonuc-formu textarea { max-width: none; }
.k-not .alan { max-width: none; margin-top: 0; }
.isaret { display: flex; align-items: center; gap: 8px; margin-top: 16px; font-weight: 500; }
.kaydet-satiri { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; margin-top: 16px; }
.agir summary { color: var(--metin2); }
.anket { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--cizgi); }
.soru { margin-bottom: 20px; }
.soru p { margin-bottom: 8px; }
.soru .secmeli { margin-top: 0; }
.olcek { display: flex; gap: 6px; flex-wrap: wrap; }
.puan { position: relative; margin: 0; }
.puan input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; cursor: pointer; }
.puan span {
  display: grid; place-items: center; width: 44px; height: 44px; border: 1.5px solid transparent;
  border-radius: var(--r-ic); font: 600 var(--boy-lede) var(--font-baslik); background: var(--yuzey2);
  transition: background var(--sure) var(--yay), color var(--sure) var(--yay);
}
.puan:hover span { background: var(--cizgi); }
.puan:has(input:checked) span { background: var(--metin); color: var(--zemin); }
.puan:has(input:focus-visible) span { outline: 3px solid var(--odak-rengi); outline-offset: 2px; }

/* koşullu bölümler: seçim yapılınca açılır (JavaScript gerekmez) */
.kosullu { display: none; }
.sonuc-formu:has(input[name=ulasma]:checked) .k-not { display: block; }
.sonuc-formu:has(input[name=ulasma][value=U1]:checked) .k-sonuc,
.sonuc-formu:has(input[name=ulasma][value=U6]:checked) .k-sonuc,
.sonuc-formu:has(input[name=ulasma][value=U7]:checked) .k-sonuc { display: block; }
.sonuc-formu:has(input[name=ulasma][value=U4]:checked) .k-geri { display: block; }
.sonuc-formu:has(input[name=sonuc][value="Ö3"]:checked) .k-soz { display: block; }
.sonuc-formu:has(input[name=sonuc][value="M_ANKET"]:checked) .k-anket { display: block; }
.sonuc-formu .kosullu { animation: belir var(--sure-ac) var(--yay) both; }

/* rapor */
.rapor-bas { margin-bottom: 28px; }
.gun-gezinme { display: flex; gap: 20px; margin-top: 6px; font-weight: 500; font-size: var(--boy-dugme); }
/* sayı kutusu: paneldeki .rakam */
.sayilar { display: grid; grid-template-columns: repeat(auto-fit, minmax(152px, 1fr)); gap: 12px; }
.sayi { background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); padding: 16px 18px; }
.sayi-b { font-size: 12.5px; color: var(--soluk); }
.sayi-d { font: 700 var(--boy-rakam)/1.1 var(--font-baslik); letter-spacing: -.02em; font-variant-numeric: tabular-nums; margin: 4px 0 2px; }
.sayi-a { font-size: 12.5px; color: var(--soluk); }
.sayi.iyi .sayi-d { color: var(--iyi); }
.sayi.risk .sayi-d { color: var(--risk); }
.kanit-ic { display: grid; grid-template-columns: repeat(auto-fit, minmax(288px, 1fr)); gap: 12px; }
.kanit-ic > div { background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); padding: 18px 20px; }
.kanit .sayi-a { font-size: var(--boy-kucuk); max-width: 544px; margin-top: 6px; }
/* tablo: paneldeki .tablo-kap + .veri */
.tablo-sar { overflow-x: auto; background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); scrollbar-width: thin; }
table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
th, td { padding: 9px 12px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--cizgi); font-size: var(--boy-tablo); }
th { background: var(--yuzey2); font-size: var(--boy-tablo-bas); font-weight: 600; color: var(--metin2); white-space: nowrap; }
th.sag, td.sag { text-align: right; white-space: nowrap; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:hover td { background: var(--satir-ustu); }
tfoot td { border-top: 1px solid var(--cizgi2); border-bottom: 0; font-weight: 600; }
td a { font-weight: 500; }
.aramalar td:last-child { color: var(--metin2); min-width: 224px; }
section > .soluk { margin-top: 10px; font-size: var(--boy-kucuk); max-width: 760px; }

/* yönetici */
.uyarilar { background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); overflow: hidden; }
.uyarilar li { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 12px 18px; }
.uyarilar li + li { border-top: 1px solid var(--cizgi); }
.uyarilar li.ciddi { box-shadow: inset 4px 0 0 var(--risk); }
.iki-sutun { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 0 32px; }
tr.onayli td:first-child { box-shadow: inset 4px 0 0 var(--iyi); }

/* hazır cevaplar */
.cevaplar { display: grid; gap: 14px; }
.cevap-karti { background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); padding: 18px 20px; transition: transform var(--sure-kart) var(--yay), box-shadow var(--sure-kart) var(--yay); }
.cevap-karti h3 { text-transform: none; letter-spacing: 0; font: 600 var(--boy-h3)/1.3 var(--font-baslik); color: var(--metin); }
.cevap { margin-bottom: 12px; white-space: pre-wrap; max-width: 704px; }
.cevap.taslak { color: var(--metin2); }
.cevap-karti > .soluk { margin-bottom: 12px; }
.cevap-formu { display: grid; gap: 4px; max-width: 576px; }
.cevap-formu .alan { margin-top: 10px; }
.cevap-formu button { justify-self: start; margin-top: 16px; }
.yeni-cevap { margin-top: 16px; }
/* 8 Ekim (toplu yükleme): arama + kategori süzgeci; kartta ayrı WhatsApp metni ve yetki notu. Yetki notu müşteriye
   söylenmez: çerçeveli, ayrı zeminli kutuda durur ve kopyala düğmesi yoktur. */
.cevap-ara { display: flex; gap: 8px; align-items: center; margin: 0 0 6px; }
.cevap-ara input { margin-top: 0; padding: 11px 14px; font-size: 1.05rem; flex: 1 1 auto; min-width: 0; }
.cevap-ara select { margin-top: 0; flex: 0 1 280px; min-width: 0; }
.cevap-ara .dugme { flex: none; }
#cevap-ara-sonuc { min-height: 1.3em; margin: 0 0 4px; }
.cevap-bolumu h2 .soluk { font-weight: 500; }
.cevap-etiket { font: 600 var(--boy-etiket)/1.3 var(--font-govde); letter-spacing: .08em; text-transform: uppercase; color: var(--soluk); margin-bottom: 4px; }
.cevap-wa { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--cizgi); }
.yetki-notu { margin-top: 16px; max-width: 704px; padding: 12px 14px; border-radius: var(--r-ic); background: var(--risk-zemin); border-left: 4px solid var(--risk); }
.yetki-baslik { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 6px; }
.yetki-metin { white-space: pre-wrap; }
.yetki-notu + details, .cevap-wa + details { margin-top: 14px; }
@media (max-width: 720px) {
  .cevap-ara { flex-wrap: wrap; }
  .cevap-ara input { flex-basis: 100%; }
  .cevap-ara select { flex: 1 1 0; }
}

/* hareket: panelle aynı. Sayfa girişi kısa (.2 sn) ve `backwards`; kart ve ayrıntı yumuşak belirir. */
@keyframes belir { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
main > * { animation: belir var(--sure) var(--yay) backwards; }
main > *:nth-child(2) { animation-delay: .02s; }
.siradaki { animation: belir .36s var(--yay) both; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* dar ekran: panelin 980/1000px kırılımı */
@media (max-width: 980px) {
  .ust { height: auto; flex-wrap: wrap; gap: 4px 16px; padding: 8px 20px; }
  .menu { order: 3; flex-basis: 100%; height: auto; overflow-x: auto; }
  .menu a { margin: 0; padding: 6px 10px; font-size: 13.5px; }
  main { padding: 32px 20px 120px; }
  .bugun, .gorev { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .musteri-karti { position: static; max-height: none; }
  .siradaki { padding: 20px; }
  .ana.buyuk { width: 100%; }
  .kutular { grid-template-columns: repeat(auto-fill, minmax(152px, 1fr)); }
}

/* ---------------------------------------------------------------------------------------------------------
   Faz 1 tamamlama: görünüm tuşu, hızlı arama, marka seçici, gün sonu, şikâyet, aylık rapor, kapasite kartı,
   arama süresi, kısayollar, boş / hata / yüklenme durumları. Renk kodu yok; hepsi tema.css değişkenlerinden.
   --------------------------------------------------------------------------------------------------------- */
kbd {
  font: 11px var(--font-govde); opacity: .7; margin-left: 4px; padding: 1px 5px; border-radius: 5px;
  border: 1px solid color-mix(in srgb, currentColor 30%, transparent); white-space: nowrap;
}
.betiksiz { display: none; }
html:not(.betik) .betiksiz { display: inline-flex; }
/* görünüm değişirken renk geçişi oynamasın: bütün renkler aynı karede değişir */
html.mod-gecis *, html.mod-gecis *::before, html.mod-gecis *::after { transition: none !important; animation: none !important; }

/* klavye: içeriğe geç bağlantısı ve odak halkaları */
.atla {
  position: absolute; left: 12px; top: -48px; z-index: 40; padding: 8px 14px; border-radius: var(--r-hap);
  background: var(--vurgu); color: var(--vurgu-ust); font-weight: 600; transition: top var(--sure-kisa) var(--yay);
}
.atla:focus { top: 8px; text-decoration: none; }
main:focus { outline: none; }
a:focus-visible, button:focus-visible, summary:focus-visible, select:focus-visible { outline: 3px solid var(--odak-rengi); outline-offset: 2px; }
input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 3px solid var(--odak-rengi); outline-offset: 1px; border-color: var(--vurgu); }
.kutu:has(input:focus-visible), .puan:has(input:focus-visible) span { outline: 3px solid var(--odak-rengi); outline-offset: 2px; }

/* üst çubuk: arama düğmesi, marka seçici, görünüm tuşu (panel: .komut-dugme, .marka-sec, .mod-dugme) */
.menu { min-width: 0; overflow-x: auto; scrollbar-width: none; }
.menu::-webkit-scrollbar { display: none; }
.kim form { display: inline-flex; align-items: center; }
.komut-dugme {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: 124px; padding: 5px 12px;
  font-size: var(--boy-dugme); color: var(--soluk); background: var(--yuzey2); border-radius: 10px;
  transition: background var(--sure) var(--yay), color var(--sure) var(--yay);
}
.komut-dugme:hover { color: var(--metin); background: var(--cizgi); text-decoration: none; }
.marka-formu { gap: 4px; }
.marka-sec { width: auto; margin: 0; padding: 5px 10px; font-size: var(--boy-dugme); border-color: transparent; background: var(--yuzey2); border-radius: 10px; max-width: 168px; }
.mod-dugme {
  display: grid; place-items: center; width: 32px; height: 30px; flex: none; padding: 0; cursor: pointer;
  font: 15px/1 var(--font-govde); color: var(--metin2); background: var(--yuzey2); border: 1px solid transparent; border-radius: 8px;
  transition: background var(--sure) var(--yay), color var(--sure) var(--yay), transform var(--sure-kisa) var(--yay);
}
.mod-dugme:hover { background: var(--cizgi); color: var(--metin); }
.mod-dugme:active { transform: scale(.94); }
.giris-mod { position: fixed; top: 14px; right: 18px; }

/* açılan pencere: hızlı arama ve kısayol listesi (panel: .komut-kap) */
dialog.pencere {
  width: min(640px, 92vw); margin: 12vh auto 0; padding: 0; border: 1px solid var(--cizgi); border-radius: var(--r);
  background: var(--yuzey); color: var(--metin); box-shadow: var(--golge-pencere); overflow: hidden;
}
dialog.pencere::backdrop { background: var(--perde); }
dialog.pencere[open] { animation: belir var(--sure) var(--yay) both; }
dialog#kisayollar { padding: 22px 24px; width: min(560px, 92vw); }
dialog#kisayollar h2 { margin: 0 0 14px; }
dialog#kisayollar form { margin-top: 18px; }
.kisayol-listesi { display: grid; gap: 10px; }
.kisayol-listesi div { display: grid; grid-template-columns: 148px 1fr; gap: 12px; align-items: baseline; }
.kisayol-listesi dt kbd { margin-left: 0; margin-right: 2px; opacity: 1; }
.kisayol-listesi dd { color: var(--metin2); }
.komut-form input {
  width: 100%; margin: 0; border: 0; border-bottom: 1px solid var(--cizgi); border-radius: 0; padding: 18px 20px;
  font: 18px var(--font-baslik); background: transparent;
}
.komut-form input:focus, .komut-form input:focus-visible { outline: none; border-color: var(--cizgi); }
.komut-liste { max-height: 420px; overflow-y: auto; padding: 6px; }
.komut-liste:empty { display: none; }
.komut-oge { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; align-items: center; padding: 9px 14px; border-radius: 9px; color: var(--metin); }
.komut-oge small { grid-column: 1; color: var(--soluk); font-size: 12.5px; }
.komut-oge .komut-gorev { grid-column: 2; grid-row: 1 / span 2; font-size: 12.5px; font-weight: 550; padding: 3px 10px; border-radius: var(--r-hap); background: var(--vurgu-acik); color: var(--vurgu-metin); }
.komut-oge.secili, .komut-oge:hover { background: var(--metin); color: var(--yuzey); text-decoration: none; }
.komut-oge.secili small, .komut-oge:hover small { color: color-mix(in srgb, var(--yuzey) 72%, var(--metin)); }
.komut-oge.secili .komut-gorev, .komut-oge:hover .komut-gorev { background: var(--yuzey); color: var(--metin); }
.komut-durum { padding: 22px 20px; color: var(--soluk); }
.komut-alt { padding: 9px 16px; border-top: 1px solid var(--cizgi); margin: 0; }
.komut-alt kbd { margin: 0 2px 0 0; }

/* arama sayfası (betiksiz hâl) */
.ara-formu { display: flex; gap: 10px; align-items: center; max-width: 640px; margin: 14px 0 8px; }
.ara-formu input { margin: 0; padding: 10px 14px; font-size: var(--boy-lede); }
.ara-ad { font-weight: 600; }
.satir-dugmeler { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }

/* boş, hata ve yüklenme durumları */
.bos-durum { padding: 28px 20px; text-align: center; background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); }
.bos-durum .bos-b { font: 600 var(--boy-h3)/1.3 var(--font-baslik); color: var(--metin); margin-bottom: 4px; }
.bos-satir, tr.bos-satir td { color: var(--soluk); }
.bos-eylem { margin-top: 16px; display: flex; gap: 8px; flex-wrap: wrap; }
.bos { background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); max-width: 560px; margin: 8vh auto 0; }
button[aria-busy="true"] { opacity: .6; cursor: progress; }
html.yukleniyor { cursor: progress; }
html.yukleniyor body::before {
  content: ""; position: fixed; z-index: 60; top: 0; left: 0; height: 3px; width: 40%; background: var(--vurgu);
  border-radius: 0 3px 3px 0; animation: yukleniyor 1.1s var(--yay) infinite;
}
@keyframes yukleniyor { from { transform: translateX(-100%); } to { transform: translateX(260%); } }
.hap.iyi { background: var(--iyi-zemin); color: var(--iyi); }
.ks.gri { opacity: 1; }
.ks.gri .ks-ad { color: var(--soluk); font-weight: 500; }
.yan-baglar { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }

/* görev: kısayol harfi, arama süresi, şikâyet alanları */
.kutu-k { position: absolute; top: 8px; right: 8px; margin: 0; opacity: .55; pointer-events: none; }
.kutu.kucuk .kutu-k { display: none; }
.ana kbd, .dugme kbd { margin-left: 2px; }
.arama-olcer { display: flex; align-items: center; gap: 12px 16px; flex-wrap: wrap; }
.arama-olcer form { display: inline-flex; }
.arama-olcer .olcer-bitir { display: none; }
.arama-olcer[data-durum="suruyor"] .olcer-baslat { display: none; }
.arama-olcer[data-durum="suruyor"] .olcer-bitir { display: inline-flex; }
.arama-olcer .dugme.dur { background: var(--risk-zemin); color: var(--risk); }
.olcer-sure { font: 700 22px/1 var(--font-baslik); font-variant-numeric: tabular-nums; letter-spacing: -.01em; color: var(--soluk); min-width: 64px; }
.arama-olcer[data-durum="suruyor"] .olcer-sure { color: var(--risk); }
.arama-olcer[data-durum="bitti"] .olcer-sure { color: var(--metin); }
/* ses kaydı bu sürümde yok: düğme değil, düz etiket */
.arama-olcer .kayit-yakinda { margin-left: auto; }
.olcer-not { flex-basis: 100%; }
.sikayet-karti { margin-bottom: 18px; padding: 14px 16px; border-radius: var(--r-ic); background: var(--risk-zemin); }
.sikayet-karti h3 { color: var(--risk); }
.sikayet-karti .bilgi-listesi { margin-top: 0; }
.sikayet-karti .bilgi-listesi div { grid-template-columns: 96px 1fr; }
.sikayet-karti > .soluk { margin-top: 10px; color: var(--metin2); }
.onay-hap { margin-top: 10px; display: inline-block; }
.sikayet-alanlari .alan, .k-sikayet .alan { max-width: none; }
.yan-yana { display: grid; grid-template-columns: minmax(0, 1fr) 168px; gap: 12px; }
.sonuc-formu:has(input[name=sonuc][value="M6"]:checked) .k-sikayet,
.sonuc-formu:has(input[name=sonuc][value="S5"]:checked) .k-sikayet,
.sonuc-formu:has(input[name=sikayet]:checked) .k-sikayet,
.sonuc-formu:has(input[name=agir]:checked) .k-sikayet { display: block; }

/* gün sonu */
.devreden { background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); overflow: hidden; }
.devreden li { display: flex; justify-content: space-between; padding: 11px 18px; }
.devreden li + li { border-top: 1px solid var(--cizgi); }
.devreden strong { font-variant-numeric: tabular-nums; }
.gun-sonu-formu .alan { max-width: none; margin-top: 0; }
.gun-sonu-formu button { margin-top: 16px; }
.uyari-bandi.saat { background: var(--saat-zemin); color: var(--saat); font-weight: 400; }
.uyari-bandi.saat a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
tr.yeni td:first-child { box-shadow: inset 4px 0 0 var(--vurgu); }
tr.secili td { background: var(--satir-ustu); font-weight: 600; }

/* aylık rapor */
.sayilar.aylik { grid-template-columns: repeat(auto-fit, minmax(208px, 1fr)); }
.fark { display: inline-block; margin-top: 4px; color: var(--soluk); }
.fark.iyi { color: var(--iyi); }
.fark.kotu { color: var(--risk); }

/* kapasite kartı (yönetici) */
.kapasite { background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); padding: 22px 24px; margin-bottom: 8px; }
.kapasite.uyari { box-shadow: inset 4px 0 0 var(--saat), var(--golge); }
.kapasite h2 { margin-top: 0; }
.kapasite > p { margin-bottom: 14px; max-width: 760px; }
.kapasite .sayi { background: var(--yuzey2); box-shadow: none; }
.kapasite-ic { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 20px 32px; margin-top: 22px; }
.kapasite-ic h3 span { text-transform: none; letter-spacing: 0; font-weight: 400; margin-left: 4px; }
.kapasite-ic p + p { margin-top: 10px; }
.dagilim { display: grid; gap: 9px; }
.dagilim li { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(64px, 1fr) 36px; gap: 12px; align-items: center; }
.dg-ad .soluk { font-size: var(--boy-kucuk); }
.dg-sayi { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
progress.dg-cubuk { appearance: none; -webkit-appearance: none; width: 100%; height: 10px; border: 0; border-radius: var(--r-hap); background: var(--yuzey2); overflow: hidden; }
progress.dg-cubuk::-webkit-progress-bar { background: var(--yuzey2); border-radius: var(--r-hap); }
progress.dg-cubuk::-webkit-progress-value { background: var(--vurgu); border-radius: var(--r-hap); }
progress.dg-cubuk::-moz-progress-bar { background: var(--vurgu); border-radius: var(--r-hap); }
.dg-kalan { padding-top: 9px; border-top: 1px solid var(--cizgi); }
.dg-kalan progress.dg-cubuk::-webkit-progress-value { background: var(--iyi); }
.dg-kalan progress.dg-cubuk::-moz-progress-bar { background: var(--iyi); }
.dg-kalan.eksik progress.dg-cubuk::-webkit-progress-value { background: var(--risk); }
.dg-kalan.eksik progress.dg-cubuk::-moz-progress-bar { background: var(--risk); }
.dg-kalan.eksik .dg-sayi, .dg-kalan.eksik .dg-ad { color: var(--risk); }
.uyarilar li > div:first-child { min-width: 0; }
.uyarilar .hata { margin: 0; }
section > p.hata { margin-top: 10px; }

/* orta genişlik: üst çubuk sıkışmasın */
@media (max-width: 1320px) {
  .ust { gap: 14px; padding: 0 24px; }
  .kim-ad { display: none; }
  .komut-dugme { min-width: 0; }
  .komut-dugme kbd { display: none; }
  .menu a { padding: 0 9px; }
}
@media (max-width: 980px) {
  .ust { padding: 8px 16px; }
  .kim { gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
  .menu a { padding: 6px 10px; }
  .mod-dugme { width: 40px; height: 36px; }
  .yan-yana { grid-template-columns: minmax(0, 1fr); }
  .kisayol-listesi div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .arama-olcer .kayit-yakinda { margin-left: 0; }
  .ara-formu { flex-wrap: wrap; }
  .uyarilar li { flex-wrap: wrap; }
  .satir-dugmeler { justify-content: flex-start; }
  .dagilim li { grid-template-columns: minmax(0, 1fr) 64px 32px; }
  .kapasite { padding: 18px 16px; }
  dialog.pencere { margin-top: 6vh; }
  kbd { display: none; }
  .kisayol-listesi kbd, .komut-alt kbd { display: inline; }
}

/* görüntü kontrolünden sonra: satır düğmeleri metnin altına insin, sıkışmasın; aylık rapor notu kutulardan ayrılsın */
.uyarilar li { flex-wrap: wrap; }
.uyarilar li > div:first-child { flex: 1 1 260px; }
.satir-dugmeler form { display: inline-flex; }
.sayilar.aylik + .soluk { margin-top: 16px; }

/* uçtan uca deneme (4 Ekim): yönetici ekranında işlemden sonra aynı bölüme dönülür; başlık üst çubuğun altında kalmasın */
section[id] { scroll-margin-top: calc(var(--ust-yukseklik) + 16px); }
.hata[tabindex] { scroll-margin-top: calc(var(--ust-yukseklik) + 16px); }
.gizli-alan { position: fixed; top: 0; left: -9999px; opacity: 0; }

/* eksik kapatma turu (4 Ekim gece): arama kaydını düzeltme ekranı, düzeltme izi, taslak bildirimi */
.duzelt { max-width: 860px; }
.duzelt-formu .alan { max-width: none; }
.duzelt-formu .kaydet-satiri { gap: 12px; }
.duzeltme-izi li { gap: 3px; }
.duzelt-h { white-space: nowrap; }
.duzelt-h .hap { margin-right: 6px; }
.taslak-bildirimi { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 9px 14px; margin-bottom: 16px; border-radius: var(--r-ic); background: var(--saat-zemin); color: var(--saat); }
.taslak-bildirimi button { color: inherit; }
/* görüntü kontrolü (4 Ekim gece): uzun kutu başlığı köşedeki kısayol harfinin altına girmesin */
.kutu:has(.kutu-k) .kutu-b { padding-right: 22px; }

/* tur 7 (6 Ekim): elle iş ve gelen arama (B2), tıkla ara / WhatsApp (B4), kısa görev ekranı (B3), kapanan işin sonucu (B10) */
.hap.elle { background: var(--vurgu-acik); color: var(--vurgu-metin); }
.tel-dugmeler { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.tel-dugmeler .dugme { padding-top: 5px; padding-bottom: 5px; }
.musteri-tel { display: flex; margin: 10px 0; }
.elle-is { background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); padding: 18px 20px 16px; margin-top: 16px; }
.elle-dugmeler { display: flex; gap: 8px; flex-wrap: wrap; margin: 10px 0; }
.geri .geri-ek { margin-left: 16px; font-weight: 400; }
.geri-al { margin-top: 8px; }
/* 8 Ekim (görev akışı): kaydetmeden çıkış — "Açmadı, mesaj yazdım" ve "Şimdi değil, sonrakine geç" */
.gorev-akis { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 10px 0 14px; }
.gorev-akis p { flex-basis: 100%; margin: 0; }
.mesaj-sayisi { margin-top: 10px; }
.yeni { max-width: 860px; }
.yeni .ara-formu { margin-bottom: 8px; }
.yeni .secmeli { margin-top: 0; }
.yeni-formu .alan { max-width: none; }
/* açılır bölüm: başlık satırı özetle birlikte tek satır; içerik tıklayınca açılır */
details.katla { margin-top: 0; }
details.kart-bolum.katla { margin-top: 14px; padding-top: 14px; }
details.katla > summary { width: 100%; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; color: var(--metin); }
details.katla > summary .katla-b { font: 600 var(--boy-h3)/1.3 var(--font-baslik); }
details.katla > summary .katla-o { font-weight: 400; font-size: var(--boy-kucuk); }
details.katla > summary::after { content: "aç"; margin-left: auto; font-size: var(--boy-kucuk); font-weight: 500; color: var(--vurgu-metin); }
details.katla[open] > summary::after { content: "kapat"; }
details.katla > .katla-ic { margin-top: 12px; }
.olcer-ayrinti { margin-top: 0; }
.olcer-ayrinti[open] { flex-basis: 100%; }
/* görev ekranı sıkıştı: ulaşma, sonuç, not ve kaydet 1440×900'de kaydırmadan görünsün. Yalnız boşluklar küçüldü. */
.gorev-bas { margin-bottom: 12px; }
main:has(> .gorev) > .geri { margin-bottom: 8px; }
.is-yardim { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 8px; align-items: start; }
.is-yardim > details.bolum { margin-bottom: 0; padding: 9px 16px; }
.is-yardim > details[open] { grid-column: 1 / -1; padding-bottom: 16px; }
.gorev .is > .bolum, .gorev .sonuc-formu > .bolum { padding: 12px 18px; margin-bottom: 8px; }
.gorev .arama-olcer { padding-top: 8px; padding-bottom: 8px; }
.gorev .sonuc-formu .bolum h3 { margin-bottom: 8px; }
.gorev .sonuc-formu .kutular { gap: 8px; }
.gorev .sonuc-formu .kutular > .kutu { min-height: 0; padding: 8px 11px; }
@media (min-width: 1200px) {
  /* ulaşma ve sonuç kutuları tek sıra (en çok 6-7 kutu) */
  .gorev .sonuc-formu > .bolum > .kutular { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
  main:has(> .gorev) { padding-top: 20px; }
}
.gorev .sonuc-formu .kutular > .kutu .kutu-a { line-height: 1.3; font-size: 12.5px; }
/* sonuç bölümünün ekleri (itiraz, söylenen teklif, sebep) yan yana; koşullu ve geniş olanlar tam satır */
.ekler { display: flex; flex-wrap: wrap; gap: 0 24px; align-items: flex-start; }
.ekler > * { flex: 1 1 280px; min-width: 0; }
.ekler > .kosullu, .ekler > .anket, .ekler > .sikayet-alanlari, .ekler > .barkod-isareti { flex-basis: 100%; }
.ekler > .secmeli, .ekler > .alan { margin-top: 12px; }
.not-ipucu { font-weight: 400; letter-spacing: 0; text-transform: none; }
.gorev .k-not .agir { margin-top: 8px; }
@media (max-width: 980px) {
  .is-yardim { grid-template-columns: minmax(0, 1fr); }
}
/* kaydet satırı ekranın altına yapışır: form uzasa da (anket) "Kaydet" kaydırmadan görünür */
.sonuc-formu .kaydet-satiri {
  position: sticky; bottom: 12px; z-index: 5; margin-top: 0; padding: 12px 20px;
  background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge-pencere, var(--golge));
}
.sonuc-formu:has(input[name=ulasma]:checked) .kaydet-satiri.k-not { display: flex; }
.sonuc-formu .bolum:last-of-type { margin-bottom: 12px; }
table.isler th.sag, table.kapananlar th { white-space: nowrap; }
/* yapışık kaydet satırı odaklanan alanın (not) üstünü kapatmasın: tarayıcı kaydırırken alttan pay bırakır */
html:has(.sonuc-formu) { scroll-padding-bottom: 96px; }

/* --- tur 8 (B5, B6): yönetici sekmeleri, kullanıcılar, ayarlar ------------------------------------------ */
.sekmeler { display: flex; flex-wrap: wrap; gap: 4px; margin: -8px 0 28px; padding-bottom: 8px; border-bottom: 1px solid var(--cizgi); }
.sekmeler a { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: var(--r-ic); color: var(--metin2); font-weight: 500; font-size: var(--boy-dugme); white-space: nowrap; }
.sekmeler a:hover { background: var(--yuzey2); color: var(--metin); text-decoration: none; }
.sekmeler a.etkin { background: var(--yuzey2); color: var(--metin); font-weight: 600; box-shadow: inset 0 -2px 0 var(--metin); }
.sayac.sakin { background: var(--yuzey2); color: var(--metin2); }
.sekme-ici > section:first-child > h2:first-child, .sekme-ici > .ozet-serit:first-child { margin-top: 0; }
.ozet-serit { display: grid; grid-template-columns: repeat(auto-fit, minmax(208px, 1fr)); gap: 12px; margin-bottom: 8px; }
.ozet-serit li { background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); }
.ozet-serit a { display: block; padding: 12px 16px; color: var(--metin2); font-size: var(--boy-kucuk); }
.ozet-serit a:hover { text-decoration: none; color: var(--metin); }
.ozet-serit strong { display: block; font: 700 var(--boy-rakam)/1.1 var(--font-baslik); color: var(--metin); font-variant-numeric: tabular-nums; }
.ozet-serit li.risk strong { color: var(--risk); }
.rapor-baglari { display: grid; gap: 10px; }
.rapor-baglari li { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.tek-seferlik { background: var(--iyi-zemin); border-radius: var(--r); padding: 14px 18px; margin-bottom: 16px; box-shadow: inset 4px 0 0 var(--iyi); }
.tek-seferlik p + p { margin-top: 8px; }
.parola-goster { font: 600 17px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .04em; padding: 4px 10px; border-radius: var(--r-ic); background: var(--yuzey); color: var(--metin); user-select: all; margin-right: 8px; }
table.kullanicilar td { vertical-align: middle; }
table.kullanicilar tr.devre-disi td:not(:last-child) { color: var(--soluk); }
table.kullanicilar .satir-dugmeler { justify-content: flex-end; }
.kullanici-ekle { margin-top: 16px; }
.kullanici-ekle > summary { cursor: pointer; font-weight: 600; }
.alan select { display: block; width: 100%; margin-top: 6px; }
.ayar-formu { max-width: 760px; }
.ayar-grubu { border: 0; padding: 0; margin: 0 0 22px; }
.ayar-grubu legend { font: 600 var(--boy-h3)/1.3 var(--font-baslik); padding: 0; margin-bottom: 2px; }
.alan.ayar { max-width: none; display: grid; grid-template-columns: minmax(0, 1fr) 208px; gap: 2px 20px; align-items: center; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--cizgi); }
.alan.ayar .ayar-ad { font-weight: 500; }
.alan.ayar > .soluk { grid-column: 1; }
.alan.ayar .sayi-giris, .alan.ayar .saat-araligi { grid-column: 2; grid-row: 1 / span 2; display: flex; align-items: center; gap: 8px; }
.alan.ayar input { margin-top: 0; width: 96px; text-align: right; font-variant-numeric: tabular-nums; }
.alan.ayar .saat-araligi input { width: 76px; text-align: center; }
.ayar-formu > button { margin-top: 4px; }
@media (max-width: 720px) {
  .alan.ayar { grid-template-columns: 1fr; }
  .alan.ayar .sayi-giris, .alan.ayar .saat-araligi { grid-column: 1; grid-row: auto; }
}

/* --- tur 8 (B9): dışa aktarım ve yazdırılabilir sayfa ---------------------------------------------------- */
.disa-aktar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 12px; font-size: var(--boy-kucuk); color: var(--soluk); }
.disa-formu { background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); padding: 16px 20px; margin-bottom: 16px; }
.disa-formu .alan { margin-top: 10px; max-width: 256px; }
.disa-formu .isaret { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.disa-formu .satir-dugmeler { justify-content: flex-start; margin-top: 14px; }
.yazdir-arac { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 24px; padding-bottom: 16px; border-bottom: 1px solid var(--cizgi); }
@page { size: A4; margin: 14mm 12mm; }
@media print {
  /* kâğıtta her zaman açık renk: renkler tema.css'in baskı bölümünden gelir (koyu görünümde de siyah yazı, beyaz zemin) */
  html, body { background: var(--zemin) !important; color: var(--metin); font-size: 11pt; }
  .ust, .atla, #veri-bandi, .veri-bandi, .yazdir-arac, .gun-gezinme, .sekmeler, .disa-aktar, .geri, dialog, form, button, .mod-formu { display: none !important; }
  main, main.genis { max-width: none; margin: 0; padding: 0; }
  a { color: inherit; text-decoration: none; }
  .tablo-sar { overflow: visible; box-shadow: none; border: 1px solid var(--cizgi); border-radius: 0; }
  .sayi, .kanit-ic > div, .uyarilar, .kapasite { box-shadow: none; border: 1px solid var(--cizgi); break-inside: avoid; }
  .sayilar { grid-template-columns: repeat(4, 1fr); gap: 6px; }
  .sayi { padding: 8px 10px; }
  .sayi-d { font-size: 16pt; }
  section { break-inside: auto; margin-top: 14px; }
  h1, h2, h3 { break-after: avoid; }
  tr, li { break-inside: avoid; }
  thead { display: table-header-group; }
  th, td { padding: 4px 6px; font-size: 9.5pt; }
  th { background: var(--yuzey2) !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .hap { border: 1px solid var(--cizgi2); background: none !important; color: var(--metin) !important; }
  details > summary { list-style: none; }
}

/* --- Bugün: iş bölümleri (7 Ekim, tur 10): her bölüm bir kart, her kartın kendi ekranı ------------------- */
.bolumler-kutu { margin-top: 28px; }
.bolumler-kutu h3 span { text-transform: none; letter-spacing: 0; font-weight: 400; margin-left: 4px; }
.bolumler { list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.bolum-kart {
  display: flex; flex-direction: column; gap: 6px; flex: 1; min-width: 0; min-height: 88px; padding: 14px 16px;
  background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); color: inherit;
  transition: background var(--sure) var(--yay);
}
.bolumler > li { display: flex; min-width: 0; }
.bolum-kart:hover { background: var(--yuzey2); text-decoration: none; }
.bolum-kart:focus-visible { outline: 2px solid var(--vurgu); outline-offset: 2px; }
.bolum-ust { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.bolum-ad { min-width: 0; overflow-wrap: anywhere; }
.bolum-sayi { margin-left: auto; min-width: 26px; text-align: center; font-variant-numeric: tabular-nums; }
.bolum-kart.risk .bolum-sayi, .bolum-sayfa.risk .bolum-sayi { background: var(--risk-zemin); color: var(--risk); }
.bolum-kart.saat .bolum-sayi, .bolum-sayfa.saat .bolum-sayi { background: var(--saat-zemin); color: var(--saat); }
.bolum-ozet { color: var(--metin2); font-size: var(--boy-kucuk); overflow-wrap: anywhere; }
.bolum-not { color: var(--soluk); font-size: var(--boy-kucuk); }
.bolum-kart.bosluk { box-shadow: none; border: 1px solid var(--cizgi); background: none; }
.bolum-kart.bosluk .bolum-ad, .bolum-kart.bosluk .bolum-ozet { color: var(--soluk); font-weight: 500; }
.bolum-kart.bosluk .nokta { background: var(--cizgi2); }
.bolum-kart.bosluk .bolum-sayi { background: none; color: var(--soluk); }
.bolum-sayfa { max-width: 760px; }
/* Trendyol işleri (7 Ekim): arama işi olmayan bölüm; kartta soru metni ve satıcı paneline bağlantı */
.ty-bolum + .ty-bolum { margin-top: 14px; }
.ty-isler { list-style: none; }
.ty-is { padding: 14px 0; display: grid; gap: 6px; min-width: 0; }
.ty-is + .ty-is { border-top: 1px solid var(--cizgi); }
.ty-ust { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; min-width: 0; }
.ty-ust .ks-ad { min-width: 0; overflow-wrap: anywhere; }
.ty-metin { color: var(--metin); overflow-wrap: anywhere; }
blockquote.ty-metin { margin: 0; padding: 8px 12px; border-left: 3px solid var(--cizgi2); background: var(--yuzey2); border-radius: 0 var(--r-kucuk, 6px) var(--r-kucuk, 6px) 0; }
.ty-alt { overflow-wrap: anywhere; }
.ty-eylem { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 2px; }
.ty-kapat { margin-left: auto; }
.ty-kapat button { color: var(--soluk); }
.bolum-sayfa .geri { margin-bottom: 12px; font-weight: 500; }
.bolum-baslik { display: flex; align-items: center; gap: 10px; }
.bolum-baslik .bolum-sayi { margin-left: 4px; font: 600 var(--boy-govde)/1.3 var(--font-govde); }
.bolum-sayfa .sonra { margin-top: 18px; }
.bolum-bekleyen { margin-top: 18px; background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); padding: 18px 20px 16px; }
.bolum-bekleyen h3 span { text-transform: none; letter-spacing: 0; font-weight: 400; margin-left: 4px; }
.bolum-eylem { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 8px; }
.bekleyenler { list-style: none; }
.bekleyenler .bk { display: grid; grid-template-columns: auto 1fr; column-gap: 10px; align-items: baseline; padding: 8px 0; }
.bekleyenler .bk.tik { display: block; padding: 0; }
.bekleyenler .bk.tik a {
  display: grid; grid-template-columns: auto 1fr; column-gap: 10px; align-items: baseline;
  padding: 8px; margin: 0 -8px; border-radius: var(--r-ic); color: inherit;
  transition: background var(--sure) var(--yay);
}
.bekleyenler .bk.tik a:hover { background: var(--yuzey2); text-decoration: none; }
.bekleyenler .bk + .bk { border-top: 1px solid var(--cizgi); }
.bekleyenler .ks-ad { font-weight: 500; color: var(--metin2); }
@media (max-width: 720px) {
  .bolumler { grid-template-columns: 1fr; }
  .bolum-kart { min-height: 0; }
}

/* --- tur 11: kargo (sipariş satırında "nerede", yönetici kargo özeti) --- */
.kargo-satiri { margin: 12px 0 0; padding-top: 10px; border-top: 1px solid var(--cizgi); }
.kargo-nerede.risk { color: var(--risk); font-weight: 600; }
.kargo-nerede.iyi { color: var(--iyi); }
.kargo-hucre { min-width: 220px; }
table.kargo-ozet td, table.kargo-ozet th { white-space: nowrap; }
.veri-yok { font-style: italic; }
#kargo-ozeti h3 { margin: 20px 0 8px; }

/* --- tur 11: ürün bilgisi --- */
.saglik-kurali { font-size: 1.02rem; }
/* R4 (8 Ekim, "çok karışık gözüküyor"): üstte arama, her ürün tek satır genişliğinde kart (solda bilgi, sağda paket ve
   fiyat), besin tablosu ve kaynak satırları kapalı ayrıntıda. Renk ve yazı tema.css'ten; burada yalnız yerleşim. */
.rapor-bas:has(+ .saglik-kurali) { margin-bottom: 16px; }
.urun-ara { display: flex; gap: 8px; align-items: center; margin: 0 0 6px; }
.urun-ara input { margin-top: 0; padding: 11px 14px; font-size: 1.05rem; }
.urun-ara .dugme { flex: none; }
#urun-ara-sonuc { min-height: 1.3em; margin: 0 0 4px; }
.urun-durum p { margin: 0; }
.urun-gezinme { margin: 12px 0 4px; display: flex; flex-wrap: wrap; gap: 6px; font-size: 0; }
.urun-gezinme a { font-size: var(--boy-dugme); font-weight: 550; padding: 6px 14px; border-radius: var(--r-hap); background: var(--yuzey2); color: var(--metin); }
.urun-gezinme a:hover { background: var(--cizgi); text-decoration: none; }
.urun-ortaklar { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1.2fr) minmax(0, 1.2fr); gap: 0 28px; margin-top: 14px;
  background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); padding: 12px 18px 8px; }
#eslesmeyen-urunler table.fiyatlar td { padding: 6px 12px; }
.urun-ortaklar h2 { grid-column: 1 / -1; margin: 0 0 8px; font-size: var(--boy-h3); }
.urun-ortak h3 { margin: 0 0 4px; }
.urun-ortak .okunur { margin: 0 0 6px; }
.urun-karti { background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); padding: 16px 18px; scroll-margin-top: 72px; }
.urun-kartlari { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin-top: 16px; }
.urun-karti[hidden], #eslesmeyen-urunler [hidden], #eslesmeyen-urunler[hidden] { display: none; }
.urun-karti h2 { margin: 0 0 10px; }
.urun-karti h3 { margin: 0 0 6px; font-size: .95rem; }
.urun-govde { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(280px, 1fr); gap: 8px 28px; align-items: start; }
.urun-govde .bilgi-listesi { margin-top: 0; }
.urun-karti .tablo-sar { box-shadow: none; border: 1px solid var(--cizgi); }
.urun-karti details { margin-top: 10px; }
.urun-karti details.satir-not { margin-top: 2px; }
.urun-karti details.satir-not summary { font-size: var(--boy-kucuk); font-weight: 400; }
.urun-ayrinti .ayrinti-ic { max-width: 560px; }
.urun-ayrinti .ayrinti-ic table.besin { margin-top: 8px; }
table.dilim-besin thead th { color: var(--soluk); font-size: var(--boy-tablo-bas); }
table.dilim-besin .sag { text-align: right; }
.okunur { font-size: 1.02rem; line-height: 1.5; }
.urun-bilgi div { grid-template-columns: 104px 1fr; }
#eslesmeyen-urunler { margin-top: 28px; scroll-margin-top: 72px; }
table.fiyatlar tbody.urun-satir + tbody.urun-satir tr:first-child td { border-top: 1px solid var(--cizgi2); }
table.fiyatlar tbody.urun-satir tr:first-child td:first-child { font-weight: 550; }
.satilmaz { margin-top: 12px; }
@media (max-width: 860px) {
  .urun-govde { grid-template-columns: minmax(0, 1fr); }
  .urun-ortaklar { grid-template-columns: minmax(0, 1fr); }
}
table.besin { width: 100%; margin-top: 14px; border-collapse: collapse; }
table.besin caption { text-align: left; font-weight: 600; padding-bottom: 4px; }
table.besin th { text-align: left; font-weight: 500; }
table.besin th, table.besin td { padding: 3px 0; border-bottom: 1px solid var(--cizgi); }
table.besin tr.alt th { padding-left: 14px; color: var(--soluk); }
table.fiyatlar td.fiyat { font-weight: 600; white-space: nowrap; }
.dilim { margin: 10px 0 0; }
.kaynak { margin: 6px 0 0; word-break: break-word; }
#urun-kaynaklari { margin-top: 28px; }

/* --- tur 13: operasyon kontrolü (yönetici › Operasyon) --- */
#operasyon h3 { margin: 22px 0 8px; }
table.operasyon-ozet td:first-child { min-width: 260px; }
table.operasyon-ozet td.sag, table.operasyon-ozet th.sag,
table.operasyon-gunler td, table.operasyon-gunler th { white-space: nowrap; font-variant-numeric: tabular-nums; }
table.operasyon-gunler tr.sayim-yok td { font-style: italic; }
.op-liste { margin: 14px 0 0; }
.op-liste h4 { margin: 0 0 6px; }
.operasyon-liste { margin: 0; padding: 0; list-style: none; background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); }
.operasyon-liste li { padding: 9px 14px; border-bottom: 1px solid var(--cizgi); }
.operasyon-liste li:last-child { border-bottom: 0; }
.op-tasan { margin: 6px 0 0; }

/* --- R2 (8 Ekim): günlük kontrol listesi (/kontrol, /yonetici/kontrol, Bugün kutusu) --- */
.kontrol-ozet { display: flex; flex: 1; min-width: 0; }     /* R3: Bugün'de öteki iş kartlarıyla aynı ızgarada bir kart */
.kontrol-sayi { font-variant-numeric: tabular-nums; }
.kontrol-sayi strong { font: 700 20px/1.2 var(--font-baslik); margin-right: 4px; }
.kontrol-sayfa { max-width: 760px; }
.kontrol-liste { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 12px; }
.kontrol-madde { background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); padding: 16px 20px; }
.kontrol-madde.yapildi { box-shadow: var(--golge), inset 4px 0 0 var(--iyi); }
.kontrol-bas { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.kontrol-tik { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; flex: none; border-radius: 6px; border: 2px solid var(--cizgi2); color: var(--iyi); font-weight: 700; line-height: 1; }
.kontrol-madde.yapildi .kontrol-tik { border-color: var(--iyi); background: var(--iyi-zemin); }
.kontrol-ad { font: 600 var(--boy-h3)/1.3 var(--font-baslik); }
.kontrol-not { max-width: none; margin-top: 10px; }
.kontrol-dugmeler { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 12px; }
.kontrol-duzenle-formu { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 0 16px; align-items: end; }
.kontrol-duzenle-formu .alan { margin-top: 0; max-width: none; }
.kontrol-liste.duzenle .kontrol-dugmeler form { margin: 0; }
table.kontrol-tablo td:nth-child(3), table.kontrol-tablo td:nth-child(2) { white-space: nowrap; font-variant-numeric: tabular-nums; }
@media (max-width: 720px) {
  .kontrol-duzenle-formu { grid-template-columns: 1fr; gap: 10px; }
  .kontrol-duzenle-formu button { justify-self: start; }
}
@media print { .kontrol-dugmeler, .kontrol-not { display: none; } }
.kontrol-sayfa .geri { margin-bottom: 12px; font-weight: 500; }

/* --- R3 (8 Ekim): her iş türü ana sayfada sade tek kart; bölüm ekranında türe özel bilgi --- */
/* Bugün: bütün kartlar (arama bölümleri, saatini bekleyen, Trendyol, Yorumlar, günlük kontrol listesi) TEK ızgarada,
   aynı boyda; özet satırı en çok iki satır tutar. Sonraki parçaların kartı (operasyon panosu) bu ızgaraya eklenir. */
.bolum-izgara { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.bolum-izgara > .bolumler, .bolum-izgara > .bolumler-ek { display: contents; }
.bolumler-ek { list-style: none; }
.bolum-izgara > ul > li { display: flex; min-width: 0; }
.bolum-izgara .bolum-kart { min-height: 104px; }
.bolum-izgara .bolum-ozet { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.bolum-izgara .bolum-ozet strong { font-variant-numeric: tabular-nums; }
.bolum-izgara .bolum-not { margin-top: auto; }
/* Bölüm ekranı: dört sayı, türe özel özet cümlesi, "bu bölümün ilk işine başla", satırda türe özel bilgi */
.bolum-serit { grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 18px 0 0; padding: 16px 20px; background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); }
.bolum-ozet-cumle { margin-top: 12px; color: var(--metin2); max-width: 640px; text-wrap: pretty; }
.bolum-ust-eylem { margin-top: 14px; align-items: center; }
.bolum-ust-eylem form { margin: 0; }
.bolum-liste .ks a { padding: 12px 8px; }
.ks-bilgi { grid-column: 2; display: grid; gap: 2px; margin-top: 4px; min-width: 0; color: var(--soluk); font-size: var(--boy-kucuk); }
.ks-bilgi span { overflow-wrap: anywhere; }
.ks-bilgi .ks-ana { color: var(--metin2); font-size: var(--boy-govde); font-weight: 500; }
.ks-bilgi .ks-ana.risk { color: var(--risk); font-weight: 600; }
.ks.gri .ks-bilgi .ks-ana { color: var(--soluk); }
.bolum-sayfa .bolum-adimlar { margin-top: 18px; background: var(--yuzey); border-radius: var(--r); box-shadow: var(--golge); padding: 14px 20px; }
.bolum-adimlar ol { margin: 8px 0 4px 18px; display: grid; gap: 4px; }
@media (max-width: 720px) {
  .bolum-izgara { grid-template-columns: 1fr; }
  .bolum-izgara .bolum-kart { min-height: 0; }
  .bolum-serit { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 12px; }
  .bolum-ust-eylem .ana { width: 100%; justify-content: center; }
}
