/* Montserrat */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700&display=swap');

:root{
  --bg:#f7f8fa;
  --card:#ffffff;
  --text:#1f2937;
  --muted:#6b7280;
  --primary:#0b63ff;
  --border:#e6e8ec;
  --success:#16a34a;
  --danger:#ef4444;

  --sidebar-w: 300px;
  --sidebar-w-collapsed: 84px;

  --sidebar-bg:#0f172a;
  --sidebar-fg:#e5e7eb;
  --sidebar-active:#1e293b;
  --sidebar-hover:#111827;

  --sb-icon: 56px;
  --sb-gap: 12px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:'Montserrat',system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";
  color:var(--text);
  background:var(--bg);
}

/* Sidebar */
.sidebar{
  position:fixed; top:0; left:0; bottom:0;
  width:var(--sidebar-w);
  background:var(--sidebar-bg); color:var(--sidebar-fg);
  padding:12px 10px; display:flex; flex-direction:column; gap:12px;
  transition:width .25s ease-in-out; z-index:10;
}
.sidebar .sidebar-top{ display:flex; align-items:center; gap:10px; padding:6px 8px; }
.sidebar-toggle{
  width:40px; height:40px; border:none; border-radius:16px;
  background:var(--sidebar-active); color:var(--sidebar-fg);
  display:inline-flex; align-items:center; justify-content:center; cursor:pointer;
}
.sidebar-toggle:hover{ filter:brightness(1.1); }
.ico{ width:20px; height:20px; display:block; }

.brand{ display:flex; align-items:center; gap:10px; font-weight:700; font-size:16px; }

.nav-links{ display:flex; flex-direction:column; gap:6px; padding:6px 4px; }
.nav-links a{
  display:flex; align-items:flex-start; gap:12px;
  padding:10px 12px; color:var(--sidebar-fg); text-decoration:none;
  border-radius:16px; background:transparent;
}
.nav-links a:hover{ background:var(--sidebar-hover); }
.nav-links a.active{ background:var(--sidebar-active); }
.nav-links .label{ display:block; font-size:13px; line-height:1.25; white-space:normal; overflow-wrap:anywhere; }

