@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@300;400;500&family=Rajdhani:wght@400;500;600&display=swap');

/* OUTPOST GDR cinematic base.
   Legacy amber/rust/hazard theme removed; outpost.css remains the final authority. */
:root {
    --outpost-global-bg: url("../images/outpost-vault-bg.png");

    --color-bg: #071015;
    --color-bg-2: #0b161b;
    --color-primary: rgba(232, 242, 238, 0.88);
    --color-primary-dark: rgba(166, 190, 191, 0.54);
    --color-accent: rgba(178, 231, 216, 0.82);
    --color-accent-cold: rgba(150, 218, 220, 0.82);
    --color-accent-cold-dim: rgba(150, 218, 220, 0.12);
    --color-accent-warm: rgba(206, 196, 218, 0.72);
    --color-accent-hover: rgba(238, 248, 245, 0.96);
    --color-on-accent: #071015;
    --color-accent-rust: rgba(170, 190, 194, 0.58);
    --color-accent-rust-dim: rgba(170, 190, 194, 0.08);

    --color-text: rgba(232, 238, 235, 0.78);
    --color-text-bright: rgba(248, 252, 248, 0.94);
    --color-text-muted: rgba(218, 230, 226, 0.52);
    --color-text-dim: rgba(218, 230, 226, 0.30);

    --color-surface: rgba(4, 10, 13, 0.18);
    --color-surface-dark: rgba(2, 7, 10, 0.28);
    --color-surface-mid: rgba(6, 13, 16, 0.22);

    --color-border: rgba(226, 240, 238, 0.07);
    --color-border-dim: rgba(226, 240, 238, 0.04);
    --color-border-gold: rgba(226, 240, 238, 0.13);

    --color-danger: rgba(216, 104, 92, 0.92);
    --color-danger-bg: rgba(216, 104, 92, 0.10);
    --color-success: rgba(152, 212, 194, 0.82);
    --color-success-bg: rgba(152, 212, 194, 0.10);

    --shadow-panel: 0 16px 54px rgba(0, 0, 0, 0.24);
    --shadow-glow: 0 0 18px rgba(150, 218, 220, 0.09);
    --shadow-inner: inset 0 1px 0 rgba(255, 255, 255, 0.035);

    --font-family: "Rajdhani", "Roboto Condensed", system-ui, sans-serif;
    --font-display: "Barlow Condensed", "Oswald", "Arial Narrow", sans-serif;
    --font-display-light: var(--font-display);
    --font-distress: var(--font-display);
    --font-mono: "Courier New", "Consolas", monospace;

    --hud-amber: var(--color-accent-cold);
    --hud-corner: 10px;
    --hud-thick: 1px;
    --hud-dash: rgba(226, 240, 238, 0.10);

    --grunge-texture: none;
    --grunge-noise: none;
    --grunge-scratch: none;
    --scanlines: none;
    --hazard-stripes: none;

    --bg-outside: var(--outpost-global-bg);
    --bg-vault: var(--outpost-global-bg);
    --bg-dashboard: var(--outpost-global-bg);
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    min-height: 100%;
    background:
        var(--outpost-global-bg) center center / cover fixed no-repeat,
        var(--color-bg);
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    min-height: 100%;
    margin: 0;
    color: var(--color-text);
    font-family: var(--font-family);
    font-size: 1rem;
    line-height: 1.5;
    background:
        var(--outpost-global-bg) center center / cover fixed no-repeat,
        var(--color-bg);
}

body::before,
html::before,
html::after {
    content: none !important;
}

button,
input,
select,
textarea,
optgroup {
    font-family: var(--font-family);
    font-size: 1rem;
    color: inherit;
}

h1,
h2,
h3,
h4,
h5,
h6,
.navbar-brand,
.logo {
    margin: 0;
    color: var(--color-text-bright);
    font-family: var(--font-display-light);
    font-weight: 300;
    line-height: 1.08;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    text-shadow: 0 3px 18px rgba(0, 0, 0, 0.70);
}

p,
span,
a,
li,
td,
th,
label,
small,
blockquote,
q,
cite,
em,
strong {
    font-family: inherit;
}

a {
    color: var(--color-text);
    text-decoration: none;
}

a:hover,
a:focus-visible {
    color: var(--color-text-bright);
}

body > header,
.navbar,
.site-nav,
.game-header-nav,
footer,
.homepage-footer,
.footer-terminal,
.dashboard-nav,
.sidebar,
.sidebar-right,
.bottom-icon-bar {
    background: transparent !important;
    border-color: var(--color-border-dim) !important;
    box-shadow: none !important;
}

.card,
.panel,
.login-card,
.register-card,
.form-card,
.dashboard-panel,
.form-section,
.modal,
.modal-content,
.drag-modal,
.draggable-modal,
.dropdown-menu,
.dropdown,
.menu-panel,
.docs-sidebar,
.docs-content,
.content-panel,
.manual-section,
.rule,
.forum-wrapper,
.pagina_forum,
.page_body,
.panels_box,
.forum_content,
.wa-side,
.wa-main,
.wa-dialog,
.message-bubble,
.map-room-panel {
    background: var(--color-surface) !important;
    border: 1px solid var(--color-border) !important;
    box-shadow: none !important;
}

.modal,
.modal-content,
.drag-modal,
.draggable-modal,
.dropdown-menu,
.dropdown,
.menu-panel {
    background: rgba(5, 12, 15, 0.48) !important;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

.btn-tld,
.btn-submit,
.btn-test,
.btn-step-yes,
.btn-step-no,
.btn-logout,
.btn-enter-game,
.btn-stat,
button,
.button,
.btn,
input[type="submit"] {
    color: var(--color-text-bright);
    background: transparent !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 3px;
    box-shadow: none !important;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    transition: color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.btn-tld:hover,
.btn-submit:hover,
.btn-test:hover,
.btn-step-yes:hover,
.btn-logout:hover,
.btn-enter-game:hover,
button:hover,
.button:hover,
.btn:hover,
input[type="submit"]:hover {
    color: var(--color-text-bright);
    background: transparent !important;
    border-color: var(--color-border-gold) !important;
    box-shadow: none !important;
}

.btn-step-no,
.danger,
.btn-logout {
    color: var(--color-danger) !important;
    border-color: rgba(216, 104, 92, 0.20) !important;
}

input,
textarea,
select,
.form-input,
.form-textarea,
.chat-textarea {
    background: rgba(2, 8, 11, 0.24) !important;
    border: 1px solid var(--color-border) !important;
    color: var(--color-text);
    outline: none;
}

input:focus,
textarea:focus,
select:focus,
.form-input:focus,
.form-textarea:focus,
.chat-textarea:focus {
    border-color: rgba(226, 240, 238, 0.28) !important;
    box-shadow: 0 0 0 2px rgba(150, 218, 220, 0.05) !important;
}

* {
    scrollbar-color: rgba(226, 240, 238, 0.24) rgba(0, 0, 0, 0.12);
    scrollbar-width: thin;
}

*::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

*::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.12);
}

*::-webkit-scrollbar-thumb {
    background: rgba(226, 240, 238, 0.18);
}

*:focus-visible {
    outline: 1px solid rgba(226, 240, 238, 0.42);
    outline-offset: 3px;
}

::selection {
    background: rgba(150, 218, 220, 0.20);
    color: var(--color-text-bright);
}

.hazard-strip {
    display: none !important;
}

@media (max-width: 768px) {
    html,
    body {
        background:
            var(--outpost-global-bg) center center / cover scroll no-repeat,
            var(--color-bg);
    }
}