/* expatistanbul.ai — taban arayüz. Renkler ve ölçüler YALNIZ assets/tokens.css değişkenlerinden gelir; burada renk sabiti yoktur.
   Yazı tipleri kendi sunucumuzdan (assets/fonts, OFL); dış CDN, dış yazı tipi, izleyici yok. */
/* [hidden] her zaman gizler: display tanımlı sınıflar (.dg, .araclar, .anahtar) onu ezemez. */
[hidden] { display: none !important; }
@font-face { font-family: "Noto Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/noto-sans-latin-400-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: "Noto Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/noto-sans-latin-ext-400-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; }
@font-face { font-family: "Noto Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/noto-sans-cyrillic-400-normal.woff2) format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Noto Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/noto-sans-latin-600-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: "Noto Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/noto-sans-latin-ext-600-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; }
@font-face { font-family: "Noto Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/noto-sans-cyrillic-600-normal.woff2) format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Noto Serif"; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/noto-serif-latin-600-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: "Noto Serif"; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/noto-serif-latin-ext-600-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; }
@font-face { font-family: "Noto Serif"; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/noto-serif-cyrillic-600-normal.woff2) format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Vazirmatn"; font-style: normal; font-weight: 400; font-display: swap; src: url(/assets/fonts/vazirmatn-arabic-400-normal.woff2) format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC; }
@font-face { font-family: "Vazirmatn"; font-style: normal; font-weight: 600; font-display: swap; src: url(/assets/fonts/vazirmatn-arabic-600-normal.woff2) format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC; }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; min-height: 100dvh; display: flex; flex-direction: column; background: var(--zemin); color: var(--ink);
  font: 400 var(--boy-m)/var(--satir) var(--yazi-govde); }
