*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;background:#f5f7fb;color:#111827}a{text-decoration:none;color:inherit}button,input,textarea,select{font:inherit}button,.btn{border:0;cursor:pointer}.login-bg{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top,#e8efff,#f7f9fc 45%,#eef2f8)}.login-card{width:min(410px,92%);padding:34px;background:#fff;border:1px solid #e5e9f2;border-radius:26px;text-align:center;box-shadow:0 25px 70px #0b17351a}.login-logo{width:210px;max-height:120px;object-fit:contain;margin:0 auto 8px;display:block}.login-card h1{margin:4px 0 2px;font-size:28px}.login-card p,.login-card small,.muted{color:#6b7280}.login-card input{display:block;width:100%;padding:14px;margin:9px 0;border:1px solid #dfe5ef;border-radius:12px;background:#fff}.login-card button{width:100%;padding:14px;border-radius:12px;margin-top:8px}.primary{background:#1748d8!important;color:#fff!important;box-shadow:0 8px 18px #1748d82b}.btn{display:inline-flex;align-items:center;justify-content:center;padding:11px 15px;border-radius:11px;background:#eef2f8;color:#172033;font-weight:700}.small{padding:7px 9px;font-size:12px}.alert{padding:10px;border-radius:9px;margin-bottom:12px}.danger{background:#fee2e2;color:#b91c1c}.success{background:#dcfce7;color:#15803d}.mobile-topbar,.mobile-bottom,.mobile-drawer{display:none}/* =========================
   MENU LATERAL DESKTOP
========================= */

aside{
    position:fixed;
    z-index:30;
    left:0;
    top:0;
    bottom:0;

    width:254px;

    background:linear-gradient(
        180deg,
        #07111f,
        #0b1423 65%,
        #050c16
    );

    color:#fff;

    padding:18px 14px;

    display:flex;
    flex-direction:column;

    border-right:1px solid #142235;

    transition:.25s ease;

    overflow:hidden;
}


/* =========================
   LOGO
========================= */

.brand{
    height:92px;
    flex-shrink:0;

    display:flex;
    align-items:center;
    gap:10px;

    padding:4px 8px 20px;

    position:relative;
}

.brand-logo{
    width:72px;
    height:64px;

    object-fit:contain;

    background:#fff;
    border-radius:12px;
    padding:2px;
}

.brand-text{
    display:flex;
    flex-direction:column;
    line-height:.9;
}

.brand-text strong{
    font-size:18px;
    letter-spacing:1px;
}

.brand-text span{
    font-size:12px;
    letter-spacing:3px;
    color:#ffd33d;
    margin-top:5px;
}

.collapse-btn{
    margin-left:auto;
    background:transparent;
    color:#cbd5e1;
    font-size:20px;
}


/* =========================
   MENU COM ROLAGEM
========================= */

.side-nav{
    display:flex;
    flex-direction:column;
    gap:4px;

    /*
     * IMPORTANTE:
     * ocupa o espaço disponível
     * entre a logo e o botão sair
     */
    flex:1;
    min-height:0;

    overflow-y:auto;
    overflow-x:hidden;

    padding-right:4px;
    padding-bottom:10px;

    scrollbar-width:thin;
    scrollbar-color:#344866 transparent;
}


/* Barra de rolagem Chrome / Edge */

.side-nav::-webkit-scrollbar{
    width:6px;
}

.side-nav::-webkit-scrollbar-track{
    background:transparent;
}

.side-nav::-webkit-scrollbar-thumb{
    background:#344866;
    border-radius:20px;
}

.side-nav::-webkit-scrollbar-thumb:hover{
    background:#4b6388;
}


/* =========================
   ITENS DO MENU
========================= */

.nav-item{
    flex-shrink:0;

    display:flex;
    align-items:center;
    gap:13px;

    color:#cbd5e1;

    padding:12px 13px;

    border-radius:10px;

    font-size:14px;

    transition:.18s;
}

.nav-item span{
    width:20px;
    min-width:20px;

    text-align:center;

    font-size:17px;
}

.nav-item:hover,
.nav-item.active{
    background:linear-gradient(
        90deg,
        #173fbe,
        #153795
    );

    color:#fff;

    box-shadow:inset 3px 0 #4b83ff;
}


/* =========================
   TÍTULOS
========================= */

.nav-label{
    flex-shrink:0;

    color:#718096;

    font-size:10px;

    text-transform:uppercase;

    padding:17px 13px 6px;

    font-weight:800;

    letter-spacing:1px;
}


