/* ═══════════════════════════════════════════════════════
   FLY HIGH ENTERTAINMENT — ADMIN DASHBOARD
   Amber Gold × Jet Black × Platinum Silver
   Inspired by the FH logo: warm amber F, silver H, airplane
   ═══════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700;800&family=DM+Sans:wght@300;400;500;600&display=swap');

:root {
  /* ── Logo-matched palette ── */
  --amber:       #D4A827;   /* exact F letter gold */
  --amber-bright:#F0C842;   /* highlight / hover */
  --amber-pale:  #FBE89A;   /* very light tint */
  --amber-deep:  #9B7519;   /* deep shadow gold */
  --amber-muted: rgba(212,168,39,0.13);
  --amber-glow:  rgba(212,168,39,0.22);
  --amber-border:rgba(212,168,39,0.28);
  --amber-border-h:rgba(212,168,39,0.55);

  --silver:      #C8C8CC;   /* H letter platinum */
  --silver-bright:#E8E8EC;
  --silver-muted:rgba(200,200,204,0.15);

  /* ── Backgrounds ── */
  --ink:         #0A0A08;   /* logo black */
  --ink1:        #111110;
  --ink2:        #181816;
  --ink3:        #1E1E1C;
  --ink4:        #252523;
  --ink5:        #2E2E2B;

  /* ── Text ── */
  --text:        #F2EDD8;   /* warm white */
  --text-muted:  #8A8472;
  --text-dim:    #4A4840;

  /* ── Semantic ── */
  --green:       #4CAF6E;
  --red:         #E05252;
  --blue:        #5B8FD4;
  --orange:      #E08C2A;

  /* ── Layout ── */
  --sidebar-w:   252px;
  --topbar-h:    64px;
  --nav-h:       64px;
  --radius:      10px;
  --radius-lg:   16px;
  --radius-xl:   22px;
  --ease:        cubic-bezier(.4,0,.2,1);
  --transition:  all 0.22s var(--ease);

  /* ── Fonts ── */
  --font-display: 'Playfair Display', Georgia, serif;
  --font-body:    'DM Sans', system-ui, sans-serif;

  /* ── Legacy aliases (backward compat) ── */
  --gold:            var(--amber-bright);
  --gold-light:      var(--amber-bright);
  --gold-dark:       var(--amber-deep);
  --gold-muted:      var(--amber-muted);
  --gold-border:     var(--amber-border);
  --gold-border-h:   var(--amber-border-h);
  --gold-border-hover:var(--amber-border-h);
  --gold-pale:       var(--amber-pale);
  --silver-light:    var(--silver-bright);
  --dark:            var(--ink1);
  --dark2:           var(--ink2);
  --dark3:           var(--ink3);
  --dark4:           var(--ink4);
  --black:           var(--ink);
  --text-dim:        #4A4840;
  --info:            var(--blue);
  --danger:          var(--red);
  --success:         var(--green);
  --warning:         var(--orange);
}

/* ═══ RESET ═══ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:var(--font-body);background:var(--ink);color:var(--text);min-height:100vh;font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased;}
a{color:var(--amber);text-decoration:none;transition:var(--transition);}
a:hover{color:var(--amber-bright);}
img{max-width:100%;}
::-webkit-scrollbar{width:4px;height:4px;}
::-webkit-scrollbar-track{background:var(--ink1);}
::-webkit-scrollbar-thumb{background:var(--amber-deep);border-radius:4px;}
button{font-family:var(--font-body);}

/* ═══ LAYOUT ═══ */
.app-layout{display:flex;min-height:100vh;}
.main-wrap{flex:1;margin-left:var(--sidebar-w);display:flex;flex-direction:column;min-height:100vh;}

/* ═══ SIDEBAR ═══ */
.sidebar{
  width:var(--sidebar-w);
  background:var(--ink1);
  border-right:1px solid var(--amber-border);
  position:fixed;top:0;left:0;height:100vh;
  overflow-y:auto;overflow-x:hidden;
  display:flex;flex-direction:column;
  z-index:200;
  transition:transform 0.3s var(--ease);
  scrollbar-width:thin;
  scrollbar-color:var(--amber-deep) var(--ink1);
}

/* Sidebar glow strip */
.sidebar::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--amber-deep),var(--amber-bright),var(--amber-deep));
}

