/* ============================================================================
   TOPUPBABA SHARED THEME
   Pulled from the original signup/login/dashboard mockups so every new page
   matches exactly. Two "shells" share these tokens:
     - auth shell  (.screen/.hero/.sheet)  used by login, signup, bind-account
     - app shell   (.nav/.drawer/main)     used by dashboard, wallet, admin, etc.
   ============================================================================ */

:root[data-theme="dark"]{
  --page-bg:#04191A;
  --hero-1:#0A2E30; --hero-2:#0F3D3E;
  --hero-text:#FFFFFF; --hero-text-muted:#B8D6D3;
  --card:#F3FBFA; --ink:#0B2E30; --muted:#5C7A7A; --border:#DCEBE9;
  --brand:#14B8A6; --brand-dark:#0E8C7E; --amber:#F5A623; --danger:#D64545; --success:#1FA97A;
  --mark-icon:#0A2E30; --surface:#FFFFFF;
  --pattern-dot: rgba(255,255,255,0.05);
  --toggle-bg: rgba(255,255,255,0.1); --toggle-icon:#FFFFFF;
  --icon-back-bg: rgba(255,255,255,0.08); --icon-back-color:#FFFFFF;
  --section-alt:#062224;
  --glass-bg: rgba(4,25,26,0.55); --glass-border: rgba(255,255,255,0.1); --glass-sheen: rgba(255,255,255,0.16);
  --chart-grid: rgba(255,255,255,0.08); --chart-text: #B8D6D3;
  --drawer-bg:#0A2E30; --drawer-text:#FFFFFF; --drawer-text-muted:#B8D6D3;
  --drawer-border: rgba(255,255,255,0.12); --drawer-surface: rgba(255,255,255,0.08);
}
:root[data-theme="light"]{
  --page-bg:#EDF3F2;
  --hero-1:#E3F7F1; --hero-2:#CFF0E8;
  --hero-text:#0B2E30; --hero-text-muted:#4B7370;
  --card:#FFFFFF; --ink:#0B2E30; --muted:#6B8886; --border:#E3EDEC;
  --brand:#14B8A6; --brand-dark:#0E8C7E; --amber:#F5A623; --danger:#D64545; --success:#1FA97A;
  --mark-icon:#0A2E30; --surface:#F3F8F7;
  --pattern-dot: rgba(10,46,48,0.06);
  --toggle-bg: rgba(10,46,48,0.08); --toggle-icon:#0B2E30;
  --icon-back-bg: rgba(10,46,48,0.08); --icon-back-color:#0B2E30;
  --section-alt:#F3F8F7;
  --glass-bg: rgba(237,243,242,0.55); --glass-border: rgba(10,46,48,0.08); --glass-sheen: rgba(255,255,255,0.7);
  --chart-grid: rgba(10,46,48,0.08); --chart-text: #6B8886;
  --drawer-bg:#FFFFFF; --drawer-text:#0B2E30; --drawer-text-muted:#6B8886;
  --drawer-border:#E3EDEC; --drawer-surface:#F3F8F7;
}

*{box-sizing:border-box;}
html,body{height:100%; overflow-x:hidden;}
html{background:var(--page-bg);}
body{margin:0;font-family:'Inter',sans-serif;background:var(--page-bg);color:var(--ink);transition:background .3s ease;}
a{text-decoration:none;}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px;}

@keyframes spin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
.spin{display:inline-flex;animation:spin 0.8s linear infinite;}

/* ---- Buttons (shared) ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:15px 26px;border-radius:14px;border:none;
  font-family:'Inter',sans-serif;font-weight:600;font-size:15.5px;cursor:pointer;transition:transform .15s ease;}
.btn:active{transform:scale(0.98);}
.btn-primary{background:var(--brand);color:#04211F;}
.btn-ghost{background:transparent;color:var(--ink);border:1.5px solid var(--border);}
.btn-ghost-light{background:var(--toggle-bg);color:var(--hero-text);border:1px solid var(--glass-border);}
.btn-danger{background:var(--danger);color:#fff;}
.btn:disabled{opacity:0.6;cursor:not-allowed;}
.btn-block{width:100%;}

/* ============================================================================
   AUTH SHELL - login.php, signup.php, bind-account.php
   ============================================================================ */
