@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root {
    --theme-ink: #111827;
    --theme-paper: #f4f1ea;
    --theme-panel: #fffdf8;
    --theme-line: #d9d5cc;
    --theme-muted: #6f746f;
    --theme-orange: #f05a28;
    --theme-orange-dark: #c9441b;
    --theme-mint: #a9d9c8;
    --theme-yellow: #f5c85b;
    --theme-shadow: 0 18px 50px rgba(33, 35, 31, .09);
    --theme-radius: 18px;
}

body.index-v3-body,
body.modern-dashboard-body,
body.admin-body {
    color: var(--theme-ink) !important;
    background-color: var(--theme-paper) !important;
    background-image: radial-gradient(rgba(17, 24, 39, .07) 1px, transparent 1px) !important;
    background-size: 18px 18px !important;
    font-family: 'Space Grotesk', sans-serif !important;
}

body.index-v3-body::before,
body.modern-dashboard-body::before,
body.admin-body::before { display: none !important; }

.v3-nav {
    padding: 14px 5%;
    background: rgba(244, 241, 234, .9);
    border-bottom: 1px solid var(--theme-line);
    backdrop-filter: blur(16px);
}

.v3-brand, .modern-brand { color: var(--theme-ink) !important; }
.v3-brand img, .modern-brand img { filter: none; border-radius: 12px; }
.v3-brand strong, .modern-brand strong { letter-spacing: -.04em; }
.v3-brand span, .modern-brand span { color: var(--theme-muted) !important; }
.v3-nav-links a { color: var(--theme-muted); }
.v3-nav-links a:hover { color: var(--theme-orange); }

