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

:root{
    --ai-bg:#07110e;
    --ai-bg-soft:#0b1713;
    --ai-panel:rgba(18,34,28,.82);
    --ai-panel-solid:#10221b;
    --ai-line:rgba(170,255,214,.12);
    --ai-line-strong:rgba(73,226,145,.28);
    --ai-text:#f2fff8;
    --ai-muted:#91a89e;
    --ai-green:#25d366;
    --ai-green-2:#55ef9b;
    --ai-cyan:#4de7d4;
    --ai-danger:#ff6b7a;
    --ai-warning:#ffcc66;
    --ai-radius:18px;
    --ai-shadow:0 22px 65px rgba(0,0,0,.32);
}

*{box-sizing:border-box}
html{background:var(--ai-bg);scroll-behavior:smooth}
body{
    margin:0!important;
    padding:0!important;
    min-height:100vh;
    color:var(--ai-text)!important;
    font-family:Inter,system-ui,-apple-system,sans-serif!important;
    background:
        radial-gradient(circle at 15% -10%,rgba(37,211,102,.16),transparent 34rem),
        radial-gradient(circle at 95% 15%,rgba(77,231,212,.09),transparent 28rem),
        var(--ai-bg)!important;
}
body:before{
    content:"";
    position:fixed;inset:0;z-index:-1;pointer-events:none;
    opacity:.18;
    background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
    background-size:44px 44px;
    mask-image:linear-gradient(to bottom,black,transparent 70%);
}

h1,h2,h3,.navbar-brand{font-family:Manrope,Inter,sans-serif!important;letter-spacing:-.035em}
p{color:var(--ai-muted)}
a{transition:.2s ease}