/* =========================
   ÁREA FIXA DO SAIR
========================= */

.sidebar-logout{
    flex-shrink:0;

    padding-top:8px;

    border-top:1px solid #1b2a3d;

    background:#07111f;
}


/* Botão Sair */

.sidebar-logout .logout{
    display:flex;

    width:100%;

    margin:0;

    color:#ff4f6d!important;
}

.sidebar-logout .logout:hover{
    background:#2a1620!important;

    color:#ff6b82!important;

    box-shadow:none!important;
}


/* =========================
   MENU RECOLHIDO
========================= */

.sidebar-collapsed aside{
    width:78px;
}

.sidebar-collapsed .brand-text,
.sidebar-collapsed .nav-item b,
.sidebar-collapsed .nav-label{
    display:none;
}

.sidebar-collapsed .brand{
    justify-content:center;
}

.sidebar-collapsed .brand-logo{
    width:52px;
}

.sidebar-collapsed .collapse-btn{
    position:absolute;
    right:7px;
    top:6px;
    font-size:14px;
}

.sidebar-collapsed main{
    margin-left:78px;
}

.sidebar-collapsed .sidebar-logout .logout{
    justify-content:center;

    padding-left:8px;
    padding-right:8px;
}
.sidebar-collapsed aside{width:78px}.sidebar-collapsed .brand-text,.sidebar-collapsed .nav-item b,.sidebar-collapsed .nav-label{display:none}.sidebar-collapsed .brand{justify-content:center}.sidebar-collapsed .brand-logo{width:52px}.sidebar-collapsed .collapse-btn{position:absolute;right:7px;top:6px;font-size:14px}.sidebar-collapsed main{margin-left:78px}main{margin-left:254px;padding:28px 30px 24px;min-height:100vh;transition:.25s}.page-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:1.8px;color:#1748d8;text-transform:uppercase}.page-head h1{margin:2px 0;font-size:30px;letter-spacing:-.5px}.page-head p{margin:3px 0;color:#718096}.head-actions{display:flex;gap:10px;align-items:center}.icon-btn{width:44px;height:44px;border:1px solid #e2e7ef;border-radius:12px;background:#fff;display:grid;place-items:center;position:relative}.icon-btn i{position:absolute;right:-3px;top:-4px;background:#e11d48;color:#fff;border-radius:50%;font-size:9px;font-style:normal;padding:3px 5px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:17px}.metric{background:#fff;border:1px solid #e3e8ef;border-radius:16px;padding:18px;position:relative;box-shadow:0 8px 22px #0f172a08;min-height:150px}.metric-icon{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-weight:900;margin-bottom:14px;background:#eaf0ff;color:#1748d8}.metric small{display:block;color:#718096;font-size:12px}.metric b{display:block;font-size:28px;margin:6px 0 3px;letter-spacing:-.6px}.metric em{font-style:normal;font-size:11px;color:#6b7280}.metric.orange .metric-icon{background:#fff2dd;color:#f59e0b}.metric.red .metric-icon{background:#ffe8ec;color:#e11d48}.metric.green .metric-icon{background:#e6f8ee;color:#059669}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(280px,.8fr);gap:16px}.lower-grid{display:grid;grid-template-columns:1.5fr .9fr;gap:16px;margin-top:16px}.card{background:#fff;border:1px solid #e3e8ef;border-radius:16px;padding:18px;box-shadow:0 8px 22px #0f172a08}.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}.section-head h3{margin:0;font-size:17px}.section-head p{margin:3px 0 0;color:#718096;font-size:12px}.dark-head{background:linear-gradient(90deg,#07162c,#0d1f3b);color:#fff;margin:-18px -18px 6px;padding:16px 18px;border-radius:16px 16px 0 0}.dark-head p{color:#9fb0c8}.outline-btn{border:1px solid #2d58ad;color:#fff;border-radius:9px;padding:8px 11px;font-size:12px}.client-list{display:grid}.dashboard-client{display:grid;grid-template-columns:42px minmax(130px,1fr) 125px 90px 34px;align-items:center;gap:11px;padding:12px 4px;border-bottom:1px solid #edf0f4}.avatar{width:36px;height:36px;border-radius:50%;background:#eaf0ff;color:#1748d8;display:grid;place-items:center;font-weight:800;font-size:11px}.client-main{display:grid;gap:3px}.client-main strong{font-size:13px}.client-main span,.client-due span{font-size:11px;color:#718096}.client-main b{color:#1748d8}.client-due{display:grid;gap:3px}.client-due strong{font-size:12px}.client-due span{color:#f59e0b}.client-value{font-weight:800;font-size:12px}.wa-circle{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:#16a34a;background:#e8f9ee;font-size:13px}.see-all{display:block;text-align:center;color:#1748d8;font-weight:800;font-size:12px;padding-top:14px}.plans-card{min-height:100%}.donut{width:180px;height:180px;border-radius:50%;margin:18px auto;display:grid;place-items:center;background:conic-gradient(#ec3c88 var(--p),#5d43d6 0 75%,#3474e8 0);position:relative}.donut:after{content:"";position:absolute;inset:31px;background:#fff;border-radius:50%}.donut span{position:relative;z-index:1;font-size:24px;font-weight:900;text-align:center}.donut small{display:block;font-size:10px;color:#718096;font-weight:600}.plan-legend{display:grid;gap:11px}.plan-legend div{display:grid;grid-template-columns:12px 1fr auto;align-items:center;gap:7px;font-size:12px}.plan-legend strong{color:#6b7280}.dot{width:9px;height:9px;border-radius:50%;background:#ec3c88}.d1{background:#5d43d6}.d2{background:#3474e8}.d3{background:#10b981}.finance-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.finance-grid>div{border:1px solid #edf0f4;border-radius:12px;padding:14px}.finance-grid small{display:block;color:#718096;font-size:11px}.finance-grid b{display:block;margin:7px 0;font-size:16px}.finance-grid span{font-size:10px;color:#718096}.red-text{color:#e11d48}.green-text{color:#059669}.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.quick-grid a{padding:13px;border:1px solid #dce5f3;border-radius:11px;color:#1748d8;font-weight:800;font-size:12px;background:#f9fbff}.quick-grid a:nth-child(2){color:#059669;background:#f4fbf7}.quick-grid a:nth-child(3){color:#f59e0b;background:#fffaf0}.quick-grid a:nth-child(4){color:#6d42d9;background:#faf7ff}.empty{text-align:center;padding:35px;color:#718096}.searchbar{display:flex;gap:8px;margin-bottom:14px}.searchbar input{flex:1}.searchbar input,.searchbar select{padding:11px;border:1px solid #dce3eb;border-radius:9px;background:#fff}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:980px}th,td{text-align:left;padding:11px 7px;border-bottom:1px solid #edf0f4}th{font-size:12px;color:#718096}.wa{background:#16a34a;color:#fff;padding:7px 9px;border-radius:8px;font-size:12px}.form-card{max-width:800px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.form-grid label{font-size:12px;font-weight:700}.form-grid input,.form-grid textarea{display:block;width:100%;padding:10px;margin-top:5px;border:1px solid #dce3eb;border-radius:9px}.form-grid textarea{min-height:100px}.full{grid-column:1/-1}.actions{text-align:right}.actions>*{margin-left:7px}.nav-label{color:#718096;font-size:10px;text-transform:uppercase;padding:17px 13px 6px;font-weight:800}.settings-tabs{display:flex;gap:7px;margin-bottom:14px;overflow:auto}.settings-tabs a{padding:10px 13px;border-radius:9px;background:#eef2f7;color:#172033;white-space:nowrap}.settings-tabs a.active{background:#1748d8;color:#fff}.inline-form{display:flex;gap:8px;margin:12px 0 18px}.inline-form input{flex:1;padding:10px;border:1px solid #dce3eb;border-radius:9px}.inline-form input[type=number]{max-width:150px}.inline{display:inline-flex;gap:6px;margin-left:8px}.settings-list{display:grid;gap:8px}.setting-row{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:12px;border:1px solid #edf0f4;border-radius:10px}.setting-row>div:first-child{display:grid;gap:3px}.setting-row span:not(.badge){font-size:12px;color:#718096}.appearance-form input[type=color]{width:70px;height:44px;padding:3px}.logo-preview{width:180px;height:80px;border:1px solid #e3e8ef;border-radius:10px;display:flex;align-items:center;justify-content:center;background:#f8fafc}.logo-preview img{max-width:160px;max-height:70px;object-fit:contain}.section-head h3{margin:0}.reminder-card{margin-top:16px}.reminder-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #edf0f4}.reminder-row>div:first-child{display:grid;gap:3px}.reminder-row span{font-size:12px;color:#718096}.reminder-row.large{padding:16px 0}.reminder-actions{display:flex;gap:7px;align-items:center}.wa{white-space:nowrap}.check{display:flex!important;align-items:center;gap:8px}.check input{width:auto!important;display:inline!important}.template-card{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid #edf0f4}.template-card pre{white-space:pre-wrap;font-family:inherit;font-size:13px;color:#526173;line-height:1.45;margin:8px 0}.template-actions{white-space:nowrap}.template-actions form{display:flex;gap:6px}footer{padding:25px 2px;color:#8a94a6;font-size:11px;text-align:center}.mobile-topbar{height:62px;background:#07111f;color:#fff;align-items:center;justify-content:space-between;padding:8px 13px;position:sticky;top:0;z-index:25}.mobile-topbar>img{height:48px;max-width:150px;object-fit:contain;background:#fff;border-radius:9px;padding:2px}.mobile-menu{background:transparent;color:#fff;border:0;font-size:23px}.top-actions{display:flex;gap:10px}.top-actions a{font-size:18px}.mobile-drawer{position:fixed;z-index:50;inset:0 auto 0 0;width:285px;background:#07111f;color:#fff;padding:18px;box-shadow:20px 0 60px #0008;transform:translateX(-105%);transition:.25s}.mobile-drawer.open{transform:translateX(0)}.drawer-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.drawer-head img{width:160px;height:70px;object-fit:contain;background:#fff;border-radius:10px}.drawer-head button{background:transparent;color:#fff;font-size:30px}.mobile-drawer>a{display:block;padding:13px 8px;color:#d5dceb;border-radius:9px}.mobile-drawer>a:hover{background:#173fbe;color:#fff}.mobile-bottom{height:67px;position:fixed;z-index:35;left:0;right:0;bottom:0;background:#fff;border-top:1px solid #e4e8ef;box-shadow:0 -8px 25px #0f172a10;grid-template-columns:repeat(5,1fr);align-items:center}.mobile-bottom a{display:grid;place-items:center;gap:3px;font-size:9px;color:#657187;font-weight:700}.mobile-bottom span{font-size:17px}.mobile-bottom a:first-child{color:#1748d8}@media(max-width:900px){aside{display:none}.mobile-topbar{display:flex}.mobile-bottom{display:grid}main{margin:0;padding:18px 12px 88px}.page-head{align-items:flex-start}.page-head h1{font-size:24px}.head-actions .icon-btn{display:none}.stats{grid-template-columns:1fr 1fr}.dashboard-grid,.lower-grid{grid-template-columns:1fr}.dashboard-client{grid-template-columns:36px minmax(0,1fr) 82px 30px}.client-value{display:none}.finance-grid{grid-template-columns:1fr 1fr}.plans-card{min-height:auto}.donut{width:160px;height:160px}.dark-head{margin:-18px -18px 6px}.template-card{flex-direction:column}.template-actions{white-space:normal}.template-actions form{flex-wrap:wrap}.form-grid{grid-template-columns:1fr}.full{grid-column:1/-1}.inline-form{flex-wrap:wrap}.inline-form input,.inline-form input[type=number]{max-width:none;min-width:100%}.setting-row{align-items:flex-start;flex-direction:column}.inline{margin-left:0;margin-top:7px}}@media(max-width:480px){.stats{gap:9px}.metric{padding:13px;min-height:125px}.metric b{font-size:22px}.metric-icon{width:34px;height:34px;margin-bottom:10px}.dashboard-client{grid-template-columns:34px 1fr 30px}.client-due{display:none}.page-head .primary{padding:10px 11px;font-size:12px}.finance-grid{grid-template-columns:1fr}.brand-logo{width:64px}}

/* V8 dynamic theme */
body{background:var(--bg);color:var(--text)}.card,.metric,.icon-btn,.login-card,.form-grid input,.form-grid textarea,.form-grid select,.searchbar input,.searchbar select,.setting-row,.logo-preview{background:var(--surface);border-color:var(--border);color:var(--text)}.muted,.page-head p,.section-head p,.metric small,.metric em,.client-main span,.client-due span,.finance-grid small,.finance-grid span,th,.setting-row span:not(.badge){color:var(--muted)}.primary{background:var(--primary)!important}.eyebrow,.see-all{color:var(--primary)}.dashboard-client,.template-card,.reminder-row,.finance-grid>div{border-color:var(--border)}.quick-grid a{background:var(--surface2);border-color:var(--border)}.donut:after{background:var(--surface)}.danger-btn{background:#fee2e2!important;color:#b91c1c!important}.theme-preview{display:flex;justify-content:space-between;align-items:center;padding:12px;border:1px dashed var(--border);border-radius:10px}.logo-preview img{width:160px;height:70px;object-fit:contain}