/* ============================================================
   PGV — "Estate Ledger" console design system
   Layered over Bootstrap's grid/components. Deep forest sidebar,
   brass-gold accents, warm paper canvas, Fraunces display serif
   (loaded by partials/font) over Archivo UI grotesque.
   ============================================================ */

:root {
    /* brand greens (forest) + brass golds */
    --pine-50:#eef5f0; --pine-100:#dcebe1; --pine-200:#bcd8c6;
    --pine-400:#4e9a6f; --pine-500:#2e7d51; --pine-600:#1d6a41; --pine-700:#155233;
    --brass-400:#c9a25e; --brass-500:#b8924e; --brass-600:#967534;

    /* legacy aliases — older styles referenced these names; keep them resolving */
    --indigo-50:var(--pine-50); --indigo-100:var(--pine-100); --indigo-200:var(--pine-200);
    --indigo-400:var(--pine-400); --indigo-500:var(--pine-500); --indigo-600:var(--pine-600); --indigo-700:var(--pine-700);
    --violet-500:var(--brass-500); --violet-600:var(--brass-600);

    --bs-primary:#1d6a41; --bs-primary-rgb:29,106,65;

    --grad: linear-gradient(135deg,#2e7d51 0%,#155233 100%);
    --grad-soft: linear-gradient(135deg,#eef5f0 0%,#f6f1e4 100%);
    --grad-brass: linear-gradient(135deg,#c9a25e 0%,#967534 100%);

    --bg:#f5f4ed;                 /* warm oat paper */
    --surface:#ffffff;
    --border:#e9e6da;
    --ink:#1c2a21;
    --ink-2:#54635a;
    --muted:#8b958c;

    --sidebar-bg:#0b2316;
    --sidebar-bg-2:#11321f;
    --sidebar-w:264px;
    --topbar-h:72px;

    --radius:16px;
    --radius-sm:11px;
    --shadow:0 1px 2px rgba(22,40,28,.04), 0 10px 24px -14px rgba(22,40,28,.16);
    --shadow-lg:0 8px 30px -10px rgba(21,82,51,.24), 0 4px 10px -6px rgba(22,40,28,.10);
    --ring:0 0 0 4px rgba(46,125,81,.16);
}

body {
    background:
        radial-gradient(1100px 500px at 100% -10%, rgba(184,146,78,.05), transparent 60%),
        var(--bg);
    color:var(--ink);
    font-size:.9rem;
    -webkit-font-smoothing:antialiased;
}
a { text-decoration:none; }
::selection { background:rgba(46,125,81,.18); }
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:#cfccbd;border-radius:9px;border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:#b5b2a1;background-clip:content-box}

/* ───────── Layout ───────── */
#page-topbar{
    position:fixed; top:0; left:0; right:0; height:var(--topbar-h); z-index:1002;
    background:rgba(255,255,255,.86); backdrop-filter:saturate(160%) blur(14px);
    border-bottom:1px solid var(--border);
}
#page-topbar .navbar-header{ height:var(--topbar-h); padding:0 22px 0 0; display:flex; align-items:center; justify-content:space-between; }

.navbar-brand-box{
    width:var(--sidebar-w); height:var(--topbar-h); display:flex; align-items:center; padding-left:24px;
    background:var(--sidebar-bg);
    border-bottom:1px solid rgba(201,162,94,.22);
}
.navbar-brand-box .logo-txt{ font-weight:800; letter-spacing:-.02em; font-size:1.15rem; color:#fff; }
.navbar-brand-box .logo-txt .text-primary{ background:var(--grad-brass); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.navbar-brand-box .logo-light{ display:none; }
.navbar-brand-box img{ background:#fff; border-radius:9px; padding:3px 8px; }

#vertical-menu-btn{
    margin-left:14px; color:var(--ink-2); border:0; background:transparent;
    width:40px; height:40px; border-radius:10px; transition:.15s;
}
#vertical-menu-btn:hover{ background:var(--pine-50); color:var(--pine-600); }

.vertical-menu{
    position:fixed; top:var(--topbar-h); left:0; width:var(--sidebar-w); bottom:0; z-index:1001;
    background:linear-gradient(180deg,var(--sidebar-bg-2),var(--sidebar-bg) 55%);
    border-right:1px solid rgba(255,255,255,.04);
    overflow-y:auto;
}
.vertical-menu::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.14); background-clip:content-box }
.main-content{ margin-left:var(--sidebar-w); padding-top:var(--topbar-h); min-height:100vh; }
.page-content{ padding:26px 26px 8px; }
.container-fluid{ padding-left:0; padding-right:0; }

/* ───────── Sidebar nav ───────── */
#sidebar-menu{ padding:18px 14px 40px; }
#sidebar-menu .menu-title{
    color:rgba(220,199,154,.55); font-size:.66rem; font-weight:700; letter-spacing:.16em;
    text-transform:uppercase; padding:18px 12px 8px; list-style:none;
}
#sidebar-menu ul{ list-style:none; padding:0; margin:0; }
#sidebar-menu ul li a{
    display:flex; align-items:center; gap:12px; color:rgba(238,243,236,.6);
    padding:.62rem .8rem; margin:2px 0; border-radius:12px; font-weight:500; font-size:.875rem;
    transition:.16s; position:relative;
}
#sidebar-menu ul li a svg{ width:18px; height:18px; opacity:.85; }
#sidebar-menu ul li a:hover{ color:#fff; background:rgba(255,255,255,.06); }
#sidebar-menu ul li a.active{
    color:#fff; background:var(--grad);
    box-shadow:inset 0 0 0 1px rgba(201,162,94,.35), 0 8px 20px -8px rgba(21,82,51,.8);
}
#sidebar-menu ul li a.active::before{
    content:''; position:absolute; left:-14px; top:8px; bottom:8px; width:3px;
    border-radius:3px; background:var(--brass-400);
}
#sidebar-menu ul li a.active svg{ opacity:1; }

