/* ====================================================================
   modal.css — HESAP BAGLAMA PENCERESI TASARIMLARI  (?m=1..16)
   --------------------------------------------------------------------
   Taban markup mm2.cash'ten geliyor (partials/sell-modal-addacc.php),
   rengi koyu yesil. Burasi onu mm2.money'nin diline cekiyor:
   buz mavisi zemin, #2563EB vurgu, camdan yuzey, karemsi koseler,
   secili = ice basilmis.
   Hicbiri markup degistirmez — yalnizca gorunum.
   ==================================================================== */

/* ---- hepsinde ortak: site paleti --------------------------------- */
body[class*="m-"] .aa2.aa3-card { font-family:var(--yazi); }

/* ---- M1 Buz mavisi: sol panel site mavisi ------------------------ */
body.m-1 .aa3-side { background:linear-gradient(160deg,#1D4ED8,#2563EB 55%,#3B82F6); }
body.m-1 .aa2-opt.is-main { border-color:var(--mavi-ln); }

/* ---- M2 Panelsiz: tek sutun, ustte ince adim serdi --------------- */
body.m-2 .aa3-side { display:none; }
body.m-2 .aa2-step.aa3 { grid-template-columns:minmax(0,1fr); }
body.m-2 .aa3-main { padding:26px; }
body.m-2 .aa2.aa3-card { max-width:470px; }

/* ---- M3 Cam: sitenin panelleri gibi ------------------------------ */
body.m-3 .aa2.aa3-card { background:rgba(var(--kd-cam, 255,255,255), .82);
  -webkit-backdrop-filter:blur(20px) saturate(170%); backdrop-filter:blur(20px) saturate(170%);
  border:1px solid var(--kd-kenar, rgba(255,255,255,.8)); box-shadow:0 24px 70px rgba(15,42,86,.26); }
body.m-3 .aa3-side { background:rgba(37,99,235,.1); }
body.m-3 .aa3-side h4, body.m-3 .aa3-side li { color:var(--ink); }
body.m-3 .aa2-opt { background:rgba(var(--kd-cam, 255,255,255), .7); }

/* ---- M4 Acik panel: buz mavisi, koyu yazi ------------------------ */
body.m-4 .aa3-side { background:var(--buz); }
body.m-4 .aa3-side h4 { color:var(--ink); }
body.m-4 .aa3-side li { color:var(--ink-2); }
body.m-4 .aa3-side li.is-on { color:var(--mavi-koyu); }
body.m-4 .aa2-n { background:var(--inci); color:var(--ink-2); }
body.m-4 .aa3-side li.is-on .aa2-n { background:var(--mavi); color:#fff; }

/* ---- M5 Koyu lacivert -------------------------------------------- */
body.m-5 .aa3-side { background:var(--ink); }
body.m-5 .aa3-side li.is-on .aa2-n { background:#8FB2F6; color:var(--ink); }

/* ---- M6 Karemsi: T63'un dili ------------------------------------- */
body.m-6 .aa2.aa3-card { border-radius:12px; }
body.m-6 .aa2-opt, body.m-6 .aa2-input, body.m-6 .aa2-btn { border-radius:9px; }
body.m-6 .aa2-opt-ic { border-radius:8px; }
body.m-6 .aa3-img { border-radius:10px; }

/* ---- M7 Kart dili: secenekler esya karti gibi -------------------- */
body.m-7 .aa2-opt { background:var(--inci); border:0; border-radius:14px;
  box-shadow:0 1px 2px rgba(15,42,86,.05), 0 3px 10px rgba(15,42,86,.06);
  transition:box-shadow var(--gecis), transform var(--gecis); }
body.m-7 .aa2-opt:hover { box-shadow:0 2px 6px rgba(15,42,86,.07), 0 8px 20px rgba(15,42,86,.1); }
body.m-7 .aa2-opt:active { background:var(--kd-basik, #FAFBFC); transform:translateY(1px);
  box-shadow:inset 0 2px 8px rgba(15,42,86,.14), inset 0 0 0 1px rgba(15,42,86,.09); }

/* ---- M8 Ice basilmis secim (TAM TASARIM) -------------------------
   Kullanicinin sectigi duzen. mm2.cash'in koyu yesili tamamen kalkti;
   sol panel sitenin mavisi, yazilar sitenin murekkebi, secenekler esya
   kartiyla ayni dilde: notr beyaz, uzerine gelince ICE BASILMIS. */

/* sol panel, jetonlar, kullanici adi kutusu ve 10 varyant: assets/css/modal-m8.css */

/* kart ve basliklar */
body.m-8 .aa2.aa3-card { border-radius:18px; }
body.m-8 .aa2-title { color:var(--ink); letter-spacing:-.035em; }
body.m-8 .aa2-sub { color:var(--ink-2); }
body.m-8 .aa3-lock { color:var(--ink-3); }
body.m-8 .aa2-x { color:var(--ink-3); }
body.m-8 .aa2-x:hover { background:var(--buz); color:var(--ink); }

/* secenekler — esya karti dili */
body.m-8 .aa2-opt { border:0; background:var(--inci); border-radius:13px; color:var(--ink);
  box-shadow:0 1px 2px rgba(15,42,86,.05), 0 3px 10px rgba(15,42,86,.06);
  transition:box-shadow var(--gecis), transform var(--gecis), background var(--gecis); }
body.m-8 .aa2-opt b { color:var(--ink); }
body.m-8 .aa2-opt small { color:var(--ink-2); }
body.m-8 .aa2-opt-ic { background:var(--buz); color:var(--mavi-koyu); border-radius:11px; }
body.m-8 .aa2-opt-go { color:var(--ink-3); }

body.m-8 .aa2-opt:not(.is-locked):hover { background:var(--kd-basik, #FAFBFC); transform:translateY(1px);
  box-shadow:inset 0 2px 8px rgba(15,42,86,.14), inset 0 0 0 1px rgba(15,42,86,.09); }
body.m-8 .aa2-opt:not(.is-locked):hover .aa2-opt-ic { background:var(--mavi); color:#fff; }
body.m-8 .aa2-opt:not(.is-locked):hover .aa2-opt-go { color:var(--mavi); }

body.m-8 .aa2-opt.is-locked { background:var(--buz); box-shadow:none; opacity:1; }
body.m-8 .aa2-opt.is-locked b, body.m-8 .aa2-opt.is-locked small { color:var(--ink-3); }
body.m-8 .aa2-opt.is-locked .aa2-opt-ic { background:rgba(142,162,192,.2); color:var(--ink-3); }

/* etiketler: yesil -> mavi, "Easiest" vurgusu */
body.m-8 .aa2-tag { background:var(--mavi-sis); color:var(--mavi-koyu); }
body.m-8 .aa2-opt.is-main .aa2-tag:first-of-type { background:var(--mavi); color:#fff; }

/* form parcalari */
body.m-8 .aa2-input { border-radius:13px; border-color:var(--cizgi); background:var(--inci); }
body.m-8 .aa2-input:focus-within { border-color:var(--mavi-ln); }
body.m-8 .aa2-input i { color:var(--ink-3); }
body.m-8 .aa2-input input { color:var(--ink); }
body.m-8 .aa2-btn.is-primary { background:var(--mavi); color:#fff; border-radius:13px;
  box-shadow:0 2px 10px rgba(37,99,235,.3); }
body.m-8 .aa2-btn.is-primary:hover:not(:disabled) { background:var(--mavi-koyu); }
body.m-8 .aa2-back-btn { color:var(--ink-2); }
body.m-8 .aa2-back-btn:hover { color:var(--ink); }
body.m-8 .aa2-note { background:var(--buz); color:var(--ink-2); border-radius:12px; }
body.m-8 .aa2-code { background:none; color:var(--ink); }   /* tek zemin: yalniz .aa2-code-row (2026-10-14) */
body.m-8 .aa2-timer { background:var(--mavi-sis); color:var(--mavi-koyu); }

/* ---- M9 Numarali adimlar ustte ----------------------------------- */
body.m-9 .aa3-side { display:none; }
body.m-9 .aa2-step.aa3 { grid-template-columns:minmax(0,1fr); }
body.m-9 .aa2.aa3-card { max-width:480px; }
body.m-9 .aa2-hero.is-left::before { content:"01 / 03"; display:block; margin-bottom:8px;
  font-size:11px; font-weight:800; letter-spacing:.14em; color:var(--mavi); }
body.m-9 #as-addacc-step-a .aa2-hero.is-left::before { content:"02 / 03"; }
body.m-9 #as-addacc-step-b .aa2-hero.is-left::before { content:"03 / 03"; }

/* ---- M10 Yatay adim cubugu --------------------------------------- */
body.m-10 .aa3-side { display:none; }
body.m-10 .aa2-step.aa3 { grid-template-columns:minmax(0,1fr); }
body.m-10 .aa2.aa3-card { max-width:470px; overflow:hidden; }
body.m-10 .aa3-main { position:relative; padding-top:30px; }
body.m-10 .aa3-main::before { content:""; position:absolute; left:0; right:0; top:0; height:4px;
  background:var(--buz-2); }
body.m-10 .aa3-main::after { content:""; position:absolute; left:0; top:0; height:4px;
  width:33%; background:var(--mavi); transition:width var(--gecis); }
body.m-10 #as-addacc-step-a .aa3-main::after { width:66%; }
body.m-10 #as-addacc-step-b .aa3-main::after { width:100%; }

/* ---- M11 Maskot sagda -------------------------------------------- */
body.m-11 .aa2-step.aa3 { direction:rtl; }
body.m-11 .aa3-side, body.m-11 .aa3-main { direction:ltr; }
body.m-11 .aa3-side { background:var(--buz); }
body.m-11 .aa3-side h4, body.m-11 .aa3-side li { color:var(--ink-2); }
body.m-11 .aa3-side li.is-on { color:var(--mavi-koyu); }

/* ---- M12 Minimal: maskot yok, bol nefes -------------------------- */
body.m-12 .aa3-side { display:none; }
body.m-12 .aa2-step.aa3 { grid-template-columns:minmax(0,1fr); }
body.m-12 .aa2.aa3-card { max-width:440px; }
body.m-12 .aa3-main { padding:32px 30px; }
body.m-12 .aa2-opts { gap:10px; }
body.m-12 .aa2-opt { padding:16px; }
body.m-12 .aa2-sub { margin-bottom:22px; }

/* ---- M13 Renkli ikon kutulari ------------------------------------ */
body.m-13 .aa2-opt-ic { border-radius:11px; color:#fff; }
body.m-13 .aa2-opt:nth-of-type(1) .aa2-opt-ic { background:#2563EB; }
body.m-13 .aa2-opt:nth-of-type(2) .aa2-opt-ic { background:#0E7490; }
body.m-13 .aa2-opt:nth-of-type(3) .aa2-opt-ic { background:#B45309; }
body.m-13 .aa2-opt.is-locked .aa2-opt-ic { background:var(--ink-3); }

/* ---- M14 Cerceveli, duz ------------------------------------------ */
body.m-14 .aa2.aa3-card { background:var(--kd-yuzey, #fff); box-shadow:none;
  border:1.5px solid var(--cizgi-2); -webkit-backdrop-filter:none; backdrop-filter:none; }
body.m-14 .aa2-opt { background:none; border:1.5px solid var(--cizgi); box-shadow:none; }
body.m-14 .aa2-opt:hover { border-color:var(--mavi-ln); }
body.m-14 .aa3-side { background:var(--buz); border-right:1.5px solid var(--cizgi-2); }
body.m-14 .aa3-side h4, body.m-14 .aa3-side li { color:var(--ink-2); }

/* ---- M15 Genis: secenekler iki sutun ----------------------------- */
body.m-15 .aa2.aa3-card { max-width:820px; }
body.m-15 .aa2-opts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
body.m-15 .aa2-opt { flex-direction:column; align-items:flex-start; gap:10px; padding:16px; }
body.m-15 .aa2-opt-go { display:none; }

/* ---- M16 Alt sayfa: telefon dili --------------------------------- */
body.m-16 .aa2-back { align-items:flex-end; }
body.m-16 .aa2.aa3-card { width:min(560px,100%); max-width:none; border-radius:22px 22px 0 0; }
body.m-16 .aa2-back.is-open > .aa2 { transform:none; }
body.m-16 .aa2-back > .aa2 { transform:translateY(40px); }
body.m-16 .aa3-side { display:none; }
body.m-16 .aa2-step.aa3 { grid-template-columns:minmax(0,1fr); }
body.m-16 .aa3-main { padding:24px 24px 30px; }
body.m-16 .aa3-main::before { content:""; display:block; width:38px; height:4px; border-radius:99px;
  background:var(--cizgi-2); margin:0 auto 18px; }