.sidebar-logo{
  padding:22px 18px 18px;
  border-bottom:1px solid var(--amber-border);
  display:flex;align-items:center;gap:12px;flex-shrink:0;
  background:linear-gradient(135deg,var(--ink2),var(--ink1));
}
.logo-img{width:52px;height:52px;object-fit:contain;flex-shrink:0;}
.logo-text-wrap{overflow:hidden;}
.logo-name{
  font-family:var(--font-display);
  font-size:15px;color:var(--amber);
  letter-spacing:2.5px;white-space:nowrap;
  text-shadow:0 0 20px rgba(212,168,39,.4);
}
.logo-sub{font-size:8.5px;color:var(--silver);letter-spacing:3.5px;margin-top:2px;white-space:nowrap;}

.sidebar-nav{flex:1;padding:14px 0;}
.nav-section{
  padding:14px 18px 5px;
  font-size:9px;color:var(--text-dim);
  letter-spacing:2.5px;text-transform:uppercase;white-space:nowrap;
  font-weight:600;
}
.nav-item{
  display:flex;align-items:center;gap:11px;
  padding:11px 18px;
  color:var(--text-muted);font-size:13px;font-weight:500;
  transition:var(--transition);
  border-left:3px solid transparent;
  white-space:nowrap;cursor:pointer;position:relative;
}
.nav-item:hover{color:var(--amber-bright);background:var(--amber-muted);padding-left:22px;}
.nav-item.active{
  color:var(--amber-bright);
  border-left-color:var(--amber);
  background:linear-gradient(90deg,rgba(212,168,39,0.18),transparent);
  font-weight:600;
}
.nav-item.active::after{
  content:'';position:absolute;right:0;top:20%;bottom:20%;
  width:2px;background:var(--amber);border-radius:2px 0 0 2px;opacity:.4;
}
.nav-icon{font-size:16px;width:20px;text-align:center;flex-shrink:0;}
.nav-label{flex:1;}
.nav-badge{
  background:var(--red);color:white;font-size:9px;
  min-width:17px;height:17px;border-radius:9px;
  display:flex;align-items:center;justify-content:center;padding:0 4px;
}

.sidebar-footer{padding:14px 18px;border-top:1px solid var(--amber-border);flex-shrink:0;}
.sidebar-user{display:flex;align-items:center;gap:10px;}
.user-avatar-sm{
  width:36px;height:36px;border-radius:50%;
  background:linear-gradient(135deg,var(--amber-bright),var(--amber-deep));
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;color:#000;flex-shrink:0;
  font-family:var(--font-display);
  box-shadow:0 0 12px rgba(212,168,39,.3);
}
.user-meta{flex:1;overflow:hidden;}
.user-name-sm{font-size:12px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.user-role-sm{font-size:10px;color:var(--amber);letter-spacing:1px;text-transform:uppercase;}
.logout-btn{background:none;border:none;color:var(--text-dim);cursor:pointer;font-size:17px;padding:4px;transition:var(--transition);}
.logout-btn:hover{color:var(--red);}

/* ═══ TOPBAR ═══ */
.topbar{
  height:var(--topbar-h);
  background:rgba(17,17,16,0.95);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--amber-border);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 28px;
  position:sticky;top:0;z-index:100;
}
.topbar-left{display:flex;align-items:center;gap:16px;}
.sidebar-toggle{background:none;border:none;color:var(--text-muted);font-size:22px;cursor:pointer;display:none;padding:4px;transition:var(--transition);}
.sidebar-toggle:hover{color:var(--amber);}
.page-heading{
  font-family:var(--font-display);
  font-size:19px;color:var(--amber-bright);
  font-weight:600;letter-spacing:.5px;
}
.topbar-right{display:flex;align-items:center;gap:14px;}
.member-id-display{
  font-size:11px;color:var(--text-muted);
  background:var(--ink3);padding:5px 12px;
  border-radius:20px;border:1px solid var(--amber-border);
  font-family:monospace;letter-spacing:.5px;
}
.role-pill{
  background:var(--amber-muted);
  border:1px solid var(--amber-border-h);
  border-radius:20px;padding:4px 14px;
  font-size:10px;color:var(--amber-bright);
  letter-spacing:1.5px;font-weight:700;text-transform:uppercase;
}
.notif-bell{position:relative;cursor:pointer;font-size:19px;padding:6px;color:var(--text-muted);transition:var(--transition);border-radius:8px;}
.notif-bell:hover{color:var(--amber);background:var(--amber-muted);}
.notif-count{
  position:absolute;top:-2px;right:-2px;
  background:var(--red);color:white;
  font-size:9px;min-width:16px;height:16px;
  border-radius:8px;display:flex;align-items:center;justify-content:center;
  border:2px solid var(--ink1);
}