/* ───────── Topbar user ───────── */
.header-item{ border:0; background:transparent; }
#page-header-user-dropdown{
    display:flex; align-items:center; gap:10px; padding:6px 12px 6px 6px; border-radius:40px !important;
    border:1px solid var(--border) !important; background:#fff !important; transition:.15s;
}
#page-header-user-dropdown:hover{ box-shadow:var(--shadow); }
#page-header-user-dropdown > span:first-child{ background:var(--grad) !important; box-shadow:0 6px 14px -6px rgba(21,82,51,.6); }
.dropdown-menu{ border:1px solid var(--border); border-radius:14px; box-shadow:var(--shadow-lg); padding:8px; }
.dropdown-item{ border-radius:9px; padding:.5rem .7rem; font-weight:500; }
.dropdown-item:hover{ background:var(--pine-50); color:var(--pine-700); }

/* ───────── Page title ───────── */
.page-title-box{ padding:4px 0 20px; }
.page-title-box h4{
    font-weight:600; letter-spacing:0; color:var(--ink); font-size:1.45rem;
}
.page-title-box h4::after{
    content:''; display:block; width:42px; height:3px; margin-top:.45rem;
    border-radius:2px; background:var(--grad-brass);
}
.breadcrumb{ background:transparent; font-size:.8rem; }
.breadcrumb-item, .breadcrumb-item a{ color:var(--muted); }
.breadcrumb-item.active{ color:var(--pine-600); font-weight:600; }
.breadcrumb-item+.breadcrumb-item::before{ color:#cfccbd; }

/* ───────── Cards ───────── */
.card{
    background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
    box-shadow:var(--shadow); margin-bottom:24px;
}
.card-h-100{ height:calc(100% - 24px); }
.card-body{ padding:1.35rem; }
.card-header{ padding:1.1rem 1.35rem; background:transparent; border-bottom:1px solid var(--border); }
.card-title{ font-weight:700; letter-spacing:-.01em; }
a.card{ transition:transform .18s, box-shadow .18s; }
a.card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-lg); border-color:var(--pine-200); }

/* ───────── Avatars / icon chips ───────── */
.avatar-sm{ width:46px; height:46px; }
.avatar-xs{ width:34px; height:34px; }
.avatar-title{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; font-weight:700; }
.bg-primary-subtle{ background:var(--pine-50) !important; }
.text-primary{ color:var(--pine-600) !important; }

