/* ============================================================
   Wide Eye Digital BBS — Custom Theme
   Clean / Modern Retro — Phosphor Green on Black
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Share+Tech+Mono&family=VT323&display=swap');

/* ── Root Variables ─────────────────────────────────────── */
:root {
    --phosphor:      #39ff6e;
    --phosphor-dim:  #1a7a3a;
    --phosphor-glow: 0 0 8px #39ff6e, 0 0 20px #1aff5a44;
    --amber:         #ffb000;
    --bg-black:      #090d0b;
    --bg-dark:       #0e1410;
    --bg-panel:      #111a13;
    --bg-elevated:   #172019;
    --border:        #1e3320;
    --text-main:     #c8e6c9;
    --text-dim:      #6a9670;
    --scanline-size: 3px;
}

/* ── Base ───────────────────────────────────────────────── */
body, .dark {
    background-color: var(--bg-black) !important;
    color: var(--text-main) !important;
    font-family: 'Share Tech Mono', 'Courier New', monospace !important;
    font-size: 14px;
}

/* Subtle scanline overlay on the body */
body::before {
    content: '';
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    pointer-events: none;
    z-index: 9999;
    background: repeating-linear-gradient(
        0deg,
        transparent,
        transparent calc(var(--scanline-size) - 1px),
        rgba(0, 0, 0, 0.18) var(--scanline-size)
    );
}

/* ── Navbar ─────────────────────────────────────────────── */
.dark .navbar,
.navbar,
.navbar-default {
    background-color: var(--bg-dark) !important;
    border-bottom: 1px solid var(--phosphor-dim) !important;
    box-shadow: 0 2px 12px rgba(57, 255, 110, 0.12);
}

.dark .navbar-brand,
.navbar-default .navbar-brand {
    font-family: 'VT323', monospace !important;
    font-size: 26px !important;
    color: var(--phosphor) !important;
    text-shadow: var(--phosphor-glow);
    letter-spacing: 2px;
    text-transform: uppercase;
}
.dark .navbar-brand:hover,
.navbar-default .navbar-brand:hover {
    color: #fff !important;
    text-shadow: 0 0 14px #39ff6e, 0 0 30px #39ff6e88;
}

.navbar-default .navbar-nav > li > a,
.dark .navbar-default a {
    color: var(--text-dim) !important;
    font-family: 'Share Tech Mono', monospace !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 12px;
    transition: color 0.2s, text-shadow 0.2s;
}
.navbar-default .navbar-nav > li > a:hover,
.dark .navbar-default a:hover {
    color: var(--phosphor) !important;
    text-shadow: var(--phosphor-glow);
    background-color: transparent !important;
}

/* ── Dropdowns ──────────────────────────────────────────── */
.dark .dropdown-menu,
.dropdown-menu {
    background-color: var(--bg-panel) !important;
    border: 1px solid var(--phosphor-dim) !important;
    box-shadow: 0 4px 20px rgba(57, 255, 110, 0.15);
    border-radius: 0 !important;
}
.dark .dropdown-menu li a,
.dropdown-menu li a {
    color: var(--text-dim) !important;
    font-family: 'Share Tech Mono', monospace !important;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.dark .dropdown-menu li a:hover,
.dropdown-menu li a:hover {
    color: var(--phosphor) !important;
    background-color: var(--bg-elevated) !important;
    text-shadow: var(--phosphor-glow);
}

/* ── Login form in dropdown ─────────────────────────────── */
#login-form {
    background-color: var(--bg-panel) !important;
    min-width: 220px;
}
.dark input, .dark select, .dark textarea,
input[type="text"], input[type="password"] {
    background-color: var(--bg-black) !important;
    color: var(--phosphor) !important;
    border: 1px solid var(--phosphor-dim) !important;
    border-radius: 0 !important;
    font-family: 'Share Tech Mono', monospace !important;
    outline: none !important;
    box-shadow: none !important;
}
input[type="text"]:focus, input[type="password"]:focus {
    border-color: var(--phosphor) !important;
    box-shadow: 0 0 6px rgba(57, 255, 110, 0.4) !important;
}
::placeholder { color: var(--phosphor-dim) !important; }

