/* ============================================================================
   REFINE — estetik olgunlastirma katmani  (EN SON yuklenir, hepsini ezer)
   ----------------------------------------------------------------------------
   Amac: "hacker / terminal / HUD" dilinden CIKIP sakin, rafine, iOS-vari bir
   gorunum. Yapiyi ve mavi/turkuaz paleti KORUR. Degisenler:
     · YESIL tamamen kalkar  -> paletin sakin turkuazina tasinir
     · Glow / parlama / tarama-isini efektleri soner
     · Sinematik arka planlar (aurora, isik cizgisi, mesh) sondurulur/yumusar
     · Mono BUYUK-HARF genis-aralikli etiketler -> sakin sans, dar aralik
     · "//", ">", "●", yanip-sonen imlec gibi terminal onekleri kalkar
     · Kartlar incelir: yumusak kenar, daha yuvarlak, sakin golge
     · Gecisler yumusar ve tutarlilasir
   ========================================================================== */

:root {
  /* --- AKSAN: turkuazdan biraz daha MAVIYE kaydirildi (sky-cyan) --- */
  --accent-rgb: 51, 165, 224;
  --accent: #33a5e0;
  --accent-hover: #52bdf2;
  --accent-press: #2a8fcc;
  --accent-text: #7cc8f5;
  --accent-top: #46b4ec;
  --accent-bot: #2894d6;
  --accent-soft: rgba(var(--accent-rgb), 0.13);
  --accent-line: rgba(var(--accent-rgb), 0.34);

  /* --- YESIL -> mavimsi turkuaz (yesil DEGIL; aksanla ayni mavi aile) --- */
  --green: #3f96c8;
  --green-soft: rgba(63, 150, 200, 0.12);

  /* --- Parlamayi neredeyse sifirla --- */
  --accent-glow: rgba(var(--accent-rgb), 0.12);

  /* --- Tek, yumusak gecis egrisi (sert degil) --- */
  --ease: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);

  /* --- Daha yuvarlak kart yaricapi (iOS hissi) --- */
  --r-card: 18px;
  --r-control: 13px;
}

/* ============================================================
   GLOBAL RESPONSIVE GUVENLIK AGI
   Hicbir gorsel/medya kapsayicisini yatay ASMASIN. (Sabit 180px QR kodu
   dar/zoom'lu ekranda tasiyordu; buna benzer tum sabit-boyut medyalar
   artik kapsayicida kalir.) Ikon SVG'leri haric tutuldu (CSS ile boyutlu).
   ============================================================ */
img, video, canvas, iframe, embed, object { max-width: 100%; }

/* Akilli-sorgu sohbeti: flex-item `min-width:auto` yuzunden kapsayici,
   icerigin min-content genisligi (uzun mesaj/input) altina inemeyip mobilde
   tasiyordu. Flex cocuklar kuculebilsin + uzun metin sarilsin. */
.chat-container, .chat-container .card-body, .input-area { min-width: 0; max-width: 100%; }
.chat-msg, .bubble { word-break: break-word; overflow-wrap: anywhere; }
.input-area input, .input-area textarea { min-width: 0; }
@media (max-width: 600px) { .input-area { flex-wrap: wrap; } }

/* EVRENSEL: `.content` bir flex-column; dogrudan cocuklari (kart/grid/satir)
   flex-item olarak `min-width:auto` ile kapsayici altina INEMEZDI -> genis grid
   ya da uzun icerik dar/zoom'lu ekranda sayfayi tasiyordu (orn. .contact-grid).
   min-width:0 ile kapsayici genisligine kuculurler. Masaustunde etkisiz (zaten
   sigiyorlar); yalnizca dar ekranda tasmayi keser. */
.content > * { min-width: 0; max-width: 100%; }

/* redefinisyonlar acik temada da gecerli olsun */
[data-theme="light"] {
  --green: #2f88bd;
  --green-soft: rgba(47, 136, 189, 0.11);
  --accent-text: #2a8fcc;
}

/* ============================================================
   1) SINEMATIK ARKA PLANLAR — kaldir / cok yumusat
   ============================================================ */
.main::before { display: none !important; }          /* arka plan aurorasi */
.topbar::after { display: none !important; }          /* topbar isik cizgisi */

/* Kimlik ekranlarindaki mesh/glow/grain: cok hafif kalsin, animasyon dursun */
.hero__mesh { opacity: 0.25 !important; }
.hero__glow { opacity: 0.30 !important; filter: blur(90px) !important; }
.hero__grain { opacity: 0.04 !important; }
.hero__mesh, .hero__glow { animation: none !important; }

/* ============================================================
   2) TERMINAL ONEKLERI ve YANIP-SONEN OGELER — kaldir
   ============================================================ */
.topbar__title span::before { content: "" !important; margin: 0 !important; }
.search--btn::before { content: "" !important; margin: 0 !important; }

/* Ust bar arama BUTONU: element hem .search hem .search--btn tasiyor. monarc.css
   `.search svg`'yi absolute konumluyor (input arama kutusu icin tasarlanmis) ->
   buton flex olunca ikon "Sorgu ara" metninin USTUNE biniyordu ("ic ice"). Buton
   icindeki ikon normal flex ogesi olsun; ikon + metin + Ctrl/K yan yana dizilir. */
