/* ===== AI CALLER — Brand Book 2026 ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{--cloud:#F4F5F0;--teal:#2F6364;--mellow:#95A7B4;--plum:#2B142C;--mint:#A8E6CF;--text:#1e293b;--text-muted:#64748b;--radius:1.5rem;--radius-sm:.875rem;--danger:#e74c3c;--warn:#f39c12;}
html{scroll-behavior:smooth;}
body{font-family:'Inter',sans-serif;background:var(--plum);color:var(--cloud);line-height:1.6;-webkit-font-smoothing:antialiased;min-height:100vh;}
::selection{background:var(--mint);color:var(--teal);}
.font-h{font-family:'Playfair Display',serif;}
a{text-decoration:none;color:inherit;}

/* Screens */
.screen{display:none!important;}
.screen.active{display:block!important;}
#loginScreen.active{display:flex!important;}

/* Login */
#loginScreen{align-items:center;justify-content:center;min-height:100vh;padding:1.5rem;background:linear-gradient(135deg,var(--plum) 0%,#1a0d1b 50%,var(--teal) 100%);position:fixed;inset:0;z-index:200;}
.login-card{max-width:400px;width:100%;padding:3rem;text-align:center;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(20px);}
.login-logo{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-bottom:1rem;}
.logo-mark,.logo-mark-sm{font-family:'Playfair Display',serif;font-weight:700;background:var(--mint);color:var(--teal);display:flex;align-items:center;justify-content:center;border-radius:12px;}
.logo-mark{width:48px;height:48px;font-size:1.3rem;}
.logo-mark-sm{width:36px;height:36px;font-size:1rem;}
.logo-text{font-size:1.5rem;color:var(--cloud);}
.logo-text-sm{font-size:1.1rem;color:var(--cloud);}
.login-sub{color:var(--mellow);font-size:.9rem;margin-bottom:2rem;}
#loginForm input{width:100%;padding:.875rem 1rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-sm);color:#fff;font-size:.95rem;margin-bottom:.75rem;outline:none;font-family:'Inter',sans-serif;}
#loginForm input:focus{border-color:var(--mint);}
#loginForm button{width:100%;padding:1rem;background:var(--mint);color:var(--teal);border:none;border-radius:var(--radius-sm);font-size:1rem;font-weight:600;cursor:pointer;font-family:'Inter',sans-serif;transition:all .2s;}
#loginForm button:hover{background:#fff;}
.error-msg{color:var(--danger);font-size:.85rem;margin-top:.5rem;min-height:1.2em;}

/* Navbar */
#navbar{position:sticky;top:0;z-index:50;background:rgba(43,20,44,.9);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.06);}
.nav-inner{max-width:1400px;margin:0 auto;padding:0 1.5rem;height:60px;display:flex;align-items:center;justify-content:space-between;gap:1rem;}
.nav-left{display:flex;align-items:center;gap:.5rem;}
.nav-tabs{display:flex;gap:.25rem;overflow-x:auto;}
.tab{background:none;border:none;color:var(--mellow);padding:.5rem .75rem;border-radius:var(--radius-sm);font-size:.8rem;cursor:pointer;font-family:'Inter',sans-serif;white-space:nowrap;display:flex;align-items:center;gap:.4rem;transition:all .2s;}
.tab:hover{color:var(--cloud);background:rgba(255,255,255,.05);}
.tab.active{color:var(--mint);background:rgba(168,230,207,.1);}
.tab span{display:inline;}
.nav-user{display:flex;align-items:center;gap:.75rem;font-size:.8rem;color:var(--mellow);}
#logoutBtn{background:none;border:none;color:var(--mellow);cursor:pointer;font-size:1rem;padding:.25rem;}
#logoutBtn:hover{color:var(--danger);}

/* Tab content */
.tab-content{display:none;padding:2rem 1.5rem;min-height:calc(100vh - 60px);}
.tab-content.active{display:block;}
.container{max-width:1200px;margin:0 auto;}
.section-title{font-size:1.75rem;color:var(--cloud);margin-bottom:1.5rem;}

/* Bento Cards */
.bento-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);padding:1.75rem;transition:all .2s;}
.bento-card:hover{border-color:rgba(168,230,207,.15);}
.bento-teal{background:rgba(47,99,100,.2);border-color:rgba(47,99,100,.3);}
.bento-mint{background:rgba(168,230,207,.1);border-color:rgba(168,230,207,.2);}
.bento-card h3{font-size:1.1rem;font-weight:600;margin-bottom:1rem;}

/* Stats */
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.25rem;}
.stat-card{text-align:center;padding:2rem;}
.stat-num{font-size:3rem;font-weight:700;font-family:'Playfair Display',serif;line-height:1;}
.stat-label{font-size:.85rem;color:var(--mellow);margin-top:.5rem;}

