/* ============================================================
   Ortak tema — "yumuşak koyu" + animasyonlar + mobil düzeltmeleri.
   Her sayfada inline <style>'dan SONRA yüklenir; :root değişkenlerini
   geçersiz kılarak tüm araçları tek noktadan yeniden renklendirir.
   Belge çıktıları (#doc beyaz kontrat, #sheet A4) etkilenmez.
   ============================================================ */

/* --- daha açık / yumuşak koyu palet --- */
:root{
  --bg:#1b2230;
  --panel:#252d3d;
  --panel2:#2d3646;
  --line:#3a4658;
  --txt:#e8edf5;
  --muted:#9fb0c8;
  --accent:#59c6ff;
  --accent2:#2d8fbf;
  --good:#4fd699;
  --warn:#ffc06b;
  --bad:#ff7a7a;
  --row:#2a3444;
}

/* --- AÇIK tema (html[data-theme="light"]) --- */
:root[data-theme="light"]{
  --bg:#eef1f7;
  --panel:#ffffff;
  --panel2:#f3f6fb;
  --line:#dbe2ee;
  --txt:#18202e;
  --muted:#5c6b83;
  --accent:#1595dd;
  --accent2:#2d8fbf;
  --good:#12a866;
  --warn:#d98614;
  --bad:#e5484d;
  --row:#eaeff7;
}