.search--btn svg { position: static !important; transform: none !important; left: auto !important; top: auto !important; }

.loader__text::after { content: "" !important; }      /* yanip sonen imlec */
.loader__text { letter-spacing: 0.14em !important; text-indent: 0 !important; }

/* Buton "sheen" supurmesi — kaldir (sakin yuzey) */
.btn::before { display: none !important; }

/* ============================================================
   3) GLOW / PARLAMA — sondur
   ============================================================ */
.logo__mark { box-shadow: inset 0 1px 0 rgba(var(--hair), 0.22) !important; }
.progress { box-shadow: none !important; background: var(--accent) !important; opacity: 0.9; }
.pill::before { box-shadow: none !important; }
.dot-ind--live { box-shadow: none !important; }

[class*="glow"] { box-shadow: none !important; }
.stat__icon, .ov__ico, .holo-prev__av { box-shadow: none !important; }

/* ============================================================
   4) TIPOGRAFI — mono/BUYUK-HARF/genis-aralik  ->  sakin sans
   Kucuk etiketler ELEGANT kalir (buyuk harf + dar aralik + sans),
   terminal hissi veren mono ve 0.2-0.42em aralik gider.
   ============================================================ */
.side-nav .sec,
.panel-title,
.loader__text,
.logo,
.side-search input,
.pill  {
  font-family: var(--font) !important;
}

.side-nav .sec,
.panel-title  {
  letter-spacing: 0.045em !important;
  font-weight: 600 !important;
  color: var(--ink-3) !important;
}

.logo {
  letter-spacing: 0.02em !important;
  font-weight: 700 !important;
}

.side-nav .sec { font-size: 10.5px !important; }
.panel-title { font-size: 11px !important; }
.pill { letter-spacing: 0.01em !important; font-weight: 600 !important; }

/* Buyuk telemetri rakamlari: mono yerine sans + tabular (daha zarif) */
.stat__value, .amount, .footer-stat,
.metric, .result-count, .side-plan strong  {
  font-family: var(--font) !important;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em !important;
  font-weight: 700 !important;
}

/* ============================================================
   5) KARTLAR — incelt: yumusak kenar, sakin golge, yuvarlak
   ============================================================ */
.card, .stat-card,
.mk {
  border: 1px solid var(--line) !important;
  border-radius: var(--r-card) !important;
  /* MAT: golge yok, yuzey duz — kartlar zeminde "yuzmez", sakin oturur */
  box-shadow: none !important;
  background: var(--surface) !important;
  background-image: none !important;
}
[data-theme="light"] .card,
[data-theme="light"] .mk  {
  /* acik temada zeminden ayrilmak icin yalnizca cok ince bir cizgi golgesi */
  box-shadow: 0 1px 1px rgba(16, 19, 28, 0.03) !important;
  border-color: var(--line-2) !important;
}

/* MAT: kart ustundeki parlak ic-cizgi (gloss) highlight'i tamamen kalksin */
.card::before { display: none !important; }

/* kart basliklari sakin */
.card__head h2, .card__head h3 { letter-spacing: -0.01em; font-weight: 640; }

/* istatistik ikon kutusu: yumusak, glow'suz */
.stat__icon {
  border-radius: 12px !important;
  background: var(--accent-soft) !important;
  color: var(--accent-text) !important;
}

/* ============================================================
   6) GECISLER — yumusak ve tutarli
   ============================================================ */
.btn, .card, .nav-link, .nav-sub a, .side-nav a, .pill, .input, .field, .tab,
.mk, .chip, .holo-opt, .swatch  {
  transition-timing-function: var(--ease-out) !important;
  transition-duration: 0.22s !important;
}

/* hover'da sert siçrama yerine hafif yukselme */
.card:hover, .mk:hover  { transform: translateY(-1px); }

/* menu aktif "fosfor sol centik + parilti" -> sade sol vurgu */
.nav-sub a.active::before, .side-nav a.nav-link.active::before,
.nav-sub a.is-active::before, .side-nav a.nav-link.is-active::before {
  box-shadow: none !important;
}

/* ============================================================
   7) KUCUK RAFINE DOKUNUSLAR
   ============================================================ */
/* arama kutusu ">" terminal istemi zaten kalkti; yazi tipi sakin */
.side-search input, .search input { letter-spacing: 0 !important; }

/* odak halkasi biraz daha ince/sakin */
:root { --ring: 0 0 0 3px rgba(var(--accent-rgb), 0.16); }

/* secili menu ogesi arka plani yumusak */
.side-nav a.nav-link.active, .nav-sub a.active,
.side-nav a.nav-link.is-active, .nav-sub a.is-active {
  background: var(--accent-soft) !important;
}