/* ═══ ANNOUNCEMENT ═══ */
.announcement-bar{
  background:linear-gradient(90deg,rgba(212,168,39,0.12),rgba(240,200,66,0.07),rgba(212,168,39,0.12));
  border-bottom:1px solid var(--amber-border);
  padding:10px 28px;
  display:flex;align-items:center;gap:10px;
  font-size:13px;color:var(--text-muted);
}
.ann-icon{font-size:15px;}
.ann-close{background:none;border:none;color:var(--text-dim);cursor:pointer;font-size:17px;margin-left:auto;transition:var(--transition);}
.ann-close:hover{color:var(--red);}

/* ═══ NOTIFICATION PANEL ═══ */
.notif-panel{
  position:fixed;top:var(--topbar-h);right:16px;
  width:340px;
  background:var(--ink2);
  border:1px solid var(--amber-border-h);
  border-radius:var(--radius-lg);z-index:300;
  box-shadow:0 12px 40px rgba(0,0,0,.6),0 0 0 1px var(--amber-border);
  max-height:460px;overflow-y:auto;
}
.notif-panel-header{
  padding:14px 18px;border-bottom:1px solid var(--amber-border);
  display:flex;align-items:center;justify-content:space-between;
  position:sticky;top:0;background:var(--ink2);z-index:1;
  font-family:var(--font-display);font-size:14px;color:var(--amber);
}
.notif-item{padding:13px 18px;border-bottom:1px solid rgba(255,255,255,.04);transition:var(--transition);}
.notif-item:hover{background:var(--amber-muted);}
.notif-item.unread{border-left:3px solid var(--amber);}
.notif-title{font-size:13px;font-weight:600;color:var(--text);margin-bottom:3px;}
.notif-msg{font-size:12px;color:var(--text-muted);}
.notif-time{font-size:11px;color:var(--text-dim);margin-top:4px;}
.notif-empty{padding:32px;text-align:center;color:var(--text-muted);font-size:13px;}

/* ═══ PAGE CONTENT ═══ */
.page-content{flex:1;padding:26px 28px;}

/* ═══ STAT CARDS ═══ */
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:24px;}
.stat-grid-3{grid-template-columns:repeat(3,1fr);}
.stat-grid-2{grid-template-columns:repeat(2,1fr);}

