
:root {
  --portal-bg:#04060b;
  --portal-bg-soft:#081120;
  --portal-panel:linear-gradient(180deg, rgba(13,21,39,.80), rgba(7,12,24,.78));
  --portal-border:rgba(255,255,255,.09);
  --portal-border-strong:rgba(100,167,255,.24);
  --portal-text:#f6f8ff;
  --portal-muted:rgba(246,248,255,.72);
  --portal-blue:#2f6fff;
  --portal-blue2:#64a7ff;
  --portal-blue3:#95d0ff;
  --portal-shadow:0 30px 80px rgba(0,0,0,.45);
  --bg-primary: #04060b;
  --bg-secondary: rgba(13,21,39,.76);
  --bg-tertiary: rgba(255,255,255,.04);
  --bg-card: rgba(7,12,24,.72);
  --text-primary: #f6f8ff;
  --text-secondary: rgba(246,248,255,.82);
  --text-muted: rgba(246,248,255,.62);
  --border: rgba(255,255,255,.09);
  --primary: #2f6fff;
  --primary-light:#64a7ff;
  --accent-primary:#2f6fff;
  --accent-secondary:#64a7ff;
  --gradient: linear-gradient(135deg, var(--portal-blue), var(--portal-blue2));
  --shadow: 0 30px 80px rgba(0,0,0,.45);
}

:root[data-theme="light"] {
  --portal-bg:#eef3ff;
  --portal-bg-soft:#dfeaff;
  --portal-panel:linear-gradient(180deg, rgba(255,255,255,.86), rgba(247,250,255,.92));
  --portal-border:rgba(16,24,40,.08);
  --portal-border-strong:rgba(47,111,255,.24);
  --portal-text:#091120;
  --portal-muted:rgba(9,17,32,.68);
  --portal-shadow:0 24px 60px rgba(15,23,42,.14);
  --bg-primary:#eef3ff;
  --bg-secondary:rgba(255,255,255,.78);
  --bg-tertiary:#f7faff;
  --bg-card:rgba(255,255,255,.82);
  --text-primary:#091120;
  --text-secondary:rgba(9,17,32,.86);
  --text-muted:rgba(9,17,32,.62);
  --border:rgba(16,24,40,.08);
}

