/* =========================================================
   Gelir Gider Takip - Premium One UI 8.5 İlhamlı Tasarım
   Yuvarlak hatlar, kalın tipografi, dolgun renk blokları,
   yumuşak derinlik, cam efekti üst bar, gradyan vurgular.
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@500;600;700;800&display=swap');

:root{
    --navy-950:#0a0f1c;
    --navy-900:#0f172a;
    --navy-800:#182338;
    --ink:#10182b;
    --paper:#eef1f7;
    --card:#ffffff;
    --line:#eef0f5;
    --muted:#71798c;

    --teal:#0f9c8e;
    --teal-2:#17b8a4;
    --teal-dark:#0b7d72;
    --teal-tint:#e3faf5;

    --amber:#e08a00;
    --amber-2:#f2a723;
    --amber-tint:#fff3dd;

    --rose:#ea2a5a;
    --rose-2:#f14d76;
    --rose-tint:#ffe6ec;

    --blue:#3b5bfd;
    --blue-2:#5f78ff;
    --blue-tint:#e8ecff;

    --income:#0f9c8e;
    --expense:#ea2a5a;

    --r-xl:28px;
    --r-lg:22px;
    --r-md:16px;
    --r-sm:12px;
    --r-full:999px;

    --shadow-sm:0 2px 8px rgba(16,24,43,.05);
    --shadow-md:0 14px 34px -10px rgba(16,24,43,.14);
    --shadow-lg:0 24px 56px -14px rgba(16,24,43,.2);
    --shadow-glow-teal:0 10px 24px -6px rgba(15,156,142,.45);
}

*{box-sizing:border-box;}

body{
    font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
    background:
        radial-gradient(1200px 600px at 100% -10%, #e7fbf6 0%, rgba(238,241,247,0) 55%),
        radial-gradient(900px 500px at -10% 10%, #eef0ff 0%, rgba(238,241,247,0) 50%),
        var(--paper);
    background-attachment:fixed;
    color:var(--ink);
    font-size:14.5px;
    -webkit-font-smoothing:antialiased;
    letter-spacing:-.01em;
}

.display, h1,h2,h3,h4,h5,h6{
    font-family:'Manrope','Inter',sans-serif;
    font-weight:800; letter-spacing:-.02em;
}

.mono, .num{
    font-family:'Manrope','Inter',sans-serif;
    font-variant-numeric:tabular-nums;
    font-weight:800;
    letter-spacing:-.02em;
}

a{ text-decoration:none; }

/* ---------- Layout ---------- */
.app-shell{ display:flex; min-height:100vh; }

.sidebar{
    width:264px;
    background:
        radial-gradient(420px 220px at 15% 0%, rgba(15,156,142,.25), transparent 60%),
        linear-gradient(190deg, var(--navy-950), var(--navy-900) 65%);
    color:#cbd5e1;
    flex-shrink:0;
    position:fixed;
    top:0; bottom:0; left:0;
    display:flex;
    flex-direction:column;
    z-index:1000;
    transition:transform .25s ease;
}

