/**
 * Theme: tbweb (TBT — navy, green accent, light text).
 * Set CSS_THEME to CSS_THEME_TBWEB in config/config.php.
 * Must define the same --token names as theme-former.css (values may differ); layout rules below are tbweb-only.
 */
:root {
    /* Core palette (TBT / navy + green) */
    --primary-color: #1cb56a;
    --primary-dark: #159954;
    --success-color: #1cb56a;
    --danger-color: #e05a5a;
    --warning-color: #e6a832;
    --info-color: #4a9fd4;
    --light-color: #071b33;
    --dark-color: #f4f7fb;
    --text-color: rgba(232, 237, 245, 1);
    --border-color: #123055;
    --shadow: 0 4px 24px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.45);

    /* Page & surfaces */
    --page-bg: #041326;
    --surface-white: #ffffff;
    --surface-muted: #f8f9fa;
    --bg-secondary: #082544;
    --surface-elevated: #082544;
    --surface-info-tint: #0a2d52;

    /* Muted typography */
    --text-muted: #aeb9cc;
    --text-subtle: #666;
    --text-tertiary: #999;

    /* Focus rings (green accent) */
    --focus-ring-primary: rgba(28, 181, 106, 0.25);
    --focus-ring-primary-strong: rgba(28, 181, 106, 0.35);
    --focus-ring-lang: rgba(28, 181, 106, 0.25);

    /* Login */
    --login-page-overlay: rgba(0, 0, 0, 0.45);
    --login-card-bg: rgba(7, 27, 51, 0.92);
    --login-card-border: rgba(255, 255, 255, 0.12);
    --login-card-shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
    --login-header-text: #ffffff;
    --input-success-hint-bg: rgba(28, 181, 106, 0.08);

    --btn-secondary-bg: #5a6268;

    /* Alerts (same pastels as former for readability) */
    --alert-success-bg: #d4edda;
    --alert-success-color: #155724;
    --alert-danger-bg: #f8d7da;
    --alert-danger-color: #721c24;
    --alert-warning-bg: #fff3cd;
    --alert-warning-color: #856404;
    --alert-info-bg: #d1ecf1;
    --alert-info-color: #0c5460;

    /* Access badges */
    --access-badge-hover-shadow: rgba(0, 0, 0, 0.25);
    --badge-access-granted-bg: #d4edda;
    --badge-access-granted-color: #155724;
    --badge-access-granted-border: #c3e6cb;
    --badge-access-pending-bg: rgba(255, 234, 167, 0.8);
    --badge-access-pending-color: #856404;
    --badge-access-pending-border: rgba(255, 234, 167, 1);
    --badge-access-rejected-bg: #f8d7da;
    --badge-access-rejected-color: #721c24;
    --badge-access-rejected-border: #f5c6cb;
    --badge-access-none-bg: #e2e3e5;
    --badge-access-none-color: #383d41;
    --badge-access-none-border: #d6d8db;

    /* Status-tint surfaces (admin / tables) */
    --request-item-approved-bg: #f0fdf4;
    --request-item-rejected-bg: #fef2f2;
    --request-rejection-reason-bg: var(--bg-secondary);

    /* Admin preview banner */
    --admin-preview-gradient-start: #ea6666;
    --admin-preview-gradient-end: #a24f4b;
    --admin-preview-border-accent: #5568d3;
    --admin-preview-shadow: rgba(0, 0, 0, 0.25);
    --admin-preview-badge-bg: #ffdc20;
    --admin-preview-badge-color: #c65a58;
    --admin-preview-content-bg: #f8f9fa;
    --admin-preview-content-shadow: rgba(0, 0, 0, 0.25);

    --disclaimer-bg: #fff9e6;
    --disclaimer-warning-bg: #fff3cd;
    --disclaimer-inset-shadow: rgba(0, 0, 0, 0.15);
    --lightbox-backdrop: rgba(0, 0, 0, 0.6);
    --lang-flag-bg: #082544;
    --lang-flag-border: #aeb9cc;

    --pulse-success-bg-a: rgba(28, 181, 106, 0.12);
    --pulse-success-bg-b: rgba(28, 181, 106, 0.22);
    --pulse-success-bg-c: rgba(28, 181, 106, 0.16);

    --text-on-dark: #ffffff;
    --nav-on-primary-text: #ffffff;
    --nav-select-border: rgba(255, 255, 255, 0.25);
    --nav-select-bg: rgba(255, 255, 255, 0.08);
    --nav-select-bg-hover: rgba(255, 255, 255, 0.15);
    --nav-select-border-hover: rgba(255, 255, 255, 0.45);
    --nav-select-border-focus: rgba(255, 255, 255, 0.65);
    --nav-link-hover-overlay: rgba(255, 255, 255, 0.1);
    --spinner-sm-track: rgba(255, 255, 255, 0.25);
    --admin-preview-btn-back-shadow-hover: rgba(0, 0, 0, 0.3);
    --alert-success-border: #c3e6cb;
    --alert-danger-border: #f5c6cb;
    --loading-spinner-bg: #ffffff;

    --scrollbar-thumb: #2a4a6f;
    --scrollbar-thumb-hover: #3d5f8a;
    --skeleton-shimmer: linear-gradient(90deg, #082544 25%, #0a3058 50%, #082544 75%);
    --shadow-card-subtle: 0 2px 8px rgba(0, 0, 0, 0.35);
    --shadow-card-hover: 0 12px 28px rgba(0, 0, 0, 0.45);
    --shadow-card-elevated: 0 6px 16px rgba(0, 0, 0, 0.4);
    --print-border: #cccccc;

    --media-preview-bg: #0a1528;

    /* Aliases used by layout rules below */
    --tbweb-page-bg: #041326;
    --tbweb-nav-bg: #071b33;
    --tbweb-panel-bg: #071b33;
    --tbweb-input-bg: #082544;
    --tbweb-text-muted: #aeb9cc;

    /* Asset list card — footer CTAs (gold) */
    --tbweb-asset-cta-primary-bg: #c9a227;
    --tbweb-asset-cta-primary-border: #a8861c;
    --tbweb-asset-cta-primary-color: #121820;
    --tbweb-asset-cta-primary-bg-hover: #d4af37;
    --tbweb-asset-cta-primary-border-hover: #c9a227;
    --tbweb-asset-cta-primary-color-hover: #041326;
    --tbweb-asset-cta-primary-focus-ring: #e6c84d;
    --tbweb-asset-cta-warning-color: #ffffff;
    --tbweb-asset-cta-warning-color-hover: #ffffff;
}