/* ── Buttons ────────────────────────────────────────────── */
.dark .btn, .btn {
    background-color: var(--bg-elevated) !important;
    color: var(--phosphor) !important;
    border: 1px solid var(--phosphor-dim) !important;
    border-radius: 0 !important;
    font-family: 'Share Tech Mono', monospace !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: all 0.2s;
}
.dark .btn:hover, .btn:hover,
.dark .btn-primary, .btn-primary {
    background-color: var(--phosphor-dim) !important;
    color: var(--bg-black) !important;
    border-color: var(--phosphor) !important;
    box-shadow: var(--phosphor-glow);
}
.dark .btn-primary:hover {
    background-color: var(--phosphor) !important;
}

/* ── List groups / panels ───────────────────────────────── */
.dark .list-group-item,
.list-group-item {
    background-color: var(--bg-panel) !important;
    color: var(--text-main) !important;
    border-color: var(--border) !important;
    border-radius: 0 !important;
    font-family: 'Share Tech Mono', monospace !important;
}
.dark .list-group-item:hover,
.dark a.list-group-item:hover {
    background-color: var(--bg-elevated) !important;
    color: var(--phosphor) !important;
    text-shadow: 0 0 6px rgba(57, 255, 110, 0.3);
}

/* Alternating rows */
.dark .striped:nth-of-type(even),
.dark .table-striped > tbody > tr:nth-child(odd) > td {
    background: var(--bg-elevated) !important;
}

/* ── Breadcrumbs ────────────────────────────────────────── */
.dark .breadcrumb, .breadcrumb {
    background-color: var(--bg-panel) !important;
    border: 1px solid var(--border);
    border-radius: 0 !important;
    color: var(--text-dim);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.dark a, a {
    color: var(--phosphor-dim) !important;
}
.dark a:hover, a:hover {
    color: var(--phosphor) !important;
    text-shadow: 0 0 4px rgba(57, 255, 110, 0.4);
}

/* ── Badges ─────────────────────────────────────────────── */
.dark span.badge.new,
span.badge.scanned,
span.badge.new {
    background: var(--phosphor-dim) !important;
    color: var(--bg-black) !important;
    border-radius: 0 !important;
    font-family: 'Share Tech Mono', monospace !important;
}

/* ── ANSI/pre blocks ────────────────────────────────────── */
pre.ansi, pre {
    background-color: var(--bg-black) !important;
    color: var(--phosphor) !important;
    border: 1px solid var(--border) !important;
    border-radius: 0 !important;
    font-family: 'Share Tech Mono', monospace !important;
    line-height: 1.2;
}

/* ── Footer ─────────────────────────────────────────────── */
footer {
    border-top: 1px solid var(--phosphor-dim);
    color: var(--text-dim) !important;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 2px;
    text-align: center;
    padding: 10px 0;
    margin-top: 20px;
}

/* ── Modal ──────────────────────────────────────────────── */
.dark .modal-content {
    background-color: var(--bg-panel) !important;
    color: var(--text-main) !important;
    border: 1px solid var(--phosphor-dim) !important;
    border-radius: 0 !important;
}
.modal-header {
    border-bottom: 1px solid var(--border) !important;
}

/* ── Dark switch checkbox ───────────────────────────────── */
.darkswitchbox label {
    color: var(--text-dim) !important;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* ── Headings ───────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6 {
    font-family: 'VT323', monospace !important;
    color: var(--phosphor) !important;
    text-shadow: 0 0 6px rgba(57, 255, 110, 0.3);
    letter-spacing: 2px;
    text-transform: uppercase;
}

/* ── hr ─────────────────────────────────────────────────── */
hr {
    border-color: var(--phosphor-dim) !important;
    opacity: 0.4;
}

/* ── Scrollbar ──────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; background: var(--bg-black); }
::-webkit-scrollbar-thumb { background: var(--phosphor-dim); border-radius: 0; }
::-webkit-scrollbar-thumb:hover { background: var(--phosphor); }