.screen{
  width:100%; max-width:430px; margin:0 auto;
  min-height:100vh; min-height:100dvh;
  display:flex;flex-direction:column;background:var(--card);
  overflow:hidden;
}
.auth-body{
  margin:0;font-family:'Inter',sans-serif;
  min-height:100vh; min-height:100dvh;
  background:linear-gradient(160deg,var(--hero-1) 0%, var(--hero-2) 100%);
  display:flex; align-items:center; justify-content:center;
}
.pattern{position:absolute; inset:0;
  background-image:radial-gradient(circle at 20px 20px, var(--pattern-dot) 2px, transparent 2.5px);
  background-size:80px 90px;}
.hero{position:relative;background:linear-gradient(160deg,var(--hero-1) 0%, var(--hero-2) 100%);
  padding:calc(40px + env(safe-area-inset-top)) 24px 42px;overflow:hidden;}
.topbar{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;}
.icon-btn{width:36px;height:36px;border-radius:50%;background:var(--icon-back-bg);border:none;
  display:flex;align-items:center;justify-content:center;color:var(--icon-back-color);text-decoration:none;cursor:pointer;flex-shrink:0;}
.mark-row{display:flex;align-items:center;gap:9px;}
.brand-logo{height:34px;width:auto;display:block;}
.brand-admin-label{font-family:'Sora',sans-serif;font-weight:700;font-size:10.5px;color:var(--hero-text-muted);
  text-transform:uppercase;letter-spacing:0.06em;align-self:flex-end;margin-bottom:2px;}
