/* Mobvera — tasarım dili maketlerden (maket\project\*.dc.html): Onest, taş zemin, petrol, sağda koyu panel.
   CSP style-src 'self': satır içi stil YOK, tüm görünüm bu dosyada. */
@font-face {
    font-family: "Onest";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("/fonts/onest-latin-wght-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Onest";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("/fonts/onest-latin-ext-wght-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
    --zemin: #E9EDEC;
    --yuzey: #FFFFFF;
    --yuzey-2: #EEF2F1;
    --yuzey-3: #F3F7F7;
    --petrol: #12404A;
    --petrol-koyu: #0A2A31;
    --petrol-orta: #2A5B66;
    --petrol-cizgi: #2F616C;
    --petrol-soluk: #B9CDD1;
    --petrol-kenar: #4F7D87;
    --metin: #1D2629;
    --soluk: #56636A;
    --cizgi: #CFD6D5;
    --ayrac: #E3E8E7;
    --secili: #E3EEF0;
    --isaret: #D7E6E9;
    --uyari-zemin: #FBEBDC;
    --uyari: #8F4300;
    --bilgi-zemin: #E3EEF0;
    --golge-palet: 0 24px 60px rgba(18, 64, 74, 0.28);
    --golge-panel: -16px 0 40px rgba(18, 64, 74, 0.18);
    --yazi: Onest, system-ui, -apple-system, "Segoe UI", sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--zemin); color: var(--metin); font: 15px/1.45 var(--yazi); }
a { color: var(--petrol); }
a:hover { color: var(--petrol-koyu); }
mark { background: var(--isaret); color: inherit; border-radius: 3px; padding: 0 1px; font-weight: 600; }
summary::-webkit-details-marker { display: none; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--petrol-kenar); outline-offset: 2px; }
button { font-family: inherit; }
.ikon { flex: 0 0 auto; }
.soluk { color: var(--soluk); }
.kucuk { font-size: 13px; }
.gizli-metin { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.satir-ici { display: inline; margin: 0; }
.bosluk { margin-top: auto; }
.kbd { font: 12px var(--yazi); color: var(--soluk); border: 1px solid var(--cizgi); border-radius: 6px; padding: 2px 6px; white-space: nowrap; background: transparent; }

/* ---------- Düğmeler, alanlar, uyarılar ---------- */
.dugme { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font: 600 15px var(--yazi); min-height: 44px; padding: 0 18px; border-radius: 10px; border: 1px solid transparent; cursor: pointer; text-decoration: none; }
.dugme--birincil { background: var(--petrol); color: #FFFFFF; }
.dugme--birincil:hover { background: var(--petrol-koyu); color: #FFFFFF; }
.dugme--ikincil { background: var(--yuzey); color: var(--metin); border-color: var(--cizgi); font-weight: 500; }
.dugme--ikincil:hover { border-color: var(--petrol); color: var(--metin); }
.dugme--acik { background: #FFFFFF; color: var(--petrol); font: 700 17px var(--yazi); min-height: 56px; border-radius: 14px; width: 100%; }
.dugme--buyuk { font: 700 17px var(--yazi); min-height: 56px; border-radius: 14px; width: 100%; }
.dugme:disabled { opacity: .55; cursor: not-allowed; }
.dugmeler { display: flex; gap: 8px; flex-wrap: wrap; }
.baglanti-dugme { background: none; border: 0; padding: 0; color: var(--petrol); font: inherit; text-decoration: underline; cursor: pointer; }

.form { display: flex; flex-direction: column; gap: 16px; margin: 0; }
.alan { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 500; }
.girdi { font: 16px var(--yazi); color: var(--metin); min-height: 48px; padding: 0 14px; border: 1px solid var(--cizgi); border-radius: 10px; background: var(--yuzey); width: 100%; }
.girdi:focus, .girdi:focus-within { outline: none; border: 2px solid var(--petrol); padding: 0 13px; }
.girdi--parola { display: flex; align-items: center; padding: 0 2px 0 14px; }
.girdi--parola:focus-within { padding: 0 1px 0 13px; }
.girdi--parola input { flex: 1 1 auto; min-width: 0; border: 0; outline: none; font: 16px var(--yazi); color: var(--metin); background: transparent; min-height: 44px; }
.girdi__goz { width: 44px; height: 44px; border: 0; background: transparent; color: var(--soluk); display: flex; align-items: center; justify-content: center; cursor: pointer; border-radius: 8px; }
.girdi__goz[aria-pressed="true"] { color: var(--petrol); }
.girdi--metin { padding: 10px 14px; min-height: 96px; resize: vertical; }
.girdi--metin:focus { padding: 9px 13px; }
.girdi--pin { letter-spacing: 8px; font-variant-numeric: tabular-nums; max-width: 240px; }
.onay { display: flex; align-items: center; gap: 10px; min-height: 44px; font-size: 15px; }
.onay input { width: 20px; height: 20px; accent-color: var(--petrol); margin: 0; }

.uyari { border-radius: 12px; padding: 10px 14px; font-size: 14px; display: flex; gap: 8px; align-items: flex-start; margin: 0 0 4px; }
.uyari .ikon { margin-top: 1px; }
.uyari--hata { background: var(--uyari-zemin); color: var(--uyari); }
.uyari--bilgi { background: var(--bilgi-zemin); color: var(--petrol); }

/* ---------- Yalın sayfalar (giriş, parola, hata) ---------- */
body.yalin { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 28px; padding: 24px 16px; }
.yalin-sayfa { display: flex; flex-direction: column; align-items: center; gap: 28px; width: 100%; }
.yalin-alt { font-size: 13px; color: var(--soluk); }
.yalin-kart, .giris-kart { width: 100%; max-width: 440px; background: var(--yuzey); border-radius: 20px; padding: 40px 40px 32px; display: flex; flex-direction: column; gap: 22px; }
.yalin-kart__baslik, .giris-kart__baslik { margin: 0; font-size: 26px; font-weight: 600; letter-spacing: -0.4px; }
.giris-kart__marka { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }
.giris-kart__simge { width: 72px; height: 72px; border-radius: 18px; background: var(--petrol); color: #FFFFFF; display: flex; align-items: center; justify-content: center; font-size: 30px; font-weight: 700; letter-spacing: -1px; }
.giris-kart__adres { font-size: 14px; color: var(--soluk); margin-top: 4px; }
.giris-kart__baglanti { align-self: center; font-size: 15px; min-height: 44px; display: flex; align-items: center; margin: 0; }
.giris-kart .uyari { margin: -6px 0; }
@media (max-width: 480px) {
    .yalin-kart, .giris-kart { padding: 28px 20px 24px; border-radius: 16px; }
}

/* ---------- Yeni sürüm bandı ---------- */
.surum-band { display: flex; align-items: center; justify-content: space-between; gap: 8px; background: var(--petrol); color: #FFFFFF; padding: 4px 8px 4px 16px; font-size: 14px; position: sticky; top: 0; z-index: 60; width: 100%; }
body.yalin .surum-band { position: fixed; left: 0; right: 0; }
.surum-band__dugme { font: 600 14px var(--yazi); min-height: 44px; padding: 0 14px; border-radius: 8px; border: 1px solid var(--petrol-kenar); background: transparent; color: #FFFFFF; cursor: pointer; }

/* ---------- Kabuk: menü | sütun | koyu panel ---------- */
.kabuk { min-height: 100vh; display: flex; }
.menu { flex: 0 0 232px; width: 232px; padding: 22px 12px; display: flex; flex-direction: column; gap: 1px; position: sticky; top: 0; align-self: flex-start; max-height: 100vh; overflow-y: auto; scrollbar-width: thin; }
.menu__ust { display: flex; align-items: center; justify-content: space-between; padding: 0 0 4px; }
.menu__urun { padding: 0 12px; font-size: 19px; font-weight: 700; color: var(--petrol); text-decoration: none; letter-spacing: -0.2px; }
.menu .menu__kapat { display: none; }
.menu__liste { display: flex; flex-direction: column; gap: 1px; }
.menu__oge { display: flex; align-items: center; gap: 10px; padding: 0 12px; min-height: 40px; border-radius: 10px; color: var(--metin); text-decoration: none; font-size: 15px; }
.menu__oge .ikon { color: var(--soluk); }
.menu__oge:hover { background: rgba(18, 64, 74, .07); color: var(--metin); }
.menu__oge[aria-current="page"] { background: var(--petrol); color: #FFFFFF; font-weight: 600; }
.menu__oge[aria-current="page"] .ikon { color: #FFFFFF; }
.menu__baslik { padding: 14px 12px 4px; font-size: 13px; color: var(--soluk); font-weight: 600; }
.menu__bos { padding: 8px 12px; font-size: 14px; color: var(--soluk); }
.menu__kisi { margin-top: auto; padding: 16px 12px 0; font-size: 13px; color: var(--soluk); }
.menu__kisi-ad { font-weight: 600; color: var(--metin); }
.menu__kisi-baglantilar { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 8px; }
.menu__kisi-baglantilar a, .menu__kisi-baglantilar .baglanti-dugme { font-size: 13px; }

.secici { margin: 0 4px 14px; position: relative; }
.secici__dugme { font: 13px var(--yazi); color: var(--soluk); padding: 8px; min-height: 44px; border-radius: 10px; border: 1px solid var(--cizgi); display: flex; align-items: center; justify-content: space-between; gap: 6px; cursor: pointer; list-style: none; }
.secici__dugme:hover { border-color: var(--petrol); }
.secici[open] .secici__dugme .ikon { transform: rotate(180deg); }
.secici__metin { min-width: 0; }
.secici__liste { position: absolute; z-index: 30; top: calc(100% + 6px); left: 0; width: 300px; max-height: 60vh; overflow-y: auto; background: var(--yuzey); border-radius: 14px; box-shadow: var(--golge-palet); padding: 8px; margin: 0; display: flex; flex-direction: column; }
.secici__grup { padding: 8px 10px 4px; font-size: 13px; font-weight: 600; color: var(--soluk); }
.secici__oge { display: flex; gap: 10px; align-items: center; min-height: 44px; padding: 0 10px; border: 0; border-radius: 10px; background: transparent; font: 14px var(--yazi); color: var(--metin); text-align: left; cursor: pointer; }
.secici__oge:hover { background: var(--yuzey-2); }
.secici__oge[aria-current="true"] { background: var(--secili); box-shadow: inset 3px 0 0 var(--petrol); font-weight: 600; }
.secici__kod { font-variant-numeric: tabular-nums; color: var(--soluk); min-width: 38px; }

.cerceve { min-width: 0; }
.kabuk > .cerceve { flex: 1 1 auto; display: flex; flex-wrap: wrap; gap: 20px; align-items: flex-start; padding: 18px 20px 24px 8px; }
.sutun { flex: 999 1 480px; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.ust { display: flex; gap: 12px; align-items: center; }
.ust .ust__menu { display: none; }
.ara-kutu { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 10px; background: var(--yuzey); border-radius: 12px; padding: 0 14px; min-height: 50px; border: 0; font: 15px var(--yazi); color: var(--soluk); cursor: text; text-align: left; }
.ara-kutu__metin { flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.yardim-dugme, .yuvarlak-dugme { flex: 0 0 44px; width: 44px; height: 44px; border-radius: 50%; background: var(--yuzey); color: var(--petrol); display: flex; align-items: center; justify-content: center; font: 600 19px var(--yazi); border: 0; cursor: pointer; }
.yuvarlak-dugme { background: var(--yuzey-2); }
.yardim-dugme[aria-expanded="true"] { background: var(--petrol); color: #FFFFFF; }
.ikon-dugme { width: 44px; height: 44px; border: 0; border-radius: 10px; background: var(--yuzey); color: var(--metin); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; flex: 0 0 auto; }
.icerik { display: flex; flex-direction: column; gap: 20px; min-width: 0; }

.sayfa-bas { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; }
.sayfa-bas__baslik { margin: 0; font-size: 34px; font-weight: 600; letter-spacing: -0.6px; line-height: 1.1; }
.sayfa-bas__not { font-size: 15px; color: var(--soluk); }
.panel { background: var(--yuzey); border-radius: 14px; padding: 20px; display: flex; flex-direction: column; gap: 14px; }
.panel p { margin: 0; }
.dar { max-width: 560px; }

/* ---------- Bugün kartları ---------- */
.kartlar { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; }
.kart { background: var(--yuzey); border-radius: 14px; padding: 18px; text-decoration: none; color: var(--metin); display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.kart:hover { color: var(--metin); box-shadow: 0 0 0 2px var(--isaret); }
.kart__bas { display: flex; align-items: center; gap: 10px; }
.kart__bas .ikon { color: var(--petrol); }
.kart__baslik { font-size: 16px; font-weight: 600; flex: 1 1 auto; }
.kart__sayi { font-size: 28px; font-weight: 700; color: var(--petrol); font-variant-numeric: tabular-nums; }
.kart__alt { font-size: 14px; color: var(--soluk); margin-top: -8px; }
.kart__satirlar { display: flex; flex-direction: column; }
.kart__satir { border-top: 1px solid var(--ayrac); display: flex; gap: 10px; align-items: center; justify-content: space-between; min-height: 44px; font-size: 14px; }
.kart__satir--bos { color: var(--soluk); }
.kart__ac { margin-top: auto; display: flex; align-items: center; justify-content: flex-end; gap: 4px; font-size: 14px; font-weight: 600; color: var(--petrol); }

.bos-durum { background: var(--yuzey); border-radius: 14px; padding: 28px 24px; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.bos-durum .ikon { color: var(--petrol); }
.bos-durum__baslik { margin: 0; font-size: 20px; font-weight: 600; }
.bos-durum__metin { margin: 0; font-size: 15px; max-width: 560px; }
.bos-durum--genis { padding: 36px 28px; }

/* ---------- Sağ koyu panel ---------- */
.koyu-panel { flex: 1 1 340px; min-width: 0; align-self: stretch; background: var(--petrol); color: #FFFFFF; border-radius: 20px; padding: 22px; display: flex; flex-direction: column; gap: 16px; }
.koyu-panel__bas { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.koyu-panel__baslik { margin: 0; font-size: 20px; font-weight: 600; }
.koyu-panel__not { font-size: 14px; color: var(--petrol-soluk); }
.koyu-panel__alt { font-size: 14px; color: var(--petrol-soluk); margin: -8px 0 0; }
.kasa { margin: 0; display: grid; grid-template-columns: 1fr auto; font-size: 16px; font-variant-numeric: tabular-nums; }
.kasa dt, .kasa dd { padding: 14px 0; border-top: 1px solid var(--petrol-cizgi); margin: 0; }
.kasa dt span { display: block; }
.kasa dd { text-align: right; font-weight: 700; }
.kasa__not { font-size: 13px; color: var(--petrol-soluk); }
.kasa__toplam { display: flex; justify-content: space-between; align-items: baseline; border-top: 1px solid var(--petrol-cizgi); padding-top: 14px; gap: 8px; flex-wrap: wrap; }
.kasa__tutar { font-size: 40px; font-weight: 700; letter-spacing: -1px; font-variant-numeric: tabular-nums; }

/* ---------- Komut paleti (Ctrl K) ---------- */
.komut { position: fixed; inset: 0; z-index: 80; background: rgba(29, 38, 41, 0.42); display: flex; justify-content: center; align-items: flex-start; padding: 80px 16px 16px; }
.komut__kutu { width: 680px; max-width: 100%; max-height: calc(100vh - 100px); background: var(--yuzey); border-radius: 20px; box-shadow: var(--golge-palet); display: flex; flex-direction: column; overflow: hidden; }
.komut__ust { display: flex; align-items: center; gap: 12px; padding: 0 20px; border-bottom: 1px solid var(--ayrac); color: var(--soluk); }
.komut__girdi { flex: 1 1 auto; min-width: 0; border: 0; outline: none; font: 20px var(--yazi); padding: 20px 0; color: var(--metin); background: transparent; }
.komut__liste { list-style: none; margin: 0; padding: 4px 10px 10px; display: flex; flex-direction: column; gap: 2px; overflow-y: auto; min-height: 0; }
.komut__grup { padding: 10px 14px 4px; font-size: 13px; font-weight: 600; color: var(--soluk); }
.komut__oge { display: flex; align-items: center; gap: 12px; padding: 0 14px; min-height: 52px; border-radius: 10px; cursor: pointer; }
.komut__oge[aria-selected="true"] { background: var(--secili); box-shadow: inset 3px 0 0 var(--petrol); }
.komut__simge { width: 34px; height: 34px; border-radius: 8px; background: var(--yuzey-2); color: var(--petrol); display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.komut__oge[aria-selected="true"] .komut__simge { background: var(--petrol); color: #FFFFFF; }
.komut__metin { flex: 1 1 auto; min-width: 0; }
.komut__baslik { display: block; font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.komut__alt { display: block; font-size: 13px; color: var(--soluk); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.komut__isaret { font-size: 13px; color: var(--soluk); white-space: nowrap; }
.komut__enter { display: none; font: 12px var(--yazi); color: var(--petrol); border: 1px solid #9DB8BE; border-radius: 6px; padding: 1px 6px; }
.komut__oge[aria-selected="true"] .komut__enter { display: inline; }
.komut__durum { padding: 14px; font-size: 14px; color: var(--soluk); }
.komut__kapat { cursor: pointer; min-height: 32px; }
.komut__ayak { display: flex; flex-wrap: wrap; gap: 8px 22px; padding: 12px 20px; border-top: 1px solid var(--ayrac); font-size: 13px; color: var(--soluk); }
.komut__ayak span { display: flex; gap: 6px; align-items: center; }
.komut__not { margin-left: auto; }
body.komut-acik { overflow: hidden; }

/* ---------- Sayfa hakkında paneli ---------- */
.yardim { position: fixed; top: 0; right: 0; bottom: 0; z-index: 70; width: 420px; max-width: 100%; background: var(--yuzey); box-shadow: var(--golge-panel); display: flex; flex-direction: column; }
.yardim__bas { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 18px 16px 14px 24px; border-bottom: 1px solid var(--ayrac); }
.yardim__ust { font-size: 13px; color: var(--soluk); }
.yardim__baslik { margin: 0; font-size: 24px; font-weight: 600; }
.yardim__govde { flex: 1 1 auto; overflow: auto; padding: 16px 24px 0; display: flex; flex-direction: column; gap: 16px; }
.yardim__bolum h2 { margin: 0 0 10px; font-size: 16px; font-weight: 600; }
.yardim__bolum p { margin: 0; font-size: 14px; line-height: 1.55; }
.adimlar { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 12px; }
.adimlar li { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; line-height: 1.5; }
.adimlar li > span:last-child { padding-top: 3px; }
.adimlar__no { flex: 0 0 26px; height: 26px; border-radius: 13px; background: var(--petrol); color: #FFFFFF; font-size: 13px; font-weight: 600; display: flex; align-items: center; justify-content: center; }
.sss { border-bottom: 1px solid var(--ayrac); }
.sss summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 8px; min-height: 48px; font-size: 15px; }
.sss summary .ikon { color: var(--soluk); }
.sss[open] summary { font-weight: 600; }
.sss[open] summary .ikon { transform: rotate(180deg); color: var(--petrol); }
.sss p { margin: 0 0 14px; font-size: 14px; line-height: 1.5; }
.kurallar { margin: 0; padding-left: 18px; font-size: 14px; line-height: 1.5; display: flex; flex-direction: column; gap: 6px; }
.yardim__not { background: var(--yuzey-3); border-radius: 14px; padding: 12px 16px 16px; display: flex; flex-direction: column; gap: 8px; }
.yardim__not-bas { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.yardim__not-bas a { font-size: 14px; min-height: 44px; display: flex; align-items: center; }
.yardim__not h2 { margin: 0; font-size: 16px; font-weight: 600; }
.yardim__not p { margin: 0; font-size: 14px; line-height: 1.55; }
.yardim__ayak { position: sticky; bottom: 0; background: var(--yuzey); margin: auto -24px 0; border-top: 1px solid var(--ayrac); padding: 14px 24px 18px; font-size: 14px; }
.yardim__oy { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin: 0; }

/* ---------- PIN ---------- */
body.pin-govde { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; align-items: center; }
.pin { width: 100%; max-width: 430px; flex: 1 1 auto; display: flex; flex-direction: column; }
.pin__ust { padding: 32px 24px 0; display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.pin__firma { font-size: 13px; color: var(--soluk); }
.pin__avatar { width: 76px; height: 76px; border-radius: 38px; background: var(--petrol-orta); color: #FFFFFF; display: flex; align-items: center; justify-content: center; font-size: 28px; font-weight: 600; margin-top: 8px; }
.pin__ad { margin: 0; font-size: 22px; font-weight: 600; }
.pin__yonerge { font-size: 15px; color: var(--soluk); }
.pin__noktalar { display: flex; gap: 14px; margin-top: 16px; }
.pin__nokta { width: 16px; height: 16px; border-radius: 8px; border: 2px solid var(--petrol); }
.pin__nokta--dolu { background: var(--petrol); }
.pin__uyari { margin-top: 12px; text-align: left; }
.pin__form { margin: auto 0 0; padding: 24px 20px 28px; }
.pin__girdi { position: absolute; opacity: 0; pointer-events: none; width: 1px; height: 1px; }
.pin__tus-takimi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.pin__tus { font: 500 28px var(--yazi); height: 68px; border-radius: 16px; border: 0; background: var(--yuzey); color: var(--metin); font-variant-numeric: tabular-nums; cursor: pointer; display: flex; align-items: center; justify-content: center; text-decoration: none; }
.pin__tus:active { background: var(--secili); }
.pin__tus:disabled { opacity: .45; cursor: not-allowed; }
.pin__tus--metin { font: 500 15px var(--yazi); background: transparent; color: var(--petrol); text-align: center; }
.pin__tus--sil { background: transparent; }

/* ---------- Ayarlar (Yönetim > Ayarlar; Organizasyon maketinin dili: beyaz bölüm, 44 px satır, hap düğmeler, sağda koyu panel) ---------- */
.gizli { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.dugme--kucuk { min-height: 44px; padding: 0 14px; font-size: 14px; }
.ayar-suzgec { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin: 0; }
.ayar-suzgec__duzey { flex: 1 1 280px; min-width: 0; }
.ayar-suzgec__ara { flex: 1 1 220px; min-width: 0; }
.ayar-suzgec select.girdi { appearance: auto; }
.hap-grup { display: flex; flex-wrap: wrap; gap: 8px; }
.hap { position: relative; display: inline-flex; }
.hap input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.hap span { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: 22px; border: 1px solid var(--cizgi); background: var(--yuzey); font: 500 14px var(--yazi); color: var(--metin); }
.hap input:checked + span { background: var(--metin); border-color: var(--metin); color: #FFFFFF; font-weight: 600; }
.hap input:focus-visible + span { outline: 2px solid var(--petrol); outline-offset: 2px; }
.ayar-alan { display: flex; flex-direction: column; gap: 20px; }
.ayar-ozet { margin: 0; font-size: 14px; color: var(--soluk); }
.ayar-ozet b { color: var(--metin); font-weight: 600; }
.ayar-grup { padding: 12px 10px; gap: 2px; }
.ayar-grup__baslik { margin: 6px 12px 6px; font-size: 17px; font-weight: 600; }
.ayar-grup__liste { display: flex; flex-direction: column; }
.ayar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(150px, auto) 150px; gap: 6px 16px; align-items: center; padding: 10px 12px; min-height: 56px; border-radius: 10px; border-top: 1px solid var(--ayrac); margin: 0; scroll-margin-top: 16px; }
.ayar:first-child { border-top-color: transparent; }
.ayar:target, .ayar--kaydedildi { background: var(--secili); }
.ayar--duzenle { grid-template-columns: minmax(0, 1fr); background: var(--yuzey-3); border: 2px solid var(--petrol); padding: 14px; gap: 12px; }
.ayar--duzenle + .ayar { border-top-color: transparent; }
.ayar__bilgi { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ayar__ad { font-size: 15px; font-weight: 600; }
.ayar__aciklama { font-size: 13px; color: var(--soluk); line-height: 1.45; }
.ayar__deger { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; text-align: right; min-width: 0; }
.ayar__etkin { font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.ayar__etkin--bos { color: var(--soluk); font-weight: 500; }
.rozet { display: inline-flex; align-items: center; min-height: 24px; padding: 0 10px; border-radius: 12px; border: 1px solid var(--cizgi); font-size: 12px; color: var(--soluk); white-space: nowrap; background: var(--yuzey); }
.rozet--burada { background: var(--petrol); border-color: var(--petrol); color: #FFFFFF; font-weight: 600; }
.ayar__eylem { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.ayar__not { font-size: 12px; color: var(--soluk); text-align: right; }
.ayar__durum { font-size: 13px; font-weight: 600; color: var(--petrol); }
.ayar__form { display: flex; flex-direction: column; gap: 10px; }
.ayar__girdi { display: flex; align-items: center; gap: 10px; max-width: 360px; }
.ayar__girdi .girdi { flex: 1 1 auto; min-width: 0; font-variant-numeric: tabular-nums; }
.ayar__birim { font-size: 15px; color: var(--soluk); white-space: nowrap; }
.ayar__ipucu { margin: 0; font-size: 13px; color: var(--soluk); }
.ayar__ipucu b { color: var(--metin); font-weight: 600; }
.secim { display: flex; flex-wrap: wrap; gap: 8px; }
.secim__oge { position: relative; display: inline-flex; }
.secim__oge input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.secim__oge span { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: 10px; border: 1px solid var(--cizgi); background: var(--yuzey); font: 500 15px var(--yazi); }
.secim__oge input:checked + span { background: var(--petrol); border-color: var(--petrol); color: #FFFFFF; font-weight: 600; }
.secim__oge input:focus-visible + span { outline: 2px solid var(--petrol); outline-offset: 2px; }
.ayar-gecmis { flex: 1 1 320px; align-self: flex-start; position: sticky; top: 18px; max-height: calc(100vh - 36px); overflow-y: auto; scrollbar-width: thin; }
.ayar-gecmis__liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.ayar-gecmis__oge { display: flex; flex-direction: column; gap: 2px; padding: 12px 0; border-top: 1px solid var(--petrol-cizgi); font-size: 14px; }
.ayar-gecmis__ad { font-weight: 600; }
.ayar-gecmis__alt { font-size: 13px; color: var(--petrol-soluk); }
.ayar-gecmis__bos { margin: 0; font-size: 14px; color: var(--petrol-soluk); }
@media (max-width: 1100px) {
    .ayar-gecmis { position: static; max-height: none; }
}
@media (max-width: 720px) {
    .ayar { grid-template-columns: minmax(0, 1fr) auto; }
    .ayar__bilgi { grid-column: 1 / -1; }
    .ayar__deger { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-start; text-align: left; }
    .ayar__eylem { align-items: flex-end; }
    .ayar__not { text-align: right; }
    .ayar__girdi { max-width: none; }
}

/* ---------- Dar ekran (tablet/telefon) ---------- */
@media (max-width: 900px) {
    .menu { position: fixed; z-index: 75; left: 0; top: 0; bottom: 0; max-height: none; background: var(--zemin); transform: translateX(-105%); transition: transform .18s ease; box-shadow: 16px 0 40px rgba(18, 64, 74, .18); width: 280px; }
    body.menu-acik .menu { transform: none; }
    .menu-ortu { position: fixed; inset: 0; z-index: 74; background: rgba(29, 38, 41, .42); }
    .menu .menu__kapat { display: inline-flex; background: transparent; }
    .ust .ust__menu { display: inline-flex; }
    .kabuk > .cerceve { padding: 12px 16px 24px; gap: 16px; }
    .sayfa-bas__baslik { font-size: 28px; }
    .secici__liste { width: 100%; }
}
@media (max-width: 560px) {
    .ara-kutu .kbd { display: none; }
    .kartlar { grid-template-columns: 1fr; }
    .komut { padding: 0; }
    .komut__kutu { border-radius: 0; height: 100%; max-height: none; }
    .komut__ayak { display: none; }
    .komut__girdi { font-size: 17px; }
    .komut__kapat { min-height: 44px; padding: 0 12px; }
    .yardim { width: 100%; }
    .kasa__tutar { font-size: 32px; }
}
/* Toast (htmx hata yanıtları, site.js) */
.toast-kutu { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); display: flex; flex-direction: column; gap: 8px; z-index: 60; width: min(480px, calc(100vw - 32px)); }
.toast { background: var(--petrol); color: #fff; border-radius: 12px; padding: 12px 16px; font-size: 14px; box-shadow: 0 6px 24px rgba(0, 0, 0, .18); transition: opacity .5s; }
.toast--git { opacity: 0; }
@media (prefers-reduced-motion: reduce) {
    .menu { transition: none; }
    .toast { transition: none; }
}
