/* ============================================================
   NRL GLOBAL THEME OVERRIDE  —  rematchcis.ru inspired
   Loaded after each page's <style> block to override colours.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

/* ── CSS tokens ──────────────────────────────────────────── */
:root {
    --bg:          #111111;
    --surface:     #1a1a1a;
    --surface2:    #222222;
    --border:      rgba(255,255,255,0.07);
    --border2:     rgba(255,255,255,0.13);
    --accent:      #41DB90;
    --accent-dim:  rgba(65,219,145,0.12);
    --text:        #e8e8e8;
    --text-dim:    #888888;
    --text-muted:  #555555;
    --nav-bg:      #161616;
}

/* ── Base ────────────────────────────────────────────────── */
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    background: var(--bg) !important;
}

/* ── Navigation bar ──────────────────────────────────────── */
.nav-container {
    background: var(--nav-bg) !important;
    box-shadow: none !important;
    border-bottom: 1px solid var(--border2) !important;
}

.nav {
    height: 50px !important;
}

.logo {
    width: 36px !important;
    height: 36px !important;
    margin-right: 28px !important;
}

.logo-text {
    color: var(--accent) !important;
    text-shadow: none !important;
    font-size: 14px !important;
}

.nav-links {
    gap: 2px !important;
    flex-grow: 0 !important;
    flex-shrink: 1 !important;
}

.nav-links a {
    color: #999 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.4px !important;
    padding: 6px 10px !important;
    border-radius: 4px !important;
    text-shadow: none !important;
}

.nav-links a:hover,
.nav-links a.active {
    color: var(--text) !important;
    background: rgba(255,255,255,0.06) !important;
    text-shadow: none !important;
    transform: none !important;
}

/* ── Sign-up button ──────────────────────────────────────── */
.sign-up {
    background: var(--accent) !important;
    color: #111 !important;
    border: none !important;
    padding: 7px 16px !important;
    border-radius: 4px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    text-shadow: none !important;
    box-shadow: none !important;
}

.sign-up:hover {
    background: var(--accent) !important;
    opacity: 0.85 !important;
    transform: none !important;
    box-shadow: none !important;
}

/* ── Dropdown ────────────────────────────────────────────── */
.dropdown-content {
    background: var(--surface2) !important;
    border: 1px solid var(--border2) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.55) !important;
    border-radius: 6px !important;
    opacity: 1 !important;
    transform: translateY(0) !important;
}

.dropdown-content a {
    color: #999 !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    text-shadow: none !important;
}

.dropdown-content a:hover {
    background: rgba(255,255,255,0.06) !important;
    color: var(--text) !important;
    transform: none !important;
    text-shadow: none !important;
}

/* Push Sign Up + hamburger to right side */
.nav-actions {
    margin-left: auto !important;
}

/* ── Mobile nav ──────────────────────────────────────────── */
.mobile-nav-toggle,
.hamburger-menu {
    color: #999 !important;
}

