/* AFC Parent Portal - Custom Styles */

/*
 * This file tests that static files are being collected and served correctly.
 * The styles below add subtle improvements to the portal interface.
 */

/* Brand color for AFC Parent Portal */
:root {
    --afc-primary: #003d82;  /* AFC blue */
    --afc-secondary: #c8102e; /* British Army red */
}

/* Navbar branding */
.navbar-brand {
    font-weight: 600;
    letter-spacing: 0.5px;
}

/* Card headers - more prominent */
.card-header {
    font-weight: 600;
    background-color: var(--bs-light);
    border-bottom: 2px solid var(--bs-primary);
}

/* Badge styling for priority levels */
.badge.bg-danger {
    background-color: var(--afc-secondary) !important;
}

/* Footer styling */
footer p {
    margin-bottom: 0.25rem;
}

/* Success message styling */
.alert-success {
    border-left: 4px solid #198754;
}

/* Warning message styling */
.alert-warning {
    border-left: 4px solid #ffc107;
}

/* Error message styling */
.alert-danger {
    border-left: 4px solid var(--afc-secondary);
}

/* Info message styling */
.alert-info {
    border-left: 4px solid #0dcaf0;
}

/* =========================
   LIGHT MODE THEME (Default)
   Apply by setting body_class = "theme-light"
   ========================= */

body.theme-light {
    --army-bg: #f5f5f5;
    --army-panel: #ffffff;
    --army-text: #1a1a1a;
    --army-muted: #5a6268;
    --army-line: rgba(0,0,0,.12);
    --army-accent: #f6c400;  /* Same bright gold as dark mode */
}

/* Light mode base */
body.theme-light {
    background: var(--army-bg) !important;
    color: var(--army-text) !important;
}

/* Light mode navbar - use same dark style as Ian's theme */
body.theme-light .navbar {
    background: #24282c !important;
    border-bottom: 1px solid rgba(255,255,255,.10);
}
body.theme-light .navbar .navbar-brand,
body.theme-light .navbar .nav-link {
    color: #e6e6e6 !important;
}
body.theme-light .navbar .nav-link:hover {
    color: #fff !important;
}
body.theme-light .navbar .navbar-brand {
    text-transform: uppercase;
    letter-spacing: .12em;
    font-weight: 600;
}

/* Light mode panels/cards */
body.theme-light .army-panel,
body.theme-light .card {
    background-color: var(--army-panel);
    border: 1px solid var(--army-line);
    box-shadow: 0 1px 3px rgba(0,0,0,.08);
    color: var(--army-text);
}

body.theme-light .card-header {
    background-color: #f8f9fa;
    border-bottom: 1px solid var(--army-line);
    color: var(--army-text);
}

/* Light mode Army typography - match dark mode military styling */
body.theme-light .army-eyebrow {
    text-transform: uppercase;
    letter-spacing: .35em;
    font-weight: 600;
    font-size: 12px;
    color: var(--army-muted);
}

body.theme-light .army-h1 {
    text-transform: uppercase;
    letter-spacing: .08em;
    line-height: .95;
    font-weight: 600;
}

body.theme-light .army-sub {
    color: var(--army-muted);
    max-width: 720px;
}

/* Light mode buttons */
body.theme-light .btn-army {
    background: var(--army-accent);
    color: #000 !important;
    border: 1px solid var(--army-accent);
    text-transform: uppercase;
    letter-spacing: .18em;
    font-weight: 600;
    font-size: 12px;
    padding: .9rem 1.2rem;
    border-radius: 0 !important;
}
body.theme-light .btn-army:hover {
    filter: brightness(.92);
}

body.theme-light .btn-primary {
    background: var(--army-accent);
    color: #000 !important;
    border: 1px solid var(--army-accent);
    text-transform: uppercase;
    letter-spacing: .18em;
    font-weight: 600;
    font-size: 12px;
    padding: .9rem 1.2rem;
    border-radius: 0 !important;
}
body.theme-light .btn-primary:hover {
    filter: brightness(.92);
}

body.theme-light .btn-outline-primary {
    background: transparent;
    color: #1d3c34 !important;
    border: 1px solid #1d3c34;
    text-transform: uppercase;
    letter-spacing: .18em;
    font-weight: 600;
    font-size: 12px;
    padding: .9rem 1.2rem;
    border-radius: 0 !important;
}
body.theme-light .btn-outline-primary:hover {
    background: #1d3c34;
    color: #fff !important;
}

body.theme-light .btn-primary.btn-sm,
body.theme-light .btn-outline-primary.btn-sm {
    padding: .4rem .6rem;
    font-size: 11px;
    letter-spacing: .14em;
}

/* Light mode army outline button */
body.theme-light .btn-army-outline {
    background: transparent;
    color: var(--army-text) !important;
    border: 1px solid var(--army-line);
    text-transform: uppercase;
    letter-spacing: .18em;
    font-weight: 600;
    font-size: 12px;
    padding: .9rem 1.2rem;
    border-radius: 0 !important;
}
body.theme-light .btn-army-outline:hover {
    border-color: var(--army-text);
    background: rgba(0,0,0,.04);
}