.mark{width:28px;height:28px;border-radius:50%;background:var(--brand);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.mark .material-symbols-outlined{color:var(--mark-icon);font-size:16px;font-variation-settings:'FILL' 1;}
.wordmark{font-family:'Sora',sans-serif;font-weight:700;font-size:15px;color:var(--hero-text);}
.wordmark span{color:var(--amber);}
.hero h1{position:relative;z-index:2;font-family:'Sora',sans-serif;font-weight:700;font-size:25px;color:var(--hero-text);margin:30px 0 8px;}
.hero p{position:relative;z-index:2;color:var(--hero-text-muted);font-size:14.5px;margin:0;max-width:280px;line-height:1.5;}

.sheet{flex:1;background:var(--card);border-radius:26px 26px 0 0;margin-top:-20px;position:relative;z-index:3;
  padding:26px 24px calc(28px + env(safe-area-inset-bottom));display:flex;flex-direction:column;}

form{display:flex;flex-direction:column;gap:14px;}
.field label{display:block;font-size:13px;font-weight:600;color:var(--ink);margin-bottom:6px;}
.field .box{display:flex;align-items:center;gap:10px;background:var(--surface);border:1.5px solid var(--border);
  border-radius:13px;padding:12px 14px;}
.field .box:focus-within{border-color:var(--brand);}
.field .box .material-symbols-outlined{color:var(--muted);font-size:20px;}
.field input,.field select{border:none;outline:none;flex:1;font-family:'Inter',sans-serif;font-size:15px;color:var(--ink);background:transparent;width:100%;}
.field input::placeholder{color:#9FB8B6;}
.toggle-eye{cursor:pointer;color:var(--muted);}
.err{font-size:12.5px;color:var(--danger);margin-top:5px;}
.field.invalid .box{border-color:var(--danger);}
.hint{font-size:12.5px;color:var(--muted);margin-top:5px;}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.two-col .field{min-width:0;}
.two-col .field .box{min-width:0;}
.two-col .field input{min-width:0;}

.terms{display:flex;align-items:flex-start;gap:10px;margin-top:2px;}
.terms input{margin-top:3px;accent-color:var(--brand);width:16px;height:16px;flex-shrink:0;}
.terms label{font-size:13px;color:var(--muted);line-height:1.5;}
.terms a{color:var(--brand-dark);font-weight:600;text-decoration:none;}

.divider{display:flex;align-items:center;gap:10px;margin:22px 0 4px;color:#9FB8B6;font-size:12.5px;}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:var(--border);}

.link-row{text-align:center;font-size:14px;color:var(--muted);margin-top:14px;}
.link-row a{color:var(--brand-dark);font-weight:600;text-decoration:none;}

.support{margin-top:auto;padding-top:26px;display:flex;gap:10px;}
.support a{flex:1;display:flex;align-items:center;gap:8px;padding:12px;border-radius:12px;background:var(--surface);
  border:1px solid var(--border);text-decoration:none;color:var(--ink);font-size:12.5px;font-weight:600;}
.support .material-symbols-outlined{font-size:18px;color:var(--brand-dark);}

.alert{border-radius:13px;padding:12px 14px;font-size:13.5px;margin-bottom:4px;display:flex;align-items:flex-start;gap:8px;flex-wrap:nowrap;line-height:1.5;}
.alert>.material-symbols-outlined{flex-shrink:0;}
.alert>span:not(.material-symbols-outlined){flex:1;min-width:0;}
.alert .material-symbols-outlined{font-size:18px;flex-shrink:0;}
.alert-error{background:rgba(214,69,69,0.1);color:var(--danger);}
.alert-success{background:rgba(31,169,122,0.12);color:var(--success);}
.alert-info{background:rgba(20,184,166,0.1);color:var(--brand-dark);}

.verified-box{background:rgba(31,169,122,0.1);border:1.5px solid var(--success);border-radius:14px;padding:16px;text-align:center;}
.verified-box .material-symbols-outlined{font-size:32px;color:var(--success);}
.verified-name{font-family:'Sora',sans-serif;font-weight:700;font-size:16px;color:var(--ink);margin:8px 0 2px;}
.verified-sub{font-size:12.5px;color:var(--muted);}

@media (min-width:431px){
  .auth-body{padding:30px 20px;}
  .auth-body .screen{
    max-width:480px;
    min-height:0;
    height:min(920px, calc(100dvh - 60px));
    border-radius:36px;
    box-shadow:0 30px 80px rgba(0,0,0,0.4);
    overflow-y:auto; overflow-x:hidden;
  }
}

/* ============================================================================
   APP SHELL - dashboard.php, wallet.php, fund-wallet.php, referrals.php,
   transactions.php, admin/*
   ============================================================================ */
.nav{position:sticky;top:0;z-index:20;background:var(--glass-bg);
  backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);
  border-bottom:1px solid var(--glass-border);
  box-shadow:inset 0 1px 0 var(--glass-sheen), 0 8px 30px rgba(0,0,0,0.10);
  transition:background .3s ease;}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;padding-top:16px;padding-bottom:16px;}
.nav-left{display:flex;align-items:center;gap:12px;}
.app-shell .mark{width:34px;height:34px;box-shadow:0 0 0 4px rgba(20,184,166,0.15);}
.app-shell .mark .material-symbols-outlined{font-size:20px;}
.app-shell .wordmark{font-size:19px;letter-spacing:-0.02em;}
.nav-actions{display:flex;align-items:center;gap:14px;}
.theme-toggle{width:38px;height:38px;border-radius:50%;background:var(--toggle-bg);border:none;
  display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;position:relative;}
.theme-toggle .material-symbols-outlined{color:var(--toggle-icon);font-size:20px;}
.badge-dot{position:absolute;top:6px;right:7px;width:8px;height:8px;border-radius:50%;background:var(--amber);border:1.5px solid var(--page-bg);}

/* Bottom sheet picker - for short lists (networks, providers, discos) */
.sheet-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.5);opacity:0;pointer-events:none;
  transition:opacity .25s ease;z-index:49;}
.sheet-overlay.open{opacity:1;pointer-events:auto;}
.bottom-sheet{position:fixed;left:0;right:0;bottom:0;max-height:75vh;background:var(--card);
  border-radius:22px 22px 0 0;z-index:50;transform:translateY(100%);transition:transform .28s ease;
  display:flex;flex-direction:column;box-shadow:0 -20px 50px rgba(0,0,0,0.25);}