.sidebar-bottom{ margin-top:auto; padding:6px 8px; }
.mini-hint{ display:flex; align-items:flex-start; gap:8px; font-size:12px; color:#c7cbd3; }

.content{ margin-left:var(--sidebar-w); padding:18px; transition:margin-left .25s ease-in-out; }

/* Collapsed */
body.sidebar-collapsed .sidebar{ width:var(--sidebar-w-collapsed); }
body.sidebar-collapsed .brand{ display:none; } /* LOGO gizlenir */
body.sidebar-collapsed .nav-links .label,
body.sidebar-collapsed .mini-hint .label,
body.sidebar-collapsed .logout-btn .label{ display:none; }
body.sidebar-collapsed .sidebar-top{ padding:0; }
body.sidebar-collapsed .sidebar-toggle{ width:var(--sb-icon); height:var(--sb-icon); margin:var(--sb-gap) auto; border-radius:18px; }
body.sidebar-collapsed .nav-links{ padding:0; gap:0; }
body.sidebar-collapsed .nav-links a{
  width:var(--sb-icon); height:var(--sb-icon);
  margin:var(--sb-gap) auto; padding:0; justify-content:center; align-items:center; gap:0;
}
body.sidebar-collapsed .logout-btn a{
  width:var(--sb-icon); height:var(--sb-icon);
  margin:var(--sb-gap) auto; padding:0; justify-content:center; align-items:center; gap:0;
}
body.sidebar-collapsed .content{ margin-left:var(--sidebar-w-collapsed); }

/* Kart/Tablo genel */
.container, .content{ max-width:1200px; }
.card{
  background:var(--card); border:1px solid var(--border);
  border-radius:14px; padding:16px; box-shadow:0 1px 2px rgba(0,0,0,.03); margin-bottom:16px;
}
h1{ margin:4px 0 12px; font-size:20px; }
h2{ margin:0 0 10px; font-size:18px; }

.row{ display:grid; gap:16px; grid-template-columns:1fr 1fr; }
@media (max-width:900px){ .row{ grid-template-columns:1fr; } }

label{ font-size:13px; color:var(--muted); margin-bottom:6px; display:block; }
input[type="text"],input[type="date"],input[type="number"],select,textarea{
  width:100%; padding:10px 12px; border:1px solid var(--border); border-radius:10px; background:#fff; outline:none;
}
textarea{ min-height:90px; resize:vertical; }

button,.button-danger,.button-success{
  padding: 10px 10px; border:none; border-radius:10px; cursor:pointer;
  background:var(--primary); color:#fff; font-weight:600;
}
.button-danger{ background:var(--danger)!important; }
.button-success{ background:var(--success)!important; }

.flash{ padding:10px 12px; border-radius:10px; margin-bottom:12px; font-size:14px; }
.flash.ok{ background:#e9f8ef; color:#165b31; border:1px solid #c9eed6; }
.flash.err{ background:#fde8e8; color:#7f1d1d; border:1px solid #f9caca; }

/* TABLOLAR – kompakt tipografi */
table{ width:100%; border-collapse:separate; border-spacing:0; font-size:13px; }
table.compact th, table.compact td{ padding:5px 10px; }
th{ font-size:12px; color:var(--muted); font-weight:600; }
td{ line-height:1.25; }
tr:last-child td{ border-bottom:none; }
th, td{ border-bottom:1px solid var(--border); text-align:left; vertical-align:middle; }

/* Aksiyon butonları (Font Awesome ikonlar) */
.actions{ display:flex; align-items:center; gap:8px; justify-content:flex-end; }
.icon-btn{
  width:28px; height:28px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:10px; text-decoration:none; background:#f5f7fb; border:1px solid var(--border); color:#111827;
}
.icon-btn:hover{ background:#eef2ff; border-color:#cfd8ea; }
.icon-btn.edit{ color:#2563eb; }
.icon-btn.delete{ background:#fff5f5; border-color:#f9caca; color:#991b1b; }
.icon-btn.delete:hover{ background:#ffe8e8; }

/* FA ikon boyutu/hiza */
.icon-btn i{ font-size:12px; line-height:1; display:block; }

/* Diğer */
.note{ font-size:10px; color:var(--muted); margin-top:6px; }
.canvas-wrap{ display:flex; justify-content:center; padding:10px 0; }
.table-toolbar{ display:flex; gap:12px; align-items:center; justify-content:space-between; margin:10px 0; }
.pager{ display:flex; gap:6px; flex-wrap:wrap; }
.pager a,.pager span{ padding:6px 10px; border:1px solid var(--border); border-radius:8px; background:#fff; text-decoration:none; color:#1f2937; font-size:13px; }
.pager span.current{ background:#eaf1ff; border-color:#cfd8ea; color:#0b63ff; font-weight:600 }
.pager a:hover{ background:#f3f4f6 }
.small-muted{ font-size:12px; color:#6b7280 }

@media (max-width:720px){
  .content{ padding:14px; }
  .sidebar{ padding:10px 8px; }
  .nav-links a{ padding:10px; gap:10px; }
}

/* --- Bilanço işlem şeritleri + tür hücresi --- */
.tur-cell{ display:flex; align-items:center; gap:8px; }
.ico.sm{ width:16px; height:16px; display:block; }

/* Satırın solunda renkli şerit */
tr.trx-gelir  td{ border-left:4px solid #2ecc71; }
tr.trx-gider  td{ border-left:4px solid #e74c3c; }
tr.trx-alacak td{ border-left:4px solid #3498db; }
tr.trx-borc   td{ border-left:4px solid #f39c12; }

/* İstersen daha yumuşak arka plan */
tr.trx-gelir  { background: linear-gradient(90deg, rgba(46,204,113,0.10) 0 80px, transparent 80px); }
tr.trx-gider  { background: linear-gradient(90deg, rgba(231,76,60,0.10) 0 80px, transparent 80px); }
tr.trx-alacak { background: linear-gradient(90deg, rgba(52,152,219,0.10) 0 80px, transparent 80px); }
tr.trx-borc   { background: linear-gradient(90deg, rgba(243,156,18,0.10) 0 80px, transparent 80px); }

#pdfBtn{ margin-top: 10px; }

/* Çıkış butonu */
.logout-btn a {
  display:flex;
  align-items:center;
  gap:8px;
  color:#fff;
  background:var(--danger);
  padding:10px 14px;
  border-radius:12px;
  text-decoration:none;
  font-weight:600;
  justify-content:flex-start;
}
.logout-btn a:hover{ background:#c0392b; }


/* ==== Bilanço scrollable container ==== */
.bilanco-list{
  max-height:60vh;
  overflow:auto;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--card);
}
.bilanco-list table{ min-width: 980px; }
.bilanco-list thead th{ position: sticky; top:0; z-index:1; background: var(--card); }
@media (max-width:768px){
  .bilanco-list{ max-height:55vh; }
  .bilanco-list table{ min-width:820px; }
}

/* ==== Dark mode palette ==== */
:root[data-theme="dark"]{
  --bg:#0b1020;
  --card:#0f172a;
  --text:#e5e7eb;
  --muted:#9aa3b2;
  --primary:#60a5fa;
  --border:rgba(255,255,255,.12);
  --sidebar-bg:#0b1224;
  --sidebar-fg:#e5e7eb;
  --sidebar-active:#182342;
  --sidebar-hover:#0f1b38;
}

/* ==== Mobile Topbar ==== */
.mobile-topbar{
  display:none;
}
@media (max-width:768px){
  body{ padding-top:64px; }
  .content{ margin-left:0 !important; }
  .sidebar{ display:none; }

  .mobile-topbar{
    position:fixed; inset:0 0 auto 0; height:64px; z-index:40;
    display:flex; align-items:center; justify-content:space-between;
    background:var(--sidebar-bg); color:var(--sidebar-fg);
    padding:8px 12px; border-bottom:1px solid var(--border);
  }
  .mt-left{ display:flex; align-items:center; gap:10px; }
  .mt-logo{ height:34px; display:block; }

  .mt-right{ display:flex; align-items:center; gap:8px; }
  .theme-toggle, .menu-trigger{
    width:40px; height:40px; border-radius:12px; border:1px solid var(--border);
    background:transparent; color:var(--sidebar-fg); display:grid; place-items:center; cursor:pointer;
  }
  .mobile-menu{ position:relative; }
  .mobile-menu .menu-pop{
    position:absolute; right:0; top:48px; width:min(92vw, 320px);
    background:var(--card); color:var(--text);
    border:1px solid var(--border); border-radius:12px; box-shadow:0 12px 30px rgba(0,0,0,.25);
    padding:6px; display:none;
  }
  .mobile-menu[open] .menu-pop{ display:block; }
  .menu-links a{ display:flex; gap:10px; align-items:center; padding:10px 12px; border-radius:10px; color:inherit; text-decoration:none; }
  .menu-links a:hover{ background:#f3f4f6; }
  :root[data-theme="dark"] .menu-links a:hover{ background:#101828; }
  .menu-divider{ height:1px; background:var(--border); margin:6px 0; }
  .menu-logout{ display:flex; gap:10px; align-items:center; padding:10px 12px; border-radius:10px; color:#b91c1c; text-decoration:none; }
}

/* Floating theme switch (visible desktop+mobile) */
.theme-fab{
  position:fixed; right:14px; bottom:14px; z-index:60;
  width:46px; height:46px; border-radius:14px; border:1px solid var(--border);
  background:var(--card); color:var(--text);
  display:grid; place-items:center; cursor:pointer;
  box-shadow: 0 10px 26px rgba(0,0,0,.18);
}
@media (max-width:768px){
  .theme-fab{ display:none; bottom: calc(14px + env(safe-area-inset-bottom)); }
}
.login-body{
  min-height:100dvh;
  margin:0;
  /* Üstte koyu degrade + Unsplash finans görseli */
  background:
    radial-gradient(1200px 600px at 20% 10%, rgba(0,0,0,.25), rgba(0,0,0,.6)),
    url("login-bg.webp");
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
  background-attachment:fixed;
}

/* === Başlık (th) sıralama linkleri – light & dark temaya uygun renkler === */
:root{
  --th-link: #0b63ff;
  --th-link-hover: #084cdf;
  --th-link-active: #073ab6;
  --th-link-bg-hover: rgba(11,99,255,.08);
  --th-link-bg-active: rgba(11,99,255,.12);
  --th-link-focus: rgba(11,99,255,.35);
}

:root[data-theme="dark"]{
  --th-link: #93c5fd;
  --th-link-hover: #bfdbfe;
  --th-link-active: #60a5fa;
  --th-link-bg-hover: rgba(147,197,253,.12);
  --th-link-bg-active: rgba(147,197,253,.18);
  --th-link-focus: rgba(147,197,253,.28);
}

th a{
  color: var(--th-link);
  text-decoration: none;
  font-weight: 700;           /* başlıkta daha belirgin dursun */
  padding: 4px 8px;           /* tıklama alanını büyüt */
  border-radius: 8px;
  transition: color .15s ease, background-color .15s ease, box-shadow .15s ease;
  display: inline-flex;       /* “↑/↓” oklarıyla hizalama daha iyi olur */
  align-items: center;
  gap: 4px;
}
th a:hover{ color: var(--th-link-hover); background: var(--th-link-bg-hover); }
th a:active{ color: var(--th-link-active); background: var(--th-link-bg-active); }
th a:visited{ color: var(--th-link); }      /* visited rengi değişmesin */
th a:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px var(--th-link-focus);
  background: var(--th-link-bg-hover);
}


.fa-solid,.fas{
  font-size: 16px !important;
}