/* Kill Bootstrap rounding */
body.theme-light .card,
body.theme-light .btn,
body.theme-light .form-control,
body.theme-light .form-select,
body.theme-light .alert {
    border-radius: 0 !important;
}

/* Light mode form controls */
body.theme-light .form-control,
body.theme-light .form-select {
    background-color: #ffffff;
    border: 1px solid #ced4da;
    color: var(--army-text);
    border-radius: 0 !important;
}

body.theme-light .form-control:focus,
body.theme-light .form-select:focus {
    background-color: #ffffff;
    border-color: var(--army-accent);
    box-shadow: 0 0 0 0.2rem rgba(201, 162, 39, 0.25);
}

body.theme-light .form-label {
    color: var(--army-text);
}

/* Light mode tables */
body.theme-light .table {
    color: var(--army-text);
    --bs-table-color: var(--army-text);
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--army-line);
}

body.theme-light .table th {
    background-color: #f8f9fa;
    border-color: var(--army-line);
    color: var(--army-text);
}

body.theme-light .table td {
    border-color: var(--army-line);
}

body.theme-light .table-hover tbody tr:hover {
    background-color: rgba(0,0,0,.04);
}

body.theme-light .table a {
    color: #1d5a4a;
}

/* Light mode list groups */
body.theme-light .list-group-item {
    background-color: var(--army-panel);
    border-color: var(--army-line);
    color: var(--army-text);
}

body.theme-light .list-group-item:hover {
    background-color: rgba(0,0,0,.03);
}

/* Light mode accordion */
body.theme-light .accordion-item {
    background-color: var(--army-panel);
    border: 1px solid var(--army-line);
}

body.theme-light .accordion-button {
    background-color: var(--army-panel);
    color: var(--army-text);
}

body.theme-light .accordion-button:not(.collapsed) {
    background-color: rgba(201, 162, 39, 0.1);
    color: var(--army-text);
}

body.theme-light .accordion-body {
    background-color: var(--army-panel);
    color: var(--army-text);
}

/* Light mode alerts - standard Bootstrap light versions with left accent */
body.theme-light .alert-success {
    background-color: #d4edda;
    border: 1px solid #c3e6cb;
    color: #155724;
    border-left: 4px solid #28a745;
}

body.theme-light .alert-danger {
    background-color: #f8d7da;
    border: 1px solid #f5c6cb;
    color: #721c24;
    border-left: 4px solid #dc3545;
}

body.theme-light .alert-warning {
    background-color: #fff3cd;
    border: 1px solid #ffeeba;
    color: #856404;
    border-left: 4px solid #ffc107;
}

body.theme-light .alert-info {
    background-color: #e8f4f8;
    border: 1px solid #bee5eb;
    color: #0c5460;
    border-left: 4px solid var(--army-accent);
}

body.theme-light .alert-info strong {
    text-transform: uppercase;
    letter-spacing: .18em;
    font-weight: 600;
    font-size: 12px;
}

/* Light mode tabs */
body.theme-light .nav-tabs {
    border-bottom: 1px solid var(--army-line);
}

body.theme-light .nav-tabs .nav-link {
    color: var(--army-muted);
}

body.theme-light .nav-tabs .nav-link:hover {
    border-color: var(--army-line);
    color: var(--army-text);
}

body.theme-light .nav-tabs .nav-link.active {
    background: var(--army-panel);
    border-color: var(--army-line) var(--army-line) transparent;
    color: var(--army-text);
}

/* Light mode breadcrumbs */
body.theme-light .breadcrumb {
    background-color: transparent;
}

body.theme-light .breadcrumb-item a {
    color: #1d5a4a;
}

body.theme-light .breadcrumb-item.active {
    color: var(--army-muted);
}

/* Light mode badges */
body.theme-light .badge {
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 600;
    font-size: 10px;
}

body.theme-light .badge-army {
    background-color: var(--army-accent);
    color: #1a1a1a;
}

/* Staff badge in navbar - make it stand out on dark navbar */
body.theme-light .navbar .badge-army {
    background-color: var(--army-accent);
    color: #000;
    padding: 0.35em 0.65em;
    font-size: 0.7em;
}

/* Secondary/outline badges for counts */
body.theme-light .badge.bg-secondary {
    background-color: transparent !important;
    color: var(--army-text) !important;
    border: 1px solid var(--army-line);
}

/* Light mode footer - use same dark style as Ian's theme */
body.theme-light .site-footer {
    background: #24282c;
    border-top: 1px solid rgba(255,255,255,.10);
    color: #e6e6e6;
}

body.theme-light .site-footer .text-muted {
    color: #e6e6e6 !important;
    opacity: 0.9;
}

body.theme-light .site-footer p {
    color: #e6e6e6 !important;
}

body.theme-light .site-footer p.small {
    opacity: 0.9;
}

/* Footer link - white in both themes */
.footer-link,
.footer-link:link,
.footer-link:visited {
    color: #ffffff !important;
}