/* Forms */
.form-group{margin-bottom:1rem;}
.form-group label{display:block;font-size:.8rem;color:var(--mellow);margin-bottom:.375rem;font-weight:500;}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:.75rem 1rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-sm);color:#fff;font-size:.9rem;outline:none;font-family:'Inter',sans-serif;resize:vertical;}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--mint);}
.form-group select option{background:var(--plum);color:#fff;}
.form-group input[type="checkbox"]{width:auto;margin-right:.5rem;}
.form-row{display:flex;gap:.75rem;align-items:end;}
.form-row input{flex:1;}

/* Buttons */
.btn-primary{display:inline-flex;align-items:center;gap:.5rem;background:var(--mint);color:var(--teal);font-weight:600;padding:.75rem 1.25rem;border-radius:var(--radius-sm);border:none;cursor:pointer;font-family:'Inter',sans-serif;transition:all .2s;}
.btn-primary:hover{background:#fff;}
.btn-secondary{display:inline-flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.08);color:var(--cloud);font-weight:500;padding:.75rem 1.25rem;border-radius:var(--radius-sm);border:1px solid rgba(255,255,255,.12);cursor:pointer;font-family:'Inter',sans-serif;transition:all .2s;}
.btn-secondary:hover{background:rgba(255,255,255,.12);}
.btn-call{width:100%;padding:1rem;background:var(--teal);color:#fff;border:none;border-radius:var(--radius-sm);font-size:1rem;font-weight:600;cursor:pointer;font-family:'Inter',sans-serif;margin-top:1rem;display:flex;align-items:center;justify-content:center;gap:.5rem;transition:all .2s;}
.btn-call:hover{background:#255051;}
.btn-danger{background:var(--danger);color:#fff;border:none;padding:.4rem .75rem;border-radius:.5rem;cursor:pointer;font-size:.75rem;}

/* Dialer */
.dialer-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;}
.hint{font-size:.8rem;color:var(--mellow);margin-bottom:1rem;}
.upload-zone{border:2px dashed rgba(255,255,255,.15);border-radius:var(--radius);padding:2.5rem;text-align:center;cursor:pointer;transition:all .2s;color:var(--mellow);}
.upload-zone:hover{border-color:var(--mint);color:var(--mint);}
.upload-zone i{font-size:2rem;display:block;margin-bottom:.75rem;}
.excel-preview{margin-top:1rem;}
.excel-list{max-height:200px;overflow-y:auto;font-size:.8rem;background:rgba(0,0,0,.2);border-radius:var(--radius-sm);padding:.75rem;margin:.75rem 0;}

/* History table */
.history-table-wrap{overflow-x:auto;}
.history-table{width:100%;border-collapse:collapse;font-size:.85rem;}
.history-table th{text-align:left;padding:.75rem;color:var(--mellow);font-weight:600;border-bottom:1px solid rgba(255,255,255,.08);font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;}
.history-table td{padding:.75rem;border-bottom:1px solid rgba(255,255,255,.04);}
.history-table tr:hover{background:rgba(255,255,255,.02);}
.badge{display:inline-block;padding:.2rem .6rem;border-radius:999px;font-size:.7rem;font-weight:600;}
.badge-pending{background:rgba(243,156,18,.15);color:var(--warn);}
.badge-completed{background:rgba(168,230,207,.15);color:var(--mint);}
.badge-failed{background:rgba(231,76,60,.15);color:var(--danger);}
.badge-interested{background:rgba(168,230,207,.2);color:var(--mint);}
.badge-not_interested{background:rgba(149,167,180,.2);color:var(--mellow);}

/* Scripts */
.scripts-list{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem;}
.script-item{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius-sm);cursor:pointer;transition:all .2s;}
.script-item:hover{border-color:var(--mint);}
.script-item.default{border-color:rgba(168,230,207,.3);}
.script-editor{margin-top:1rem;}

/* Numbers */
.numbers-list{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem;}
.number-item{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius-sm);}
.number-item .phone{font-weight:600;font-size:1.05rem;}
.number-item .label{color:var(--mellow);font-size:.8rem;}

/* Users */
.users-list{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.5rem;}
.user-item{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius-sm);}

/* FAQ */
.faq-list{display:flex;flex-direction:column;gap:1rem;}
.faq-item h3{color:var(--mint);margin-bottom:.5rem;}
.faq-item p{color:var(--mellow);font-size:.9rem;}

/* Modal */
.modal{display:none;position:fixed;inset:0;z-index:100;align-items:center;justify-content:center;padding:1.5rem;}
.modal.active{display:flex;}
.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(8px);}
.modal-content{position:relative;max-width:600px;width:100%;max-height:80vh;overflow-y:auto;z-index:1;}
.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;}
.modal-header button{background:none;border:none;color:var(--mellow);font-size:1.2rem;cursor:pointer;}

/* Admin-only visibility (controlled via JS) */
.admin-only{display:none;}
body.is-admin .admin-only{display:flex;}

/* Mobile */
@media(max-width:768px){
    .nav-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch;}
    .tab span{display:none;}
    .dialer-grid{grid-template-columns:1fr;}
    .stats-grid{grid-template-columns:1fr;}
}