.bottom-sheet.open{transform:translateY(0);}
.bottom-sheet-handle{width:40px;height:4px;border-radius:2px;background:var(--border);margin:12px auto 4px;flex-shrink:0;}
.bottom-sheet-head{display:flex;align-items:center;justify-content:space-between;padding:8px 20px 12px;flex-shrink:0;}
.bottom-sheet-head h3{margin:0;font-family:'Sora',sans-serif;font-size:16px;color:var(--ink);}
.bottom-sheet-body{overflow-y:auto;padding-bottom:calc(16px + env(safe-area-inset-bottom));}
.sheet-option{display:flex;align-items:center;gap:14px;padding:15px 20px;color:var(--ink);font-size:15px;font-weight:600;}
.sheet-option+.sheet-option{border-top:1px solid var(--border);}
.sheet-option .material-symbols-outlined{color:var(--brand-dark);flex-shrink:0;}
.sheet-option.selected{background:rgba(20,184,166,0.08);color:var(--brand-dark);}
.sheet-option .check{margin-left:auto;color:var(--brand);display:none;}
.sheet-option.selected .check{display:block;}
.sheet-trigger{display:flex;align-items:center;width:100%;text-align:left;background:var(--surface);
  border:1.5px solid var(--border);border-radius:13px;padding:12px 14px;gap:10px;cursor:pointer;font-family:'Inter',sans-serif;font-size:15px;color:var(--ink);}
.sheet-trigger .material-symbols-outlined:first-child{color:var(--muted);}
.sheet-trigger .placeholder-text{color:#9FB8B6;}
.sheet-trigger .chev{margin-left:auto;color:var(--muted);}

.drawer-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.5);opacity:0;pointer-events:none;
  transition:opacity .25s ease;z-index:39;}
.drawer-overlay.open{opacity:1;pointer-events:auto;}
.drawer{position:fixed;top:0;left:0;bottom:0;width:280px;max-width:82%;background:var(--drawer-bg);
  z-index:40;transform:translateX(-100%);transition:transform .28s ease, background .3s ease;display:flex;flex-direction:column;
  padding:20px;box-shadow:20px 0 50px rgba(0,0,0,0.25);overflow-y:auto;}
.drawer.open{transform:translateX(0);}
.drawer-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;}
.drawer-head .wordmark{color:var(--drawer-text);}
.drawer-user{display:flex;align-items:center;gap:12px;padding:14px;background:var(--drawer-surface);
  border:1px solid var(--drawer-border);border-radius:14px;margin-bottom:20px;}
.drawer-name{font-family:'Sora',sans-serif;font-weight:700;font-size:14px;color:var(--drawer-text);}
.drawer-email{font-size:12px;color:var(--drawer-text-muted);}
.drawer-nav{display:flex;flex-direction:column;gap:4px;flex:1;}
.drawer-link{display:flex;align-items:center;gap:12px;padding:12px 10px;border-radius:12px;
  color:var(--drawer-text);font-size:14.5px;font-weight:600;}
.drawer-link .material-symbols-outlined{font-size:20px;color:var(--drawer-text-muted);}
.drawer-link.active{background:rgba(20,184,166,0.18);color:var(--brand);}
.drawer-link.active .material-symbols-outlined{color:var(--brand);}
.drawer-footer{border-top:1px solid var(--drawer-border);padding-top:12px;margin-top:12px;}
.drawer-link.logout{color:var(--danger);}
.drawer-link.logout .material-symbols-outlined{color:var(--danger);}
.drawer .theme-toggle{background:var(--drawer-surface);}
.drawer .theme-toggle .material-symbols-outlined{color:var(--drawer-text);}

main{padding:28px 0 60px;}

.page-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;}
.greeting h1{font-family:'Sora',sans-serif;font-weight:700;font-size:21px;margin:0 0 3px;color:var(--hero-text);}
.greeting p{margin:0;font-size:13.5px;color:var(--hero-text-muted);}
.avatar{width:42px;height:42px;border-radius:50%;background:var(--brand);color:#04211F;font-family:'Sora',sans-serif;
  font-weight:700;font-size:15px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}

.balance-card{position:relative;overflow:hidden;border-radius:24px;padding:26px 24px;margin-bottom:22px;
  background:linear-gradient(160deg,var(--hero-1) 0%, var(--hero-2) 100%);}
.balance-card .pattern{position:absolute;inset:0;
  background-image:radial-gradient(circle at 20px 20px, var(--pattern-dot) 2px, transparent 2.5px);background-size:80px 90px;}
.balance-top{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;}
.balance-label{font-size:13px;color:var(--hero-text-muted);}
.balance-eye{background:none;border:none;color:var(--hero-text-muted);cursor:pointer;display:flex;padding:4px;flex-shrink:0;}
.balance-amount-row{position:relative;z-index:2;display:flex;align-items:center;gap:10px;margin-bottom:20px;}
.balance-amount{font-family:'Sora',sans-serif;font-weight:800;font-size:34px;color:var(--hero-text);}
.balance-actions{position:relative;z-index:2;display:flex;gap:10px;}
.balance-actions .btn{flex:1;}