.footer-link:hover,
.footer-link:active {
    color: #f6c400 !important;
}

/* Light mode dev banner */
body.theme-light .dev-banner {
    background-color: #fff3cd;
    color: #856404;
    border-bottom: 1px solid #ffeeba;
}

/* Light mode text utilities */
body.theme-light .text-muted {
    color: var(--army-muted) !important;
}

/* Light mode links */
body.theme-light a:not(.btn):not(.nav-link):not(.navbar-brand):not(.list-group-item) {
    color: #1d5a4a;
}

body.theme-light a:not(.btn):not(.nav-link):not(.navbar-brand):not(.list-group-item):hover {
    color: #0d3028;
}

/* Light mode hero section - use same dark style as Ian's theme */
body.theme-light .army-hero {
    background: #2b2f33;
    position: relative;
    overflow: hidden;
    padding: 72px 0 48px;
}

/* Soft spotlight behind title */
body.theme-light .army-hero::after {
    content: "";
    position: absolute;
    inset: -10%;
    background:
        radial-gradient(circle at 50% 35%, rgba(255,255,255,.10) 0%, rgba(255,255,255,0) 55%),
        radial-gradient(circle at 50% 35%, rgba(0,0,0,.35) 0%, rgba(0,0,0,0) 55%);
    pointer-events: none;
    z-index: 0;
}

