/* =========================================================
   THE WIZARD'S HALL - CLEAN TACTICAL HUD
   ========================================================= */

.wizard-hall {
    /* 1. Stretch to full width of the parent site-wrapper */
    width: 99% !important;
    max-width: 98% !important; 
    padding: 0 0 !important; /* Vertical space only, let children handle horizontal */
    display: flex;
    flex-direction: column;
    gap: 30px;
    background: transparent !important;
    position: relative;
    /* This overrides the 'Courier New' from your main_theme.css */
    font-family: "Georgia", "Times New Roman", serif !important;
    line-height: 1.4 !important;
    color: var(--strobe-white) !important;
    letter-spacing: 0.5px;
    min-height: 80vh;
    justify-content: flex-start;
    z-index: 5;
}

/* 🔐 AUTHENTICATION BOX SPECIFICS */
.auth-container, .register-container {
    margin-top: 10px !important; /* Minimal gap from the header */
    width: 100%;
    max-width: 500px !important; /* Keeps the login box tight and tactical */
}

/* --- TITLES & HEADERS --- */
.wizard-hall h2, 
.wizard-hall h3, 
.wizard-hall .level-number, 
.wizard-hall .stat-value {
    font-family: "Georgia", serif !important;
    font-weight: 900 !important; /* Force extra bold weight */
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
}

/* Keep the labels slightly smaller and clean */
.wizard-hall .stat-label, 
.wizard-hall .level-title, 
.wizard-hall .news-time {
    font-family: 'Times New Roman', Times, serif !important;
    font-size: 0.85rem;
}


/* --- LEVEL UP BANNER --- */
.level-up-banner {
    text-align: center;
    padding: 20px;
    margin-top: 40px !important;
    border: 1px solid var(--primary-green);
    background: rgba(0, 0, 0, 0.8);
    box-shadow: var(--neon-glow);
    animation: level-up-pulse 3s infinite ease-in-out;
    box-sizing: border-box; /* Prevents padding from pushing width past 100% */
    width: 100%;
}

.level-number {
    font-size: 2.5rem;
    color: var(--primary-green);
    text-shadow: var(--neon-bloom);
    font-family: var(--crt-font);
}

.xp-bar {
    width: 100%;
    height: 10px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 5px;
    margin: 15px 0;
    overflow: hidden;
    border: 1px solid rgba(9, 245, 48, 0.3);
}

.xp-progress {
    height: 100%;
    background: var(--primary-green);
    box-shadow: 0 0 10px var(--primary-green);
}

/* --- STATS GRID --- */
.wizard-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
    gap: 20px;
    width: 100%;
}

.stat-card {
    background: rgba(0, 0, 0, 0.8);
    border: 1px solid rgba(9, 245, 48, 0.4);
    padding: 20px;
    text-align: center;
    transition: all 0.3s ease;
}

.stat-card:hover {
    border-color: var(--primary-green);
    box-shadow: var(--neon-glow);
    transform: translateY(-5px);
}

.stat-value {
    font-size: 2rem;
    color: var(--primary-green);
    display: block;
}

/* --- RECRUITMENT & NEWS --- */
.recruitment-banner {
    border: 1px solid var(--plasma-orange);
    padding: 30px;
    text-align: center;
    background: rgba(10, 5, 0, 0.7);
    box-shadow: var(--orange-glow);
    box-sizing: border-box; /* Prevents padding from pushing width past 100% */
    width: 100%;
}

/* --- FIXING THE LINKS (JOIN THE CHESS LEGION) --- */
.recruit-buttons .btn {
    font-family: "Georgia", serif !important;
    font-weight: bold !important;
    text-decoration: none !important;
    display: inline-block;
}

.recruit-btn {
    background: #ff0000 !important; /* Solid High-Vis Red like your example */
    color: #ffffff !important;
    border: 1px solid #7a0000 !important;
    padding: 10px 25px !important;
}

.learn-btn {
    color: #ffffff !important;
    text-decoration: underline !important;
    background: transparent !important;
    margin-left: 20px;
}