.balance-card-gold{background:linear-gradient(160deg,#3D2E0A 0%, #5C4310 100%);}
:root[data-theme="light"] .balance-card-gold{background:linear-gradient(160deg,#FFF3D9 0%, #FCE6B0 100%);}
.balance-card-gold .balance-label,.balance-card-gold .balance-amount,.balance-card-gold .stat-mini-label{color:var(--hero-text);}
:root[data-theme="light"] .balance-card-gold .balance-label{color:#7A5B0A;}
.stat-mini-row{position:relative;z-index:2;display:flex;gap:16px;margin-top:4px;}
.stat-mini{display:flex;align-items:baseline;gap:6px;}
.stat-mini-value{font-family:'Sora',sans-serif;font-weight:800;font-size:18px;color:var(--hero-text);}
.stat-mini-label{font-size:12px;color:var(--hero-text-muted);}

.section-label{font-family:'Sora',sans-serif;font-weight:700;font-size:15px;color:var(--hero-text);margin:0 0 14px;}
.quick-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:26px;}
.quick-action{display:flex;flex-direction:column;align-items:center;gap:8px;background:var(--card);
  border:1px solid var(--border);border-radius:16px;padding:16px 6px;color:var(--ink);}
.quick-action .qa-icon{width:42px;height:42px;border-radius:12px;background:rgba(11,46,48,0.08);
  display:flex;align-items:center;justify-content:center;}
.quick-action .qa-icon .material-symbols-outlined{color:var(--brand-dark);font-size:21px;}
.quick-action span.label{font-size:11.5px;font-weight:600;text-align:center;line-height:1.3;}

.stat-row{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:26px;}
.stat-card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:18px 20px;
  display:flex;align-items:center;gap:14px;}
.stat-card .stat-icon{width:40px;height:40px;border-radius:12px;background:rgba(11,46,48,0.08);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.stat-card .stat-icon .material-symbols-outlined{color:var(--brand-dark);font-size:20px;}
.stat-card .stat-value{font-family:'Sora',sans-serif;font-weight:700;font-size:18px;color:var(--ink);}
.stat-card .stat-name{font-size:12.5px;color:var(--muted);}

.card{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:20px;margin-bottom:22px;}
.card h3{font-family:'Sora',sans-serif;font-size:15.5px;margin:0 0 6px;color:var(--ink);}
.card p.desc{font-size:13.5px;color:var(--muted);line-height:1.6;margin:0 0 16px;}

.chart-card{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:20px 16px 8px;margin-bottom:22px;}
.chart-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px;padding:0 4px;}
.chart-card-head h3{font-family:'Sora',sans-serif;font-size:15.5px;margin:0;color:var(--ink);}
.chart-canvas-wrap{position:relative;height:180px;margin-top:8px;}

.announce-banner{display:flex;align-items:center;gap:12px;border-radius:16px;padding:14px 16px;margin-bottom:14px;}
.announce-banner .material-symbols-outlined{flex-shrink:0;font-size:22px;}
.announce-banner-text{flex:1;min-width:0;}
.announce-banner-title{font-family:'Sora',sans-serif;font-weight:700;font-size:13.5px;margin:0 0 2px;}
.announce-banner-msg{font-size:12.5px;margin:0;opacity:0.9;}
.announce-banner-link{font-size:12.5px;font-weight:700;flex-shrink:0;white-space:nowrap;}
.announce-info{background:rgba(20,184,166,0.12);color:var(--brand-dark);}
.announce-success{background:rgba(31,169,122,0.12);color:var(--success);}
.announce-warning{background:rgba(245,166,35,0.14);color:var(--amber);}
.announce-important{background:rgba(214,69,69,0.12);color:var(--danger);}
.announce-maintenance{background:rgba(107,136,134,0.14);color:var(--muted);}

.txn-card{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:8px 20px;margin-bottom:26px;}
.txn-row{display:flex;align-items:center;gap:14px;padding:16px 0;}
.txn-row + .txn-row{border-top:1px solid var(--border);}
.txn-icon{width:40px;height:40px;border-radius:50%;background:rgba(11,46,48,0.08);display:flex;
  align-items:center;justify-content:center;flex-shrink:0;}
.txn-icon .material-symbols-outlined{color:var(--brand-dark);font-size:19px;}
.txn-info{flex:1;min-width:0;}
.txn-title{font-family:'Sora',sans-serif;font-weight:600;font-size:14px;color:var(--ink);margin:0 0 2px;}
.txn-date{font-size:12px;color:var(--muted);}
.txn-right{text-align:right;flex-shrink:0;}
.txn-amount{font-family:'Sora',sans-serif;font-weight:700;font-size:14px;}
.txn-amount.debit{color:var(--ink);}
.txn-amount.credit{color:var(--success);}
.txn-status{font-size:11px;margin-top:2px;}
.txn-status.pending{color:var(--amber);}
.txn-status.successful,.txn-status.approved,.txn-status.paid{color:var(--success);}
.txn-status.rejected,.txn-status.failed{color:var(--danger);}
.empty-state{text-align:center;padding:30px 10px;color:var(--muted);font-size:13.5px;}

.tabs{display:flex;gap:8px;margin-bottom:18px;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:4px;}
.tab{flex:1;text-align:center;padding:10px;border-radius:11px;font-size:13.5px;font-weight:600;color:var(--muted);cursor:pointer;border:none;background:none;font-family:'Inter',sans-serif;}
.tab.active{background:var(--brand);color:#04211F;}

.pill{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:100px;font-size:11.5px;font-weight:700;}
.pill-free{background:rgba(92,122,122,0.15);color:var(--muted);}
.pill-premium{background:rgba(245,166,35,0.15);color:var(--amber);}
.pill-pending{background:rgba(245,166,35,0.15);color:var(--amber);}
.pill-verified{background:rgba(31,169,122,0.15);color:var(--success);}
.pill-active{background:rgba(31,169,122,0.15);color:var(--success);}
.pill-suspended,.pill-banned{background:rgba(214,69,69,0.15);color:var(--danger);}

.list-item{display:flex;align-items:center;gap:14px;padding:14px 16px;color:var(--ink);font-size:14.5px;font-weight:600;}
.list-item+.list-item{border-top:1px solid var(--border);}
.list-item .material-symbols-outlined{color:var(--brand-dark);font-size:20px;flex-shrink:0;}

.copy-box{display:flex;align-items:center;gap:10px;background:var(--surface);border:1.5px dashed var(--border);
  border-radius:13px;padding:13px 14px;}
.copy-box span.code{flex:1;font-family:'Sora',sans-serif;font-weight:700;font-size:15px;color:var(--ink);word-break:break-all;}
.copy-box button{background:none;border:none;color:var(--brand-dark);cursor:pointer;display:flex;flex-shrink:0;}

footer.site-footer{border-top:1px solid var(--border);padding:22px 0;text-align:center;}
footer.site-footer p{font-size:13px;color:var(--hero-text-muted);margin:0;}

/* Floating support button (FAB) */
.fab{position:fixed;bottom:22px;right:22px;width:56px;height:56px;border-radius:50%;background:var(--brand);
  color:#04211F;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 26px rgba(0,0,0,0.28);
  z-index:30;border:none;cursor:pointer;}
.fab .material-symbols-outlined{font-size:26px;}
.fab:focus-visible{outline:2px solid var(--brand-dark);outline-offset:3px;}

@media (min-width:900px){
  .stat-row{grid-template-columns:repeat(3,1fr);}
}

/* ============================================================================
   ADMIN specific tweaks (reuses the app shell above)
   ============================================================================ */
.admin-table{width:100%;border-collapse:collapse;font-size:13.5px;}
.admin-table th{text-align:left;font-family:'Sora',sans-serif;font-size:12px;text-transform:uppercase;
  letter-spacing:.04em;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--border);}
.admin-table td{padding:12px;border-bottom:1px solid var(--border);color:var(--ink);vertical-align:middle;}
.admin-table tr:last-child td{border-bottom:none;}
.table-scroll{overflow-x:auto;}
.admin-grid{display:grid;grid-template-columns:1fr;gap:14px;margin-bottom:22px;}
.small-btn{padding:8px 14px;font-size:13px;border-radius:10px;}
.form-inline{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}

@media (min-width:900px){
  .admin-grid{grid-template-columns:repeat(4,1fr);}
}