/* Dots pattern */
body.theme-light .army-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle, rgba(255,255,255,.10) 1px, transparent 1px);
    background-size: 8px 8px;
    opacity: .22;
    -webkit-mask-image: radial-gradient(circle at 50% 35%, #000 45%, transparent 80%);
    mask-image: radial-gradient(circle at 50% 35%, #000 45%, transparent 80%);
    pointer-events: none;
    z-index: 0;
}

/* Ensure content is above pseudo-elements */
body.theme-light .army-hero .container {
    position: relative;
    z-index: 1;
}

body.theme-light .army-hero .army-eyebrow,
body.theme-light .army-hero .army-h1,
body.theme-light .army-hero .army-sub,
body.theme-light .army-hero p {
    color: #e6e6e6 !important;
}

body.theme-light .army-hero .army-sub {
    opacity: 0.85;
}

body.theme-light .army-hero .btn-army-outline {
    color: #ffffff !important;
    border-color: rgba(255,255,255,.30);
}

body.theme-light .army-hero .btn-army-outline:hover {
    border-color: rgba(255,255,255,.50);
    background: rgba(255,255,255,.08);
}

/* Light mode divider */
body.theme-light .army-divider {
    height: 1px;
    background: var(--army-line);
    width: 100%;
}

/* Light mode feature tiles */
body.theme-light .army-feature {
    background: var(--army-panel);
    border: 1px solid var(--army-line);
    padding: 28px;
    height: 100%;
    box-shadow: 0 1px 3px rgba(0,0,0,.08);
}

body.theme-light .army-feature h5,
body.theme-light .army-feature h6 {
    text-transform: uppercase;
    letter-spacing: .18em;
    font-weight: 600;
    font-size: 12px;
    color: var(--army-text);
    margin-bottom: 10px;
}

body.theme-light .army-feature p {
    color: var(--army-muted);
    font-size: 14px;
    line-height: 1.6;
}

/* Light mode code blocks */
body.theme-light code {
    color: #1d3c34;
    background: rgba(29, 60, 52, 0.08);
    border: 1px solid rgba(29, 60, 52, 0.15);
    padding: 0 .35rem;
}

/* Light mode container color inheritance */
body.theme-light .card,
body.theme-light .container,
body.theme-light .container-fluid {
    color: inherit;
}

/* Light mode navbar button text */
body.theme-light .navbar .btn-primary {
    color: #000 !important;
}

/* Light mode dropdown menus */
body.theme-light .dropdown-menu {
    background: var(--army-panel);
    border: 1px solid var(--army-line);
    box-shadow: 0 2px 8px rgba(0,0,0,.1);
}

body.theme-light .dropdown-item {
    color: var(--army-text);
}

body.theme-light .dropdown-item:hover,
body.theme-light .dropdown-item:focus {
    background-color: rgba(0,0,0,.04);
    color: var(--army-text);
}

body.theme-light .dropdown-divider {
    border-top-color: var(--army-line);
}

body.theme-light .dropdown-header {
    color: var(--army-muted);
}

/* Light mode modal styling */
body.theme-light .modal-content {
    background: var(--army-panel);
    border: 1px solid var(--army-line);
    color: var(--army-text);
}

body.theme-light .modal-header {
    border-bottom-color: var(--army-line);
}

body.theme-light .modal-footer {
    border-top-color: var(--army-line);
}

/* Light mode pagination */
body.theme-light .page-link {
    background: var(--army-panel);
    border-color: var(--army-line);
    color: var(--army-text);
}

body.theme-light .page-link:hover {
    background: rgba(0,0,0,.04);
    border-color: var(--army-line);
    color: var(--army-text);
}

body.theme-light .page-item.active .page-link {
    background: var(--army-accent);
    border-color: var(--army-accent);
    color: #000;
}

body.theme-light .page-item.disabled .page-link {
    background: var(--army-panel);
    border-color: var(--army-line);
    color: var(--army-muted);
}

/* =========================
   ARMY THEME (scoped)
   Apply by setting body_class = "theme-army"
   ========================= */

body.theme-army{
    --army-bg: #2b2f33;
    --army-panel: #24282c;
    --army-text: #e6e6e6;
    --army-muted: #aeb6bd;
    --army-line: rgba(255,255,255,.10);
    --army-accent: #f6c400;
}

/* Page background + default text */
.theme-army body,
body.theme-army {
    background: var(--army-bg);
    color: var(--army-text);
}

/* Kill "Bootstrap friendly" rounding */
.theme-army .card,
.theme-army .btn,
.theme-army .form-control,
.theme-army .alert {
    border-radius: 0 !important;
}

/* Navbar */
.theme-army .navbar {
    background: var(--army-panel) !important;
    border-bottom: 1px solid var(--army-line);
}
.theme-army .navbar .navbar-brand,
.theme-army .navbar .nav-link {
    color: var(--army-text) !important;
}
.theme-army .navbar .nav-link:hover {
    color: #fff !important;
}
body.theme-army .navbar .navbar-brand{
    text-transform: uppercase;
    letter-spacing: .12em;
    font-weight: 600;
}

/* Dev banner: make it look intentional, not "random yellow strip" */
.theme-army .dev-banner,
.theme-army .alert-warning {
    background: rgba(246,196,0,.12) !important;
    border: 1px solid rgba(246,196,0,.35) !important;
    color: var(--army-text) !important;
}

/* Headline styling */
.theme-army .army-eyebrow{
    text-transform: uppercase;
    letter-spacing: .35em;
    font-weight: 600;
    font-size: 12px;
    color: var(--army-muted);
}
.theme-army .army-h1{
    text-transform: uppercase;
    letter-spacing: .08em;
    line-height: .95;
    font-weight: 600;
}
.theme-army .army-sub{
    color: var(--army-muted);
    max-width: 720px;
}

/* Hero section */
body.theme-army .army-hero{
    background: var(--army-bg);
    position: relative;
    overflow: hidden;
    padding: 72px 0 48px;
}
/* soft spotlight behind title */
body.theme-army .army-hero::after{
    content:"";
    position:absolute;
    inset:-10%;
    background:
        radial-gradient(circle at 50% 35%, rgba(255,255,255,.10) 0%, rgba(255,255,255,0) 55%),
        radial-gradient(circle at 50% 35%, rgba(0,0,0,.35) 0%, rgba(0,0,0,0) 55%);
    pointer-events:none;
    z-index: 0;
}
/* dots: make them subtler like the real site */
body.theme-army .army-hero::before{
    content:"";
    position:absolute;
    inset:0;
    background-image: radial-gradient(circle, rgba(255,255,255,.10) 1px, transparent 1px);
    background-size: 8px 8px;
    opacity: .22;
    -webkit-mask-image: radial-gradient(circle at 50% 35%, #000 45%, transparent 80%);
    mask-image: radial-gradient(circle at 50% 35%, #000 45%, transparent 80%);
    pointer-events:none;
    z-index: 0;
}
/* ensure content is above */
body.theme-army .army-hero .container{
    position: relative;
    z-index: 1;
}

/* Buttons */
.theme-army .btn-army{
    background: var(--army-accent);
    color: #000 !important;
    border: 1px solid var(--army-accent);
    text-transform: uppercase;
    letter-spacing: .18em;
    font-weight: 600;
    font-size: 12px;
    padding: .9rem 1.2rem;
}
.theme-army .btn-army:hover{ filter: brightness(.95); }

.theme-army .btn-army-outline{
    background: transparent;
    color: var(--army-text) !important;
    border: 1px solid rgba(255,255,255,.18);
    text-transform: uppercase;
    letter-spacing: .18em;
    font-weight: 600;
    font-size: 12px;
    padding: .9rem 1.2rem;
}
.theme-army .btn-army-outline:hover{
    border-color: rgba(255,255,255,.28);
}

/* Fallback: map Bootstrap primary buttons to Army buttons */
body.theme-army .btn-primary{
    background: var(--army-accent);
    color: #000 !important;
    border: 1px solid var(--army-accent);
    text-transform: uppercase;
    letter-spacing: .18em;
    font-weight: 600;
    font-size: 12px;
    padding: .9rem 1.2rem;
}
body.theme-army .btn-primary:hover{ filter: brightness(.95); }
body.theme-army .btn-outline-primary{
    background: transparent;
    color: var(--army-text) !important;
    border: 1px solid rgba(255,255,255,.18);
    text-transform: uppercase;
    letter-spacing: .18em;
    font-weight: 600;
    font-size: 12px;
    padding: .9rem 1.2rem;
}
body.theme-army .btn-outline-primary:hover{
    border-color: rgba(255,255,255,.28);
}
body.theme-army .btn-primary.btn-sm,
body.theme-army .btn-outline-primary.btn-sm{
    padding: .4rem .6rem;
    font-size: 11px;
    letter-spacing: .14em;
}
body.theme-army .navbar .btn-primary{
    color: #000 !important;
}

/* Army badge styling to avoid Bootstrap colors */
body.theme-army .badge{
    background: rgba(255,255,255,.12) !important;
    color: var(--army-text) !important;
    border: 1px solid var(--army-line);
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 600;
    font-size: 10px;
}
body.theme-army .badge.bg-primary,
body.theme-army .badge.bg-secondary,
body.theme-army .badge.bg-success,
body.theme-army .badge.bg-info,
body.theme-army .badge.bg-warning,
body.theme-army .badge.bg-danger,
body.theme-army .badge.bg-light,
body.theme-army .badge.bg-dark{
    background: rgba(255,255,255,.12) !important;
    color: var(--army-text) !important;
    border: 1px solid var(--army-line);
}
body.theme-army .badge.bg-warning,
body.theme-army .badge.bg-danger{
    background: rgba(246,196,0,.15) !important;
    color: var(--army-text) !important;
    border-color: rgba(246,196,0,.35);
}
body.theme-army .badge-army{
    background: rgba(246,196,0,.15);
    color: var(--army-text);
    border: 1px solid rgba(246,196,0,.35);
}

body.theme-army .bg-primary,
body.theme-army .bg-secondary,
body.theme-army .bg-success,
body.theme-army .bg-info,
body.theme-army .bg-warning,
body.theme-army .bg-danger,
body.theme-army .bg-light,
body.theme-army .bg-dark{
    background-color: rgba(255,255,255,.12) !important;
    color: var(--army-text) !important;
    border-color: var(--army-line) !important;
}
body.theme-army .bg-warning,
body.theme-army .bg-danger{
    background-color: rgba(246,196,0,.15) !important;
    border-color: rgba(246,196,0,.35) !important;
}

/* Panels / cards */
body.theme-army .army-panel{
    background: rgba(0,0,0,.22);
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 0 0 1px rgba(255,255,255,.04) inset;
    color: var(--army-text);
}
.theme-army .army-panel .text-muted{
    color: var(--army-muted) !important;
}

/* Feature strip */
.theme-army .army-feature{
    background: rgba(255,255,255,.03);
    border: 1px solid var(--army-line);
    padding: 28px;
    height: 100%;
}
.theme-army .army-feature h5{
    text-transform: uppercase;
    letter-spacing: .12em;
    font-weight: 600;
    font-size: 14px;
}
.theme-army .army-divider{
    height: 1px;
    background: var(--army-line);
    width: 100%;
}

/* Hard override so you actually SEE the theme */
body.theme-army{
    background: var(--army-bg) !important;
    color: var(--army-text) !important;
}

/* Make common containers not sit on white */
body.theme-army .card,
body.theme-army .container,
body.theme-army .container-fluid{
    color: inherit;
}

/* Ensure text is readable inside Army feature tiles */
body.theme-army .army-feature,
body.theme-army .army-panel,
body.theme-army .army-tile {
    color: var(--army-text) !important;
}

body.theme-army .army-feature p,
body.theme-army .army-feature .text-muted,
body.theme-army .army-panel p,
body.theme-army .army-panel .text-muted {
    color: var(--army-muted) !important;
    opacity: 1 !important;
}

/* Make headings inside tiles pop */
body.theme-army .army-feature h5,
body.theme-army .army-feature h6 {
    color: #fff !important;
}

/* Optional: add a subtle inner glow so tiles don't "sink" */
body.theme-army .army-feature {
    background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01));
    border: 1px solid var(--army-line);
}

body.theme-army .army-feature h5{
    letter-spacing: .18em;
    text-transform: uppercase;
    font-size: 12px;
    margin-bottom: 10px;
}

body.theme-army .army-feature p{
    font-size: 14px;
    line-height: 1.6;
}

body.theme-army .site-footer{
    background: var(--army-panel);
    border-top: 1px solid var(--army-line);
    color: var(--army-text);
}
body.theme-army .site-footer .text-muted {
    color: var(--army-text) !important;
    opacity: 0.9;
}

body.theme-army .site-footer p{
    color: var(--army-text) !important;
}

body.theme-army .site-footer p.small {
    opacity: 0.9;
}

/* Card headers on staff dashboard */
body.theme-army .card-header{
    background: rgba(0,0,0,.22);
    border-bottom: 1px solid rgba(255,255,255,.10);
    color: var(--army-text);
}

body.theme-army .table{
    color: var(--army-text);
    --bs-table-color: var(--army-text);
    --bs-table-bg: transparent;
    --bs-table-striped-color: var(--army-text);
    --bs-table-striped-bg: rgba(255,255,255,.03);
    --bs-table-hover-color: var(--army-text);
    --bs-table-hover-bg: rgba(255,255,255,.04);
    --bs-table-border-color: var(--army-line);
}
body.theme-army .table > :not(caption) > * > *{
    background-color: transparent;
    border-color: var(--army-line);
}
body.theme-army .table-hover tbody tr:hover > *{
    background-color: rgba(255,255,255,.04);
}
body.theme-army .table a{
    color: var(--army-text);
}
body.theme-army code{
    color: var(--army-accent);
    background: rgba(246,196,0,.08);
    border: 1px solid rgba(246,196,0,.25);
    padding: 0 .35rem;
}

/* Accordion styling for Army theme */

/* Compact action buttons inside tables */
body.theme-army .table .btn{
    border-radius: 0;
}

body.theme-army .table th,
body.theme-army .table td{
    color: var(--army-text);
}

body.theme-army .list-group-item{
    background: rgba(0,0,0,.18);
    border-color: var(--army-line);
    color: var(--army-text);
}
body.theme-army .list-group-item:hover{
    background: rgba(255,255,255,.04);
}

body.theme-army .breadcrumb{
    --bs-breadcrumb-divider-color: var(--army-muted);
}
body.theme-army .breadcrumb-item.active{
    color: var(--army-muted);
}

body.theme-army .nav-tabs{
    border-bottom: 1px solid var(--army-line);
}
body.theme-army .nav-tabs .nav-link{
    color: var(--army-muted);
    border: 1px solid transparent;
}
body.theme-army .nav-tabs .nav-link:hover{
    border-color: var(--army-line);
    color: var(--army-text);
}
body.theme-army .nav-tabs .nav-link.active{
    background: rgba(0,0,0,.22);
    border-color: var(--army-line) var(--army-line) transparent;
    color: var(--army-text);
}

body.theme-army .accordion-item{
    background: rgba(0,0,0,.18);
    border: 1px solid var(--army-line);
}
body.theme-army .accordion-button{
    background: rgba(0,0,0,.18);
    color: var(--army-text);
}
body.theme-army .accordion-button:not(.collapsed){
    background: rgba(0,0,0,.28);
    color: var(--army-text);
    box-shadow: inset 0 -1px 0 var(--army-line);
}
body.theme-army .accordion-button::after{
    filter: invert(1);
}
body.theme-army .accordion-body{
    background: rgba(0,0,0,.12);
    color: var(--army-text);
}

body.theme-army .form-control,
body.theme-army .form-select{
    background-color: #1f2327;
    border-color: var(--army-line);
    color: var(--army-text);
}
body.theme-army .form-control::placeholder{
    color: var(--army-muted);
}
body.theme-army .form-control:focus,
body.theme-army .form-select:focus{
    background-color: #1f2327;
    border-color: rgba(246,196,0,.55);
    color: var(--army-text);
    box-shadow: 0 0 0 .2rem rgba(246,196,0,.12);
}
body.theme-army .form-label{
    color: var(--army-text);
}

/* Prevent browser autofill from forcing white backgrounds */
body.theme-army input:-webkit-autofill,
body.theme-army input:-webkit-autofill:hover,
body.theme-army input:-webkit-autofill:focus,
body.theme-army textarea:-webkit-autofill,
body.theme-army textarea:-webkit-autofill:hover,
body.theme-army textarea:-webkit-autofill:focus,
body.theme-army select:-webkit-autofill,
body.theme-army select:-webkit-autofill:hover,
body.theme-army select:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--army-text);
    box-shadow: 0 0 0px 1000px #1f2327 inset;
    transition: background-color 9999s ease-out 0s;
}