a { color: var(--aksan-metin); }
:focus-visible { outline: 3px solid var(--odak); outline-offset: 2px; }
.gizli { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.w { width: 100%; max-width: var(--kolon-genis); margin-inline: auto; padding-inline: var(--bosluk-4); }
.kolon { width: 100%; max-width: var(--kolon); margin-inline: auto; padding: var(--bosluk-6) var(--bosluk-4); flex: 1; }
h1, h2, h3 { font-family: var(--yazi-baslik); font-weight: 600; line-height: 1.2; color: var(--ink); }
.ust-yazi { font-size: var(--boy-xs); letter-spacing: .08em; text-transform: uppercase; color: var(--mut); }

/* üst bar */
.ust { background: var(--kapak); border-bottom: 1px solid var(--hair); }
.ust .w { display: flex; align-items: center; justify-content: space-between; gap: var(--bosluk-3); flex-wrap: wrap; padding-block: var(--bosluk-3); }
.marka { font-family: var(--yazi-baslik); font-weight: 600; font-size: var(--boy-l); color: var(--ink); text-decoration: none; }
.ust nav { display: flex; align-items: center; gap: var(--bosluk-3); flex-wrap: wrap; }
.ust nav a { color: var(--ink-2); text-decoration: none; min-height: var(--dokunma); display: inline-flex; align-items: center; }
.ust nav a:hover { text-decoration: underline; }
.dil-sec { display: flex; gap: var(--bosluk-1); flex-wrap: wrap; border: 1px solid var(--hair); border-radius: var(--kose-cip); padding: 2px; background: var(--kapak-2); }
.dil-sec button { font: 600 var(--boy-s)/1 var(--yazi-govde); border: 0; background: none; color: var(--ink-2); padding: var(--bosluk-2) var(--bosluk-3);
  border-radius: var(--kose-cip); cursor: pointer; min-height: var(--dokunma); }
.dil-sec button[aria-pressed="true"] { background: var(--aksan); color: var(--aksan-ust); }
.beta-kap { position: relative; display: inline-flex; }
.beta { font: 600 var(--boy-xs)/1 var(--yazi-govde); background: var(--beta-zemin); color: var(--beta-metin); border: 0; border-radius: var(--kose-cip);
  padding: var(--bosluk-1) var(--bosluk-3); min-height: var(--dokunma); cursor: pointer; }
.beta-aciklama { position: absolute; inset-inline-end: 0; top: calc(100% + var(--bosluk-1)); z-index: 2; width: min(22rem, 80vw); padding: var(--bosluk-3);
  background: var(--kapak); color: var(--ink-2); border: 1px solid var(--hair); border-radius: var(--kose); box-shadow: var(--golge); font-size: var(--boy-s); }
.beta-aciklama[hidden] { display: none; }

/* kalıcı şerit */
.serit { background: var(--serit-zemin); color: var(--serit-metin); font-size: var(--boy-xs); }
.serit .w { display: flex; gap: var(--bosluk-4); flex-wrap: wrap; justify-content: space-between; padding-block: var(--bosluk-2); }
.alt { border-top: 1px solid var(--hair); background: var(--kapak); font-size: var(--boy-s); }
.alt .w { display: flex; gap: var(--bosluk-4); flex-wrap: wrap; padding-block: var(--bosluk-3); }
.alt a { color: var(--ink-2); display: inline-flex; align-items: center; min-height: var(--dokunma); }
.kaynak-liste a { display: inline-flex; align-items: center; min-height: var(--dokunma); }
.marka { display: inline-flex; align-items: center; min-height: var(--dokunma); }
/* Arap harfli dil adları (dil seçici) LTR sayfada da Vazirmatn ile. */
:lang(ar), :lang(fa) { font-family: var(--yazi-arap); }

/* düğmeler */
.dg { display: inline-flex; align-items: center; justify-content: center; min-height: var(--dokunma); padding: 0 var(--bosluk-4); border-radius: var(--kose-cip);
  border: 1px solid var(--aksan); background: var(--kapak); color: var(--aksan-metin); font: 600 var(--boy-s)/1 var(--yazi-govde); cursor: pointer; text-decoration: none;
  transition: background var(--gecis); }
.dg-dolu { background: var(--aksan); color: var(--aksan-ust); }
.dg-sade { border-color: var(--hair); color: var(--ink-2); }

/* ana sayfa */
.kahraman { padding-block: var(--bosluk-6) var(--bosluk-5); }
.kahraman h1 { font-size: var(--boy-2xl); margin: 0 0 var(--bosluk-3); }
.kahraman p { font-size: var(--boy-l); color: var(--ink-2); max-width: 40rem; margin: 0; }
.kahraman .nasil { font-size: var(--boy-s); color: var(--mut); margin-top: var(--bosluk-3); }
.evre-kutu { display: flex; gap: var(--bosluk-2); flex-wrap: wrap; align-items: center; margin-block: var(--bosluk-5) var(--bosluk-4); }
.evre { font: 600 var(--boy-s)/1 var(--yazi-govde); min-height: var(--dokunma); padding: 0 var(--bosluk-4); border-radius: var(--kose-cip);
  border: 1px solid var(--hair); background: var(--kapak); color: var(--ink-2); cursor: pointer; }
.evre[aria-pressed="true"] { background: var(--gunes); color: var(--gunes-ust); border-color: var(--gunes); }
.alan-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: var(--bosluk-4); padding-bottom: var(--bosluk-6); }
.alan { background: var(--kapak); border: 1px solid var(--hair); border-radius: var(--kose-buyuk); padding: var(--bosluk-5); box-shadow: var(--golge); }
.alan h2 { font-size: var(--boy-l); margin: 0 0 var(--bosluk-3); }
.soru-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--bosluk-2); }
.soru { display: block; padding: var(--bosluk-2) var(--bosluk-3); border-radius: var(--kose); background: var(--gok); color: var(--ink); text-decoration: none; }
.soru:hover { text-decoration: underline; }