html,body{font-family:"Inter",system-ui,sans-serif !important; background:var(--portal-bg) !important; color:var(--portal-text) !important;}
body::before{content:"";position:fixed;inset:0;z-index:-5;background:radial-gradient(circle at 15% 18%, rgba(64,132,255,.16), transparent 20%),radial-gradient(circle at 85% 14%, rgba(95,168,255,.12), transparent 18%),radial-gradient(circle at 50% 65%, rgba(40,90,255,.10), transparent 24%),linear-gradient(135deg, var(--portal-bg) 0%, var(--portal-bg-soft) 32%, #07101d 58%, var(--portal-bg) 100%);} 
body::after{content:"";position:fixed;inset:0;z-index:-4;opacity:.08;background-image:linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);background-size:38px 38px;mask-image:radial-gradient(circle at center, black 40%, transparent 90%);pointer-events:none;}
a{color:inherit}
p,.subtitle,.mini,.stat-card .label,.user-info,.modal p,.empty-state p{color:var(--portal-muted)!important}

.header-area,.top-nav,.site-header,header{background:linear-gradient(180deg, rgba(5,8,16,.96), rgba(5,8,16,.84)) !important;border-bottom:1px solid var(--portal-border)!important;backdrop-filter:blur(18px)!important;box-shadow:0 10px 40px rgba(0,0,0,.25)!important;}
:root[data-theme="light"] .header-area,:root[data-theme="light"] .top-nav,:root[data-theme="light"] .site-header,:root[data-theme="light"] header{background:linear-gradient(180deg, rgba(255,255,255,.90), rgba(245,248,255,.8))!important;}
.main-nav,.nav-container{max-width:1340px!important;margin:0 auto!important;padding:18px 22px!important;min-height:92px!important;display:flex!important;align-items:center!important;gap:18px!important;}
.logo img{height:74px!important;width:auto!important;max-width:min(320px,28vw)!important;object-fit:contain!important;filter:drop-shadow(0 0 32px rgba(74,138,255,.30));}
.nav a,.nav-link,.desktop-nav a,.dropdown-toggle{font-weight:700!important;color:var(--portal-text)!important;opacity:.92}
.nav a:hover,.nav-link:hover,.dropdown-toggle:hover{color:#fff!important}
.server-selector,.guild-selector select,.user-info,.danger-button a,.logout-btn,.lang-btn,.restart-btn{border-radius:18px!important;border:1px solid var(--portal-border)!important;background:rgba(255,255,255,.05)!important;backdrop-filter:blur(12px)!important;box-shadow:none!important;color:var(--portal-text)!important;}
:root[data-theme="light"] .server-selector,:root[data-theme="light"] .guild-selector select,:root[data-theme="light"] .user-info,:root[data-theme="light"] .danger-button a,:root[data-theme="light"] .logout-btn,:root[data-theme="light"] .lang-btn,:root[data-theme="light"] .restart-btn{background:rgba(255,255,255,.7)!important;}
.server-selector select,.guild-selector select{background:transparent!important;border:none!important;color:var(--portal-text)!important;padding:12px 16px!important;min-width:220px}

.container{position:relative;z-index:1}
.main-content,.dashboard-container,.content-wrapper{padding-top:130px!important;background:transparent!important;}
.card,.stat-card,.report-card,.ticket-card,.modal,.modal-overlay>div,.login-container,.provider,.preview-shell,.report-details,.settings-card,.content-panel{background:var(--portal-panel)!important;border:1px solid var(--portal-border)!important;box-shadow:var(--portal-shadow)!important;backdrop-filter:blur(18px)!important;border-radius:28px!important;color:var(--portal-text)!important;}
.page-header,.section-header{margin-bottom:24px!important}
.page-header h1,.page-header h2,h1,h2,h3,h4,h5,.modal-title,.section-title{color:var(--portal-text)!important;letter-spacing:-.03em}

.gradient-button button,.btn,.btn-primary,.login-btn,.border-button button,.action-btn,.filter-btn.active,.nav-link.active{background:linear-gradient(135deg,var(--portal-blue),var(--portal-blue2))!important;border:1px solid transparent!important;color:#fff!important;border-radius:18px!important;box-shadow:0 16px 36px rgba(47,111,255,.28), inset 0 1px 0 rgba(255,255,255,.2)!important;font-weight:800!important;}
.btn.secondary,.border-button button,.filter-btn,.secondary-btn,.action-btn.secondary{background:rgba(255,255,255,.05)!important;border:1px solid var(--portal-border)!important;color:var(--portal-text)!important;box-shadow:none!important}
.gradient-button button:hover,.btn:hover,.login-btn:hover,.filter-btn:hover{transform:translateY(-2px)!important}

input,select,textarea,.form-control{background:rgba(255,255,255,.04)!important;border:1px solid var(--portal-border)!important;color:var(--portal-text)!important;border-radius:18px!important;padding:14px 16px!important;box-shadow:none!important}
input::placeholder,textarea::placeholder{color:var(--portal-muted)!important}
label,.form-group label{color:var(--portal-text)!important;font-weight:700!important}
.form-group label::before{color:var(--portal-blue)!important}

.stats-grid,.data-grid,.card-grid{gap:22px!important}
.stat-card .icon,.icon-wrap,.social-icon{width:58px!important;height:58px!important;display:grid!important;place-items:center!important;border-radius:18px!important;background:linear-gradient(135deg,var(--portal-blue),var(--portal-blue2))!important;color:#fff!important;box-shadow:none!important}
.stat-card .value{font-size:2rem!important;font-weight:800!important;color:var(--portal-text)!important}

.report-card,.ticket-card,.provider{padding:24px!important;overflow:hidden}
.report-card:hover,.ticket-card:hover,.provider:hover,.card:hover{border-color:var(--portal-border-strong)!important;transform:translateY(-4px);transition:.3s ease}
.modal-overlay{background:rgba(3,6,12,.72)!important;backdrop-filter:blur(8px)!important}
.modal-header{border-bottom:1px solid var(--portal-border)!important}
.dropdown-menu,.select-dropdown,.custom-dropdown{background:rgba(10,14,24,.98)!important;border:1px solid var(--portal-border)!important;border-radius:20px!important;box-shadow:var(--portal-shadow)!important}
:root[data-theme="light"] .dropdown-menu,:root[data-theme="light"] .select-dropdown,:root[data-theme="light"] .custom-dropdown{background:rgba(255,255,255,.98)!important}

.empty-state,.loading{background:var(--portal-panel)!important;border:1px solid var(--portal-border)!important;border-radius:28px!important;padding:32px!important}
.table,table{background:transparent!important;color:var(--portal-text)!important}
th,td{border-color:var(--portal-border)!important}

.site-footer{margin:50px auto 24px; width:min(1340px, calc(100% - 40px)); padding:22px 24px; border-radius:28px; background:var(--portal-panel); border:1px solid var(--portal-border); box-shadow:var(--portal-shadow); display:flex; justify-content:space-between; gap:18px; align-items:center; color:var(--portal-muted); backdrop-filter:blur(18px)}
.site-footer strong{display:block;color:var(--portal-text);font-size:1rem;margin-bottom:4px}
.site-footer img{display:none!important}
.footer-links{display:flex;gap:12px;flex-wrap:wrap}
.footer-links a{padding:10px 14px;border-radius:999px;border:1px solid var(--portal-border);background:rgba(255,255,255,.04)}
@media (max-width: 900px){.site-footer{flex-direction:column;align-items:flex-start}.main-nav,.nav-container{padding:16px!important;min-height:84px!important}.logo img{height:60px!important;max-width:68vw!important}}


/* Theme-aware top page loader */
#js-preloader{
  position:fixed!important;
  inset:0 0 auto 0!important;
  height:4px!important;
  width:100%!important;
  z-index:99999!important;
  background:transparent!important;
  pointer-events:none!important;
  opacity:1!important;
  transition:opacity .28s ease, visibility .28s ease!important;
}
#js-preloader .preloader-inner,
#js-preloader .dot,
#js-preloader .dots{display:none!important}
#js-preloader .preloader-bar{
  position:relative;
  width:100%;
  height:100%;
  overflow:hidden;
  background:linear-gradient(90deg, rgba(9,17,32,.08), rgba(9,17,32,.02));
}
#js-preloader .preloader-bar::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:32%;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(47,111,255,0), rgba(9,17,32,.84), rgba(47,111,255,.9));
  box-shadow:0 0 18px rgba(47,111,255,.28);
  transform:translateX(-110%);
  animation:portalLoaderLight 1.15s cubic-bezier(.4,0,.2,1) infinite;
}
html[data-theme="dark"] #js-preloader .preloader-bar{
  background:linear-gradient(90deg, rgba(255,255,255,.08), rgba(255,255,255,.02));
}
html[data-theme="dark"] #js-preloader .preloader-bar::before{
  background:linear-gradient(90deg, rgba(47,111,255,0), rgba(255,255,255,.92), rgba(100,167,255,.98));
  box-shadow:0 0 18px rgba(100,167,255,.55);
  animation-name:portalLoaderDark;
}
#js-preloader .preloader-glow{
  position:absolute;
  inset:-12px 0 auto 0;
  height:16px;
  background:radial-gradient(circle at center, rgba(100,167,255,.22), transparent 70%);
  filter:blur(10px);
}
#js-preloader.loaded{
  opacity:0!important;
  visibility:hidden!important;
}
html.page-loading #js-preloader{opacity:1!important;visibility:visible!important}
@keyframes portalLoaderDark{
  0%{transform:translateX(-120%) scaleX(.65)}
  55%{transform:translateX(135%) scaleX(1)}
  100%{transform:translateX(320%) scaleX(.72)}
}
@keyframes portalLoaderLight{
  0%{transform:translateX(-120%) scaleX(.65)}
  55%{transform:translateX(135%) scaleX(1)}
  100%{transform:translateX(320%) scaleX(.72)}
}