/* Army-styled info callout (Next Steps) */
body.theme-army .alert-info{
    background: rgba(246,196,0,.12) !important;
    border: 1px solid rgba(246,196,0,.45) !important;
    color: var(--army-text) !important;
    border-left: 4px solid var(--army-accent);
}
body.theme-army .alert-info strong{
    text-transform: uppercase;
    letter-spacing: .18em;
    font-weight: 600;
    font-size: 12px;
    color: #fff;
}

/* Ensure muted text is readable in Army theme */
body.theme-army .text-muted{
    color: var(--army-muted) !important;
}

/* Signed-out / success messages */
body.theme-army .alert-success{
    background: rgba(255,255,255,.04) !important;
    border: 1px solid var(--army-line) !important;
    color: var(--army-text) !important;
    border-left: 4px solid var(--army-accent);
}

body.theme-army .alert-danger{
    background: rgba(217,83,79,.18) !important;
    border: 1px solid rgba(217,83,79,.45) !important;
    color: #fff !important;
    border-left: 4px solid #d9534f;
}

/* =========================
   CONSISTENT DJANGO MESSAGES
   Dark grey bg, yellow X, white text across ALL themes
   ========================= */

/* Override ALL alert styles for consistency */
.alert,
body.theme-light .alert,
body.theme-army .alert,
.alert-success,
.alert-info,
.alert-warning,
.alert-danger {
    background: #3a3f44 !important;
    border: 1px solid #555a5f !important;
    border-left: 4px solid #f6c400 !important;
    color: #ffffff !important;
}