/* sohbet */
.sohbet { flex: 1; display: flex; flex-direction: column; }
.sohbet-ic { flex: 1; max-width: var(--kolon); padding-block: var(--bosluk-5); }
.karsilama h1 { font-size: var(--boy-xl); margin: 0 0 var(--bosluk-2); }
.karsilama p { color: var(--ink-2); margin: 0 0 var(--bosluk-4); }
.akis { display: flex; flex-direction: column; gap: var(--bosluk-4); }
.mesaj { max-width: min(42rem, 100%); border-radius: var(--kose); padding: var(--bosluk-3) var(--bosluk-4); overflow-wrap: anywhere; }
.mesaj p { margin: 0 0 var(--bosluk-3); }
.mesaj p:last-child { margin-bottom: 0; }
.mesaj-siz { align-self: flex-end; background: var(--aksan); color: var(--aksan-ust); }
.mesaj-asistan { align-self: flex-start; background: var(--kapak); border: 1px solid var(--hair); box-shadow: var(--golge); }
.bekliyor p { color: var(--mut); }
.iddia { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.iddia-verified { text-decoration-color: var(--damga-verified-kenar); }
.iddia-carried { text-decoration-color: var(--damga-carried-kenar); }
.iddia-subtracted { text-decoration-color: var(--damga-subtracted-kenar); }
.iddia-open { text-decoration-color: var(--damga-open-kenar); text-decoration-style: dashed; }
.iddia-contra { text-decoration-color: var(--damga-contra-kenar); text-decoration-style: wavy; }
.iddia-unexamined { text-decoration-color: var(--damga-unexamined-kenar); text-decoration-style: dotted; }
.damga { display: inline; }
.cip { display: inline-flex; align-items: center; gap: var(--bosluk-1); margin-inline-start: var(--bosluk-1); padding: 0 var(--bosluk-2); min-height: 28px;
  border-radius: var(--kose-cip); border: 1px solid; font: 600 var(--boy-xs)/1 var(--yazi-govde); cursor: pointer; vertical-align: baseline; }
/* Çip görsel olarak küçük kalır; dokunma alanı görünmez kenarla 44 px'e çıkar. */
.cip { position: relative; }
.cip::after { content: ""; position: absolute; inset: -8px -2px; }
.cip-verified { background: var(--damga-verified-zemin); color: var(--damga-verified-metin); border-color: var(--damga-verified-kenar); }
.cip-carried { background: var(--damga-carried-zemin); color: var(--damga-carried-metin); border-color: var(--damga-carried-kenar); }
.cip-subtracted { background: var(--damga-subtracted-zemin); color: var(--damga-subtracted-metin); border-color: var(--damga-subtracted-kenar); }
.cip-open { background: var(--damga-open-zemin); color: var(--damga-open-metin); border-color: var(--damga-open-kenar); }
.cip-contra { background: var(--damga-contra-zemin); color: var(--damga-contra-metin); border-color: var(--damga-contra-kenar); }
.cip-unexamined { background: var(--damga-unexamined-zemin); color: var(--damga-unexamined-metin); border-color: var(--damga-unexamined-kenar); }
.cip-panel { display: block; margin-block: var(--bosluk-2); padding: var(--bosluk-3); border-radius: var(--kose); background: var(--kapak-2); color: var(--ink-2); font-size: var(--boy-s); }
.cip-panel[hidden] { display: none; }
.cip-aciklama, .cip-destek { display: block; }
.cip-destek { margin-top: var(--bosluk-2); }
.not-kutu { margin-top: var(--bosluk-4); padding: var(--bosluk-3) var(--bosluk-4); border-radius: var(--kose); background: var(--not-zemin); color: var(--not-metin);
  border-inline-start: 4px solid var(--not-kenar); font-size: var(--boy-s); }
.kaynak-kutu { margin-top: var(--bosluk-4); padding-top: var(--bosluk-3); border-top: 1px dashed var(--hair); }
.kaynak-baslik, .kaynak-alt-baslik { font-size: var(--boy-xs); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--mut); margin: 0 0 var(--bosluk-2); }
.kaynak-liste { list-style: none; margin: 0 0 var(--bosluk-3); padding: 0; display: grid; gap: var(--bosluk-2); }
.kaynak-liste li { display: flex; flex-wrap: wrap; gap: var(--bosluk-2); align-items: baseline; font-size: var(--boy-s); }
.kaynak-tur { color: var(--mut); }
.katman { font-size: var(--boy-xs); font-weight: 600; border-radius: var(--kose-cip); padding: 2px var(--bosluk-2); border: 1px solid var(--hair); }
.katman-l0 { background: var(--katman-l0-zemin); color: var(--katman-l0-metin); }
.katman-l1 { background: var(--katman-l1-zemin); color: var(--katman-l1-metin); }
.katman-l2 { background: var(--katman-l2-zemin); color: var(--katman-l2-metin); }
.katman-l3, .katman-yok { background: var(--katman-l3-zemin); color: var(--katman-l3-metin); }
.araclar { display: flex; gap: var(--bosluk-2); margin-top: var(--bosluk-4); flex-wrap: wrap; }
.not { margin: var(--bosluk-2) 0; padding: var(--bosluk-2) var(--bosluk-3); border-radius: var(--kose); background: var(--kapak-2); color: var(--ink); font-size: var(--boy-s); }
.not[data-tur="hata"] { background: var(--damga-contra-zemin); color: var(--damga-contra-metin); }
.yaz-kap { position: sticky; bottom: 0; background: var(--zemin); border-top: 1px solid var(--hair); padding-block: var(--bosluk-3); }
.yaz { display: flex; gap: var(--bosluk-2); align-items: flex-end; max-width: var(--kolon); }
.yaz textarea { flex: 1; resize: none; font: inherit; color: var(--ink); background: var(--kapak); border: 1px solid var(--hair); border-radius: var(--kose);
  padding: var(--bosluk-3); min-height: var(--dokunma); }