/* ============================================================
   8) GIRIS EKRANI istatistik seridi (.auth__proof)
   ops-skin.css'te agir mavi callout kutusuydu: zemin + sol accent
   cubugu + tek-tarafli radius, ama PADDING YOKTU -> sayilar kenara
   yapisik, bozuk goruntu. Sade, cizgiyle ayrilmis stat satirina cevrildi.
   ============================================================ */
.auth__proof {
  background: none !important;
  border-left: 0 !important;
  border-radius: 0 !important;
  border-top: 1px solid var(--line) !important;
  padding: 22px 0 0 !important;
  margin-top: 30px !important;
  gap: 44px !important;
}
.auth__proof > div { text-align: left; }
.auth__proof .num {
  color: var(--ink) !important;
  font-family: var(--font) !important;
  font-weight: 700 !important;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em !important;
}
.auth__proof .cap {
  color: var(--ink-3) !important;
  font-size: 11.5px !important;
  margin-top: 4px !important;
  letter-spacing: 0.01em !important;
}

/* ============================================================
   9) FORM ETIKETLERI — hacker mono/BUYUK-HARF/genis-aralik temizligi
   ops-skin.css'te .form-group > label mono + uppercase + 0.14em idi
   ("E-POSTA" gibi). Sakin, okunakli sans'a cevrildi.
   ============================================================ */
.form-group > label,
.field-group > label,
.field-group > .lbl,
.form-label {
  font-family: var(--font) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  color: var(--ink-2) !important;
  margin-bottom: 7px !important;
}
/* help-icon artik label icinde; label metniyle ayni satirda hizali */
.form-label .help-icon { vertical-align: middle; margin-left: 5px; }

/* Baglanti kartlari (Telegram/Discord) ve tercih satirlari: hint yazilari
   sakin, satirlar dikey ortali kalsin (kayma olmasin) */
.link-row, .pref-row { align-items: center !important; }
.link-hint, .pref-label { letter-spacing: 0 !important; }

/* --- KATMAN CAKISMASI DUZELTMESI: bordered liste kutularinda yatay ic bosluk ---
   .pref-list / .link-list bordered bir kutudur (monarc-legacy), ama ops-skin
   .pref-row/.link-row/.ntf-pref-row'a `padding: X 0` verip YATAY ic boslugu
   sifirlamis. Sonuc: etiket sol border'a, toggle/select sag border'a yapisik
   ("sikis tikis / tasmis") duruyordu. Yatay ic bosluk geri veriliyor. */
.pref-row, .link-row, .ntf-pref-row { padding-left: 16px !important; padding-right: 16px !important; }

/* Tercih satirindaki select kenara dayanmasin + makul genislik */
.pref-row .form-control { max-width: 168px; }
/* Toggle sag border'a birebir yapismasin (nefes) */
.pref-row .switch { margin-right: 0; }

/* --- GRID KOLON COKMESI DUZELTMESI ---
   monarc-compat `.row > [class*="col-"]{flex:1 1 0;min-width:0}` (ozgulluk 0,2,0)
   sized kolonlarin `min-width`'ini (col-*-4:230px, col-*-3:200px) EZIYORDU.
   2-kolonlu (col-*-6) satirlar 50/50 calistigi icin sorun gorunmuyordu; ama
   3'lu/4'lu grid'ler (col-xl-4 vb.) tek satira sikisip ~31px'e cokuyor, icerik
   tasiyordu (orn. /admin/error-codes). Esit ozgullukle min-width geri verilir;
   refine EN SON yuklendigi icin kazanir -> kolonlar dogru sayida sarar. */
.row > [class*="col-md-4"], .row > [class*="col-lg-4"], .row > [class*="col-xl-4"] { min-width: 230px; }
.row > [class*="col-md-3"], .row > [class*="col-lg-3"], .row > [class*="col-xl-3"] { min-width: 200px; }

/* ============================================================
   10) MOBIL DUZELTMELERI
   Masaustu duzeltilince mobilde bozuk kalan yerler.
   ============================================================ */
@media (max-width: 600px) {
  /* Topbar cok sikisikti: baslik kirpiliyor, alt baslik 4 satira sariyordu.
     Mobilde alt baslik gizlenir, baslik biraz kuculur ve sigar. */
  .topbar__title > span { display: none !important; }
  .topbar__title h1 { font-size: 15px !important; }
  .topbar { gap: 8px; }

  /* Market kosе bandi (.mk__ribbon) karti asip viewport disina tasiyordu:
     kart artik ribbon'u kirpar (yuvarlak kosede sik durur). */
  .mk { overflow: hidden !important; }

  /* Genis tablolar kaydirilabilir sarmalayici icinde; mobilde kenardan
     tasmasin diye sarmalayici tam genislik + yatay kaydirma net olsun. */
  .table-wrap, .table-responsive { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }

  /* Kartlar mobilde biraz daha az ic bosluk (dar ekranda nefes) */
  .grid-2 > .card, .content > .card { padding: 16px !important; }

  /* Sekme cubugu (profil vb.) mobilde kaydirilabilir, tasmasin */
  .tabs { overflow-x: auto; -webkit-overflow-scrolling: touch; flex-wrap: nowrap; }
  .tabs .tab { flex: 0 0 auto; }
}