/* NOVA CASINO - MAIN STYLESHEET */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}:root{--gold:#c9a84c;--red:#c0392b;--blue:#2980b9;--green:#27ae60;--dark:#0a0a0f;--text:#d4cfc5;--text-dim:#6a6560}html,body{min-height:100vh;font-family:'Rajdhani',sans-serif;background:var(--dark);color:var(--text)}body::before{content:'';position:fixed;inset:0;z-index:0;background:radial-gradient(ellipse 70% 50% at 15% 15%,rgba(201,168,76,0.07) 0%,transparent 55%),radial-gradient(ellipse 60% 70% at 85% 85%,rgba(192,57,43,0.06) 0%,transparent 55%)}body::after{content:'';position:fixed;inset:0;z-index:0;background-image:linear-gradient(rgba(201,168,76,0.022) 1px,transparent 1px),linear-gradient(90deg,rgba(201,168,76,0.022) 1px,transparent 1px);background-size:48px 48px}.screen{position:fixed;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;padding:24px}.screen.active{opacity:1}.container{max-width:420px;width:100%}.form-group{margin-bottom:16px}.form-label{display:block;font-size:0.67rem;font-weight:600;letter-spacing:0.22em;text-transform:uppercase;color:var(--text-dim);margin-bottom:7px}input[type="text"],input[type="password"],input[type="number"],select,textarea{width:100%;background:rgba(8,8,14,0.75);border:1px solid rgba(255,255,255,0.07);border-radius:3px;padding:12px 14px;font-family:inherit;font-size:1rem;color:var(--text);outline:none;transition:border 0.2s,box-shadow 0.2s}input:focus,select:focus,textarea:focus{border-color:rgba(201,168,76,0.38);background:rgba(12,12,18,0.9);box-shadow:0 0 0 3px rgba(201,168,76,0.07)}.btn{padding:12px 20px;border:none;border-radius:3px;font-family:'Cinzel',serif;font-size:0.86rem;font-weight:600;letter-spacing:0.22em;text-transform:uppercase;cursor:pointer;transition:all 0.2s;position:relative}.btn-gold{background:linear-gradient(135deg,#c9a84c,#a07830,#c9a84c);color:#18100a;box-shadow:0 4px 20px rgba(201,168,76,0.28)}.btn-gold:hover{box-shadow:0 6px 28px rgba(201,168,76,0.42)}.btn-red{background:linear-gradient(135deg,#c0392b,#8b1c12,#c0392b);color:#fff0ee;box-shadow:0 4px 18px rgba(192,57,43,0.3)}.btn-red:hover{box-shadow:0 6px 26px rgba(192,57,43,0.45)}.btn-green{background:linear-gradient(135deg,#27ae60,#1a7a40,#27ae60);color:#e8f8ee;box-shadow:0 4px 18px rgba(39,174,96,0.28)}.btn-green:hover{box-shadow:0 6px 26px rgba(39,174,96,0.42)}.alert{padding:10px 14px;border-radius:3px;font-size:0.8rem;margin-bottom:14px;display:none}.alert.show{display:block}.alert-error{border:1px solid rgba(192,57,43,0.3);background:rgba(192,57,43,0.1);color:#e88}.alert-success{border:1px solid rgba(39,174,96,0.3);background:rgba(39,174,96,0.1);color:#6ddc8e}.panel-wrap{min-height:100vh;display:flex;flex-direction:column}.panel-layout{display:flex;flex:1}.sidebar{width:220px;min-width:220px;flex-shrink:0;background:#0a0a10;border-right:1px solid rgba(201,168,76,0.1);display:flex;flex-direction:column;padding-bottom:20px}.sidebar-logo{padding:18px;border-bottom:1px solid rgba(201,168,76,0.08);display:flex;align-items:center;gap:10px}.sidebar-logo-text{font-family:'Cinzel',serif;font-size:1rem;letter-spacing:0.18em;color:var(--gold)}.nav-item{padding:12px 20px;color:rgba(180,175,170,0.6);font-size:0.88rem;cursor:pointer;border-left:2px solid transparent;transition:all 0.2s;display:flex;align-items:center;gap:10px;user-select:none}.nav-item:hover{color:var(--text);background:rgba(255,255,255,0.04);border-left-color:rgba(201,168,76,0.3)}.nav-item.active{color:var(--gold);background:rgba(201,168,76,0.06);border-left-color:var(--gold)}.main-content{flex:1;padding:26px 30px;overflow-y:auto}.topbar{height:56px;flex-shrink:0;background:rgba(10,10,16,0.92);border-bottom:1px solid rgba(201,168,76,0.08);display:flex;align-items:center;padding:0 28px;gap:16px}.topbar-title{font-family:'Cinzel',serif;font-size:1rem;letter-spacing:0.08em}.topbar-user{margin-left:auto;display:flex;align-items:center;gap:10px}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-bottom:24px}.stat-card{background:rgba(14,14,22,0.8);border:1px solid rgba(255,255,255,0.06);border-radius:4px;padding:18px;position:relative}.stat-label{font-size:0.66rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--text-dim);margin-bottom:8px}.stat-value{font-family:'Cinzel',serif;font-size:1.6rem;color:var(--gold)}.table-wrap{background:rgba(12,12,20,0.7);border:1px solid rgba(255,255,255,0.06);border-radius:4px;overflow:hidden;margin-bottom:20px}table{width:100%;border-collapse:collapse}th{font-size:0.63rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--text-dim);padding:9px 15px;background:rgba(8,8,14,0.6);border-bottom:1px solid rgba(255,255,255,0.05);text-align:left}td{font-size:0.86rem;color:var(--text);padding:10px 15px;border-bottom:1px solid rgba(255,255,255,0.03)}tr:hover td{background:rgba(255,255,255,0.012)}.badge{display:inline-block;padding:2px 8px;border-radius:2px;font-size:0.66rem;letter-spacing:0.12em;font-weight:600;text-transform:uppercase}.badge-active{background:rgba(93,186,110,0.12);color:#5dba6e}.badge-pending{background:rgba(201,168,76,0.1);color:var(--gold)}.badge-error{background:rgba(192,57,43,0.1);color:var(--red)}.toast{position:fixed;bottom:28px;right:28px;padding:14px 20px;border-radius:4px;font-size:0.88rem;transform:translateY(100px);opacity:0;transition:all 0.35s ease;pointer-events:none;z-index:9999}.toast.show{transform:translateY(0);opacity:1}.toast-success{background:rgba(16,30,20,0.97);border:1px solid rgba(39,174,96,0.35);color:#6ddc8e}.toast-error{background:rgba(28,10,10,0.97);border:1px solid rgba(192,57,43,0.35);color:#e88}@keyframes fadeDown{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}
/* ── MOBILE RESPONSIVE — Dashboard panels ─────────────────────────────────── */
@media (max-width: 767px) {

  /* Stack sidebar above content */
  .panel-layout {
    flex-direction: column;
  }

  /* Sidebar becomes a horizontal scrollable nav bar at top */
  .sidebar {
    width: 100%;
    min-width: unset;
    flex-direction: row;
    align-items: center;
    padding: 0;
    border-right: none;
    border-bottom: 1px solid rgba(201,168,76,.1);
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    flex-shrink: 0;
    min-height: 48px;
    height: auto;
  }

  .sidebar::-webkit-scrollbar { display: none; }

  /* Logo hidden on mobile to save space */
  .sidebar-logo { display: none; }

  /* Nav items become horizontal pills */
  .nav-item {
    flex-shrink: 0;
    padding: 10px 14px;
    border-left: none;
    border-bottom: 3px solid transparent;
    font-size: .78rem;
    white-space: nowrap;
    gap: 5px;
  }

  .nav-item:hover,
  .nav-item.active {
    border-left-color: transparent;
    border-bottom-color: var(--gold);
  }

  /* Logout button inside sidebar — hide on mobile, show in topbar */
  .sidebar > div[style*="margin-top:auto"] {
    display: none;
  }

  /* Main content full width, less padding */
  .main-content {
    padding: 16px 14px;
    overflow-y: auto;
  }

  /* Topbar adjustments */
  .topbar {
    padding: 0 14px;
    height: 50px;
  }

  .topbar-title {
    font-size: .82rem;
  }

  /* Stats grid — 2 columns on mobile */
  .stats-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }

  .stat-value {
    font-size: 1.2rem;
  }

  /* Tables — horizontal scroll */
  .table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  table {
    min-width: 420px;
  }

  /* Buttons full width on mobile */
  .btn {
    font-size: .78rem;
    padding: 10px 14px;
  }

  /* Credit card on client panel */
  .credit-card {
    padding: 18px;
  }

  .credit-amount {
    font-size: 2rem;
  }

  /* Form inputs comfortable on mobile */
  input[type="text"],
  input[type="password"],
  input[type="number"],
  select, textarea {
    font-size: .95rem;
    padding: 11px 12px;
  }
}

/* ── TABLET (768px – 1023px) ─────────────────────────────────────────────── */
@media (min-width: 768px) and (max-width: 1023px) {
  .sidebar {
    width: 180px;
    min-width: 180px;
  }

  .nav-item {
    padding: 11px 14px;
    font-size: .82rem;
  }

  .main-content {
    padding: 20px;
  }

  .stats-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ── body::before and ::after must not block clicks ─────────────────────── */
body::before, body::after {
  pointer-events: none;
}