.erisim-etkin { display: inline-block; font-size: var(--boy-s); background: var(--damga-verified-zemin); color: var(--damga-verified-metin); border-radius: var(--kose-cip); padding: var(--bosluk-1) var(--bosluk-3); }
.duvar { background: var(--kapak); border: 1px solid var(--hair); border-radius: var(--kose); padding: var(--bosluk-4); margin-block: var(--bosluk-4); }
.duvar-dg, .anahtar { display: flex; gap: var(--bosluk-2); flex-wrap: wrap; align-items: center; }
.anahtar { margin-top: var(--bosluk-3); }
.anahtar label { width: 100%; font-size: var(--boy-s); }
.anahtar input { flex: 1; min-width: 12rem; font: inherit; padding: var(--bosluk-2) var(--bosluk-3); border: 1px solid var(--hair); border-radius: var(--kose-cip); background: var(--kapak); color: var(--ink); }

/* yasal sayfalar */
.guncelleme { color: var(--mut); font-size: var(--boy-s); }
.dil-bolum { margin-top: var(--bosluk-5); padding-top: var(--bosluk-5); border-top: 1px solid var(--hair); }
.tablo-kap { overflow-x: auto; margin-block: var(--bosluk-3); }
.tablo-kap table { border-collapse: collapse; width: 100%; min-width: 34rem; font-size: var(--boy-s); }
.tablo-kap th, .tablo-kap td { text-align: start; vertical-align: top; padding: var(--bosluk-2) var(--bosluk-3); border-bottom: 1px solid var(--hair); color: var(--ink-2); }
.tablo-kap th { color: var(--ink); font-weight: 600; }
.metin p, .metin li { color: var(--ink-2); }
.kunye { margin: 0; color: var(--mut); font-size: var(--boy-xs); width: 100%; }

/* satış: planlar ve ödeme */
.satis { margin-top: var(--bosluk-5); }
.plan-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); gap: var(--bosluk-4); margin-bottom: var(--bosluk-4); }
.plan { display: grid; gap: var(--bosluk-2); padding: var(--bosluk-5); background: var(--kapak); border: 2px solid var(--hair); border-radius: var(--kose-buyuk); cursor: pointer; box-shadow: var(--golge); }
.plan:focus-within { outline: 3px solid var(--odak); outline-offset: 2px; }
.plan-secili { border-color: var(--aksan); }
.plan input { width: 1.25rem; height: 1.25rem; accent-color: var(--aksan); }
.plan-ad { font-family: var(--yazi-baslik); font-size: var(--boy-l); font-weight: 600; }
.plan-kime, .plan-ayrinti { color: var(--ink-2); font-size: var(--boy-s); }
.plan-fiyat { font-size: var(--boy-xl); font-weight: 600; color: var(--ink); }
.onaylar { display: grid; gap: var(--bosluk-3); margin-block: var(--bosluk-4); }
.onay { display: flex; gap: var(--bosluk-3); align-items: flex-start; min-height: var(--dokunma); margin-block: var(--bosluk-4); }
.onay input { flex: none; width: 1.25rem; height: 1.25rem; margin-top: .2rem; accent-color: var(--aksan); cursor: pointer; }
.onay label { cursor: pointer; color: var(--ink); }
/* ödeme öncesi özet: ayrı kutu, 16 px altına inmez (Mesafeli Sözleşmeler Yönetmeliği m. 6/2-a) */
.ozet { font-size: max(1rem, var(--boy-m)); line-height: 1.5; color: var(--ink); background: var(--kapak); border: 2px solid var(--hair); border-radius: var(--kose); padding: var(--bosluk-4); margin-block: var(--bosluk-4); }
.onay-panel { background: var(--kapak); border: 1px solid var(--hair); border-radius: var(--kose); padding: var(--bosluk-4); margin-block: var(--bosluk-4); }
.onay-panel .onay { margin-block: 0 var(--bosluk-3); }
.onay-panel .dg[disabled] { opacity: .5; cursor: not-allowed; }
.satis .dg[disabled] { opacity: .5; cursor: not-allowed; }
.anahtar-kutu { background: var(--kapak); border: 1px solid var(--hair); border-radius: var(--kose); padding: var(--bosluk-4); margin-block: var(--bosluk-4); }
.anahtar-kod { display: block; overflow-wrap: anywhere; font-size: var(--boy-m); background: var(--kapak-2); padding: var(--bosluk-3); border-radius: var(--kose); margin-bottom: var(--bosluk-3); user-select: all; }

