/* 3OAK V2 - MASTER THEME */
:root {
    --oak-green: #4ade80;
    --oak-yellow: #f3d03e;
    --oak-red: #f87171;
    --oak-white: #ffffff;
    --oak-black: #000000;
    --grad-start: #020617;
    --grid-line: rgba(255, 255, 255, 0.40); 
    --font-main: 'Inter', sans-serif;
    --border-main: 2px solid var(--oak-green);
    --glow-yellow: 0 0 15px rgba(243, 208, 62, 0.5);
    --glow-red: 0 0 15px rgba(248, 113, 113, 0.5);
}

* { box-sizing: border-box; text-transform: uppercase; margin: 0; padding: 0; }

body {
    height: 100vh; width: 100vw; overflow: hidden; 
    font-family: var(--font-main); color: var(--oak-white);
    background-color: var(--grad-start);
    background-image: 
        linear-gradient(var(--grid-line) 1px, transparent 1px),
        linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
    background-size: 50px 50px; background-attachment: fixed;
    padding: 20px; display: flex; flex-direction: column;
}

#nav-placeholder { min-height: 74px; display: block; }

/* Rule 1 & 2: Scrollbars */
.cyber-panel::-webkit-scrollbar, 
.scroll-area::-webkit-scrollbar { width: 6px; }
.cyber-panel::-webkit-scrollbar-track, 
.scroll-area::-webkit-scrollbar-track { background: var(--oak-black); }
.cyber-panel::-webkit-scrollbar-thumb, 
.scroll-area::-webkit-scrollbar-thumb { background: var(--oak-green); border-radius: 10px; }
.cyber-panel::-webkit-scrollbar-thumb:hover, 
.scroll-area::-webkit-scrollbar-thumb:hover { 
    background: var(--oak-yellow); 
    box-shadow: var(--glow-yellow); 
}

/* Standardized Buttons */
.btn-oak, .btn-oak-red {
    background-color: var(--oak-black) !important;
    font-family: var(--font-main) !important;
    font-size: 0.8rem !important; 
    padding: 8px 16px !important;
    cursor: pointer; font-weight: bold;
    display: inline-flex; align-items: center; justify-content: center;
    transition: all 0.1s ease; text-decoration: none; white-space: nowrap;
}
.btn-oak { border: var(--border-main) !important; color: var(--oak-green) !important; }
.btn-oak:hover { border-color: var(--oak-yellow) !important; color: var(--oak-yellow) !important; box-shadow: var(--glow-yellow); }

.btn-oak-red { border: 2px solid var(--oak-red) !important; color: var(--oak-red) !important; }
.btn-oak-red:hover { box-shadow: var(--glow-red); background: rgba(248, 113, 113, 0.1) !important; }

/* Global Input & Data Standard */
input, select, textarea, td {
    background-color: var(--oak-black) !important;
    color: var(--oak-white) !important;
    border: 1px solid var(--oak-green);
    padding: 8px 10px !important;
    font-family: var(--font-main) !important;
    font-weight: normal !important;
    font-size: 0.85rem !important;
    outline: none;
}
td { border: none !important; background: transparent !important; } /* Reset table data specifically */
input:focus, select:focus { border-color: var(--oak-yellow); }

.cyber-panel { background-color: rgba(0, 0, 0, 0.92); border: var(--border-main); border-radius: 12px; padding: 20px; }
.label-text { font-size: 0.7rem; color: var(--oak-yellow); margin-bottom: 5px; font-weight: bold; }