.stat-card{
  background:var(--ink2);
  border:1px solid var(--amber-border);
  border-radius:var(--radius-lg);
  padding:22px 20px;
  position:relative;overflow:hidden;
  transition:var(--transition);
  cursor:default;
}
.stat-card:hover{border-color:var(--amber-border-h);transform:translateY(-2px);box-shadow:0 8px 30px rgba(0,0,0,.35);}
.stat-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;}
.stat-card.c-gold::before{background:linear-gradient(90deg,var(--amber-deep),var(--amber-bright));}
.stat-card.c-silver::before{background:linear-gradient(90deg,#666,var(--silver-bright));}
.stat-card.c-green::before{background:linear-gradient(90deg,#1a5c35,var(--green));}
.stat-card.c-blue::before{background:linear-gradient(90deg,#1a3a6c,var(--blue));}
.stat-card.c-red::before{background:linear-gradient(90deg,#6c1a1a,var(--red));}
.stat-card.c-orange::before{background:linear-gradient(90deg,#6c3a1a,var(--orange));}

.stat-card::after{
  content:'';position:absolute;bottom:-30px;right:-30px;
  width:100px;height:100px;border-radius:50%;
  opacity:.04;
}
.stat-card.c-gold::after{background:var(--amber-bright);}
.stat-card.c-green::after{background:var(--green);}
.stat-card.c-blue::after{background:var(--blue);}

.stat-label{font-size:10.5px;color:var(--text-muted);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:10px;font-weight:500;}
.stat-value{font-family:var(--font-display);font-size:27px;font-weight:700;letter-spacing:-0.5px;}
.stat-card.c-gold .stat-value{color:var(--amber-bright);}
.stat-card.c-silver .stat-value{color:var(--silver-bright);}
.stat-card.c-green .stat-value{color:var(--green);}
.stat-card.c-blue .stat-value{color:var(--blue);}
.stat-card.c-red .stat-value{color:var(--red);}
.stat-card.c-orange .stat-value{color:var(--orange);}
.stat-change{font-size:11px;color:var(--text-muted);margin-top:6px;}
.stat-change.up{color:var(--green);}
.stat-change.down{color:var(--red);}
.stat-icon{position:absolute;right:18px;top:50%;transform:translateY(-50%);font-size:42px;opacity:.07;pointer-events:none;}

/* ═══ CARDS ═══ */
.card{
  background:var(--ink2);
  border:1px solid var(--amber-border);
  border-radius:var(--radius-lg);
  margin-bottom:22px;overflow:hidden;
}
.card-header{
  padding:16px 22px;
  border-bottom:1px solid var(--amber-border);
  display:flex;align-items:center;justify-content:space-between;
  gap:12px;flex-wrap:wrap;
  background:linear-gradient(90deg,rgba(212,168,39,0.06),transparent);
}
.card-title{font-family:var(--font-display);font-size:14px;color:var(--amber-bright);font-weight:600;}
.card-body{padding:22px;}
.card-body.p-0{padding:0;}

/* ═══ GRID ═══ */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:22px;}
.grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:22px;}
.grid-2-1{display:grid;grid-template-columns:2fr 1fr;gap:22px;}
.grid-1-2{display:grid;grid-template-columns:1fr 2fr;gap:22px;}

/* ═══ TABLES ═══ */
.table-wrap{overflow-x:auto;}
table{width:100%;border-collapse:collapse;font-size:13px;min-width:500px;}
thead th{
  padding:11px 16px;text-align:left;
  font-size:10px;color:var(--text-dim);
  letter-spacing:1.8px;text-transform:uppercase;
  border-bottom:1px solid var(--amber-border);
  font-weight:600;white-space:nowrap;
  background:var(--ink3);
}
tbody td{padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.04);color:var(--text);vertical-align:middle;}
tbody tr:hover td{background:rgba(212,168,39,.04);}
tbody tr:last-child td{border-bottom:none;}
.td-muted{color:var(--text-muted)!important;font-size:12px;}
.td-gold{color:var(--amber-bright)!important;font-weight:600;}
.td-green{color:var(--green)!important;font-weight:600;}
.td-red{color:var(--red)!important;}

/* ═══ BADGES ═══ */
.badge{display:inline-flex;align-items:center;padding:3px 10px;border-radius:20px;font-size:10.5px;font-weight:600;letter-spacing:.5px;white-space:nowrap;}
.badge-success{background:rgba(76,175,110,.14);color:var(--green);border:1px solid rgba(76,175,110,.28);}
.badge-danger{background:rgba(224,82,82,.14);color:var(--red);border:1px solid rgba(224,82,82,.28);}
.badge-warning{background:rgba(224,140,42,.14);color:var(--orange);border:1px solid rgba(224,140,42,.28);}
.badge-info{background:rgba(91,143,212,.14);color:var(--blue);border:1px solid rgba(91,143,212,.28);}
.badge-gold{background:var(--amber-muted);color:var(--amber-bright);border:1px solid var(--amber-border-h);}
.badge-silver{background:var(--silver-muted);color:var(--silver-bright);border:1px solid rgba(200,200,204,.3);}

/* ═══ BUTTONS ═══ */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:9px 20px;border-radius:8px;border:none;cursor:pointer;
  font-size:13px;font-family:var(--font-body);font-weight:600;
  transition:var(--transition);letter-spacing:.3px;white-space:nowrap;
}
.btn:disabled{opacity:.5;cursor:not-allowed;}
.btn-gold{
  background:linear-gradient(135deg,var(--amber-bright),var(--amber-deep));
  color:#000;
  box-shadow:0 2px 12px rgba(212,168,39,.25);
}
.btn-gold:hover{
  background:linear-gradient(135deg,var(--amber-pale),var(--amber));
  transform:translateY(-1px);
  box-shadow:0 6px 20px rgba(212,168,39,.4);
  color:#000;
}
.btn-outline{background:transparent;border:1px solid var(--amber-border-h);color:var(--amber);}
.btn-outline:hover{background:var(--amber-muted);border-color:var(--amber);}
.btn-sm{padding:5px 12px;font-size:12px;}
.btn-xs{padding:3px 8px;font-size:11px;}
.btn-danger{background:rgba(224,82,82,.18);border:1px solid rgba(224,82,82,.4);color:var(--red);}
.btn-danger:hover{background:rgba(224,82,82,.3);}
.btn-success{background:rgba(76,175,110,.18);border:1px solid rgba(76,175,110,.4);color:var(--green);}
.btn-success:hover{background:rgba(76,175,110,.3);}
.btn-info{background:rgba(91,143,212,.18);border:1px solid rgba(91,143,212,.4);color:var(--blue);}
.btn-block{width:100%;}
.btn-group{display:flex;gap:8px;flex-wrap:wrap;}

/* ═══ FORMS ═══ */
.form-group{margin-bottom:16px;}
.form-label{display:block;font-size:11.5px;color:var(--text-muted);margin-bottom:6px;letter-spacing:.5px;font-weight:500;text-transform:uppercase;}
.form-control{
  width:100%;background:var(--ink3);
  border:1px solid var(--amber-border);
  border-radius:8px;padding:10px 14px;
  color:var(--text);font-size:13px;font-family:var(--font-body);
  outline:none;transition:var(--transition);
}
.form-control:focus{border-color:var(--amber);box-shadow:0 0 0 3px rgba(212,168,39,.12);}
.form-control::placeholder{color:var(--text-dim);}
.form-control:disabled{opacity:.5;cursor:not-allowed;}
select.form-control{cursor:pointer;}
select.form-control option{background:var(--ink3);color:var(--text);}
textarea.form-control{resize:vertical;min-height:80px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.form-row-3{grid-template-columns:1fr 1fr 1fr;}
.form-hint{font-size:11px;color:var(--text-dim);margin-top:4px;}
.form-error{font-size:12px;color:var(--red);margin-top:4px;}

/* ═══ ALERTS ═══ */
.alert{padding:12px 16px;border-radius:10px;font-size:13px;margin-bottom:16px;display:flex;align-items:flex-start;gap:10px;}
.alert-success{background:rgba(76,175,110,.1);border:1px solid rgba(76,175,110,.3);color:var(--green);}
.alert-danger{background:rgba(224,82,82,.1);border:1px solid rgba(224,82,82,.3);color:var(--red);}
.alert-warning{background:rgba(224,140,42,.1);border:1px solid rgba(224,140,42,.3);color:var(--orange);}
.alert-info{background:rgba(91,143,212,.1);border:1px solid rgba(91,143,212,.3);color:var(--blue);}
.alert-gold{background:var(--amber-muted);border:1px solid var(--amber-border-h);color:var(--amber-bright);}
.alert .alert-icon{font-size:15px;flex-shrink:0;margin-top:1px;}

/* ═══ PROGRESS ═══ */
.progress{background:var(--ink4);border-radius:10px;overflow:hidden;}
.progress-sm{height:5px;}.progress-md{height:8px;}.progress-lg{height:12px;}
.progress-bar{height:100%;background:linear-gradient(90deg,var(--amber-deep),var(--amber-bright));border-radius:10px;transition:width .5s var(--ease);}
.progress-bar.silver{background:linear-gradient(90deg,var(--silver),var(--silver-bright));}
.progress-bar.green{background:linear-gradient(90deg,#1a5c35,var(--green));}
.progress-bar.blue{background:linear-gradient(90deg,#1a3a6c,var(--blue));}

/* ═══ TOGGLE SWITCH ═══ */
.switch{position:relative;display:inline-block;width:44px;height:24px;flex-shrink:0;}
.switch input{opacity:0;width:0;height:0;}
.switch-slider{position:absolute;inset:0;background:var(--ink4);border-radius:24px;cursor:pointer;border:1px solid var(--amber-border);transition:.3s;}
.switch-slider::before{content:'';position:absolute;width:18px;height:18px;left:2px;bottom:2px;background:var(--text-muted);border-radius:50%;transition:.3s;}
.switch input:checked + .switch-slider{background:rgba(212,168,39,.2);border-color:var(--amber);}
.switch input:checked + .switch-slider::before{transform:translateX(20px);background:var(--amber-bright);}
.toggle-row{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid var(--amber-border);}
.toggle-row:last-child{border-bottom:none;}
.toggle-label{font-size:13px;font-weight:500;}
.toggle-desc{font-size:11px;color:var(--text-muted);margin-top:2px;}

/* ═══ TABS ═══ */
.tabs{display:flex;border-bottom:1px solid var(--amber-border);margin-bottom:22px;overflow-x:auto;gap:2px;}
.tab-item{padding:11px 20px;font-size:13px;color:var(--text-muted);cursor:pointer;border-bottom:2px solid transparent;transition:var(--transition);white-space:nowrap;font-weight:500;}
.tab-item:hover{color:var(--text);}
.tab-item.active{color:var(--amber-bright);border-bottom-color:var(--amber);}
.tab-content{display:none;}
.tab-content.active{display:block;}

/* ═══ MLM TREE ═══ */
.tree-container{overflow-x:auto;padding:24px 10px;}
.tree-node{display:flex;flex-direction:column;align-items:center;}
.tree-children{display:flex;gap:18px;position:relative;padding-top:28px;}
.tree-children::before{content:'';position:absolute;top:0;left:50%;transform:translateX(-50%);width:2px;height:28px;background:var(--amber-border-h);}
.tree-connector{width:2px;height:28px;background:var(--amber-border-h);margin:0 auto;}
.tree-box{
  background:var(--ink3);border:1px solid var(--amber-border);border-radius:14px;
  padding:13px 16px;text-align:center;min-width:115px;cursor:pointer;transition:var(--transition);
}
.tree-box:hover{border-color:var(--amber);transform:translateY(-2px);box-shadow:0 8px 24px rgba(212,168,39,.15);}
.tree-box.root{border-color:var(--amber);background:linear-gradient(135deg,rgba(212,168,39,.18),rgba(212,168,39,.06));}
.tree-avatar{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#000;margin:0 auto 6px;}
.tree-name{font-size:11px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100px;}
.tree-mid{font-size:10px;color:var(--text-muted);margin:2px 0;}
.tree-earn{font-size:11px;color:var(--amber-bright);}

/* ═══ WALLET CARDS ═══ */
.wallet-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:26px;}
.wallet-card{
  background:var(--ink2);border:1px solid var(--amber-border);
  border-radius:var(--radius-lg);padding:26px;text-align:center;
  transition:var(--transition);position:relative;overflow:hidden;
}
.wallet-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--amber-deep),var(--amber-bright),var(--amber-deep));}
.wallet-card:hover{border-color:var(--amber-border-h);transform:translateY(-3px);box-shadow:0 10px 32px rgba(0,0,0,.4);}
.wallet-amount{font-family:var(--font-display);font-size:28px;color:var(--amber-bright);margin:10px 0;font-weight:700;}
.wallet-amount.silver{color:var(--silver-bright);}
.wallet-amount.green{color:var(--green);}
.wallet-amount.blue{color:var(--blue);}
.wallet-label{font-size:10.5px;color:var(--text-muted);letter-spacing:1.5px;text-transform:uppercase;font-weight:500;}
.wallet-sub{font-size:12px;color:var(--text-dim);margin-top:5px;}

/* ═══ COMMISSION LEVELS ═══ */
.level-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:13px;}
.level-card{
  background:var(--ink3);border:1px solid var(--amber-border);
  border-radius:var(--radius);padding:18px 12px;text-align:center;
  transition:var(--transition);
}
.level-card:hover{border-color:var(--amber);box-shadow:0 4px 16px rgba(212,168,39,.15);}
.level-card.inactive{opacity:.35;}
.level-num{font-family:var(--font-display);font-size:22px;color:var(--amber-bright);}
.level-amount{font-size:21px;font-weight:700;color:var(--amber-pale);margin:4px 0;}
.level-label{font-size:10px;color:var(--text-muted);letter-spacing:1px;text-transform:uppercase;}

/* ═══ QR SECTION ═══ */
.qr-section{text-align:center;padding:26px;}
.qr-box{display:inline-block;background:white;padding:16px;border-radius:14px;margin-bottom:16px;box-shadow:0 8px 32px rgba(0,0,0,.5);}
.qr-amount{font-family:var(--font-display);font-size:34px;color:var(--amber-bright);margin-bottom:6px;font-weight:700;}

/* ═══ REFERRAL BOX ═══ */
.ref-box{
  background:var(--ink3);border:1px solid var(--amber-border);
  border-radius:10px;padding:13px 16px;display:flex;align-items:center;gap:12px;
}
.ref-link{flex:1;font-size:12px;color:var(--amber-bright);word-break:break-all;}

/* ═══ REVENUE SPLIT ═══ */
.split-bar{display:flex;height:26px;border-radius:13px;overflow:hidden;gap:1px;}
.split-seg{display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;}

/* ═══ FILTERS ═══ */
.filters{display:flex;gap:12px;align-items:center;margin-bottom:20px;flex-wrap:wrap;}
.filters .form-control{width:auto;min-width:140px;}

/* ═══ PAGINATION ═══ */
.pagination{display:flex;gap:6px;align-items:center;justify-content:center;padding:18px 0;}
.page-btn{
  background:var(--ink3);border:1px solid var(--amber-border);
  color:var(--text-muted);padding:7px 13px;border-radius:7px;
  cursor:pointer;font-size:13px;transition:var(--transition);font-family:var(--font-body);
}
.page-btn:hover,.page-btn.active{background:var(--amber-muted);border-color:var(--amber);color:var(--amber-bright);}
.page-info{font-size:12px;color:var(--text-muted);}

/* ═══ MODAL ═══ */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:500;display:none;align-items:center;justify-content:center;padding:16px;backdrop-filter:blur(4px);}
.modal-overlay.open{display:flex;}
.modal{background:var(--ink2);border:1px solid var(--amber-border-h);border-radius:var(--radius-xl);width:100%;max-width:520px;max-height:90vh;overflow-y:auto;box-shadow:0 24px 80px rgba(0,0,0,.7),0 0 0 1px var(--amber-border);}
.modal-lg{max-width:720px;}
.modal-header{padding:20px 24px;border-bottom:1px solid var(--amber-border);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:var(--ink2);z-index:1;background:linear-gradient(90deg,rgba(212,168,39,.08),var(--ink2));}
.modal-title{font-family:var(--font-display);font-size:16px;color:var(--amber-bright);}
.modal-close{background:none;border:none;color:var(--text-muted);font-size:22px;cursor:pointer;line-height:1;transition:var(--transition);}
.modal-close:hover{color:var(--red);}
.modal-body{padding:24px;}
.modal-footer{padding:18px 24px;border-top:1px solid var(--amber-border);display:flex;gap:10px;justify-content:flex-end;}

/* ═══ BAR CHART ═══ */
.bar-chart{display:flex;align-items:flex-end;gap:6px;height:80px;}
.bar{flex:1;background:linear-gradient(to top,var(--amber-deep),var(--amber-bright));border-radius:4px 4px 0 0;transition:.3s;min-height:4px;cursor:default;}
.bar:hover{opacity:.8;}
.chart-labels{display:flex;gap:6px;margin-top:6px;}
.chart-labels span{flex:1;text-align:center;font-size:10px;color:var(--text-dim);}

/* ═══ AUTH PAGES ═══ */
.auth-wrap{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:var(--ink);padding:20px;position:relative;overflow:hidden;
}
.auth-bg-glow{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse at 30% 30%,rgba(212,168,39,.1) 0%,transparent 50%),
    radial-gradient(ellipse at 70% 70%,rgba(200,200,204,.04) 0%,transparent 50%);
}
/* Diagonal grid like logo swoosh */
.auth-wrap::before{
  content:'';position:absolute;inset:0;
  background-image:
    linear-gradient(135deg,rgba(212,168,39,.04) 1px,transparent 1px),
    linear-gradient(45deg,rgba(212,168,39,.02) 1px,transparent 1px);
  background-size:60px 60px;
}
.auth-card{
  background:var(--ink2);
  border:1px solid var(--amber-border-h);
  border-radius:var(--radius-xl);
  padding:42px 38px;
  width:100%;max-width:440px;
  position:relative;z-index:1;
  box-shadow:0 32px 80px rgba(0,0,0,.6),0 0 0 1px rgba(212,168,39,.1);
}
.auth-logo{text-align:center;margin-bottom:32px;}
.auth-logo-img{width:88px;height:88px;object-fit:contain;margin:0 auto 12px;filter:drop-shadow(0 0 20px rgba(212,168,39,.4));}
.auth-title{font-family:var(--font-display);font-size:24px;color:var(--amber-bright);margin-bottom:4px;text-shadow:0 0 30px rgba(212,168,39,.3);}
.auth-subtitle{font-size:13px;color:var(--text-muted);}
.auth-divider{text-align:center;color:var(--text-dim);font-size:12px;margin:18px 0;position:relative;}
.auth-divider::before,.auth-divider::after{content:'';position:absolute;top:50%;width:40%;height:1px;background:var(--amber-border);}
.auth-divider::before{left:0;}.auth-divider::after{right:0;}
.auth-footer-link{text-align:center;font-size:13px;color:var(--text-muted);margin-top:16px;}

/* ═══ STEPS ═══ */
.steps{display:flex;align-items:center;margin-bottom:28px;}
.step{display:flex;align-items:center;gap:8px;flex:1;}
.step-num{width:28px;height:28px;border-radius:50%;border:2px solid var(--amber-border);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--text-muted);flex-shrink:0;}
.step.active .step-num{border-color:var(--amber);color:var(--amber-bright);background:var(--amber-muted);box-shadow:0 0 12px rgba(212,168,39,.25);}
.step.done .step-num{border-color:var(--green);background:rgba(76,175,110,.18);color:var(--green);}
.step-label{font-size:12px;color:var(--text-muted);}
.step.active .step-label{color:var(--amber-bright);}
.step-line{flex:1;height:1px;background:var(--amber-border);margin:0 8px;}

/* ═══ PROFILE CARD ═══ */
.profile-card{
  display:flex;align-items:center;gap:22px;
  background:linear-gradient(135deg,var(--ink3),var(--ink2));
  border-radius:var(--radius-lg);padding:22px;margin-bottom:22px;
  border:1px solid var(--amber-border);
}
.profile-avatar{
  width:72px;height:72px;border-radius:50%;
  background:linear-gradient(135deg,var(--amber-bright),var(--amber-deep));
  display:flex;align-items:center;justify-content:center;
  font-size:24px;font-weight:700;color:#000;flex-shrink:0;
  font-family:var(--font-display);
  box-shadow:0 0 24px rgba(212,168,39,.35);
}
.profile-info h2{font-family:var(--font-display);font-size:21px;color:var(--amber-bright);margin-bottom:4px;}
.profile-info .pid{font-size:12px;color:var(--silver);}
.profile-meta{display:flex;gap:18px;margin-top:9px;flex-wrap:wrap;}
.profile-meta-item{font-size:12px;color:var(--text-muted);}
.profile-meta-item strong{color:var(--text);}

/* ═══ EMPTY STATE ═══ */
.empty-state{text-align:center;padding:60px 20px;color:var(--text-muted);}
.empty-state-icon{font-size:48px;opacity:.25;margin-bottom:16px;}
.empty-state-title{font-size:16px;font-weight:600;color:var(--text);margin-bottom:8px;}

/* ═══ SEPARATOR ═══ */
.separator{border:none;border-top:1px solid var(--amber-border);margin:16px 0;}

/* ═══ UTILITIES ═══ */
.text-gold{color:var(--amber-bright)!important;}
.text-silver{color:var(--silver-bright)!important;}
.text-success{color:var(--green)!important;}
.text-danger{color:var(--red)!important;}
.text-warning{color:var(--orange)!important;}
.text-muted{color:var(--text-muted)!important;}
.text-center{text-align:center;}
.text-right{text-align:right;}
.fw-600{font-weight:600;}
.fw-cinzel{font-family:var(--font-display)!important;}
.mt-1{margin-top:8px;}.mt-2{margin-top:16px;}.mt-3{margin-top:24px;}
.mb-0{margin-bottom:0!important;}.mb-1{margin-bottom:8px;}.mb-2{margin-bottom:16px;}.mb-3{margin-bottom:24px;}
.d-flex{display:flex;}.align-center{align-items:center;}.justify-between{justify-content:space-between;}
.gap-1{gap:8px;}.gap-2{gap:16px;}
.w-100{width:100%;}

/* ═══ ANIMATIONS ═══ */
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.45}}
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
@keyframes glowPulse{0%,100%{box-shadow:0 0 12px rgba(212,168,39,.2)}50%{box-shadow:0 0 28px rgba(212,168,39,.5)}}

.fade-in{animation:fadeUp .35s var(--ease);}
.pulse{animation:pulse 2s infinite;}
.glow-pulse{animation:glowPulse 2.5s infinite;}

/* ═══ RESPONSIVE ═══ */
@media(max-width:1100px){
  .stat-grid{grid-template-columns:repeat(2,1fr);}
  .grid-2-1,.grid-1-2{grid-template-columns:1fr;}
  .wallet-grid{grid-template-columns:repeat(2,1fr);}
  .level-grid{grid-template-columns:repeat(3,1fr);}
}
@media(max-width:768px){
  .sidebar{transform:translateX(-100%);}
  .sidebar.open{transform:translateX(0);box-shadow:8px 0 40px rgba(0,0,0,.8);}
  .main-wrap{margin-left:0;}
  .sidebar-toggle{display:block;}
  .stat-grid{grid-template-columns:1fr 1fr;}
  .grid-2,.grid-3{grid-template-columns:1fr;}
  .wallet-grid{grid-template-columns:1fr 1fr;}
  .form-row{grid-template-columns:1fr;}
  .page-content{padding:16px 18px;}
  .topbar{padding:0 18px;}
  .card-body{padding:16px;}
  .auth-card{padding:28px 22px;}
  .level-grid{grid-template-columns:repeat(3,1fr);}
  .notif-panel{width:300px;right:8px;}
  body.sidebar-open::after{content:'';position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:199;}
}
@media(max-width:480px){
  .stat-grid{grid-template-columns:1fr;}
  .wallet-grid{grid-template-columns:1fr;}
  .level-grid{grid-template-columns:repeat(2,1fr);}
  .btn-group{flex-direction:column;}
}