/* v7e portal fixes */
footer, footer.simple { background-image:none !important; }
.site-footer > div:first-child > div:last-child{ display:none !important; }
.site-footer{ background-image:none !important; }
.main-nav{ position:relative; }
.nav-online-pill{
  display:inline-flex; align-items:center; gap:10px; white-space:nowrap;
  padding:10px 14px; border-radius:999px; border:1px solid var(--portal-border);
  background:rgba(255,255,255,.05); color:var(--portal-text); font-weight:700; font-size:.95rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.nav-online-pill .dot{ width:10px; height:10px; border-radius:50%; background:#2f6fff; box-shadow:0 0 0 4px rgba(47,111,255,.16); flex:none; }
.nav-online-pill .label{ color:var(--portal-muted); font-weight:600; }
.nav-online-pill .count{ min-width:1.5ch; text-align:right; color:var(--portal-text); }
.nav-online-pill.updating{ animation:navOnlinePulse .45s ease; }
@keyframes navOnlinePulse{0%{transform:scale(1)}50%{transform:scale(1.04)}100%{transform:scale(1)}}
.theme-toggle{z-index:1200!important}
html,body{overflow-x:hidden!important}
img{max-width:100%;height:auto}
.header-area .container{padding-left:18px!important;padding-right:18px!important}
@media (max-width: 991px){
  .main-nav,.nav-container{display:grid!important;grid-template-columns:1fr auto;align-items:center!important;gap:12px!important;min-height:auto!important}
  .server-selector{grid-column:1 / -1; order:4}
  .nav-online-pill{grid-column:1 / 2; order:3; width:max-content; max-width:100%}
  .user-area{grid-column:1 / -1; order:5; width:100%; display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap}
  .header-area .nav{top:96px!important; left:16px!important; right:16px!important; width:auto!important; border-radius:22px!important; background:var(--portal-panel)!important; border:1px solid var(--portal-border)!important; backdrop-filter:blur(18px)!important}
  .header-area .nav li a, .header-area .nav .dropdown-toggle{border-bottom:1px solid var(--portal-border)!important; width:100%; text-align:left}
  .header-area .nav li:last-child a{border-bottom:none!important}
  .header-area .nav .dropdown-menu{position:static!important; display:none; box-shadow:none!important; background:transparent!important; border:none!important; padding:0 0 8px 12px!important}
  .header-area .nav .dropdown.open .dropdown-menu{display:block!important}
  .page-header{align-items:flex-start!important}
  body > .container,.main-content,.dashboard-container,.content-wrapper{padding-top:116px!important}
}
@media (max-width: 700px){
  .logo img{height:48px!important;max-width:56vw!important}
  .nav-online-pill{font-size:.86rem;padding:8px 12px}
  .site-footer{width:min(100% - 24px, 1340px)!important;padding:18px!important;border-radius:20px!important}
  .card,.stat-card,.report-card,.ticket-card,.modal,.modal-overlay>div,.login-container,.provider,.preview-shell,.report-details,.settings-card,.content-panel{border-radius:20px!important}
  .container{padding-left:12px!important;padding-right:12px!important}
}
