:root{
  --bg-0:#0b1020;
  --bg-1:#0f172a;
  --bg-2:#111827;
  --accent:#38bdf8;
  --accent-2:#818cf8;
  --text:#e5e7eb;
  --muted:#94a3b8;
  --glass: rgba(255,255,255,.06);
  --glass-border: rgba(255,255,255,.12);
  --nav-h: 62px;
  --side-w: 250px;
}
html,body{background: radial-gradient(1200px 700px at 10% -10%, rgba(56,189,248,.15), transparent),
                       radial-gradient(1000px 800px at 100% 100%, rgba(129,140,248,.12), transparent),
                       var(--bg-0);
  color:var(--text); min-height:100vh;}
.glass-card{background:var(--glass); border:1px solid var(--glass-border); border-radius:16px; backdrop-filter: blur(12px); box-shadow:0 8px 24px rgba(0,0,0,.25);}
.glass-nav{background: rgba(15,23,42,.75); border-bottom:1px solid var(--glass-border); backdrop-filter: blur(10px);}
.glass-side{background: rgba(15,23,42,.75); border-right:1px solid var(--glass-border); backdrop-filter: blur(10px);}

.navbar.fixed-top{height:var(--nav-h);}
.app-sidebar{position:fixed; top:var(--nav-h); left:0; bottom:0; width:var(--side-w); padding:1rem .75rem; overflow-y:auto; transition: transform .25s;}
.app-sidebar .nav-link{color:var(--muted); border-radius:10px; padding:.55rem .75rem; margin-bottom:.15rem;}
.app-sidebar .nav-link:hover{background:rgba(255,255,255,.05); color:#fff;}
.app-sidebar .nav-link.active{background: linear-gradient(90deg, rgba(56,189,248,.2), rgba(129,140,248,.15)); color:#fff; border:1px solid var(--glass-border);}
.sidebar-heading{color:var(--muted); text-transform:uppercase; font-size:.7rem; padding:.75rem .75rem .25rem;}

.app-main{margin-left:var(--side-w); padding-top:var(--nav-h); padding-bottom:56px; min-height:100vh;}
.app-footer{position:fixed; bottom:0; left:var(--side-w); right:0; padding:.6rem 1rem; color:var(--muted);}

@media(max-width: 991.98px){
  .app-sidebar{transform:translateX(-100%);}
  .app-sidebar.show{transform:translateX(0);}
  .app-main{margin-left:0;}
  .app-footer{left:0;}
}

.stat-card{padding:1.15rem; border-radius:16px;}
.stat-card:hover{transform: translateY(-2px); transition: transform .25s;}

.auth-wrap{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:2rem;}
.auth-card{width:100%; max-width:440px; padding:2rem;}

.form-control, .form-select{background: rgba(255,255,255,.05); border:1px solid var(--glass-border); color:var(--text);}
.form-control:focus, .form-select:focus{background: rgba(255,255,255,.08); color:#fff; border-color:var(--accent); box-shadow: 0 0 0 .2rem rgba(56,189,248,.15);}
.form-control::placeholder{color:#64748b;}

.table{color:var(--text);}
.table > :not(caption) > * > *{background: transparent; color: var(--text); border-color: rgba(255,255,255,.08);}
.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter, .dataTables_info, .dataTables_paginate{color:var(--muted) !important;}
.page-item.active .page-link{background: var(--accent); border-color: var(--accent);}
.page-link{background: transparent; color: var(--text); border-color: var(--glass-border);}

.btn-primary{background: linear-gradient(135deg, var(--accent), var(--accent-2)); border:0;}
.btn-primary:hover{filter: brightness(1.05);}

.toast-fly{position:fixed; top:80px; right:20px; z-index:2000; background: rgba(15,23,42,.95); border:1px solid var(--glass-border); border-radius:12px; padding:.75rem 1rem; color:#fff; animation: slide .3s;}
.toast-fly[data-type="success"]{border-left:4px solid #22c55e;}
.toast-fly[data-type="error"]{border-left:4px solid #ef4444;}
.toast-fly[data-type="info"]{border-left:4px solid var(--accent);}
@keyframes slide{from{opacity:0; transform: translateX(20px);} to{opacity:1; transform: translateX(0);}}

video::-webkit-media-controls-download-button{display:none;}
video::-internal-media-controls-download-button{display:none;}

/* --- Fix: unreadable dropdown menu options --- */
.dropdown-menu{
  background: var(--bg-1);
  border: 1px solid var(--glass-border);
}
.dropdown-item{
  color: var(--text);
}
.dropdown-item:hover,
.dropdown-item:focus{
  background: rgba(255,255,255,.08);
  color: #fff;
}
.dropdown-item.active,
.dropdown-item:active{
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  color: #fff;
}
.dropdown-divider{
  border-color: var(--glass-border);
}

/* Native <select> dropdown options (browser-rendered, limited styling support) */
.form-select option{
  background: var(--bg-1);
  color: var(--text);
}

.form-select{
  color-scheme: dark;
}