.navbar,
nav.navbar{
    min-height:76px!important;
    padding:0 5vw!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    color:var(--ai-text)!important;
    background:rgba(7,17,14,.8)!important;
    border-bottom:1px solid var(--ai-line)!important;
    box-shadow:none!important;
    backdrop-filter:blur(18px);
    position:relative;
    z-index:20;
}
.navbar h1,.navbar-brand,.navbar-brand span{color:var(--ai-text)!important;font-size:1.12rem!important;margin:0!important}
.navbar h1:before,.navbar-brand:before{
    content:"W";
    display:inline-grid;place-items:center;
    width:34px;height:34px;margin-right:10px;
    color:#052412;background:linear-gradient(145deg,var(--ai-green-2),var(--ai-green));
    border-radius:11px;font-size:.9rem;font-weight:900;
    box-shadow:0 0 30px rgba(37,211,102,.24);
}
.navbar h1:before{
    content:""!important;
    background-image:url('assets/whatspop-ai-logo.png')!important;
    background-size:cover!important;background-position:center!important;
    color:transparent!important;
}
.navbar-brand:before{display:none!important}
.logo-icon{background:linear-gradient(145deg,var(--ai-green-2),var(--ai-green))!important;color:#052412!important}
.logo-icon,.sidebar-logo,.invoice-logo{
    background-image:url('assets/whatspop-ai-logo.png')!important;
    background-size:cover!important;background-position:center!important;
    background-color:transparent!important;color:transparent!important;font-size:0!important;
}
.navbar .user-info,.navbar-actions,.navbar-nav{display:flex;align-items:center;gap:8px}
.navbar a,.btn-nav{
    color:#cce0d6!important;
    text-decoration:none!important;
    border:1px solid var(--ai-line)!important;
    background:rgba(255,255,255,.035)!important;
    padding:10px 14px!important;border-radius:11px!important;font-weight:650!important;
}
.navbar a:hover,.btn-nav:hover{color:#fff!important;border-color:var(--ai-line-strong)!important;background:rgba(37,211,102,.1)!important;transform:translateY(-1px)}
.navbar .btn-send,.navbar .btn-primary{background:var(--ai-green)!important;color:#052412!important;border-color:transparent!important}
.navbar .danger{color:#ff9aa5!important}

.marquee-bar{
    background:rgba(37,211,102,.1)!important;
    color:#aef6ca!important;
    border-bottom:1px solid var(--ai-line)!important;
    font-size:.78rem!important;padding:8px 0!important;
}

body>.container,
body>.container-lg,
.page{
    width:min(1440px,92vw)!important;
    max-width:1440px!important;
    margin:32px auto!important;
    padding:0!important;
}

.page-header{text-align:left!important;max-width:760px!important;margin:50px 0 28px!important}
.page-header h1{font-size:clamp(2.3rem,5vw,4.6rem)!important;line-height:1.02!important;margin:14px 0!important;color:var(--ai-text)!important}
.page-header h1 span{color:var(--ai-green-2)!important}
.page-header p{font-size:1.05rem!important}
.page-header .badge,.badge{
    background:rgba(37,211,102,.1)!important;
    color:#aef6ca!important;border:1px solid var(--ai-line-strong)!important;
}

.stats,.row-cols-xl-5{gap:14px!important}
.stat-card,
.card,
.sms-section,
.replay-section,
.filters-section,
.table-card,
.profile-card,
.action-bar{
    color:var(--ai-text)!important;
    background:linear-gradient(145deg,rgba(20,39,32,.9),rgba(11,25,20,.9))!important;
    border:1px solid var(--ai-line)!important;
    border-radius:var(--ai-radius)!important;
    box-shadow:var(--ai-shadow)!important;
}
.stat-card{position:relative;overflow:hidden;padding:24px!important}
.stat-card:after{
    content:"";position:absolute;width:120px;height:120px;right:-50px;top:-60px;
    border-radius:50%;background:var(--ai-green);filter:blur(45px);opacity:.08;
}
.stat-card h3,.stat-card .display-5{color:var(--ai-text)!important;font-size:clamp(1.65rem,3vw,2.25rem)!important}
.stat-card p{color:var(--ai-muted)!important;font-size:.72rem!important;letter-spacing:.1em!important;text-transform:uppercase}
.stat-card .icon{background:rgba(37,211,102,.1)!important;color:var(--ai-green-2)!important;border:1px solid var(--ai-line)!important}

.card-header,.card-body{background:transparent!important;border-color:var(--ai-line)!important;color:var(--ai-text)!important}
.card-header{padding:22px 24px!important}
.card-body{padding:24px!important}
.card-header h3,.sms-section h2,.replay-section h2{color:var(--ai-text)!important}
.instr-item{background:rgba(255,255,255,.025)!important;border:1px solid var(--ai-line)!important;border-radius:14px!important}
.step-num{color:var(--ai-green-2)!important}

input,select,textarea,.form-control,.form-select{
    color:var(--ai-text)!important;
    background:#091711!important;
    border:1px solid rgba(170,255,214,.16)!important;
    border-radius:12px!important;
    min-height:46px;
    padding:11px 13px!important;
    outline:none!important;
    box-shadow:none!important;
}
textarea{min-height:130px}
input:focus,select:focus,textarea:focus,.form-control:focus,.form-select:focus{
    border-color:var(--ai-green)!important;
    box-shadow:0 0 0 4px rgba(37,211,102,.1)!important;
}
input::placeholder,textarea::placeholder{color:#667b71!important}
label{color:#c9ddd3!important;font-size:.83rem!important;font-weight:650!important;margin-bottom:7px!important}
select option{background:#10221b;color:#fff}

button,.btn,.download-btn,.export-btn,.btn-view-all{
    border-radius:11px!important;
    font-weight:700!important;
    text-decoration:none!important;
    transition:.2s ease!important;
}
button,.btn-primary,.download-btn{
    color:#052412!important;
    background:linear-gradient(135deg,var(--ai-green-2),var(--ai-green))!important;
    border:0!important;
    box-shadow:0 10px 28px rgba(37,211,102,.16)!important;
}
button:hover,.btn:hover,.download-btn:hover{transform:translateY(-2px);filter:brightness(1.05)}
.btn-secondary{color:#d9e9e1!important;background:rgba(255,255,255,.06)!important;border:1px solid var(--ai-line)!important}
.btn-danger{background:rgba(255,107,122,.12)!important;color:#ff9aa5!important;border:1px solid rgba(255,107,122,.2)!important}
.btn-view-all{color:var(--ai-green-2)!important}

.tables-container{gap:18px!important}
.sms-section,.replay-section,.table-card{overflow:hidden}
.table-scroll,.table-wrapper,.table-responsive{overflow:auto}
table{width:100%;border-collapse:separate!important;border-spacing:0!important;color:#dcebe4!important}
thead,thead tr{background:rgba(37,211,102,.07)!important}
th{
    color:#9fb4aa!important;background:transparent!important;
    border-color:var(--ai-line)!important;
    font-size:.7rem!important;text-transform:uppercase;letter-spacing:.08em;padding:15px!important;
}
td{color:#dcebe4!important;background:transparent!important;border-color:var(--ai-line)!important;padding:15px!important}
tbody tr{background:transparent!important;transition:.15s ease}
tbody tr:hover{background:rgba(37,211,102,.045)!important}
.status-badge,.badge{border-radius:999px!important;padding:6px 10px!important;font-weight:700!important}
.status-sent,.bg-success{background:rgba(37,211,102,.12)!important;color:#76f3aa!important}
.status-pending,.bg-warning{background:rgba(255,204,102,.12)!important;color:#ffd57f!important}
.text-primary,.text-success{color:var(--ai-green-2)!important}
.text-warning{color:var(--ai-warning)!important}
.text-muted,.navbar-text{color:var(--ai-muted)!important}

.filters-section,.profile-card{padding:28px!important}
.filter-form{gap:14px!important}
.header-section{margin:44px 0 24px!important}
.header-section h2{font-size:clamp(2rem,4vw,3.2rem)!important;color:var(--ai-text)!important}
.info-box,.success,.error,.alert{
    border-radius:12px!important;border:1px solid var(--ai-line)!important;
    background:rgba(37,211,102,.07)!important;color:#c9f8db!important;
}
.error,.alert-danger{background:rgba(255,107,122,.08)!important;color:#ffabb4!important;border-color:rgba(255,107,122,.22)!important}

body:has(> .container > form)>.container,
body:has(> .marquee-bar + .container)>.container{
    width:min(460px,calc(100vw - 32px))!important;
    margin:clamp(48px,9vh,110px) auto!important;
    padding:34px!important;
    background:linear-gradient(145deg,rgba(20,39,32,.96),rgba(9,22,17,.96))!important;
    border:1px solid var(--ai-line)!important;border-radius:24px!important;
    box-shadow:var(--ai-shadow)!important;
}
body:has(> .container > form)>.container:before,
body:has(> .marquee-bar + .container)>.container:before{
    content:"W";display:grid;place-items:center;width:48px;height:48px;margin-bottom:26px;
    border-radius:15px;background:linear-gradient(145deg,var(--ai-green-2),var(--ai-green));
    color:#052412;font-family:Manrope,sans-serif;font-weight:900;font-size:1.25rem;
}
body:has(> .container > form)>.container h2,
body:has(> .marquee-bar + .container)>.container h2{font-size:1.75rem!important;color:var(--ai-text)!important;margin-bottom:26px!important;text-align:left!important}
.register-link,.login-link{color:var(--ai-muted)!important}
.register-link a,.login-link a{color:var(--ai-green-2)!important}

@media(max-width:820px){
    .navbar,nav.navbar{padding:14px 18px!important;min-height:68px!important;align-items:flex-start!important;gap:14px}
    .navbar .user-info,.navbar-actions{flex-wrap:wrap;justify-content:flex-end}
    .navbar .username,.navbar-text{display:none!important}
    .navbar a,.btn-nav{padding:8px 10px!important;font-size:.78rem!important}
    body>.container,body>.container-lg,.page{width:calc(100vw - 28px)!important;margin:20px auto!important}
    .stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}
    .tables-container,.instructions-grid{grid-template-columns:1fr!important}
    .page-header{margin-top:34px!important}
    .page-header h1{font-size:2.65rem!important}
    .filters-section,.profile-card,.card-body{padding:19px!important}
    .filter-form{grid-template-columns:1fr!important}
}
@media(max-width:520px){
    .navbar h1,.navbar-brand span{font-size:.88rem!important}
    .navbar h1:before,.navbar-brand:before{width:30px;height:30px;margin-right:7px}
    .stats{grid-template-columns:1fr!important}
    .stat-card{padding:20px!important}
    body:has(> .container > form)>.container,
    body:has(> .marquee-bar + .container)>.container{padding:25px!important}
}

/* Dashboard workspace sidebar */
.dashboard-notice{display:none!important}
.dashboard-topbar{
    height:76px!important;min-height:76px!important;
    margin:0!important;
    position:sticky!important;top:0;z-index:30;
    border-bottom:1px solid rgba(170,255,214,.12)!important;
}
.dashboard-topbar h1{font-size:0!important}
.dashboard-topbar h1:before{
    content:"W";font-size:.9rem!important;
}
.dashboard-topbar h1:after{
    content:"Whatspop AI";font-size:1.02rem!important;
    color:var(--ai-text);vertical-align:middle;
}
.dashboard-old-actions{display:none!important}
.campaign-old-actions{display:none!important}
.user-menu{position:relative;margin-left:auto}
.user-menu summary{
    min-width:170px;display:flex;align-items:center;gap:10px;
    padding:7px 10px 7px 7px;border:1px solid var(--ai-line);
    border-radius:12px;background:rgba(255,255,255,.035);
    color:#dcebe4;font-size:.78rem;font-weight:700;
    list-style:none;cursor:pointer;user-select:none;
}
.user-menu summary::-webkit-details-marker{display:none}
.user-menu summary:hover{border-color:var(--ai-line-strong);background:rgba(37,211,102,.07)}
.user-avatar{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:rgba(37,211,102,.13);color:var(--ai-green-2);font-weight:800}
.menu-chevron{margin-left:auto;color:#7f988c;font-size:.9rem;transition:.2s ease}
.user-menu[open] .menu-chevron{transform:rotate(180deg)}
.user-dropdown{
    position:absolute;right:0;top:calc(100% + 10px);width:220px;padding:8px;
    background:#10221b;border:1px solid var(--ai-line);border-radius:14px;
    box-shadow:0 22px 65px rgba(0,0,0,.48);
}
.dropdown-account{padding:10px 10px 12px;margin-bottom:5px;border-bottom:1px solid var(--ai-line)}
.dropdown-account small{display:block;color:#6f887c;font-size:.62rem;margin-bottom:3px}
.dropdown-account strong{display:block;color:#eafff1;font-size:.76rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.navbar .user-dropdown a{
    display:flex!important;align-items:center;gap:10px;width:100%;
    padding:10px!important;border:0!important;background:transparent!important;
    color:#bcd0c6!important;border-radius:9px!important;font-size:.75rem!important;
}
.navbar .user-dropdown a:hover{background:rgba(37,211,102,.08)!important;color:#fff!important;transform:none}
.navbar .user-dropdown .logout-link{color:#ff9aa5!important}
.dashboard-sidebar{
    position:fixed!important;left:0;top:76px!important;bottom:0;width:260px;
    padding:24px 18px;border-right:1px solid var(--ai-line);
    background:rgba(8,20,15,.92);backdrop-filter:blur(20px);
    display:flex;flex-direction:column;z-index:15;
}
.sidebar-brand{display:flex;align-items:center;gap:12px;padding:2px 8px 24px;border-bottom:1px solid var(--ai-line)}
.sidebar-logo{position:relative;display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:linear-gradient(145deg,var(--ai-green-2),var(--ai-green));color:#052412;font-family:Manrope,sans-serif;font-weight:900}
.sidebar-brand strong{display:block;font-family:Manrope,sans-serif;font-size:.95rem}
.sidebar-brand strong:after{
    content:"AI POWERED";display:inline-block;margin-left:7px;padding:3px 5px;
    border:1px solid rgba(85,239,155,.25);border-radius:5px;
    background:rgba(37,211,102,.09);color:var(--ai-green-2);
    font-family:Inter,sans-serif;font-size:.46rem;font-weight:800;
    letter-spacing:.08em;vertical-align:2px;
}
.sidebar-brand small{display:block;color:var(--ai-muted);font-size:.66rem;margin-top:2px}
.sidebar-nav{display:flex!important;flex-direction:column;align-items:stretch!important;gap:4px!important;margin-top:20px}
.sidebar-label{color:#5f786c;font-size:.61rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;padding:14px 11px 7px}
.sidebar-nav a{
    min-height:44px;display:flex;align-items:center;gap:11px;padding:10px 11px!important;
    color:#f4fff8!important;background:transparent!important;border:1px solid transparent!important;
    border-radius:11px!important;text-decoration:none;font-size:.8rem;font-weight:650!important;
}
.sidebar-nav a:hover{color:#eafff1!important;background:rgba(255,255,255,.035)!important;border-color:var(--ai-line)!important;transform:none!important}
.sidebar-nav a.active{color:#dffff0!important;background:rgba(37,211,102,.1)!important;border-color:rgba(37,211,102,.18)!important}
.sidebar-nav a.active .nav-symbol{color:var(--ai-green-2)}
.nav-symbol{display:grid;place-items:center;width:23px;height:23px;color:#d8eee3;font-size:1rem;font-weight:800}
.sidebar-nav b{margin-left:auto;color:#75f1a8;background:rgba(37,211,102,.12);padding:3px 6px;border-radius:6px;font-size:.56rem;text-transform:uppercase;letter-spacing:.06em}
.sidebar-logout{color:#d9949c!important}
.sidebar-credit{margin-top:auto;padding:15px;background:rgba(255,255,255,.025);border:1px solid var(--ai-line);border-radius:14px}
.credit-row{display:flex;justify-content:space-between;gap:8px;color:#95aa9f;font-size:.68rem}
.credit-row strong{color:#e8fff1}
.credit-track{height:5px;margin:11px 0 9px;background:#1a3026;border-radius:999px;overflow:hidden}
.credit-track span{display:block;height:100%;background:linear-gradient(90deg,var(--ai-green),var(--ai-cyan));border-radius:inherit}
.sidebar-credit small{color:#627b70;font-size:.61rem}
body>.dashboard-main{width:calc(100% - 308px)!important;max-width:none!important;margin:32px 24px 50px 284px!important}
body:has(> .dashboard-main){background:#07110e!important}
body>.dashboard-main{
    min-height:100vh;margin-top:0!important;padding-top:32px!important;
    background:#07110e!important;
}
body>.campaign-main{width:calc(100% - 308px)!important;max-width:none!important;margin:32px 24px 50px 284px!important}
body>.history-main{width:calc(100% - 308px)!important;max-width:none!important;margin:32px 24px 50px 284px!important}
body>.bulk-main{width:calc(100% - 308px)!important;max-width:none!important;margin:32px 24px 50px 284px!important}
body>.profile-main{width:calc(100% - 308px)!important;max-width:none!important;margin:32px 24px 50px 284px!important}
body:has(> .campaign-main),
body:has(> .history-main),
body:has(> .bulk-main),
body:has(> .profile-main),
body:has(> .billing-main){background:#07110e!important}
body>.campaign-main,
body>.history-main,
body>.bulk-main,
body>.profile-main,
body>.billing-main{
    min-height:100vh;margin-top:0!important;padding-top:32px!important;
    background:#07110e!important;
}
nav.history-old-navbar.navbar{display:none!important}
.history-topbar{
    height:76px!important;min-height:76px!important;margin:0!important;
    position:sticky!important;top:0;z-index:30;
}
.history-topbar h1{font-size:0!important}
.history-topbar h1:before{content:"W";font-size:.9rem!important}
.history-topbar h1:after{content:"Whatspop AI";font-size:1.02rem!important;color:var(--ai-text);vertical-align:middle}
.history-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:8px 0 26px}
.history-heading .eyebrow{color:var(--ai-green-2);font-size:.62rem;font-weight:800;letter-spacing:.17em}
.history-heading h2{color:var(--ai-text);font-size:clamp(1.8rem,3vw,2.7rem);margin:8px 0 4px}
.history-heading p{margin:0;font-size:.82rem}
.history-main>.row{margin-left:0!important;margin-right:0!important}
.history-main .dataTables_wrapper,.history-main .dt-container{color:var(--ai-text)!important}
.history-main .card{overflow:hidden}
.history-main .form-label{color:#f4fff8!important}
.bulk-topbar{
    height:76px!important;min-height:76px!important;margin:0!important;
    position:sticky!important;top:0;z-index:30;
}
.bulk-topbar h1{font-size:0!important}
.bulk-topbar h1>i{display:none!important}
.bulk-topbar h1:before{content:"W";font-size:.9rem!important}
.bulk-topbar h1:after{content:"Whatspop AI";font-size:1.02rem!important;color:var(--ai-text);vertical-align:middle}
.bulk-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:8px 0 26px}
.bulk-heading .eyebrow{color:var(--ai-green-2);font-size:.62rem;font-weight:800;letter-spacing:.17em}
.bulk-heading h2{color:var(--ai-text);font-size:clamp(1.8rem,3vw,2.7rem);margin:8px 0 4px}
.bulk-heading p{margin:0;font-size:.82rem}
.bulk-main .action-bar{padding:16px 18px!important;margin-bottom:16px!important}
.bulk-main .info-text{color:#cde0d7!important}
.bulk-main .table-card{margin-bottom:24px}
.profile-topbar{
    height:76px!important;min-height:76px!important;margin:0!important;
    position:sticky!important;top:0;z-index:30;
}
.profile-topbar h1{font-size:0!important}
.profile-topbar h1:before{content:"W";font-size:.9rem!important}
.profile-topbar h1:after{content:"Whatspop AI";font-size:1.02rem!important;color:var(--ai-text);vertical-align:middle}
.profile-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:8px 0 26px}
.profile-heading .eyebrow{color:var(--ai-green-2);font-size:.62rem;font-weight:800;letter-spacing:.17em}
.profile-heading h2{color:var(--ai-text);font-size:clamp(1.8rem,3vw,2.7rem);margin:8px 0 4px}
.profile-heading p{margin:0;font-size:.82rem}
.profile-main>.profile-card{max-width:900px!important;margin:0!important}
.profile-main .current-photo,.profile-main .no-photo{border:3px solid rgba(85,239,155,.35)!important;box-shadow:0 12px 35px rgba(0,0,0,.3)}
.profile-main .readonly-field{opacity:.72}
.profile-live-label{
    display:flex;align-items:center;gap:6px;margin-bottom:13px;
    color:#789187;font-size:.58rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;
}
.live-dot{width:6px;height:6px;border-radius:50%;background:var(--ai-green);box-shadow:0 0 10px var(--ai-green)}
.profile-tip .credit-row strong{color:var(--ai-green-2);font-size:.8rem}
.last-campaign-status{margin-top:15px;padding-top:14px;border-top:1px solid var(--ai-line)}
.campaign-label{display:block;color:#91a89e;font-size:.63rem;margin-bottom:7px}
.campaign-status-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:5px}
.campaign-status{color:#dcebe4;font-size:.68rem}
.campaign-status:before{content:"";display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;background:#789187}
.campaign-status.status-sent{color:#76f3aa!important}
.campaign-status.status-sent:before{background:var(--ai-green)}
.campaign-status.status-pending{color:#ffd57f!important}
.campaign-status.status-pending:before{background:var(--ai-warning)}
.campaign-status.status-failed{color:#ff9aa5!important}
.campaign-status.status-failed:before{background:var(--ai-danger)}
.campaign-status-row time{color:#6c8479;font-size:.55rem}
.last-campaign-status>small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Billing */
.billing-topbar{
    height:76px!important;min-height:76px!important;margin:0!important;
    position:sticky!important;top:0;z-index:30;
}

/* Headerless workspace layout */
body>.dashboard-topbar,
body>.campaign-topbar,
body>.history-topbar,
body>.bulk-topbar,
body>.profile-topbar,
body>.billing-topbar{display:none!important}
.dashboard-sidebar{top:0!important;height:100vh!important}
.billing-topbar h1{font-size:0!important}
.billing-topbar h1:before{content:"W";font-size:.9rem!important}
.billing-topbar h1:after{content:"Whatspop AI";font-size:1.02rem!important;color:var(--ai-text);vertical-align:middle}
.billing-main{width:calc(100% - 308px);margin:32px 24px 60px 284px}
.billing-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:8px 0 26px}
.billing-heading .eyebrow{color:var(--ai-green-2);font-size:.62rem;font-weight:800;letter-spacing:.17em}
.billing-heading h2{color:var(--ai-text);font-size:clamp(1.8rem,3vw,2.7rem);margin:8px 0 4px}
.billing-heading p{margin:0;font-size:.82rem}
.print-bill{border:0;cursor:pointer}
.invoice-sheet{
    max-width:1050px;padding:42px;
    background:linear-gradient(145deg,rgba(20,39,32,.95),rgba(9,23,18,.97));
    border:1px solid var(--ai-line);border-radius:22px;box-shadow:var(--ai-shadow);
}
.invoice-top,.invoice-meta,.invoice-summary,.invoice-footer{display:flex;justify-content:space-between;gap:28px}
.invoice-top{align-items:center;padding-bottom:28px;border-bottom:1px solid var(--ai-line)}
.invoice-brand{display:flex;align-items:center;gap:12px}
.invoice-logo{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:linear-gradient(145deg,var(--ai-green-2),var(--ai-green));color:#052412;font-weight:900}
.invoice-brand strong,.invoice-brand small{display:block}
.invoice-brand strong{font-family:Manrope,sans-serif;font-size:1rem}
.invoice-brand small{color:var(--ai-muted);font-size:.65rem;margin-top:3px}
.invoice-title{text-align:right}
.invoice-title span{display:block;color:#6f887c;font-size:.62rem;font-weight:800;letter-spacing:.14em}
.invoice-title strong{display:block;margin-top:6px;color:var(--ai-green-2);font-size:.82rem}
.invoice-meta{padding:30px 0}
.invoice-meta strong,.invoice-meta p{display:block;margin:4px 0;color:#e8fff1;font-size:.8rem}
.invoice-meta p{color:var(--ai-muted);font-size:.68rem}
.invoice-label{display:block;color:#6f887c;font-size:.59rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.invoice-date{text-align:right}
.bill-status{display:inline-block;margin-top:10px;padding:5px 9px;border-radius:999px;background:rgba(255,204,102,.1);color:#ffd57f;font-size:.62rem;font-weight:700}
.invoice-table-wrap{overflow:auto;border:1px solid var(--ai-line);border-radius:14px}
.invoice-table{min-width:650px}
.invoice-table th{padding:14px 16px!important}
.invoice-table td{padding:20px 16px!important}
.invoice-table td:first-child{width:45%}
.invoice-table td strong,.invoice-table td small{display:block}
.invoice-table td small{color:var(--ai-muted);font-size:.64rem;margin-top:5px}
.invoice-summary{align-items:flex-start;padding:28px 0;border-bottom:1px solid var(--ai-line)}
.invoice-note p{font-size:.7rem}
.invoice-total{text-align:right;min-width:240px}
.invoice-total span,.invoice-total small{display:block;color:var(--ai-muted);font-size:.65rem}
.invoice-total .total-line{display:flex;justify-content:space-between;gap:30px;padding:5px 0}
.invoice-total .total-line span{display:inline;color:var(--ai-muted)}
.invoice-total .total-line b{color:#dcebe4;font-size:.7rem}
.invoice-total .grand-total-label{margin-top:12px;padding-top:10px;border-top:1px solid var(--ai-line)}
.invoice-total strong{display:block;margin:7px 0;color:var(--ai-green-2);font-family:Manrope,sans-serif;font-size:2rem}
.invoice-footer{padding-top:22px;align-items:center}
.invoice-footer p,.invoice-footer span{margin:0;color:var(--ai-muted);font-size:.65rem}

@media(max-width:1050px){
    .billing-main{width:calc(100% - 112px);margin-left:96px;margin-right:16px}
}
@media(max-width:700px){
    body>.billing-topbar{display:none!important}
    .billing-main{width:calc(100% - 28px);margin:22px auto}
    .billing-heading{align-items:flex-start}
    .invoice-sheet{padding:22px}
    .invoice-meta,.invoice-summary{flex-direction:column}
    .invoice-date,.invoice-total{text-align:left}
}
@media print{
    .billing-topbar,.billing-sidebar,.billing-heading{display:none!important}
    body{background:#fff!important;color:#111!important}
    body:before{display:none!important}
    .billing-main{width:100%!important;margin:0!important}
    .invoice-sheet{max-width:none;border:0;box-shadow:none;background:#fff!important;color:#111!important}
    .invoice-sheet *{color:#111!important}
    .invoice-table th{background:#eee!important}
}
.sms-selection-bar{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    margin-bottom:14px;padding:11px 13px;border:1px solid var(--ai-line);
    border-radius:11px;background:rgba(37,211,102,.035);
    color:#cce0d6;font-size:.72rem;
}
.sms-selection-bar strong{color:var(--ai-green-2);font-size:.82rem}
.sms-check-cell{width:42px!important;text-align:center!important}
.sms-row-check,#select_all_sms{
    appearance:none;width:17px!important;height:17px!important;min-height:17px!important;
    padding:0!important;border:1px solid #536e61!important;border-radius:5px!important;
    background:#07130f!important;cursor:pointer;vertical-align:middle;
}
.sms-row-check:checked,#select_all_sms:checked{
    border-color:var(--ai-green)!important;background-color:var(--ai-green)!important;
    background-image:linear-gradient(135deg,transparent 45%,#052412 45%,#052412 58%,transparent 58%),linear-gradient(45deg,transparent 58%,#052412 58%,#052412 70%,transparent 70%)!important;
}
#select_all_sms:indeterminate{background:var(--ai-green)!important;box-shadow:inset 0 0 0 5px var(--ai-green)!important}
.campaign-tip .credit-row strong{color:var(--ai-green-2)}

/* Modern campaign form */
.campaign-main{
    padding-bottom:70px!important;
    display:grid!important;
    grid-template-columns:minmax(0,1.55fr) minmax(300px,.65fr);
    gap:20px!important;align-items:start;
}
.campaign-main .page-header{grid-column:1/-1;margin:42px 0 10px!important;max-width:860px!important}
.send-mode-tabs{
    grid-column:1/-1;grid-row:2;display:inline-flex;width:max-content;
    gap:5px;padding:5px;background:#091711;border:1px solid var(--ai-line);border-radius:14px;
}
.send-mode-btn{
    min-height:42px!important;padding:9px 15px!important;border-radius:10px!important;
    background:transparent!important;color:#8fa69b!important;box-shadow:none!important;
    font-size:.75rem!important;border:0!important;
}
.send-mode-btn.active{background:rgba(37,211,102,.13)!important;color:#e5fff0!important}
.send-mode-btn span{margin-right:6px;color:var(--ai-green-2)}
.single-send-section{grid-column:1/-1;grid-row:3;max-width:1080px!important}
.single-send-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.single-form-field{
    padding:18px;background:rgba(255,255,255,.018);
    border:1px solid var(--ai-line);border-radius:14px;
}
.single-form-field>label{display:flex;align-items:center;margin-bottom:10px!important;color:#f5fff9!important}
.single-form-field>small,.mobile-input-wrap+small{display:block;margin-top:8px;color:#789086;font-size:.62rem}
.single-message-field{grid-column:1/-1}
.single-message-field textarea{min-height:150px!important}
.mobile-input-wrap{display:flex;align-items:center;background:#091711;border:1px solid rgba(170,255,214,.16);border-radius:12px;overflow:hidden}
.mobile-input-wrap:focus-within{border-color:var(--ai-green);box-shadow:0 0 0 4px rgba(37,211,102,.1)}
.mobile-input-wrap>span{padding:0 12px;color:var(--ai-green-2);font-size:.78rem;font-weight:800;border-right:1px solid var(--ai-line)}
.mobile-input-wrap input{border:0!important;border-radius:0!important;box-shadow:none!important}
.single-upload-box{
    position:relative;min-height:115px;display:flex;flex-direction:column;align-items:center;justify-content:center;
    border:1px dashed rgba(85,239,155,.3);border-radius:12px;background:rgba(37,211,102,.025);
}
.single-upload-box input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.single-upload-box strong{color:#fff;font-size:.76rem}
.single-upload-box small{color:#789086;font-size:.61rem;margin-top:5px}
.single-send-button{grid-column:1/-1}
.campaign-main .page-header h1{font-size:clamp(2.7rem,5vw,4.4rem)!important;max-width:780px}
.campaign-main>.card{
    max-width:none;margin:0!important;
    background:linear-gradient(145deg,rgba(18,38,30,.94),rgba(8,23,17,.94))!important;
}
.campaign-main>.how-card{
    grid-column:2;grid-row:3;box-shadow:none!important;
    background:rgba(15,31,25,.62)!important;
}
.campaign-main>.new-campaign-card{grid-column:1;grid-row:3}
.campaign-main .card-header{display:flex;align-items:center;gap:14px;padding:22px 28px!important}
.campaign-main .card-header>.icon{
    display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;
    border-radius:13px;background:rgba(37,211,102,.11)!important;
    border:1px solid rgba(37,211,102,.18);font-size:1rem;
}
.campaign-main .card-header h3{margin:0 0 3px!important;font-size:1.05rem!important}
.campaign-main .card-header p{margin:0!important;font-size:.75rem!important}
.campaign-main .card-body{padding:28px!important}
.campaign-main>.how-card .card-body{padding:20px!important}
.campaign-main .instructions-grid{grid-template-columns:1fr!important;gap:10px!important}
.campaign-main .instr-item{padding:17px!important;min-height:112px}
.campaign-main .instr-item p{color:#dcebe4!important;font-size:.76rem!important;line-height:1.55!important;margin-top:9px!important}
.campaign-main .download-btn{display:inline-flex!important;align-items:center;gap:8px;margin-top:16px!important;padding:11px 15px!important;font-size:.75rem!important}
.campaign-main .tabs-wrapper{
    display:inline-flex!important;gap:5px!important;padding:5px!important;margin-bottom:26px!important;
    background:#091711!important;border:1px solid var(--ai-line)!important;border-radius:13px!important;
}
.campaign-main .tabs-wrapper{display:none!important}
.campaign-main .tab-btn{
    min-height:40px!important;padding:9px 15px!important;border-radius:9px!important;
    background:transparent!important;color:#8fa69b!important;box-shadow:none!important;font-size:.75rem!important;
}
.campaign-main .tab-btn.active{background:rgba(37,211,102,.13)!important;color:#dffff0!important}
.campaign-main .tabs-wrapper .tab-btn:nth-child(2){display:none!important}
.campaign-main .tab-panel{max-width:920px}
.campaign-main .tab-panel form{display:grid;grid-template-columns:minmax(0,1fr);gap:22px}
.campaign-main .form-row{
    position:relative;margin:0!important;padding:20px!important;
    background:rgba(255,255,255,.018);border:1px solid var(--ai-line);border-radius:15px;
}
.campaign-main .form-row>label{display:flex;align-items:center;gap:5px;margin-bottom:12px!important;color:#f5fff9!important;font-size:.78rem!important}
.campaign-main .optional{
    margin-left:auto;padding:3px 7px;border-radius:999px;
    color:#82998e!important;background:rgba(255,255,255,.045);font-size:.58rem!important;text-transform:uppercase;letter-spacing:.08em;
}
.campaign-main .file-zone{
    min-height:145px!important;display:flex!important;flex-direction:column;align-items:center;justify-content:center;
    padding:22px!important;border:1px dashed rgba(85,239,155,.3)!important;border-radius:13px!important;
    background:rgba(37,211,102,.025)!important;transition:.2s ease!important;
}
.campaign-main .file-zone:hover,.campaign-main .file-zone.dragover{
    border-color:var(--ai-green)!important;background:rgba(37,211,102,.07)!important;
    transform:translateY(-1px);
}
.campaign-main .fz-icon{
    display:grid;place-items:center;width:42px;height:42px;margin-bottom:10px!important;
    border-radius:12px;background:rgba(37,211,102,.1);font-size:1.15rem!important;
}
.campaign-main .fz-title{color:#fff!important;font-size:.78rem!important;font-weight:700!important}
.campaign-main .fz-sub,.campaign-main .hint{color:#b8cec3!important;font-size:.65rem!important}
.campaign-main .hint{margin-top:9px!important}
.campaign-main textarea.field{
    min-height:190px!important;padding:17px!important;resize:vertical;
    background:#07130f!important;border-color:rgba(170,255,214,.14)!important;
    font-size:.86rem!important;line-height:1.65!important;
}
.campaign-main .char-counter{margin-top:8px!important;color:#799086!important;font-size:.64rem!important;text-align:right}
.campaign-main .field{background:#07130f!important}
.campaign-main .divider{display:none!important}
.campaign-main .btn-submit{
    width:100%!important;min-height:54px!important;margin-top:2px!important;
    display:flex!important;align-items:center;justify-content:center;gap:9px;
    border-radius:13px!important;font-size:.82rem!important;letter-spacing:.01em;
}
.campaign-main .alert{margin-bottom:20px!important;padding:14px 16px!important}

@media(min-width:900px){
    .campaign-main #simple form{grid-template-columns:1fr}
}
@media(max-width:1100px){
    .campaign-main{grid-template-columns:1fr!important}
    .campaign-main .page-header{grid-column:1;grid-row:1}
    .send-mode-tabs{grid-column:1;grid-row:2}
    .campaign-main>.new-campaign-card{grid-column:1;grid-row:3}
    .campaign-main>.how-card{grid-column:1;grid-row:4}
    .single-send-section{grid-column:1;grid-row:3}
}
.dashboard-welcome{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:10px 0 26px}
.dashboard-welcome .eyebrow{color:var(--ai-green-2);font-size:.62rem;font-weight:800;letter-spacing:.17em}
.dashboard-welcome h2{font-size:clamp(1.65rem,3vw,2.45rem);margin:8px 0 4px;color:var(--ai-text)}
.dashboard-welcome p{margin:0;font-size:.86rem}
.welcome-action{display:flex;align-items:center;gap:12px;padding:12px 15px;border-radius:12px;background:linear-gradient(135deg,var(--ai-green-2),var(--ai-green));color:#052412;text-decoration:none;font-size:.78rem;font-weight:800;box-shadow:0 10px 30px rgba(37,211,102,.15)}
.welcome-action:hover{transform:translateY(-2px);color:#052412}
.welcome-action span{font-size:1rem}
.dashboard-main .stats{grid-template-columns:repeat(4,minmax(0,1fr))!important}

/* Dashboard overview refresh */
.dashboard-main .dashboard-welcome{
    position:relative;overflow:hidden;align-items:center;
    padding:28px 30px;margin:0 0 18px!important;
    border:1px solid rgba(85,239,155,.16);border-radius:22px;
    background:
        radial-gradient(circle at 78% 20%,rgba(85,239,155,.14),transparent 18rem),
        linear-gradient(135deg,rgba(20,48,36,.92),rgba(9,25,19,.94));
    box-shadow:0 20px 50px rgba(0,0,0,.22);
}
.dashboard-main .dashboard-welcome:after{
    content:"AI workspace active";position:absolute;right:28px;bottom:18px;
    color:rgba(145,235,182,.42);font-size:.52rem;font-weight:800;
    letter-spacing:.13em;text-transform:uppercase;pointer-events:none;
}
.dashboard-main .dashboard-welcome .eyebrow{
    display:inline-flex;align-items:center;gap:7px;padding:5px 8px;
    border:1px solid rgba(85,239,155,.2);border-radius:999px;
    background:rgba(37,211,102,.07);font-size:.55rem;
}
.dashboard-main .dashboard-welcome .eyebrow:before{
    content:"";width:6px;height:6px;border-radius:50%;background:var(--ai-green);
    box-shadow:0 0 10px var(--ai-green);
}
.dashboard-main .dashboard-welcome h2{font-size:clamp(1.65rem,3vw,2.35rem);margin:11px 0 6px}
.dashboard-main .dashboard-welcome p{max-width:620px;color:#9bb2a7!important}
.dashboard-main .dashboard-welcome .welcome-action{
    flex:0 0 auto;padding:13px 17px;border-radius:13px;
    box-shadow:0 12px 30px rgba(37,211,102,.2);
}
.dashboard-main .stats{gap:12px!important;margin-bottom:22px}
.dashboard-main .stat-card{
    min-height:168px;display:flex!important;flex-direction:column;align-items:flex-start!important;
    justify-content:flex-start;text-align:left!important;padding:22px!important;
    background:linear-gradient(145deg,rgba(18,38,30,.94),rgba(8,23,17,.94))!important;
}
.dashboard-main .stat-card:before{
    content:"";position:absolute;left:0;top:22px;bottom:22px;width:3px;
    border-radius:0 4px 4px 0;background:var(--ai-green);
}
.dashboard-main .stat-card:nth-child(2):before{background:#8c6cff}
.dashboard-main .stat-card:nth-child(3):before{background:var(--ai-cyan)}
.dashboard-main .stat-card:nth-child(4):before{background:#6f9cff}
.dashboard-main .stat-card .icon{
    width:38px!important;height:38px!important;display:grid!important;place-items:center;
    margin:0 0 18px!important;padding:0!important;border-radius:11px!important;
    background:rgba(37,211,102,.08)!important;border:1px solid rgba(85,239,155,.14)!important;
}
.dashboard-main .stat-card:nth-child(2) .icon{background:rgba(140,108,255,.09)!important;border-color:rgba(140,108,255,.2)!important}
.dashboard-main .stat-card:nth-child(3) .icon{background:rgba(77,231,212,.08)!important;border-color:rgba(77,231,212,.18)!important}
.dashboard-main .stat-card:nth-child(4) .icon{background:rgba(111,156,255,.08)!important;border-color:rgba(111,156,255,.18)!important}
.dashboard-main .stat-card h3{
    order:2;margin:0 0 7px!important;font-size:clamp(1.55rem,2.5vw,2.15rem)!important;
    line-height:1!important;letter-spacing:-.045em;
}
.dashboard-main .stat-card p{order:3;margin:0!important;font-size:.62rem!important;color:#7f978c!important}
.dashboard-main .stat-card .icon{order:1}
.dashboard-main .tables-container{grid-template-columns:minmax(0,1fr)!important}
.dashboard-main .sms-section.replay{display:none!important}
.dashboard-main .sms-section:not(.replay){width:100%!important;max-width:none!important}

@media(max-width:1050px){
    .dashboard-sidebar{width:78px;padding:22px 12px}
    .sidebar-brand{justify-content:center;padding-left:0;padding-right:0}
    .sidebar-brand>div,.sidebar-label,.sidebar-nav a span:not(.nav-symbol),.sidebar-nav b,.sidebar-credit{display:none}
    .sidebar-logo:after{content:"AI";position:absolute;margin-top:42px;color:var(--ai-green-2);font-size:.43rem;letter-spacing:.08em}
    .sidebar-nav a{justify-content:center;padding:10px!important}
    body>.dashboard-main{width:calc(100% - 112px)!important;margin-left:96px!important;margin-right:16px!important}
    body>.campaign-main{width:calc(100% - 112px)!important;margin-left:96px!important;margin-right:16px!important}
    body>.history-main{width:calc(100% - 112px)!important;margin-left:96px!important;margin-right:16px!important}
    body>.bulk-main{width:calc(100% - 112px)!important;margin-left:96px!important;margin-right:16px!important}
    body>.profile-main{width:calc(100% - 112px)!important;margin-left:96px!important;margin-right:16px!important}
    .dashboard-main .stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:700px){
    body>.dashboard-topbar,body>.campaign-topbar,body>.history-topbar,body>.bulk-topbar,body>.profile-topbar,body>.billing-topbar{display:none!important}
    .dashboard-sidebar{
        position:sticky!important;top:0!important;left:auto!important;bottom:auto!important;
        width:100%!important;height:58px!important;padding:10px 12px!important;display:flex;flex-direction:row;
        align-items:center;border-right:0;border-bottom:1px solid var(--ai-line);
        overflow-x:auto;overflow-y:hidden;white-space:nowrap;
    }
    .sidebar-brand{flex:0 0 auto;padding:0 12px 0 0;border:0;position:sticky;left:0;background:#091711;z-index:2}
    .sidebar-logo{width:34px;height:34px}
    .sidebar-logo:after{display:none}
    .sidebar-nav{flex:0 0 auto;margin:0;flex-direction:row!important;gap:3px!important}
    .sidebar-nav a{min-width:42px;min-height:38px;padding:7px!important}
    .sidebar-nav a span:not(.nav-symbol),.sidebar-nav b,.sidebar-label{display:none!important}
    .sidebar-credit{display:none!important}
    body>.dashboard-main{width:calc(100% - 28px)!important;margin:22px auto!important}
    body>.dashboard-main{margin-top:0!important;padding-top:18px!important}
    body>.campaign-main{width:calc(100% - 28px)!important;margin:22px auto!important}
    body>.history-main{width:calc(100% - 28px)!important;margin:22px auto!important}
    body>.bulk-main{width:calc(100% - 28px)!important;margin:22px auto!important}
    body>.profile-main{width:calc(100% - 28px)!important;margin:22px auto!important}
    .billing-main{width:calc(100% - 28px)!important;margin:22px auto!important}
    body>.campaign-main,
    body>.history-main,
    body>.bulk-main,
    body>.profile-main,
    body>.billing-main{margin-top:0!important;padding-top:18px!important}
    .history-heading,.bulk-heading,.profile-heading,.dashboard-welcome,.billing-heading{
        align-items:flex-start;flex-direction:column;gap:14px;margin-top:4px!important;
    }
    .welcome-action{width:100%;justify-content:center;font-size:.72rem!important;padding:11px}
    .welcome-action span{font-size:.9rem}
    .dashboard-main .stats{grid-template-columns:1fr!important}
    .dashboard-main .dashboard-welcome{padding:22px!important}
    .dashboard-main .dashboard-welcome:after{display:none}
    .dashboard-main .stat-card{min-height:145px}
    .tables-container{display:block!important}
    .sms-section,.replay-section{margin-bottom:16px}
    .table-scroll,.table-wrapper,.table-responsive{max-width:100%;overflow-x:auto!important;-webkit-overflow-scrolling:touch}
    table{min-width:680px}
    .invoice-table{min-width:620px}
    .campaign-main{display:block!important}
    .campaign-main>.page-header,.campaign-main>.card{margin-bottom:18px!important}
    .campaign-main .page-header h1{font-size:2.35rem!important}
    .campaign-main .card-header,.campaign-main .card-body{padding:18px!important}
    .send-mode-tabs{display:flex;width:100%;overflow-x:auto}
    .send-mode-btn{flex:1;white-space:nowrap}
    .single-send-form{grid-template-columns:1fr}
    .single-message-field,.single-send-button{grid-column:1}
    .history-main .row{--bs-gutter-x:0!important}
    .profile-main>.profile-card{padding:20px!important}
}