/* yumuşak, derinlikli arka plan (yalnızca ekranda; baskıyı bozmaz) */
@media screen{
  body{
    background:
      radial-gradient(1100px 550px at 82% -12%, rgba(89,198,255,.07), transparent 60%),
      radial-gradient(900px 520px at -12% 112%, rgba(124,92,255,.06), transparent 60%),
      var(--bg);
    background-attachment: fixed;
  }
  :root[data-theme="light"] body{
    background:
      radial-gradient(1100px 550px at 82% -12%, rgba(21,149,221,.10), transparent 60%),
      radial-gradient(900px 520px at -12% 112%, rgba(124,92,255,.07), transparent 60%),
      var(--bg);
    background-attachment: fixed;
  }
  /* açık temada kartlar/çubuklar için daha yumuşak gölge */
  :root[data-theme="light"] .card,
  :root[data-theme="light"] .top,
  :root[data-theme="light"] .housebar,
  :root[data-theme="light"] .toolbar{ box-shadow:0 1px 2px rgba(20,40,80,.06), 0 8px 22px rgba(20,40,80,.07); }
  :root[data-theme="light"] ::-webkit-scrollbar-thumb{ background:#c4cede; }
}

/* kartlara yumuşak derinlik */
.card{ box-shadow: 0 1px 2px rgba(0,0,0,.22), 0 10px 28px rgba(0,0,0,.16); border-radius:14px; }

/* --- geçişler & animasyonlar (keyifli his) --- */
button, input, select, textarea, a,
.box, .stat, .person-card, .citem, .archrow, .tabs button, .zone-edit, .bill-block{
  transition: background-color .18s ease, border-color .18s ease, color .18s ease,
              box-shadow .2s ease, transform .13s cubic-bezier(.2,.8,.3,1);
}
button:hover{ transform: translateY(-1px); }
button:active{ transform: translateY(0) scale(.99); }
input:focus, select:focus, textarea:focus{ box-shadow: 0 0 0 3px rgba(89,198,255,.16); }
.person-card:hover, .stat:hover, .box:hover{ transform: translateY(-2px); box-shadow: 0 8px 22px rgba(0,0,0,.22); }
.citem:hover, .archrow:hover{ background: var(--row); }

/* sayfa açılışı ve modal animasyonu */
@keyframes tFadeUp{ from{opacity:0; transform: translateY(8px);} to{opacity:1; transform:none;} }
@keyframes tFadeIn{ from{opacity:0} to{opacity:1} }
@media screen{
  .top{ animation: tFadeUp .3s ease both; }
  .wrap, .layout{ animation: tFadeUp .4s ease both; }
  .overlay.open{ animation: tFadeIn .18s ease; }
  .overlay.open .modal, .modal{ animation: tFadeUp .24s cubic-bezier(.2,.8,.3,1) both; }
}

/* ince, modern kaydırma çubuğu */
*{ scrollbar-width: thin; scrollbar-color: #44506a transparent; }
::-webkit-scrollbar{ height:10px; width:10px; }
::-webkit-scrollbar-thumb{ background:#44506a; border-radius:10px; }
::-webkit-scrollbar-thumb:hover{ background:#556180; }
::-webkit-scrollbar-track{ background:transparent; }

/* hareketi azalt tercihine saygı */
@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; }
}

/* ============================================================
   v2 — "yeni nesil" cila: ferah · yuvarlak · tutarlı  (yalnızca ekran)
   ============================================================ */
@media screen{
  /* köşeleri yumuşat (araçlar arası tutarlılık) */
  button{ border-radius:10px; }
  input, select, textarea{ border-radius:10px; }

  /* üst başlık → gerçek "app-bar" */
  .top{
    background:linear-gradient(180deg, rgba(255,255,255,.035), transparent), var(--panel);
    border:1px solid var(--line); border-radius:16px; padding:12px 18px;
    box-shadow:0 1px 2px rgba(0,0,0,.2), 0 10px 26px rgba(0,0,0,.14); align-items:center;
  }
  .top h1, .top h1.app{ letter-spacing:-.3px; }

  /* araç çubukları biraz daha derinlik */
  .housebar, .toolbar{ border-radius:16px; box-shadow:0 1px 2px rgba(0,0,0,.18), 0 8px 22px rgba(0,0,0,.12); }

  /* aksan / print butonlarına yumuşak gradyan + gölge */
  button.add{ background:linear-gradient(145deg, var(--accent), var(--accent2)); border-color:transparent; color:#04121e; font-weight:700; box-shadow:0 4px 14px rgba(89,198,255,.22); }
  button.print{ background:linear-gradient(145deg, var(--good), #37b87f); border-color:transparent; color:#062117; box-shadow:0 4px 14px rgba(79,214,153,.2); }
  button.add:hover, button.print:hover{ filter:brightness(1.06); }

  /* segmented sekmeler — yalnızca araç sayfaları (.wrap içi); login etkilenmez */
  .wrap .tabs{ background:var(--panel2); border:1px solid var(--line); border-radius:12px; padding:4px; gap:4px; }
  .wrap .tabs button{ border:none !important; background:transparent !important; color:var(--muted) !important; border-radius:9px; font-weight:700; }
  .wrap .tabs button.on{ background:linear-gradient(145deg, var(--accent), var(--accent2)) !important; color:#04121e !important; box-shadow:0 3px 10px rgba(89,198,255,.24); }

  /* housebar "⋯ Menü" açılır menüsü (tüm araçlarda ortak) */
  .hbmenu{ position:relative; display:inline-block; }
  .hbpanel{ position:absolute; top:calc(100% + 6px); right:0; left:auto; z-index:45; min-width:210px; max-width:calc(100vw - 32px);
    background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:6px;
    box-shadow:0 14px 34px rgba(0,0,0,.4); display:none; flex-direction:column; gap:2px; }
  .hbmenu.open .hbpanel{ display:flex; }
  .hbpanel button{ width:100%; text-align:left; background:transparent; border:none; padding:9px 12px; border-radius:8px;
    color:var(--txt); font:inherit; font-size:14px; font-weight:600; cursor:pointer; }
  .hbpanel button:hover{ background:var(--panel2); }
  .hbsep{ height:1px; background:var(--line); margin:4px 6px; }
}

/* --- MOBİL: sağa kayma / yatay taşma düzeltmeleri --- */
@media (max-width:760px){
  html, body{ overflow-x: hidden; max-width: 100%; }
  .wrap, .layout, .top, .housebar, .tabs, .toolbar, .card, .dash{ max-width: 100%; }
  /* geniş tablolar sayfayı değil kendi kutusunu kaydırsın */
  .card{ overflow-x: auto; }
  /* uzun kelime/URL taşmasın */
  .a-meta, .note, .hint, .sub, .foot{ overflow-wrap: anywhere; }

  /* --- tam mobil cila --- */
  body{ padding:14px 12px 40px; }
  .top{ padding:10px 12px; gap:4px 7px; flex-wrap:nowrap; }   /* header tek satır */
  .top h1, .top h1.app{ font-size:16px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }
  .top > a[href="panel.php"]{ flex:none; }
  .top > span:last-child{ gap:6px !important; flex:none; }     /* kontrolleri sıkıştır */
  .top .sm{ padding:5px 9px; }
  .top span[data-i18n$=".tag"]{ display:none; }        /* uzun tanıtım yazısını mobilde gizle */
  button{ min-height:38px; }                            /* dokunma hedefi */
  td button, button.danger, button.ci, .citem button, .cb{ min-height:0; }  /* tablo/ikon butonları küçük kalsın */
  input, select, textarea{ font-size:16px; }            /* iOS odak zoom'unu engelle */
  td input, td select{ font-size:13px; }                /* tablo yoğunluğunu koru */
  .housebar, .toolbar{ padding:10px 12px; }
  .housebar select, .toolbar select{ min-width:0; flex:1 1 140px; }
  .wrap .tabs{ display:flex; width:100%; }
  .wrap .tabs button{ flex:1; }
  /* mobilde üst bar: mail'i gizle → tema+dil+çıkış yan yana taşmadan sığsın */
  .umail{ display:none; }
}