/* Dar ekran: başlık tek şeritte kalır, dil seçici kendi içinde kayar (sohbete yer kalsın). */
@media (max-width: 40rem) {
  .ust .w { flex-wrap: nowrap; gap: var(--bosluk-2); padding-block: var(--bosluk-2); }
  .ust nav { flex-wrap: nowrap; overflow-x: auto; min-width: 0; gap: var(--bosluk-2); }
  .dil-sec { flex-wrap: nowrap; }
  .marka { font-size: var(--boy-m); flex: none; }
}

/* satış (iyzico): dönem seçici, plan kartları, ödeme paneli, abonelik, hukuk ekleri — yalnız token'lar */
.lede { color: var(--ink-2); font-size: var(--boy-l); margin-block: 0 var(--bosluk-4); }
.donem-secici { border: 1px solid var(--hair); border-radius: var(--kose); padding: var(--bosluk-2) var(--bosluk-4); margin: 0 0 var(--bosluk-4); display: flex; flex-wrap: wrap; gap: var(--bosluk-2) var(--bosluk-5); width: fit-content; max-width: 100%; }
.donem-secici legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.donem-secici label { display: inline-flex; align-items: center; gap: var(--bosluk-2); min-height: var(--dokunma); cursor: pointer; }
.donem-secici input { accent-color: var(--aksan); width: 1.1rem; height: 1.1rem; }
.plan-kart { cursor: default; align-content: start; }
.plan-kart h2 { margin: 0; }
.plan-kart p { margin: 0; }
.plan-kart ul { margin: var(--bosluk-2) 0; padding-inline-start: var(--bosluk-4); color: var(--ink-2); font-size: var(--boy-s); }
.plan-kart .dg { justify-self: start; }
.plan-kart button.dg { cursor: pointer; border: 0; font: inherit; font-weight: 600; }
.plan-satir { color: var(--ink-2); font-size: var(--boy-s); margin-block: var(--bosluk-3); }
.odeme-panel { background: var(--kapak); border: 1px solid var(--hair); border-radius: var(--kose); padding: var(--bosluk-4); margin-block: var(--bosluk-4); }
.odeme-panel h2, .nasil h2, .sss h2 { font-size: var(--boy-l); margin-block: 0 var(--bosluk-3); }
.alanlar { display: grid; gap: var(--bosluk-3); grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); }
.alan { display: grid; gap: var(--bosluk-1); font-size: var(--boy-s); color: var(--ink-2); min-width: 0; }
.alan input { font: inherit; color: var(--ink); background: var(--zemin); border: 1px solid var(--hair); border-radius: var(--kose-cip); padding: var(--bosluk-2) var(--bosluk-3); min-height: var(--dokunma); width: 100%; box-sizing: border-box; }
#odemeyeGec[disabled] { opacity: .5; cursor: not-allowed; }
.nasil, .sss { margin-block: var(--bosluk-5); }
.nasil ol { padding-inline-start: var(--bosluk-5); color: var(--ink-2); }
.nasil li { margin-block: var(--bosluk-2); }
.sss details { border-bottom: 1px solid var(--hair); padding-block: var(--bosluk-2); }
.sss summary { cursor: pointer; font-weight: 600; min-height: var(--dokunma); display: flex; align-items: center; }
.sss details p { color: var(--ink-2); margin-block: var(--bosluk-2); }
#baglantiFormu { display: grid; gap: var(--bosluk-3); max-width: 32rem; }
#baglantiFormu .dg, .iptal-ekrani button, .abonelik-kart button { justify-self: start; cursor: pointer; font: inherit; font-weight: 600; }
.abonelik-kart { border-top: 1px solid var(--hair); padding-block: var(--bosluk-4); }
.abonelik-kart dl { display: grid; grid-template-columns: auto 1fr; gap: var(--bosluk-1) var(--bosluk-4); margin: 0 0 var(--bosluk-3); }
.abonelik-kart dt { color: var(--mut); } .abonelik-kart dd { margin: 0; }
.abonelik-kart button, .iptal-ekrani button { min-height: var(--dokunma); padding: 0 var(--bosluk-4); border: 1px solid var(--hair); border-radius: var(--kose-cip); background: var(--kapak); color: var(--ink); }
.iptal-ekrani fieldset { border: 0; padding: 0; margin: 0 0 var(--bosluk-3); display: grid; gap: var(--bosluk-2); }
.iptal-ekrani button:disabled { opacity: .5; cursor: not-allowed; }