body {
    background-color: var(--page-bg) !important;
    color: var(--text-color);
}

.main-nav {
    background: var(--tbweb-nav-bg) !important;
    color: var(--dark-color);
    border-bottom: 1px solid var(--border-color);
    box-shadow: var(--shadow);
}

.nav-brand a,
.nav-links a {
    color: var(--dark-color) !important;
}

.nav-links a:hover {
    background: rgba(255, 255, 255, 0.08) !important;
}

.nav-links .admin-link {
    color: var(--page-bg) !important;
    font-weight: 600;
}

.language-selector-form .language-select {
    background: var(--tbweb-input-bg);
    color: var(--dark-color);
    border-color: var(--border-color);
}

.card,
.asset-card,
.login-card,
.admin-preview-banner,
.empty-state {
    background: var(--tbweb-panel-bg) !important;
    color: var(--text-color);
    border: 1px solid var(--border-color);
}

.card-header h2,
.card-header h3,
.asset-title,
.page-header h1 {
    color: var(--dark-color) !important;
}

.text-muted,
.asset-date,
.results-summary label {
    color: var(--text-muted) !important;
}

.form-control,
.filter-select,
.language-select,
textarea.form-control,
select.form-control {
    background-color: var(--tbweb-input-bg) !important;
    color: var(--dark-color) !important;
    border-color: var(--border-color) !important;
}

.form-control:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px var(--focus-ring-primary);
}

table th {
    background: var(--tbweb-input-bg) !important;
    color: var(--dark-color) !important;
}

table td {
    border-color: var(--border-color) !important;
}

.filter-btn {
    border-color: var(--border-color) !important;
    color: var(--text-color) !important;
}

.filter-btn:hover,
.filter-btn.active {
    background: var(--tbweb-input-bg) !important;
    color: var(--primary-color) !important;
}

.pagination a,
.pagination span {
    border-color: var(--border-color) !important;
}

.pagination .active {
    background: var(--primary-color) !important;
    color: var(--page-bg) !important;
}

.login-card {
    background: var(--tbweb-login-card-bg) !important;
    border-color: var(--border-color) !important;
}

.login-header {
    background: var(--tbweb-nav-bg) !important;
}

.login-form {
    color: var(--text-color);
}

.login-form label {
    color: var(--dark-color);
}

.skip-link {
    background: var(--primary-color) !important;
    color: var(--page-bg) !important;
}

/* Asset grid card — primary & warning share gold bar; text colour per variant (:root tokens) */
.asset-card .asset-footer .btn.btn-primary,
.asset-card .asset-footer .btn.btn-warning {
    background: var(--tbweb-asset-cta-primary-bg) !important;
    border-color: var(--tbweb-asset-cta-primary-border) !important;
}

.asset-card .asset-footer .btn.btn-primary {
    color: var(--tbweb-asset-cta-primary-color) !important;
}

.asset-card .asset-footer .btn.btn-warning {
    color: var(--tbweb-asset-cta-warning-color) !important;
}

.asset-card .asset-footer .btn.btn-primary:hover,
.asset-card .asset-footer .btn.btn-warning:hover {
    background: var(--tbweb-asset-cta-primary-bg-hover) !important;
    border-color: var(--tbweb-asset-cta-primary-border-hover) !important;
    text-decoration: none;
}

.asset-card .asset-footer .btn.btn-primary:hover {
    color: var(--tbweb-asset-cta-primary-color-hover) !important;
}

.asset-card .asset-footer .btn.btn-warning:hover {
    color: var(--tbweb-asset-cta-warning-color-hover) !important;
}

.asset-card .asset-footer .btn.btn-primary:focus-visible,
.asset-card .asset-footer .btn.btn-warning:focus-visible {
    outline: 2px solid var(--tbweb-asset-cta-primary-focus-ring);
    outline-offset: 2px;
}

/* My requests: row surface matches main .card (tbweb panel) */
.requests-page .request-item,
.requests-page .request-item.status-pending,
.requests-page .request-item.status-approved,
.requests-page .request-item.status-rejected {
    background: var(--tbweb-panel-bg) !important;
}