/* Hamburger button */
.mobile-menu-btn {
    display: none;
    background: none;
    border: none;
    color: var(--text, #eee);
    font-size: 22px;
    cursor: pointer;
    padding: 8px;
    line-height: 1;
    transition: color 0.2s;
}
.mobile-menu-btn:hover { color: var(--accent, #41DB90); }

/* Show hamburger + hide nav links on small screens */
@media (max-width: 1024px) {
    .nav-links { display: none !important; }
    .mobile-menu-btn,
    .mobile-nav-toggle { display: block !important; }
    .nav-actions { margin-left: auto; }
}
@media (max-width: 768px) {
    .nav-links { display: none !important; }
    .mobile-menu-btn,
    .mobile-nav-toggle { display: block !important; }
    .nav-actions { margin-left: auto; }
}

/* Mobile nav dropdown panel */
.mobile-nav {
    display: none;
    position: fixed;
    top: 50px;
    left: 0;
    right: 0;
    background: #1a1a1a !important;
    border-bottom: 1px solid var(--border2) !important;
    z-index: 999;
    padding: 16px 20px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.4) !important;
}
.mobile-nav.active {
    display: block;
    animation: mobileNavSlide 0.2s ease;
}
@keyframes mobileNavSlide {
    from { opacity: 0; transform: translateY(-8px); }
    to   { opacity: 1; transform: translateY(0); }
}

.mobile-nav-links {
    list-style: none;
    margin: 0;
    padding: 0;
}
.mobile-nav-links li { margin-bottom: 15px; }
.mobile-nav-links li:last-child { margin-bottom: 0; }

.mobile-nav-links a,
.mobile-menu a {
    color: var(--text-dim, #888) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.4px !important;
    font-size: 13px !important;
    text-shadow: none !important;
    display: block;
    padding: 10px 0;
    text-decoration: none;
    font-weight: 600;
    border-bottom: 1px solid var(--border, rgba(255,255,255,0.07));
}
.mobile-nav-links li:last-child a { border-bottom: none; }

.mobile-nav-links a:hover,
.mobile-menu a:hover {
    color: var(--accent, #41DB90) !important;
    text-shadow: none !important;
}

/* ── Green-background panels → neutral dark ──────────────── */

/* Common surface/card containers */
.sidebar,
.stats-sidebar,
.news-sidebar,
.matches-sidebar,
.season-sidebar,
.team-sidebar,
.info-panel,
.detail-panel,
.stat-panel,
.standings-container,
.standings-panel,
.schedule-container,
.schedule-panel,
.game-panel,
.player-panel,
.players-table-container,
.stats-table-container,
.allstar-section,
.draft-section,
.free-agency-section,
.season-section,
.page-section,
.content-section,
.news-card,
.match-card,
.team-card,
.player-card,
.stat-card,
.season-card,
.division-block,
.standings-block,
.conference-block,
.division-table,
.history-container,
.history-panel,
.history-card {
    background: var(--surface) !important;
    border-color: var(--border2) !important;
}

/* Any element with the green gradient  backgrounds */
[style*="background: linear-gradient(135deg, #1a3a1a"],
[style*="background:linear-gradient(135deg, #1a3a1a"],
[style*="background: linear-gradient(135deg, #242424 0%, #1a3a1a"] {
    background: var(--surface) !important;
}

/* ── Table theming ───────────────────────────────────────── */
thead tr,
.table-header,
th {
    background: var(--surface2) !important;
    color: var(--text-dim) !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    border-color: var(--border2) !important;
}

tbody tr {
    border-bottom: 1px solid var(--border) !important;
}

tbody tr:hover {
    background: rgba(255,255,255,0.04) !important;
}

table {
    border-color: var(--border2) !important;
}

/* ── Section / page headers ──────────────────────────────── */
.page-title,
.section-title,
h1.title,
h2.title {
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.6px !important;
    color: var(--text) !important;
    text-shadow: none !important;
    border-left: 3px solid var(--accent) !important;
    padding-left: 10px !important;
}

/* ── Filter / tab bars ───────────────────────────────────── */
.filter-bar,
.tab-bar,
.season-tabs,
.tier-tabs,
.view-tabs {
    background: var(--surface) !important;
    border: 1px solid var(--border2) !important;
    border-radius: 6px !important;
}

.filter-btn,
.tab-btn,
.season-tab,
.tier-tab,
.view-btn {
    color: var(--text-dim) !important;
    background: transparent !important;
    border: none !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
}

.filter-btn.active,
.tab-btn.active,
.season-tab.active,
.tier-tab.active,
.view-btn.active {
    background: var(--accent-dim) !important;
    color: var(--accent) !important;
    border-radius: 4px !important;
}

/* ── Input / search ──────────────────────────────────────── */
input[type="text"],
input[type="search"],
select,
.search-input {
    background: var(--surface2) !important;
    border: 1px solid var(--border2) !important;
    color: var(--text) !important;
    border-radius: 4px !important;
}

input[type="text"]:focus,
input[type="search"]:focus,
select:focus {
    outline: none !important;
    border-color: var(--accent) !important;
}

/* ── Green gradient table row highlight → flat accent ────── */
.rank-highlight,
.playoff-row,
.top-player {
    background: var(--accent-dim) !important;
}

/* Accent text stays green — only bg/border changes */
.accent,
.green-text,
.stat-accent {
    color: var(--accent) !important;
}

/* ── Hero/banner areas ───────────────────────────────────── */
.hero,
.page-hero,
.banner {
    border: 1px solid var(--border2) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
}

/* ── Cards generic ───────────────────────────────────────── */
.card,
.panel {
    background: var(--surface2) !important;
    border: 1px solid var(--border) !important;
    border-radius: 6px !important;
}

/* ── Scrollbar styling ───────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: #333; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #444; }