/*
 * Phosphor: an amber CRT terminal. Dark only (the registry lists a single
 * mode, so the light/dark toggle hides). VT323 pixel lettering with a faint
 * glow for headings, IBM Plex Mono for everything else; scanlines, F-key
 * labels on the nav, a blinking block cursor after the brand, "// " panel
 * titles and inverse-video hover/selection. Status and security cells keep
 * distinct green/amber/red tints so they stay readable. Fonts are loaded by
 * themes/theme-boot.js from the registry entry.
 */

html[data-fw-theme="phosphor"] {
    --fw-bg: #0b0a07;
    --fw-surface: #12100b;
    --fw-surface-2: #1a160e;
    --fw-text: #f2deb3;
    --fw-muted: #b8862a;
    --fw-border: #4a3a17;
    --fw-border-strong: #ffb000;
    --fw-border-width: 1px;
    --fw-accent: #ffb000;
    --fw-on-accent: #0b0a07;
    --fw-accent-2: #ffb000;
    --fw-on-accent-2: #0b0a07;
    --fw-link: #ffb000;
    --fw-link-hover: #ffd166;
    --fw-focus: rgba(255, 176, 0, 0.35);
    --fw-positive: #9fe07a;
    --fw-negative: #ff6b5a;
    --fw-warning: #ffb000;
    --fw-info: #e8c27a;
    --fw-on-status: #0b0a07;
    --fw-on-warning: #0b0a07;
    --fw-nav-bg: #0e0c08;
    --fw-nav-text: #f2deb3;
    --fw-footer-bg: #0e0c08;
    --fw-footer-text: #b8862a;
    --fw-input-bg: #0b0a07;
    --fw-code-bg: #12100b;
    --fw-row-stripe: rgba(255, 176, 0, 0.035);
    --fw-row-hover: rgba(255, 176, 0, 0.10);
    --fw-radius-sm: 0px;
    --fw-radius-md: 0px;
    --fw-radius-lg: 0px;
    --fw-radius-pill: 0px;
    --fw-font-body: "IBM Plex Mono", Menlo, Consolas, monospace;
    --fw-font-display: "VT323", "IBM Plex Mono", monospace;
    --fw-font-mono: "IBM Plex Mono", Menlo, Consolas, monospace;
    --fw-sec-high: #2f5a2a;
    --fw-sec-low: #6b5310;
    --fw-sec-null: #6e2418;
    --fw-on-sec: #f2deb3;
    --fw-status-good: #2f5a2a;
    --fw-status-ok: #6b5310;
    --fw-status-bad: #6e2418;
    --fw-status-hover: #2a2418;
    --fw-on-status-cell: #f2deb3;
    --fw-group-row: #1f1a10;
    --fw-shadow-raised: 0 0 8px rgba(255, 176, 0, 0.35);
    --ph-glow: rgba(255, 176, 0, 0.35);
}

/* ---- Decoration ---- */

html[data-fw-theme="phosphor"] body {
    font-size: 13px;
    caret-color: var(--fw-accent);
}

/* Scanlines over everything; never intercepts clicks */
html[data-fw-theme="phosphor"] body::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 10000;
    background: repeating-linear-gradient(0deg, transparent 0, transparent 2px, rgba(0, 0, 0, 0.16) 3px);
}

/* Pixel headings with phosphor glow. VT323 runs small, so it's sized up. */
html[data-fw-theme="phosphor"] h1,
html[data-fw-theme="phosphor"] h2,
html[data-fw-theme="phosphor"] h3 {
    color: var(--fw-accent);
    text-shadow: 0 0 10px var(--ph-glow);
    font-weight: 400;
    letter-spacing: 1px;
    text-transform: uppercase;
    line-height: 1;
}
html[data-fw-theme="phosphor"] h1 { font-size: 52px; }
html[data-fw-theme="phosphor"] h2 { font-size: 40px; }
html[data-fw-theme="phosphor"] h3 { font-size: 32px; }
html[data-fw-theme="phosphor"] h1 a,
html[data-fw-theme="phosphor"] h2 a,
html[data-fw-theme="phosphor"] h3 a { color: inherit; }
html[data-fw-theme="phosphor"] h4,
html[data-fw-theme="phosphor"] h5,
html[data-fw-theme="phosphor"] h6 { color: var(--fw-accent); text-transform: uppercase; letter-spacing: 1px; }