.v3-btn, .v3-big-btn, .modern-primary-btn, .modern-card-btn,
.header-btn, .logout-btn, .server-v2-action-row a {
    border-radius: 10px !important;
    font-family: inherit;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.v3-btn.primary, .v3-big-btn.primary, .modern-primary-btn,
.modern-card-btn:not(.outline), .header-btn {
    color: #fff !important;
    background: var(--theme-orange) !important;
    box-shadow: 0 10px 24px rgba(240, 90, 40, .2) !important;
}

.v3-btn.ghost, .v3-big-btn.secondary, .v3-big-btn.tertiary,
.modern-card-btn.outline, .logout-btn, .header-btn.danger-btn {
    color: var(--theme-ink) !important;
    background: transparent !important;
    border: 1px solid var(--theme-line) !important;
}

.v3-btn:hover, .v3-big-btn:hover, .modern-primary-btn:hover,
.modern-card-btn:hover, .header-btn:hover, .logout-btn:hover { transform: translateY(-2px); }

.v3-hero {
    min-height: 760px;
    padding: 88px 5% 74px;
    background: linear-gradient(120deg, rgba(169, 217, 200, .5), transparent 50%);
}

.v3-bg-orb { display: none; }
.v3-badge, .dashboard-badge, .server-v2-badge {
    color: var(--theme-orange-dark) !important;
    background: rgba(240, 90, 40, .1) !important;
    border: 1px solid rgba(240, 90, 40, .25) !important;
    border-radius: 999px !important;
}
.v3-badge.green { color: #28735d !important; background: rgba(169, 217, 200, .45) !important; border-color: #91c9b4 !important; }
.v3-badge.purple, .v3-badge.gold { color: #7d5b13 !important; background: rgba(245, 200, 91, .25) !important; border-color: #e5bd54 !important; }

.v3-hero h1, .modern-hero h1, .server-v2-hero h1 {
    color: var(--theme-ink) !important;
    background: none !important;
    -webkit-text-fill-color: currentColor !important;
    filter: none !important;
    letter-spacing: -.075em;
}
.v3-hero h1 span { color: var(--theme-orange) !important; background: none; -webkit-text-fill-color: currentColor; animation: none; filter: none; }
.v3-hero p, .modern-hero p, .server-v2-hero p { color: var(--theme-muted) !important; }

.v3-dashboard-mockup, .v3-main-preview, .v3-showcase-cards article,
.v3-feature-card, .v3-fivem-box, .v3-premium-card,
.modern-sidebar, .modern-topbar, .modern-hero, .modern-server-card,
.modern-empty-state, .server-v2-hero, .dashboard-card, .server-v2-toolbar,
.oz-v3-control-strip, .oz-v3-filter-bar {
    border: 1px solid var(--theme-line) !important;
    border-radius: var(--theme-radius) !important;
    background: var(--theme-panel) !important;
    box-shadow: var(--theme-shadow) !important;
    backdrop-filter: none !important;
}

.v3-dashboard-mockup { padding: 10px; background: var(--theme-ink) !important; border-color: var(--theme-ink) !important; }
.v3-window-bar { background: #252b36; border-radius: 12px 12px 0 0; }
.v3-floating-card { background: var(--theme-ink); border: 1px solid #3c4653; border-radius: 10px; }
.v3-feature-card:hover, .v3-showcase-cards article:hover, .modern-server-card:hover, .dashboard-card:hover { border-color: var(--theme-orange) !important; transform: translateY(-4px); }
.v3-stats div, .modern-stat-card, .server-v2-stat { background: #f8f5ee !important; border: 1px solid var(--theme-line) !important; border-radius: 12px !important; box-shadow: none !important; }
.v3-stats strong, .modern-stat-card strong, .server-v2-stat strong { color: var(--theme-ink) !important; }
.v3-stats span, .modern-stat-card small, .server-v2-stat small, .v3-feature-card p { color: var(--theme-muted) !important; }
.v3-module-strip { border-block: 1px solid var(--theme-line); background: var(--theme-ink); color: #fff; }
.v3-module-strip span { color: var(--theme-mint); }
.v3-section-head span, .modern-section-head > div > span { color: var(--theme-orange) !important; }
.v3-section-head h2, .v3-fivem-box h2, .v3-premium-card h2 { color: var(--theme-ink); letter-spacing: -.05em; }
.v3-fivem-box { background: var(--theme-mint) !important; }
.v3-premium-card { background: var(--theme-yellow) !important; }
.v3-cta, .v3-footer { color: #fff; background: var(--theme-ink); }
.v3-cta h2, .v3-footer strong { color: #fff; }
.v3-cta p, .v3-footer p, .v3-footer a { color: #bac1bd; }

.modern-dashboard-shell { width: min(1580px, calc(100% - 44px)); gap: 20px; }
.modern-sidebar { background: var(--theme-ink) !important; border-color: var(--theme-ink) !important; }
.modern-sidebar .modern-brand, .modern-sidebar .modern-brand span { color: #fff !important; }
.modern-side-nav a { color: #aeb8b3; border-radius: 10px; }
.modern-side-nav a:hover, .modern-side-nav a.active { color: var(--theme-ink); background: var(--theme-mint); transform: translateX(3px); }
.modern-sidebar-card { background: rgba(169, 217, 200, .14); border-color: rgba(169, 217, 200, .35); border-radius: 12px; }
.modern-sidebar-card span { color: var(--theme-mint); }
.modern-sidebar-card p { color: #b7c4bf; }
.modern-topbar { background: rgba(255, 253, 248, .88) !important; }
.modern-search-wrap, .server-v2-search-wrap { background: #f4f1ea !important; border: 1px solid var(--theme-line) !important; border-radius: 10px !important; }
.modern-search-wrap input, .server-v2-search-wrap input { color: var(--theme-ink) !important; }
.modern-status.online, .status.online { color: #28735d !important; background: rgba(169, 217, 200, .55) !important; }
.modern-status.offline, .status.offline { color: #a64026 !important; background: rgba(240, 90, 40, .12) !important; }
.modern-filter-bar, .dashboard-filter-bar { background: transparent; }
.oz-v3-control-strip, .oz-v3-filter-bar { box-shadow: none !important; background: rgba(255, 253, 248, .8) !important; }
.oz-v3-control-strip button, .oz-v3-filter-bar button { border-radius: 8px; color: var(--theme-muted); background: transparent; }
.oz-v3-control-strip button:hover, .oz-v3-filter-bar button.active { color: #fff; background: var(--theme-orange); }

.admin-page { padding-top: 34px; }
.server-v2-hero { background: linear-gradient(120deg, var(--theme-mint), var(--theme-panel) 62%) !important; }
.server-v2-bg, .hero-gradient, .server-banner-glow { display: none !important; }
.server-v2-actions .header-btn.danger-btn { color: var(--theme-orange-dark) !important; border-color: rgba(240, 90, 40, .3) !important; }
.server-v2-toolbar { padding: 22px 26px; }
.server-v2-toolbar h2, .section-title { color: var(--theme-ink) !important; }
.server-v2-toolbar p, .dashboard-card p { color: var(--theme-muted) !important; }
.card-top .status { border-radius: 999px; }

@media (max-width: 900px) {
    .v3-nav-links { display: none; }
    .v3-hero { grid-template-columns: 1fr; min-height: auto; padding-top: 62px; }
    .v3-hero h1 { font-size: clamp(48px, 13vw, 78px); }
    .v3-stats { grid-template-columns: repeat(2, 1fr); }
    .modern-dashboard-shell { grid-template-columns: 1fr; width: min(100% - 24px, 680px); }
    .modern-sidebar { position: relative; top: auto; height: auto; }
    .modern-sidebar-card { display: none; }
    .modern-side-nav { grid-template-columns: repeat(3, 1fr); }
    .modern-side-nav a { justify-content: center; padding: 0 8px; font-size: 12px; }
    .modern-hero, .server-v2-hero { grid-template-columns: 1fr; padding: 26px; }
    .modern-hero-preview { display: none; }
    .server-v2-actions { align-items: flex-start; }
    .server-v2-stats { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 560px) {
    .v3-nav { padding-inline: 18px; }
    .v3-nav-actions .ghost { display: none; }
    .v3-hero { padding-inline: 18px; }
    .v3-hero-actions, .v3-hero-actions > * { width: 100%; }
    .v3-stats { gap: 8px; }
    .modern-topbar { align-items: stretch; flex-direction: column; }
    .modern-top-actions { justify-content: space-between; }
    .modern-side-nav { grid-template-columns: repeat(2, 1fr); }
    .server-v2-action-row { flex-wrap: wrap; }
    .server-v2-action-row > * { flex: 1; }
}

/* Final dark control language for every action surface. */
body.index-v3-body,
body.modern-dashboard-body,
body.admin-body {
    color: #f5f7fb !important;
    background-color: #07090d !important;
    background-image: radial-gradient(rgba(114, 224, 189, .07) 1px, transparent 1px), linear-gradient(135deg, #07090d, #0d1219 55%, #080b10) !important;
    background-size: 22px 22px, auto !important;
}

.v3-nav { background: rgba(7, 9, 13, .9) !important; border-color: rgba(148, 163, 184, .16) !important; }
.v3-brand, .modern-brand { color: #f5f7fb !important; }
.v3-brand span, .modern-brand span, .v3-nav-links a { color: #8e9aaa !important; }
.v3-nav-links a:hover { color: #72e0bd !important; }

.v3-hero { background: radial-gradient(circle at 75% 25%, rgba(114, 224, 189, .12), transparent 35%), linear-gradient(120deg, rgba(255, 107, 53, .08), transparent 50%) !important; }
.v3-hero h1, .modern-hero h1, .server-v2-hero h1,
.v3-section-head h2, .v3-fivem-box h2, .v3-premium-card h2,
.server-v2-toolbar h2, .section-title, .modern-server-card h3, .dashboard-card h3 {
    color: #f5f7fb !important;
    background: none !important;
    -webkit-text-fill-color: currentColor !important;
    filter: none !important;
}
.v3-hero h1 span { color: #ff6b35 !important; -webkit-text-fill-color: currentColor !important; }
.v3-hero p, .modern-hero p, .server-v2-hero p, .v3-feature-card p,
.modern-server-card p, .dashboard-card p, .server-v2-toolbar p { color: #8e9aaa !important; }

.v3-dashboard-mockup, .v3-main-preview, .v3-showcase-cards article,
.v3-feature-card, .v3-fivem-box, .v3-premium-card, .modern-sidebar,
.modern-topbar, .modern-hero, .modern-server-card, .modern-empty-state,
.server-v2-hero, .dashboard-card, .server-v2-toolbar,
.oz-v3-control-strip, .oz-v3-filter-bar, .v3-stats div,
.modern-stat-card, .server-v2-stat {
    background: #10151d !important;
    border-color: rgba(148, 163, 184, .16) !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .3) !important;
}
.v3-fivem-box { background: linear-gradient(135deg, #15352f, #10241f) !important; }
.v3-premium-card { background: linear-gradient(135deg, #342a14, #1e1a11) !important; }
.v3-stats strong, .modern-stat-card strong, .server-v2-stat strong { color: #f5f7fb !important; }
.v3-stats span, .modern-stat-card small, .server-v2-stat small { color: #8e9aaa !important; }
.modern-sidebar { background: #0d1219 !important; border-color: #0d1219 !important; }
.modern-sidebar .modern-brand, .modern-sidebar .modern-brand span { color: #f5f7fb !important; }
.modern-side-nav a { color: #aeb8b3 !important; }
.modern-side-nav a:hover, .modern-side-nav a.active { color: #080b10 !important; background: #72e0bd !important; }
.modern-topbar { background: rgba(16, 21, 29, .94) !important; }
.modern-search-wrap, .server-v2-search-wrap { background: #0a0e14 !important; border-color: rgba(148, 163, 184, .16) !important; }
.modern-search-wrap input, .server-v2-search-wrap input { color: #f5f7fb !important; }
.server-v2-hero { background: radial-gradient(circle at 85% 20%, rgba(114, 224, 189, .16), transparent 35%), linear-gradient(120deg, #10241f, #10151d 62%) !important; }
.server-v2-bg, .hero-gradient, .server-banner-glow { display: none !important; }
.v3-module-strip, .v3-cta, .v3-footer { color: #f5f7fb; background: #0d1219 !important; }
.v3-cta h2, .v3-footer strong { color: #f5f7fb !important; }
.v3-cta p, .v3-footer p, .v3-footer a { color: #8e9aaa !important; }

button, a.v3-btn, a.v3-big-btn, a.modern-primary-btn, a.modern-card-btn,
a.header-btn, a.logout-btn, .server-v2-action-row a, .oz-v3-control-strip button,
.oz-v3-filter-bar button, .lang-switch a {
    color: #f5f7fb !important;
    border: 1px solid rgba(148, 163, 184, .2) !important;
    border-radius: 9px !important;
    background: #171e29 !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .16) !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 600;
    transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
button:hover, a.v3-btn:hover, a.v3-big-btn:hover, a.modern-primary-btn:hover,
a.modern-card-btn:hover, a.header-btn:hover, a.logout-btn:hover,
.server-v2-action-row a:hover, .oz-v3-control-strip button:hover,
.oz-v3-filter-bar button:hover, .lang-switch a:hover, .oz-v3-filter-bar button.active {
    color: #080b10 !important;
    border-color: #72e0bd !important;
    background: #72e0bd !important;
    box-shadow: 0 8px 24px rgba(114, 224, 189, .18) !important;
    transform: translateY(-2px);
}
a.v3-btn.primary, a.v3-big-btn.primary, a.modern-primary-btn,
a.modern-card-btn:not(.outline), a.header-btn, .server-v2-action-row .header-btn {
    color: #fff !important;
    border-color: #ff6b35 !important;
    background: #ff6b35 !important;
    box-shadow: 0 10px 26px rgba(255, 107, 53, .24) !important;
}
a.v3-btn.primary:hover, a.v3-big-btn.primary:hover, a.modern-primary-btn:hover,
a.modern-card-btn:not(.outline):hover, a.header-btn:hover {
    color: #fff !important;
    border-color: #ff8b60 !important;
    background: #ff7b4c !important;
}
a.v3-btn.ghost, a.v3-big-btn.secondary, a.v3-big-btn.tertiary,
a.modern-card-btn.outline, a.logout-btn, a.header-btn.danger-btn { color: #f5f7fb !important; background: #171e29 !important; }
.modern-status.online, .status.online { color: #72e0bd !important; background: rgba(114, 224, 189, .12) !important; }
.modern-status.offline, .status.offline { color: #ff9a78 !important; background: rgba(255, 107, 53, .12) !important; }
.live-dashboard-badge { gap: 8px; padding: 9px 13px !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; opacity: 1 !important; background: #0b1715 !important; border-color: #72e0bd !important; letter-spacing: .06em; font-size: 11px; font-weight: 800; text-shadow: none; }
.live-dashboard-badge i { width: 8px; height: 8px; display: inline-block; flex: 0 0 8px; border-radius: 50%; background: #72e0bd; box-shadow: 0 0 0 3px rgba(114, 224, 189, .18), 0 0 14px rgba(114, 224, 189, .85); }
.reset-action { gap: 7px; color: #ffad92 !important; background: rgba(255, 107, 53, .08) !important; border-color: rgba(255, 107, 53, .3) !important; }
.reset-action span { font-size: 17px; line-height: 1; }
.reset-action:hover { color: #fff !important; background: #c94b29 !important; border-color: #ff7850 !important; box-shadow: 0 8px 24px rgba(255, 107, 53, .2) !important; }

.slide-panel {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2000 !important;
    background: rgba(2, 5, 9, .78) !important;
    backdrop-filter: blur(10px) !important;
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease, visibility .25s ease;
}
.slide-panel.open { opacity: 1; visibility: visible; }
body.panel-is-open { overflow: hidden; }
.slide-panel-content {
    width: min(720px, 94vw) !important;
    height: 100vh !important;
    margin-left: auto !important;
    overflow-y: auto !important;
    padding: 28px !important;
    color: #f5f7fb !important;
    background: #0d1219 !important;
    border-left: 1px solid rgba(114, 224, 189, .2) !important;
    box-shadow: -30px 0 90px rgba(0, 0, 0, .5) !important;
    transform: translateX(32px);
    transition: transform .25s ease;
}
.slide-panel.open .slide-panel-content { transform: translateX(0); }
.slide-panel-head {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: -28px -28px 26px !important;
    padding: 22px 28px !important;
    background: rgba(13, 18, 25, .96) !important;
    border-bottom: 1px solid rgba(148, 163, 184, .16) !important;
}
.slide-panel-head h2 { flex: 1; margin: 0; color: #f5f7fb !important; font-size: 22px; letter-spacing: -.04em; }
.slide-panel-head > button:not(.panel-save-btn) {
    width: 38px !important;
    height: 38px !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    color: #8e9aaa !important;
    background: #171e29 !important;
}
.slide-panel-head > button:not(.panel-save-btn):hover { color: #080b10 !important; }
.create-form, .script-admin-card {
    color: #f5f7fb !important;
    background: #101820 !important;
    border: 1px solid rgba(148, 163, 184, .14) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
}
.field label { color: #aeb8b3 !important; }
input, textarea, select {
    color: #f5f7fb !important;
    background: #080c12 !important;
    border: 1px solid rgba(148, 163, 184, .2) !important;
    border-radius: 8px !important;
}
input:focus, textarea:focus, select:focus {
    border-color: #72e0bd !important;
    box-shadow: 0 0 0 3px rgba(114, 224, 189, .12) !important;
    outline: none;
}
.panel-save-btn, .create-category-btn, .delete-btn {
    border-radius: 9px !important;
    font-family: 'Space Grotesk', sans-serif !important;
    font-weight: 600;
}
.panel-save-btn, .create-category-btn { color: #080b10 !important; background: #72e0bd !important; border: 1px solid #72e0bd !important; }
.panel-save-btn:hover, .create-category-btn:hover { background: #9aefd4 !important; transform: translateY(-2px); }
.delete-btn { color: #ff9a78 !important; background: rgba(255, 107, 53, .1) !important; border: 1px solid rgba(255, 107, 53, .28) !important; }
.delete-btn:hover { color: #fff !important; background: #d84f29 !important; }

@media (max-width: 560px) {
    .slide-panel-content { width: 100vw !important; padding: 20px !important; }
    .slide-panel-head { margin: -20px -20px 20px !important; padding: 18px 20px !important; }
    .slide-panel-head h2 { font-size: 18px; }
}