.sidebar-brand{
    padding:26px 22px 20px;
    display:flex;
    align-items:center;
    gap:12px;
}
.sidebar-brand .logo-icon{
    width:40px;height:40px;border-radius:var(--r-md);
    background:linear-gradient(135deg, var(--teal), var(--teal-2));
    display:flex;align-items:center;justify-content:center;
    color:#fff;font-weight:800;font-size:17px;
    flex-shrink:0;
    box-shadow:var(--shadow-glow-teal);
}
.sidebar-brand .brand-name{
    font-family:'Manrope',sans-serif;
    color:#fff;font-weight:800;font-size:15.5px;line-height:1.2;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    letter-spacing:-.01em;
}
.sidebar-brand .brand-sub{ font-size:11px;color:#57627a; font-weight:600; }

.sidebar-nav{ padding:8px 14px; overflow-y:auto; flex:1; }
.sidebar-section-label{
    font-size:10.5px; text-transform:uppercase; letter-spacing:.09em;
    color:#3e4a63; padding:18px 12px 8px;
    font-weight:800;
}
.sidebar-nav a{
    display:flex; align-items:center; gap:12px;
    padding:11px 14px; border-radius:var(--r-full);
    color:#9aa4bd; font-size:13.8px; font-weight:700;
    margin-bottom:3px;
    transition:background .15s, color .15s, transform .1s;
}
.sidebar-nav a i{ width:19px; text-align:center; font-size:15px; color:#4b5773; }
.sidebar-nav a:hover{ background:rgba(255,255,255,.06); color:#fff; }
.sidebar-nav a:active{ transform:scale(.98); }
.sidebar-nav a.active{
    background:linear-gradient(120deg, var(--teal), var(--teal-2));
    color:#fff; box-shadow:var(--shadow-glow-teal);
}
.sidebar-nav a.active i{ color:#fff; }

.sidebar-foot{
    padding:16px 20px; font-size:11.5px; color:#3e4a63; font-weight:600;
}

.main-wrap{ margin-left:264px; flex:1; min-width:0; display:flex; flex-direction:column; }

.topbar{
    height:78px; background:rgba(238,241,247,.72);
    backdrop-filter:blur(14px) saturate(160%);
    -webkit-backdrop-filter:blur(14px) saturate(160%);
    display:flex; align-items:center; justify-content:space-between;
    padding:0 28px; position:sticky; top:0; z-index:900;
    border-bottom:1px solid rgba(15,23,42,.04);
}
.topbar .page-title{ font-family:'Manrope',sans-serif; font-size:21px; font-weight:800; color:var(--ink); letter-spacing:-.02em;}
.topbar .page-title .sub{ font-size:12.5px; color:var(--muted); font-weight:600; display:block; margin-top:1px;}

.topbar-user{ display:flex; align-items:center; gap:12px; }
.topbar-user > a{
    display:flex; align-items:center; gap:10px;
    background:#fff; padding:6px 16px 6px 6px; border-radius:var(--r-full);
    box-shadow:var(--shadow-sm);
    border:1px solid rgba(15,23,42,.04);
    transition:box-shadow .15s;
}
.topbar-user > a:hover{ box-shadow:var(--shadow-md); }
.topbar-user .avatar{
    width:38px;height:38px;border-radius:50%;
    background:linear-gradient(135deg,var(--navy-800),var(--navy-900)); color:#fff;
    display:flex;align-items:center;justify-content:center;
    font-weight:800; font-size:13.5px;
    font-family:'Manrope',sans-serif;
}
.menu-toggle{ display:none; background:none;border:none;font-size:20px;color:var(--ink); }

.content{ padding:8px 28px 28px; flex:1; }

/* ---------- Cards ---------- */
.card{
    background:var(--card); border:1px solid rgba(15,23,42,.035); border-radius:var(--r-lg);
    box-shadow:var(--shadow-sm);
    transition:box-shadow .2s ease;
}
.card-header-flex{
    display:flex; align-items:center; justify-content:space-between;
    padding:18px 22px; border-bottom:1px solid var(--line);
}
.card-header-flex h6{ margin:0; font-weight:800; font-size:14.5px; letter-spacing:-.01em; font-family:'Manrope',sans-serif;}
.card-body-pad{ padding:22px; }

.stat-card{
    border-radius:var(--r-lg); padding:22px; position:relative; overflow:hidden;
    border:1px solid rgba(15,23,42,.035); background:#fff; box-shadow:var(--shadow-sm);
    transition:transform .18s ease, box-shadow .18s ease;
}
.stat-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); }
.stat-card .stat-label{ font-size:12.5px; color:var(--muted); font-weight:700; letter-spacing:-.005em;}
.stat-card .stat-value{ font-size:28px; font-weight:800; margin-top:8px; font-family:'Manrope',sans-serif; letter-spacing:-.025em;}
.stat-card .stat-icon{
    position:absolute; right:18px; top:18px; width:46px;height:46px;border-radius:var(--r-md);
    display:flex;align-items:center;justify-content:center;font-size:18px;
    box-shadow:0 8px 18px -6px rgba(16,24,43,.25);
}
.stat-card.income{ background:linear-gradient(160deg,var(--teal-tint),#fff 65%); }
.stat-card.income .stat-icon{ background:linear-gradient(135deg,var(--teal),var(--teal-2)); color:#fff; }
.stat-card.income .stat-value{ color:var(--teal-dark); }
.stat-card.expense{ background:linear-gradient(160deg,var(--rose-tint),#fff 65%); }
.stat-card.expense .stat-icon{ background:linear-gradient(135deg,var(--rose),var(--rose-2)); color:#fff; }
.stat-card.expense .stat-value{ color:var(--rose); }
.stat-card.balance{ background:linear-gradient(160deg,var(--blue-tint),#fff 65%); }
.stat-card.balance .stat-icon{ background:linear-gradient(135deg,var(--blue),var(--blue-2)); color:#fff; }
.stat-card.balance .stat-value{ color:var(--blue); }
.stat-card.amber{ background:linear-gradient(160deg,var(--amber-tint),#fff 65%); }
.stat-card.amber .stat-icon{ background:linear-gradient(135deg,var(--amber),var(--amber-2)); color:#fff; }

/* ---------- Buttons ---------- */
.btn{ border-radius:var(--r-full); font-weight:700; font-size:13.8px; padding:10px 20px; border:none; font-family:'Manrope',sans-serif;}
.btn-teal{ background:linear-gradient(135deg,var(--teal),var(--teal-2)); color:#fff; box-shadow:var(--shadow-glow-teal);}
.btn-teal:hover{ filter:brightness(1.05); color:#fff; box-shadow:0 12px 26px -6px rgba(15,156,142,.55); }
.btn-outline-teal{ border:2px solid var(--teal); color:var(--teal-dark); background:#fff; padding:8px 18px;}
.btn-outline-teal:hover{ background:var(--teal); color:#fff; }
.btn-navy{ background:linear-gradient(135deg,var(--navy-800),var(--navy-900)); color:#fff; }
.btn-navy:hover{ filter:brightness(1.15); color:#fff; }
.btn-light{ background:#f1f3f9; border:none; color:var(--ink); border-radius:var(--r-sm); font-weight:700;}
.btn-light:hover{ background:#e5e8f2; }
.btn-outline-danger{ border:2px solid var(--rose); color:var(--rose); background:#fff; }
.btn-outline-danger:hover{ background:var(--rose); color:#fff; }
.btn-sm{ padding:6px 12px; font-size:12.5px; border-radius:var(--r-sm);}

/* ---------- Tables ---------- */
.table-clean{ margin-bottom:0; }
.table-clean thead th{
    font-size:11px; text-transform:uppercase; letter-spacing:.05em;
    color:var(--muted); font-weight:800; border-bottom:1px solid var(--line);
    padding:13px 16px; background:transparent;
}
.table-clean tbody td{ padding:14px 16px; vertical-align:middle; border-bottom:1px solid var(--line); font-size:13.8px; font-weight:500;}
.table-clean tbody tr:last-child td{ border-bottom:none; }
.table-clean tbody tr{ transition:background .12s; }
.table-clean tbody tr:hover{ background:#f7f8fc; }

.badge-soft{ font-weight:800; font-size:11.5px; padding:6px 13px; border-radius:var(--r-full); letter-spacing:-.01em;}
.badge-income{ background:var(--teal-tint); color:var(--teal-dark); }
.badge-expense{ background:var(--rose-tint); color:var(--rose); }
.badge-draft{ background:#eef0f5; color:#5c6478; }
.badge-sent{ background:var(--blue-tint); color:#2c3fc4; }
.badge-partial{ background:var(--amber-tint); color:var(--amber); }
.badge-paid{ background:var(--teal-tint); color:var(--teal-dark); }
.badge-overdue{ background:var(--rose-tint); color:var(--rose); }
.badge-cancelled{ background:#eef0f5; color:#98a0b3; }

/* ---------- Forms ---------- */
.form-label{ font-weight:700; font-size:13px; color:#38415a; margin-bottom:6px; }
.form-control, .form-select{
    border-radius:var(--r-md); border:2px solid var(--line); font-size:13.9px; padding:10px 14px;
    font-weight:500; background:#fbfbfd;
}
.form-control:focus, .form-select:focus{
    border-color:var(--teal); box-shadow:0 0 0 4px rgba(15,156,142,.12); background:#fff;
}
.form-control-color{ border-radius:var(--r-sm); }
.required::after{ content:' *'; color:var(--rose); }

/* ---------- Login / Install ---------- */
.auth-shell{
    min-height:100vh; display:flex; align-items:center; justify-content:center;
    background:
        radial-gradient(700px 400px at 15% 15%, rgba(15,156,142,.18), transparent 60%),
        radial-gradient(circle at 80% 80%, #182338, #0a0f1c 60%);
    padding:20px;
}
.auth-card{
    background:#fff; border-radius:var(--r-xl); width:100%; max-width:410px;
    box-shadow:0 30px 70px rgba(0,0,0,.4); overflow:hidden;
}
.auth-card .auth-head{ padding:34px 34px 8px; text-align:center; }
.auth-card .auth-body{ padding:26px 34px 34px; }

/* ---------- Misc ---------- */
.text-income{ color:var(--income) !important; }
.text-expense{ color:var(--expense) !important; }
.divider-label{ font-size:11px; text-transform:uppercase; color:var(--muted); font-weight:800; letter-spacing:.06em; }
.empty-state{ text-align:center; padding:64px 20px; color:var(--muted); }
.empty-state i{ font-size:46px; color:#d5d9e6; margin-bottom:16px; }
.kbd-hint{ background:#eef0f5; padding:3px 8px; border-radius:var(--r-sm); font-size:11px; color:var(--muted); font-weight:700;}

.app-footer{
    padding:20px 24px 28px;
    display:flex; align-items:center; justify-content:center;
}
.powered-by{
    display:inline-flex; align-items:center; gap:8px;
    color:#0f172a; font-size:12px; font-weight:700;
    opacity:.8; transition:opacity .15s;
}
.powered-by:hover{ opacity:1; }
.powered-by img{ height:16px; width:auto; display:block; }

/* Modal görünümü */
.modal-content{ border-radius:var(--r-xl); border:none; box-shadow:var(--shadow-lg); }
.modal-header{ border-bottom:1px solid var(--line); padding:20px 24px; }
.modal-header .modal-title{ font-weight:800; font-family:'Manrope',sans-serif;}
.modal-body{ padding:24px; }
.modal-footer{ border-top:1px solid var(--line); padding:16px 24px; }
.btn-close{ opacity:.5; }

/* Dropdown */
.dropdown-menu{ border-radius:var(--r-md); border:none; box-shadow:var(--shadow-lg); padding:8px; }
.dropdown-item{ border-radius:var(--r-sm); font-weight:600; padding:9px 12px; font-size:13.5px;}
.dropdown-item:hover{ background:#f1f3f9; }

/* Alert */
.alert{ border-radius:var(--r-md); border:none; font-weight:600; padding:14px 18px; }
.alert-success{ background:var(--teal-tint); color:var(--teal-dark); }
.alert-danger{ background:var(--rose-tint); color:var(--rose); }

@media (max-width: 991px){
    .sidebar{ transform:translateX(-100%); }
    .sidebar.open{ transform:translateX(0); }
    .main-wrap{ margin-left:0; }
    .menu-toggle{ display:block; }
    .topbar{ padding:0 18px; }
    .content{ padding:8px 18px 24px; }
}