/* Yellow X close button */
.alert .btn-close,
body.theme-light .alert .btn-close,
body.theme-army .alert .btn-close {
    filter: invert(88%) sepia(76%) saturate(514%) hue-rotate(1deg) brightness(103%) contrast(96%) !important;
    opacity: 1 !important;
}

.alert .btn-close:hover,
body.theme-light .alert .btn-close:hover,
body.theme-army .alert .btn-close:hover {
    filter: invert(88%) sepia(76%) saturate(514%) hue-rotate(1deg) brightness(103%) contrast(96%) !important;
    opacity: 0.8 !important;
}

/* =========================
   CONSISTENT BADGE STYLING
   Override Bootstrap's blue bg-primary badges to be grey
   ========================= */

/* Light mode badges */
body.theme-light .badge.bg-primary {
    background-color: #6c757d !important;
    color: #ffffff !important;
    border: 1px solid #5a6268 !important;
}

/* Dark mode badges - already handled by theme-army styles above, but ensure consistency */
body.theme-army .badge.bg-primary {
    background-color: rgba(255,255,255,.12) !important;
    color: var(--army-text) !important;
    border: 1px solid var(--army-line) !important;
}

/* =========================
   BOOTSTRAP COLOR OVERRIDES - SYSTEM-WIDE
   Replace Bootstrap blue with army colors everywhere
   ========================= */