/* Navbar: brand with a blinking block cursor, F-key labels on the items */
html[data-fw-theme="phosphor"] #topnavbar {
    border: 0;
    border-bottom: 1px solid var(--fw-border);
    margin-bottom: 24px;
}
html[data-fw-theme="phosphor"] #topnavbar .navbar-brand {
    font-family: var(--fw-font-display);
    font-size: 30px;
    letter-spacing: 2px;
    color: var(--fw-accent);
    text-shadow: 0 0 8px var(--ph-glow);
    text-transform: uppercase;
}
html[data-fw-theme="phosphor"] #topnavbar .navbar-brand::after {
    content: "";
    display: inline-block;
    width: 10px;
    height: 20px;
    margin-left: 4px;
    vertical-align: -3px;
    background: var(--fw-accent);
    animation: ph-blink 1.1s steps(1) infinite;
}
@keyframes ph-blink { 50% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
    html[data-fw-theme="phosphor"] #topnavbar .navbar-brand::after { animation: none; }
}
html[data-fw-theme="phosphor"] #topnavbar .navbar-nav { counter-reset: fkey; }
html[data-fw-theme="phosphor"] #topnavbar .navbar-nav > li > a {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding-left: 9px;
    padding-right: 9px;
}
html[data-fw-theme="phosphor"] #topnavbar .navbar-nav > li > a::before {
    counter-increment: fkey;
    content: "F" counter(fkey) " ";
    color: var(--fw-muted);
    font-size: 10px;
}
html[data-fw-theme="phosphor"] #topnavbar .navbar-nav > li > a:hover::before,
html[data-fw-theme="phosphor"] #topnavbar .navbar-nav > .open > a::before { color: inherit; }

/* Panels: dim frames, "// " titles */
html[data-fw-theme="phosphor"] .panel {
    border-color: var(--fw-border);
    box-shadow: none;
}
html[data-fw-theme="phosphor"] .panel > .panel-heading {
    background-color: transparent;
    border-bottom: 1px solid var(--fw-border);
}
html[data-fw-theme="phosphor"] .panel-title,
html[data-fw-theme="phosphor"] .panel > .panel-heading {
    font-family: var(--fw-font-body);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--fw-muted);
}
html[data-fw-theme="phosphor"] .panel-title::before { content: "// "; }
html[data-fw-theme="phosphor"] .panel-title a { color: var(--fw-muted); }
html[data-fw-theme="phosphor"] .panel-title a:hover { color: var(--fw-accent); }

/* Controls: amber outlines, inverse video on hover */
html[data-fw-theme="phosphor"] .btn,
html[data-fw-theme="phosphor"] :where(button:not(.navbar-toggle, .close)),
html[data-fw-theme="phosphor"] :where(input[type="button"], input[type="submit"], input[type="reset"]) {
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
html[data-fw-theme="phosphor"] .btn-default,
html[data-fw-theme="phosphor"] :where(button:not(.btn, .navbar-toggle, .close)),
html[data-fw-theme="phosphor"] :where(input[type="button"]:not(.btn), input[type="submit"]:not(.btn), input[type="reset"]:not(.btn)) {
    background-color: transparent;
    color: var(--fw-accent);
    border-color: var(--fw-accent);
}
html[data-fw-theme="phosphor"] .btn-default:hover,
html[data-fw-theme="phosphor"] .btn-default:focus,
html[data-fw-theme="phosphor"] :where(button:not(.btn, .navbar-toggle, .close)):hover,
html[data-fw-theme="phosphor"] :where(input[type="button"]:not(.btn), input[type="submit"]:not(.btn)):hover {
    background-color: var(--fw-accent);
    color: var(--fw-on-accent);
    box-shadow: 0 0 8px var(--ph-glow);
}
html[data-fw-theme="phosphor"] .form-control,
html[data-fw-theme="phosphor"] input:not([type]),
html[data-fw-theme="phosphor"] input[type="text"],
html[data-fw-theme="phosphor"] input[type="number"],
html[data-fw-theme="phosphor"] input[type="search"],
html[data-fw-theme="phosphor"] select,
html[data-fw-theme="phosphor"] textarea { border-color: var(--fw-border); }
html[data-fw-theme="phosphor"] .form-control:focus,
html[data-fw-theme="phosphor"] input:focus,
html[data-fw-theme="phosphor"] select:focus,
html[data-fw-theme="phosphor"] textarea:focus { border-color: var(--fw-accent); box-shadow: 0 0 0 1px var(--fw-accent), 0 0 10px var(--ph-glow); }

/* Tables: monospace is wide, so data tables drop a size to stay inside the
   page container (the LP store table overflowed at body size). */
html[data-fw-theme="phosphor"] .table,
html[data-fw-theme="phosphor"] table.dataTable { font-size: 12px; }

/* Tables: dim uppercase column heads, dashed row rules */
html[data-fw-theme="phosphor"] .table > thead > tr > th,
html[data-fw-theme="phosphor"] table.dataTable thead th,
html[data-fw-theme="phosphor"] .fw-grid thead th {
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--fw-muted);
}
html[data-fw-theme="phosphor"] .table > thead > tr > th { border-bottom: 1px solid var(--fw-border); }
html[data-fw-theme="phosphor"] .table > tbody > tr > td,
html[data-fw-theme="phosphor"] .table > tbody > tr > th { border-top: 1px dashed var(--fw-border); }
html[data-fw-theme="phosphor"] .fw-grid .fw-group-row {
    font-size: 24px;
    color: var(--fw-accent);
    text-shadow: 0 0 8px var(--ph-glow);
    letter-spacing: 1px;
    text-transform: uppercase;
}
html[data-fw-theme="phosphor"] #priceheader { color: var(--fw-accent); }

/* Footer, labels */
html[data-fw-theme="phosphor"] #footer { border-top: 1px dashed var(--fw-border); }
html[data-fw-theme="phosphor"] .label,
html[data-fw-theme="phosphor"] .badge { border-radius: 0; font-weight: 500; text-transform: uppercase; }