.news-section {
    width: 100%;
    box-sizing: border-box; /* Prevents padding from pushing width past 100% */
}

.news-section h2, 
.academy-gateway h2,
.live-challenges h2 {
    text-align: center !important;
    font-family: "Georgia", "Times New Roman", serif !important; /* Fixed Serif Font */
    font-size: 2.2rem !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: 4px !important;
    margin-bottom: 50px !important;
    position: relative !important;
    padding-bottom: 15px !important;
    width: 100% !important;
    color: var(--strobe-white) !important;
}

/* THE UNDERLINE: Echoing the top horizontal line style */
.news-section h2::after, 
.academy-gateway h2::after,
.live-challenges h2::after {
    content: "" !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 60% !important; /* Matches the top horizontal line width */
    height: 2px !important;
    background: var(--primary-green) !important; /* Neon Green */
    box-shadow: var(--neon-glow) !important; /* Plasma Aura */
}
.news-item {
    border-left: 3px solid var(--primary-green);
    background: rgba(255, 255, 255, 0.05);
    margin-bottom: 15px;
    padding: 15px;
    font-weight: bold !important;
    color: var(--primary-green) !important;
    font-size: 0.8rem !important;
}

.news-item h3 {
    font-size: 1.4rem !important;
    margin-bottom: 5px !important;
}

.news-item p {
    font-weight: 500 !important; /* Slightly heavier than standard text */
    font-size: 1rem !important;
}

/* --- ACADEMY GRID --- */

.academy-gateway {
    width: 100%;
    box-sizing: border-box; /* Prevents padding from pushing width past 100% */
}

.academy-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
    gap: 20px;
    width: 100%;
}

.academy-card {
    border: 1px solid rgba(255,255,255,0.1);
    padding: 20px;
    background: rgba(0,0,0,0.6);
}

.academy-card:hover {
    border-color: var(--primary-green);
}

.live-challenges {
    width: 100%;
    box-sizing: border-box; /* Prevents padding from pushing width past 100% */
}

.challenge-list {
    display: grid !important;
    /* Use 1fr to ensure boxes stretch to fill all available horizontal space */
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) !important;
    gap: 20px;
    width: 100%;
}

/* Faction-specific glows */
.underline-green::after {
    background: var(--primary-green) !important;
    box-shadow: var(--neon-glow) !important;
}

.underline-orange::after {
    background: var(--plasma-orange) !important;
    box-shadow: var(--orange-glow) !important;
}

.faction-black .stat-card {
    border-color: var(--plasma-orange) !important;
}

.faction-black .stat-card:hover {
    box-shadow: var(--orange-glow) !important;
}

@keyframes level-up-pulse {
    0%, 100% { transform: scale(1); opacity: 0.9; }
    50% { transform: scale(1.02); opacity: 1; }
}

/* 🔓 TERMINAL OVERRIDE - UNLOCK SCROLL */
.terminal-main-frame {
    /* Remove the fixed height that was meant for the news terminal */
    height: auto !important; 
    max-height: none !important;
    min-height: 100vh;
    width: 95% !important; /* Ensure full width */
    display: flex;
    flex-direction: column; /* Stack children vertically */
    background: transparent !important; /* Transparent background for full scroll */
    /* Ensure the browser allows vertical scrolling */
    overflow-y: visible !important; 
    overflow-x: hidden;
}

.wizard-hall {
    /* Ensure the container itself doesn't trap the scroll */
    overflow: visible !important;
    /* Add a buffer so the last "Live Challenge" doesn't hit the footer */
    padding-bottom: 80px !important; 
}

/* 🔓 HUD CONTAINER SCROLL FIX */
.terminal-main-frame {
    height: auto !important;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    overflow-y: visible !important; /* Fixes the scrolling cutoff */
    background: transparent !important;
}

.wizard-hall {
    width: 100% !important;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

/* 🟢 Force Content Visibility */
.wizard-hall > * {
    opacity: 1 !important;
    visibility: visible !important;
}