/* Light mode - System-wide bg-info and bg-primary */
body.theme-light .bg-info,
body.theme-light .card-header.bg-info {
    background-color: var(--army-accent) !important;
    color: #000 !important;
    border-color: var(--army-accent) !important;
}

body.theme-light .bg-primary,
body.theme-light .card-header.bg-primary {
    background-color: var(--army-accent) !important;
    color: #000 !important;
    border-color: var(--army-accent) !important;
}

body.theme-light .text-primary {
    color: var(--army-text) !important;
}

/* Light mode - Override Bootstrap link colors */
body.theme-light a:not(.btn):not(.nav-link):not(.navbar-brand):not(.dropdown-item):not(.footer-link) {
    color: var(--army-text) !important;
}

body.theme-light a:not(.btn):not(.nav-link):not(.navbar-brand):not(.dropdown-item):not(.footer-link):hover {
    color: #000 !important;
    text-decoration: underline;
}

body.theme-light .btn-outline-primary {
    background: transparent !important;
    color: var(--army-text) !important;
    border: 1px solid var(--army-line) !important;
}

body.theme-light .btn-outline-primary:hover {
    background: rgba(0,0,0,.04) !important;
    border-color: var(--army-text) !important;
}

body.theme-light .btn-secondary {
    background-color: #6c757d !important;
    color: #ffffff !important;
    border: 1px solid #6c757d !important;
}

body.theme-light .btn-secondary:hover {
    background-color: #5a6268 !important;
    border-color: #545b62 !important;
}

body.theme-light pre {
    background-color: #f8f9fa !important;
    color: var(--army-text) !important;
    border: 1px solid var(--army-line) !important;
}

/* Dark mode - System-wide bg-info and bg-primary */
body.theme-army .bg-info,
body.theme-army .card-header.bg-info {
    background: rgba(246,196,0,.15) !important;
    border-color: rgba(246,196,0,.35) !important;
    color: var(--army-text) !important;
}

body.theme-army .bg-primary,
body.theme-army .card-header.bg-primary {
    background: rgba(246,196,0,.15) !important;
    border-color: rgba(246,196,0,.35) !important;
    color: var(--army-text) !important;
}

body.theme-army .text-primary {
    color: var(--army-accent) !important;
}

/* Dark mode - Override Bootstrap link colors */
body.theme-army a:not(.btn):not(.nav-link):not(.navbar-brand):not(.dropdown-item) {
    color: var(--army-text) !important;
}

body.theme-army a:not(.btn):not(.nav-link):not(.navbar-brand):not(.dropdown-item):hover {
    color: #fff !important;
    text-decoration: underline;
}

body.theme-army .btn-outline-primary {
    background: transparent !important;
    color: var(--army-text) !important;
    border: 1px solid rgba(255,255,255,.18) !important;
}

body.theme-army .btn-outline-primary:hover {
    border-color: rgba(255,255,255,.28) !important;
}

body.theme-army .btn-secondary {
    background-color: rgba(255,255,255,.12) !important;
    color: var(--army-text) !important;
    border: 1px solid var(--army-line) !important;
}

body.theme-army .btn-secondary:hover {
    background-color: rgba(255,255,255,.18) !important;
}

body.theme-army pre,
body.theme-army .bg-light {
    background-color: rgba(0,0,0,.22) !important;
    color: var(--army-text) !important;
    border: 1px solid var(--army-line) !important;
}

body.theme-army pre code {
    color: var(--army-text) !important;
}

/* =========================
   NAVBAR ROLE BADGE
   Fix unreadable role badge in navbar
   ========================= */