/* ───────── Buttons ───────── */
.btn{ border-radius:10px; font-weight:600; padding:.5rem .95rem; transition:.16s; letter-spacing:-.01em; }
.btn-sm{ border-radius:8px; padding:.32rem .7rem; font-size:.78rem; }
.btn-lg{ border-radius:12px; padding:.7rem 1.3rem; }
.btn-primary{ background:var(--grad); border:0; box-shadow:0 8px 18px -8px rgba(21,82,51,.7); }
.btn-primary:hover{ transform:translateY(-1px); box-shadow:0 12px 22px -8px rgba(21,82,51,.8); filter:brightness(1.05); }
.btn-light{ background:#f0efe7; border:1px solid var(--border); color:var(--ink-2); }
.btn-light:hover{ background:#e7e5d9; }
.btn-soft-primary{ background:var(--pine-50); color:var(--pine-600); border:0; }
.btn-soft-primary:hover{ background:var(--pine-100); color:var(--pine-700); }
.btn-soft-success{ background:#e7f5ec; color:#177245; border:0; }
.btn-soft-success:hover{ background:#d4eedd; }
.btn-soft-danger{ background:#fdecec; color:#cf3340; border:0; }
.btn-soft-danger:hover{ background:#fbdcdc; }
.btn-soft-secondary{ background:#efeee6; color:#54635a; border:0; }
.btn-soft-secondary:hover{ background:#e5e3d6; }
.btn-soft-warning{ background:#fbf3e1; color:#a8771c; border:0; }
.btn-soft-info{ background:#e8f1f5; color:#22708f; border:0; }
.btn-soft-info:hover{ background:#d9e9f0; }
.btn-outline-secondary{ border:1px solid #d6d3c4; color:var(--ink-2); }
.btn-outline-secondary:hover{ background:#f0efe7; color:var(--ink); border-color:#c8c5b4; }
.btn-success{ background:#1d7a47; border:0; box-shadow:0 8px 18px -10px rgba(29,122,71,.7); }
.btn-warning{ background:#c08a1d; border:0; color:#fff; }
.btn-danger{ background:#cf3340; border:0; }

/* ───────── Tables ───────── */
.table{ --bs-table-bg:transparent; margin-bottom:0; color:var(--ink-2); }
.table > thead{ background:transparent; }
.table > thead th{
    text-transform:uppercase; font-size:.68rem; font-weight:700; letter-spacing:.08em;
    color:var(--muted); border-bottom:1px solid var(--border); padding:.85rem 1rem; white-space:nowrap;
}
.table > tbody > tr{ border-bottom:1px solid #f1efe6; }
.table > tbody > tr:last-child{ border-bottom:0; }
.table > tbody td{ padding:.9rem 1rem; vertical-align:middle; }
.table-hover > tbody > tr:hover{ background:#f8f7f0; }
.table-light{ --bs-table-bg:#faf9f3; }
.table-nowrap td, .table-nowrap th{ white-space:nowrap; }

/* ───────── Badges ───────── */
.badge{ font-weight:600; padding:.36em .7em; border-radius:7px; letter-spacing:.01em; }
.bg-success-subtle{ background:#e7f5ec !important; } .text-success{ color:#177245 !important; }
.bg-warning-subtle{ background:#fbf3e1 !important; } .text-warning{ color:#a8771c !important; }
.bg-danger-subtle{ background:#fdecec !important; }  .text-danger{ color:#cf3340 !important; }
.bg-info-subtle{ background:#e8f1f5 !important; }    .text-info{ color:#22708f !important; }
.bg-secondary-subtle{ background:#efeee6 !important; } .text-secondary{ color:#6c7a70 !important; }

/* ───────── Forms ───────── */
.form-control,.form-select{
    border:1px solid #e0ddcf; border-radius:10px; padding:.55rem .8rem; font-size:.875rem; color:var(--ink);
    transition:.15s; background-color:#fff;
}
.form-control:focus,.form-select:focus{ border-color:var(--pine-400); box-shadow:var(--ring); }
.form-label{ font-weight:600; font-size:.8rem; color:var(--ink-2); margin-bottom:.4rem; }
.input-group-text{ background:#f6f5ee; border:1px solid #e0ddcf; border-radius:10px; color:var(--muted); }
.form-text{ font-size:.75rem; color:var(--muted); }
.form-switch .form-check-input{ width:2.6em; height:1.35em; background-color:#d6d3c4; border:0; cursor:pointer; }
.form-switch .form-check-input:checked{ background-color:var(--pine-500); }
.form-check-input:checked{ background-color:var(--pine-500); border-color:var(--pine-500); }
.form-check-input:focus{ box-shadow:var(--ring); }

/* ───────── Alerts ───────── */
.alert{ border:0; border-radius:12px; padding:.85rem 1.1rem; font-weight:500; }
.alert-success{ background:#e7f5ec; color:#115c36; }
.alert-danger{ background:#fdecec; color:#a82833; }
.alert-warning{ background:#fbf3e1; color:#8a6217; }
.alert-info{ background:#e8f1f5; color:#1d5f7a; }
.alert-secondary{ background:#f6f5ee; color:var(--ink-2); }

/* ───────── Footer ───────── */
.footer{ margin-left:0; padding:18px 26px; color:var(--muted); font-size:.8rem; }

/* ───────── Login ───────── */
.auth-shell{ min-height:100vh; display:grid; grid-template-columns:1fr; }
@media (min-width:992px){ .auth-shell{ grid-template-columns:480px 1fr; } }
.auth-form-side{ display:flex; align-items:center; justify-content:center; padding:40px; background:#fff; }
.auth-form-card{ width:100%; max-width:380px; }
.auth-brand{ font-weight:700; font-size:1.5rem; letter-spacing:-.01em; color:var(--ink); }
.auth-brand .text-primary{ background:var(--grad-brass); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.auth-aside{
    display:none; position:relative; overflow:hidden; color:#fff;
    background:
        radial-gradient(900px 600px at 85% 15%, rgba(201,162,94,.16), transparent 55%),
        linear-gradient(150deg,#11321f 0%,#0e2a1a 45%,#0b2316 100%);
}
@media (min-width:992px){ .auth-aside{ display:flex; align-items:center; } }
.auth-aside::after{
    content:''; position:absolute; inset:0; pointer-events:none; opacity:.55;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' fill='none'%3E%3Cpath d='M0 60h120M60 0v120' stroke='%23ffffff' stroke-opacity='.045'/%3E%3C/svg%3E");
}
.auth-aside .blob{ position:absolute; border-radius:50%; filter:blur(8px); opacity:.5; }
.auth-aside .blob.b1{ width:420px;height:420px; background:radial-gradient(circle at 30% 30%, rgba(201,162,94,.28), rgba(201,162,94,.05)); top:-120px; right:-80px; }
.auth-aside .blob.b2{ width:320px;height:320px; background:rgba(255,255,255,.07); bottom:-100px; left:-60px; }
.auth-aside .content{ position:relative; z-index:2; padding:64px; max-width:560px; }
.auth-aside h1{ font-weight:600; }
.auth-aside h1 em{ font-style:italic; color:#dcc79c; }
.auth-aside .badge{ letter-spacing:.14em; text-transform:uppercase; font-weight:700; }

/* ───────── Responsive sidebar ───────── */
@media (max-width:991.98px){
    .vertical-menu{ transform:translateX(-100%); transition:transform .25s; box-shadow:0 0 40px rgba(0,0,0,.3); }
    body.sidebar-open .vertical-menu{ transform:none; }
    .navbar-brand-box{ width:auto; padding-right:18px; background:transparent; border-bottom:0; }
    .navbar-brand-box img{ background:transparent; padding:0; }
    .navbar-brand-box .logo-txt{ color:var(--ink); }
    .navbar-brand-box .logo-txt .text-primary{ -webkit-text-fill-color:initial; color:var(--pine-600); }
    .main-content{ margin-left:0; }
    body.sidebar-open::after{ content:''; position:fixed; inset:0; top:var(--topbar-h); background:rgba(12,24,17,.5); z-index:1000; }
}

/* chart text inherits the UI face */
.apex-charts text{ font-family:var(--font-google-sans) !important; }