/* Light mode - grey badge with white text */
body.theme-light .navbar .badge.bg-secondary {
    background-color: #6c757d !important;
    color: #ffffff !important;
    border: 1px solid #5a6268 !important;
}

/* Dark mode - subtle badge that's readable */
body.theme-army .navbar .badge.bg-secondary {
    background-color: rgba(255,255,255,.15) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255,255,255,.25) !important;
}

/* =========================
   FAQ ACCORDION STYLING
   Fix light yellow backgrounds and blue borders
   ========================= */

/* Light mode accordion */
body.theme-light .accordion-item {
    background-color: #ffffff !important;
    border: 1px solid var(--army-line) !important;
    margin-bottom: 0.5rem;
}

body.theme-light .accordion-button {
    background-color: #f8f9fa !important;
    color: var(--army-text) !important;
    border: none !important;
}

body.theme-light .accordion-button:not(.collapsed) {
    background-color: #ffffff !important;
    color: var(--army-text) !important;
    border-bottom: 1px solid var(--army-line) !important;
    box-shadow: none !important;
}

body.theme-light .accordion-button:focus {
    box-shadow: none !important;
    border-color: var(--army-line) !important;
}

body.theme-light .accordion-body {
    background-color: #ffffff !important;
    color: var(--army-text) !important;
    border: none !important;
}

/* Dark mode accordion */
body.theme-army .accordion-item {
    background-color: rgba(0,0,0,.15) !important;
    border: 1px solid var(--army-line) !important;
    margin-bottom: 0.5rem;
}

body.theme-army .accordion-button {
    background-color: rgba(0,0,0,.22) !important;
    color: var(--army-text) !important;
    border: none !important;
}

body.theme-army .accordion-button:not(.collapsed) {
    background-color: rgba(0,0,0,.15) !important;
    color: var(--army-accent) !important;
    border-bottom: 1px solid var(--army-line) !important;
    box-shadow: none !important;
}

body.theme-army .accordion-button:focus {
    box-shadow: none !important;
    border-color: var(--army-line) !important;
}

body.theme-army .accordion-body {
    background-color: rgba(0,0,0,.15) !important;
    color: var(--army-text) !important;
    border: none !important;
}

/* =========================
   APPLICATION DETAILS STYLING
   Uppercase labels for military styling
   ========================= */

.application-details strong {
    text-transform: uppercase;
    letter-spacing: .18em;
    font-weight: 600;
    font-size: 12px;
}

/* =========================
   ALERT LINKS
   Must come AFTER link color overrides
   ========================= */
.alert a,
body.theme-light .alert a,
body.theme-army .alert a {
    color: #ffffff !important;
    text-decoration: underline;
}

.alert a:hover,
body.theme-light .alert a:hover,
body.theme-army .alert a:hover {
    color: #f6c400 !important;
}

/* =========================
   OVERRIDE TREE CONNECTORS
   Visual hierarchy for content overrides
   ========================= */

.override-tree {
    position: relative;
    padding-left: 0;
}

.override-tree-item {
    position: relative;
    padding-left: 24px;
}

/* Tree connector line (vertical) */
.override-tree-item::before {
    content: "";
    position: absolute;
    left: 8px;
    top: 0;
    bottom: 50%;
    width: 1px;
    background-color: var(--army-muted, #6c757d);
}

/* Tree connector branch (horizontal) */
.override-tree-item::after {
    content: "";
    position: absolute;
    left: 8px;
    top: 50%;
    width: 12px;
    height: 1px;
    background-color: var(--army-muted, #6c757d);
}

/* Last item gets an L-shaped connector */
.override-tree-item:last-child::before {
    bottom: 50%;
}

/* Non-last items extend the vertical line to the next sibling */
.override-tree-item:not(:last-child)::before {
    bottom: -100%;
}

/* Sub-override tree (nested level) */
.sub-override-tree {
    position: relative;
    margin-left: 12px;
}

.sub-override-tree-item {
    position: relative;
    padding-left: 24px;
}

.sub-override-tree-item::before {
    content: "";
    position: absolute;
    left: 8px;
    top: 0;
    bottom: 50%;
    width: 1px;
    background-color: var(--army-muted, #6c757d);
}

.sub-override-tree-item::after {
    content: "";
    position: absolute;
    left: 8px;
    top: 50%;
    width: 12px;
    height: 1px;
    background-color: var(--army-muted, #6c757d);
}

.sub-override-tree-item:last-child::before {
    bottom: 50%;
}

.sub-override-tree-item:not(:last-child)::before {
    bottom: -100%;
}

/* Override info tooltip styling */
.override-info-icon {
    cursor: help;
    opacity: 0.7;
    font-size: 12px;
}

.override-info-icon:hover {
    opacity: 1;
}

/* Override action buttons - show on hover (desktop only) */
@media (min-width: 992px) {
    .override-actions {
        opacity: 0;
        transition: opacity 0.15s ease-in-out;
    }

    .override-tree-item:hover .override-actions {
        opacity: 1;
    }

    /* Also show when focused (keyboard navigation) */
    .override-actions:focus-within {
        opacity: 1;
    }
}