/* =====================================================================
   CFBRank · static/css/styles.css  (Direction D — Prime Time refresh)
   Cosmetic refresh of the class names already used across templates:
   .rank-badge, .rank-badge-mobile, .team-logo, .team-logo-mobile,
   .conference-tag, .conference-badge-mobile, .rating-badge,
   .rating-badge-mobile, .feature-card, .team-name, .team-name-mobile,
   .legend-*, .official-tagline, .tagline-*, .methodology-btn, etc.
   No class renames; templates need no markup changes.
   ===================================================================== */

:root {
    --d-bg:        #0F1B2D;
    --d-bg-2:      #14233A;
    --d-bg-3:      #1B2D48;
    --d-border:    #2A3C58;
    --d-cream:     #F5EBD8;
    --d-cream-dim: #C9BFAE;
    --d-dim:       #8A98AE;
    --d-accent:    #B8332E;
    --d-accent-2:  #D14841;
    --d-gold:      #C9A961;
}

/* ===== Card / panel surface defaults so Bootstrap cards read on dark ===== */
.card {
    background: var(--d-bg-2);
    border: 1px solid var(--d-border) !important;
    border-radius: 4px !important;
    color: var(--d-cream);
    overflow: hidden;
}
.card-header,
.card-footer {
    background: var(--d-bg) !important;
    border-color: var(--d-border) !important;
    border-left: 3px solid var(--d-gold) !important;
    color: var(--d-cream) !important;
}
.card-header h1, .card-header h2, .card-header h3,
.card-header h4, .card-header h5, .card-header h6 {
    color: var(--d-cream) !important;
}

/* ===== Tables on dark ===== */
.table {
    color: var(--d-cream);
    --bs-table-bg: transparent;
    --bs-table-color: var(--d-cream);
    --bs-table-striped-bg: rgba(255,255,255,0.025);
    --bs-table-striped-color: var(--d-cream);
    --bs-table-hover-bg: rgba(184, 51, 46, 0.08);
    --bs-table-hover-color: var(--d-cream);
    margin-bottom: 0;
}
.table thead {
    background: var(--d-bg) !important;
}
.table thead th {
    color: var(--d-cream-dim) !important;
    font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase;
    border-bottom: 2px solid var(--d-border) !important;
    background: var(--d-bg) !important;
}
.table tbody tr {
    border-color: var(--d-border);
    transition: background-color 0.15s ease, border-left-color 0.15s ease;
    border-left: 3px solid transparent;
}
.table tbody td {
    border-color: var(--d-border);
    color: var(--d-cream);
    vertical-align: middle;
}
.table-hover tbody tr:hover {
    background-color: rgba(201, 169, 97, 0.06) !important;
    border-left-color: var(--d-gold) !important;
}

/* Headings ride the editorial serif */
h1, h2, h3, h4 {
    color: var(--d-cream);
}
.text-dark { color: var(--d-cream) !important; }
.text-muted { color: var(--d-dim) !important; }
.bg-white { background: var(--d-bg-2) !important; }

/* ===== RANK BADGES ===== */
.rank-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    font-family: 'Plus Jakarta Sans', -apple-system, sans-serif;
    font-style: normal;
    font-weight: 800;
    font-size: 1.1rem;
    color: var(--d-cream);
    background: var(--d-bg-3);
    border: 2px solid var(--d-border);
}
.rank-badge.playoff-bye {
    background: var(--d-accent);
    color: var(--d-cream);
    border-color: var(--d-accent);
}
.rank-badge.playoff-game {
    background: transparent;
    color: var(--d-gold);
    border-color: var(--d-gold);
}
.rank-badge.bubble {
    background: transparent;
    color: var(--d-cream-dim);
    border-color: var(--d-border);
}

.rank-badge-mobile {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 6px;
    font-family: 'Plus Jakarta Sans', -apple-system, sans-serif;
    font-style: normal;
    font-weight: 800;
    font-size: 0.95rem;
    color: var(--d-cream);
    background: var(--d-bg-3);
    border: 2px solid var(--d-border);
}
.rank-badge-mobile.playoff-bye  { background: var(--d-accent); border-color: var(--d-accent); color: var(--d-cream); }
.rank-badge-mobile.playoff-game { background: transparent; color: var(--d-gold); border-color: var(--d-gold); }
.rank-badge-mobile.bubble       { background: transparent; color: var(--d-cream-dim); border-color: var(--d-border); }

/* ===== TEAM LOGOS ===== */
.team-logo {
    width: 44px;
    height: 44px;
    object-fit: contain;
    filter: drop-shadow(0 0 6px rgba(245, 235, 216, 0.35)) drop-shadow(0 0 12px rgba(201, 169, 97, 0.15));
}
.team-logo-mobile {
    width: 32px;
    height: 32px;
    object-fit: contain;
    flex-shrink: 0;
    filter: drop-shadow(0 0 5px rgba(245, 235, 216, 0.35)) drop-shadow(0 0 10px rgba(201, 169, 97, 0.15));
}

/* ===== TEAM NAMES ===== */
.team-name {
    font-family: 'Plus Jakarta Sans', -apple-system, sans-serif;
    font-weight: 700;
    font-size: 1.05rem;
    color: var(--d-cream) !important;
    transition: color 0.2s ease;
}
.team-name:hover { color: var(--d-accent-2) !important; }

.team-name-mobile {
    font-family: 'Plus Jakarta Sans', -apple-system, sans-serif;
    font-weight: 700;
    font-size: 0.95rem;
    color: var(--d-cream) !important;
}
.team-name-mobile:hover { color: var(--d-accent-2) !important; }

/* ===== CONFERENCE TAG ===== */
.conference-tag {
    display: inline-block;
    padding: 5px 11px;
    background: transparent;
    border: 1px solid var(--d-border);
    border-radius: 0;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 700;
    color: var(--d-cream-dim);
    text-transform: uppercase;
    letter-spacing: 0.14em;
}
.conference-badge-mobile {
    display: inline-block;
    padding: 3px 7px;
    background: transparent;
    border: 1px solid var(--d-border);
    border-radius: 0;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 700;
    color: var(--d-cream-dim);
    text-transform: uppercase;
    letter-spacing: 0.12em;
}

/* ===== RATING BADGE ===== */
.rating-badge {
    display: inline-block;
    padding: 6px 12px;
    background: transparent;
    color: var(--d-accent-2) !important;
    border: 1px solid var(--d-accent);
    border-radius: 0;
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700;
    font-size: 0.85rem;
    letter-spacing: 0.04em;
}
.rating-badge-mobile {
    display: inline-block;
    padding: 4px 9px;
    background: transparent;
    color: var(--d-accent-2) !important;
    border: 1px solid var(--d-accent);
    border-radius: 0;
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700;
    font-size: 0.78rem;
    letter-spacing: 0.04em;
}

/* ===== ROW TINTS for top groups (templates inline these as bg colors —
   override via :is() so old inline-style RGBA values get replaced) ===== */
.table tbody tr[style*="rgba(25, 135, 84"] {
    background: rgba(184, 51, 46, 0.08) !important;
    border-left: 3px solid var(--d-accent);
}
.table tbody tr[style*="rgba(255, 193, 7"] {
    background: rgba(201, 169, 97, 0.06) !important;
    border-left: 3px solid var(--d-gold);
}

/* ===== LEGEND ===== */
.legend-item {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--d-cream-dim);
}
.legend-item small {
    color: var(--d-cream-dim) !important;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.legend-color {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid var(--d-border);
}
.legend-color.playoff-bye  { background: var(--d-accent);  border-color: var(--d-accent); }
.legend-color.playoff-game { background: transparent;       border-color: var(--d-gold); }
.legend-color.bubble       { background: transparent;       border-color: var(--d-border); }

/* ===== FEATURE CARDS (landing) ===== */
.feature-card {
    background: var(--d-bg-2);
    border: 1px solid var(--d-border);
    border-radius: 4px;
    padding: 2rem;
    text-align: left;
    height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}
.feature-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 3px;
    height: 100%;
    background: var(--d-accent);
}
.feature-card:hover { border-color: var(--d-cream-dim); }
.feature-icon {
    font-size: 2.4rem;
    margin-bottom: 1rem;
    color: var(--d-gold);
}
.feature-title {
    font-family: 'Plus Jakarta Sans', -apple-system, sans-serif;
    font-style: normal;
    color: var(--d-cream) !important;
    font-weight: 700;
    font-size: 1.5rem;
    margin-bottom: 0.75rem;
}
.feature-description {
    color: var(--d-cream-dim);
    line-height: 1.65;
    margin-bottom: 1.25rem;
    flex-grow: 1;
    font-size: 0.95rem;
}
.feature-link {
    color: var(--d-accent-2);
    text-decoration: none;
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}
.feature-link:hover { color: var(--d-cream); }

/* ===== TAGLINE / METHODOLOGY ===== */
.official-tagline {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 1rem;
}
.tagline-accent {
    width: 60px;
    height: 1px;
    background: var(--d-border);
}
.tagline-text {
    font-family: 'Plus Jakarta Sans', -apple-system, sans-serif;
    font-style: normal;
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--d-cream) !important;
    margin: 0;
    letter-spacing: -0.005em;
    text-transform: none;
    background: none !important;
    -webkit-text-fill-color: var(--d-cream) !important;
    text-shadow: none !important;
}
.tagline-description {
    color: var(--d-cream-dim);
    font-size: 0.95rem;
    font-weight: 500;
    margin: 0 auto 1.5rem;
    max-width: 620px;
    line-height: 1.65;
}
.methodology-btn {
    border: 1px solid var(--d-border) !important;
    background: transparent !important;
    color: var(--d-cream-dim) !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.16em !important;
    text-transform: uppercase;
    padding: 10px 20px !important;
    border-radius: 0 !important;
}
.methodology-btn:hover {
    background: var(--d-accent) !important;
    border-color: var(--d-accent) !important;
    color: var(--d-cream) !important;
}

/* ===== BUTTONS — global Bootstrap variants on dark ===== */
.btn-primary {
    background: var(--d-accent) !important;
    border-color: var(--d-accent) !important;
    color: var(--d-cream) !important;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    border-radius: 0 !important;
    padding: 10px 20px !important;
}
.btn-primary:hover, .btn-primary:focus {
    background: var(--d-accent-2) !important;
    border-color: var(--d-accent-2) !important;
    color: var(--d-cream) !important;
}
.btn-outline-light {
    color: var(--d-cream) !important;
    border-color: var(--d-border) !important;
}
.btn-outline-light:hover {
    background: var(--d-bg-3) !important;
    border-color: var(--d-cream) !important;
    color: var(--d-cream) !important;
}
.btn-outline-dark, .btn-outline-secondary {
    color: var(--d-cream-dim) !important;
    border-color: var(--d-border) !important;
    background: transparent !important;
}
.btn-outline-dark:hover, .btn-outline-secondary:hover {
    background: var(--d-bg-3) !important;
    border-color: var(--d-cream-dim) !important;
    color: var(--d-cream) !important;
}
.btn-outline-info, .btn-outline-danger {
    color: var(--d-accent-2) !important;
    border-color: var(--d-accent) !important;
    background: transparent !important;
}
.btn-outline-info:hover, .btn-outline-danger:hover {
    background: var(--d-accent) !important;
    color: var(--d-cream) !important;
}

/* ===== FORMS on dark ===== */
.form-control, .form-select {
    background: var(--d-bg-2) !important;
    border: 1px solid var(--d-border) !important;
    color: var(--d-cream) !important;
    border-radius: 0 !important;
}
.form-control:focus, .form-select:focus {
    background: var(--d-bg-3) !important;
    border-color: var(--d-accent) !important;
    color: var(--d-cream) !important;
    box-shadow: 0 0 0 0.15rem rgba(184, 51, 46, 0.25) !important;
}
.form-control::placeholder { color: var(--d-dim) !important; }
.form-label { color: var(--d-cream-dim) !important; font-weight: 600; }

/* ===== ALERTS ===== */
.alert {
    border-radius: 0 !important;
    border-width: 1px;
    border-style: solid;
}
.alert-success {
    background: rgba(74, 222, 128, 0.08) !important;
    border-color: rgba(74, 222, 128, 0.4) !important;
    color: #A7F3C5 !important;
}
.alert-danger {
    background: rgba(184, 51, 46, 0.12) !important;
    border-color: var(--d-accent) !important;
    color: #F5C6C2 !important;
}

/* ===== BOOTSTRAP CONFERENCE BADGES (.badge bg-*) — recolor on dark ===== */
.badge {
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    border-radius: 0;
    padding: 5px 9px;
    font-size: 10px;
}
.badge.bg-warning, .badge.bg-warning.text-dark {
    background: var(--d-gold) !important;
    color: var(--d-bg) !important;
}
.badge.bg-light, .badge.bg-light.text-dark {
    background: var(--d-bg-3) !important;
    color: var(--d-cream) !important;
}

/* ===== MOBILE TUNING ===== */
@media (max-width: 768px) {
    .official-tagline { flex-direction: column; gap: 0.5rem; }
    .tagline-accent { width: 40px; }
    .tagline-text { font-size: 1.4rem; }
    .tagline-description { font-size: 0.9rem; }
    .feature-card { padding: 1.5rem; margin-bottom: 1rem; }
    .table thead th, .table tbody td {
        padding: 0.5rem 0.4rem;
        font-size: 0.85rem;
    }
}

/* =====================================================================
   ===== SITE-WIDE OVERRIDES — neutralizes per-template inline styles =====
   These rules catch hardcoded colors and gradients used across ~40
   templates (rankings.html, scoreboard.html, team_leaders.html,
   weekly_movement.html, ml_dashboard.html, etc.) so child pages take on
   the D theme without per-file edits.
   ===================================================================== */

/* ---- BOOTSTRAP COLOR UTILITIES ---- */
.bg-light, .bg-light.rounded { background-color: var(--d-bg-2) !important; color: var(--d-cream) !important; }
.bg-white                    { background-color: var(--d-bg-2) !important; }
.bg-dark                     { background-color: var(--d-bg) !important; }
.bg-secondary                { background-color: var(--d-bg-3) !important; }
.bg-primary                  { background-color: var(--d-accent) !important; }
.bg-success                  { background-color: #2F7D52 !important; color: var(--d-cream) !important; }
.bg-danger                   { background-color: var(--d-accent) !important; }
.bg-warning, .bg-warning.text-dark { background-color: var(--d-gold) !important; color: var(--d-bg) !important; }
.bg-info                     { background-color: #2D6E8E !important; color: var(--d-cream) !important; }

.text-primary   { color: var(--d-accent-2) !important; }
.text-success   { color: #6FD49B !important; }
.text-danger    { color: var(--d-accent-2) !important; }
.text-warning   { color: var(--d-gold) !important; }
.text-info      { color: #7BB7D1 !important; }
.text-secondary { color: var(--d-dim) !important; }
.text-purple    { color: var(--d-gold) !important; }
.text-white     { color: var(--d-cream) !important; }
.text-black     { color: var(--d-cream) !important; }

/* Inline color="..." style attributes used in templates — override common purples/violets/oranges */
[style*="color: #6366f1"], [style*="color:#6366f1"] { color: var(--d-accent-2) !important; }
[style*="color: #8b5cf6"], [style*="color:#8b5cf6"] { color: var(--d-gold) !important; }
[style*="color: #a855f7"], [style*="color:#a855f7"] { color: var(--d-gold) !important; }
[style*="color: #f59e0b"], [style*="color:#f59e0b"] { color: var(--d-gold) !important; }
[style*="color: #d97706"], [style*="color:#d97706"] { color: var(--d-gold) !important; }
[style*="color: #007bff"], [style*="color:#007bff"] { color: var(--d-accent-2) !important; }
[style*="color: #28a745"], [style*="color:#28a745"] { color: #6FD49B !important; }
[style*="color: #dc3545"], [style*="color:#dc3545"] { color: var(--d-accent-2) !important; }
[style*="color: #ffc107"], [style*="color:#ffc107"] { color: var(--d-gold) !important; }
[style*="color: #6c757d"], [style*="color:#6c757d"] { color: var(--d-dim) !important; }
[style*="color: white"]    { color: var(--d-cream) !important; }
[style*="color: #fff"]     { color: var(--d-cream) !important; }
[style*="color: #ffffff"]  { color: var(--d-cream) !important; }

/* Inline gradient backgrounds (card-headers, navbars, badges) — replace ALL gradients on common targets */
.card-header[style*="linear-gradient"],
.table th[style*="linear-gradient"],
[style*="linear-gradient(135deg, #14532d"],
[style*="linear-gradient(135deg, #166534"],
[style*="linear-gradient(135deg, #16a34a"],
[style*="linear-gradient(135deg, #6366f1"],
[style*="linear-gradient(135deg, #8b5cf6"],
[style*="linear-gradient(135deg, #a855f7"],
[style*="linear-gradient(135deg, #f59e0b"],
[style*="linear-gradient(135deg, #d97706"],
[style*="linear-gradient(135deg, #007bff"],
[style*="linear-gradient(135deg, #0056b3"],
[style*="linear-gradient(135deg, #28a745"],
[style*="linear-gradient(135deg, #20c997"],
[style*="linear-gradient(135deg, #dc3545"],
[style*="linear-gradient(135deg, #e74c3c"],
[style*="linear-gradient(135deg, #f8f9fa"],
[style*="linear-gradient(135deg, #e9ecef"] {
    background: var(--d-bg-3) !important;
    color: var(--d-cream) !important;
    border-color: var(--d-border) !important;
}

/* Card headers in general — kill rounded corners, recolor, gold left accent */
.card-header {
    background: var(--d-bg) !important;
    border-bottom: 1px solid var(--d-border) !important;
    border-left: 3px solid var(--d-gold) !important;
    color: var(--d-cream) !important;
    border-radius: 0 !important;
}
.card-header h1, .card-header h2, .card-header h3,
.card-header h4, .card-header h5, .card-header h6,
.card-header .card-title, .card-header small {
    color: var(--d-cream) !important;
}
.card-header small { color: var(--d-cream-dim) !important; }

/* Card body text */
.card-body { color: var(--d-cream); }
.card-body small, .card-body .text-muted { color: var(--d-dim) !important; }

/* ---- BUTTON OVERRIDES ---- */
.btn-success {
    background: #2F7D52 !important;
    border-color: #2F7D52 !important;
    color: var(--d-cream) !important;
}
.btn-success:hover { background: #3A9866 !important; border-color: #3A9866 !important; }
.btn-danger {
    background: var(--d-accent) !important;
    border-color: var(--d-accent) !important;
    color: var(--d-cream) !important;
}
.btn-danger:hover { background: var(--d-accent-2) !important; border-color: var(--d-accent-2) !important; }
.btn-warning {
    background: var(--d-gold) !important;
    border-color: var(--d-gold) !important;
    color: var(--d-bg) !important;
}
.btn-info {
    background: #2D6E8E !important;
    border-color: #2D6E8E !important;
    color: var(--d-cream) !important;
}
.btn-secondary {
    background: var(--d-bg-3) !important;
    border-color: var(--d-border) !important;
    color: var(--d-cream-dim) !important;
}
.btn-purple, .btn-purple:hover {
    background: var(--d-gold) !important;
    border-color: var(--d-gold) !important;
    color: var(--d-bg) !important;
}
.btn-outline-success {
    color: #6FD49B !important;
    border-color: #2F7D52 !important;
    background: transparent !important;
}
.btn-outline-success:hover { background: #2F7D52 !important; color: var(--d-cream) !important; }
.btn-outline-warning {
    color: var(--d-gold) !important;
    border-color: var(--d-gold) !important;
    background: transparent !important;
}
.btn-outline-warning:hover { background: var(--d-gold) !important; color: var(--d-bg) !important; }
.btn-outline-primary {
    color: var(--d-accent-2) !important;
    border-color: var(--d-accent) !important;
    background: transparent !important;
}
.btn-outline-primary:hover { background: var(--d-accent) !important; color: var(--d-cream) !important; }

/* All buttons get the mono label treatment */
.btn {
    font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    border-radius: 0 !important;
    padding: 9px 18px;
}
.btn-sm { font-size: 10px; padding: 6px 12px; letter-spacing: 0.12em; }
.btn-lg { font-size: 12px; padding: 14px 26px; }

/* ---- WEEKLY MOVEMENT specific (.rank-up / .rank-down / .rank-new / .rank-same) ---- */
.rank-up {
    background: transparent !important;
    color: #6FD49B !important;
    border: 1px solid #2F7D52 !important;
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700 !important;
    padding: 4px 10px !important;
    border-radius: 0 !important;
    font-size: 11px;
    letter-spacing: 0.08em;
}
.rank-down {
    background: transparent !important;
    color: var(--d-accent-2) !important;
    border: 1px solid var(--d-accent) !important;
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700 !important;
    padding: 4px 10px !important;
    border-radius: 0 !important;
    font-size: 11px;
    letter-spacing: 0.08em;
}
.rank-new {
    background: var(--d-gold) !important;
    color: var(--d-bg) !important;
    border: 1px solid var(--d-gold) !important;
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700 !important;
    padding: 4px 10px !important;
    border-radius: 0 !important;
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.rank-same {
    background: transparent !important;
    color: var(--d-dim) !important;
    border: 1px solid var(--d-border) !important;
    font-family: 'JetBrains Mono', monospace;
    font-weight: 600 !important;
    padding: 4px 10px !important;
    border-radius: 0 !important;
    font-size: 11px;
}

/* ---- COMPARISON RESULTS specific ---- */
.prediction-card { border-left: 4px solid var(--d-accent) !important; background: var(--d-bg-2); }
.confidence-high   { border-left-color: #6FD49B !important; }
.confidence-medium { border-left-color: var(--d-gold) !important; }
.confidence-low    { border-left-color: var(--d-accent-2) !important; }
.stat-positive   { color: #6FD49B !important; font-weight: 700; }
.stat-negative   { color: var(--d-accent-2) !important; font-weight: 700; }
.stat-neutral    { color: var(--d-dim) !important; }
.momentum-up     { color: #6FD49B !important; }
.momentum-down   { color: var(--d-accent-2) !important; }
.momentum-stable { color: var(--d-dim) !important; }
.scientific-breakdown {
    background: var(--d-bg-2) !important;
    border: 1px solid var(--d-border) !important;
    border-radius: 0 !important;
}
.factor-item { border-bottom-color: var(--d-border) !important; }

/* ---- MODULE / TIER badges (ranking_methodology, prediction factors) ---- */
.module-header {
    background: var(--d-bg-3) !important;
    color: var(--d-cream) !important;
    border-bottom: 2px solid var(--d-accent) !important;
    border-radius: 0 !important;
}
.tier-fcs { background: var(--d-dim) !important; color: var(--d-cream) !important; }

/* ---- PROGRESS BARS ---- */
.progress {
    background-color: var(--d-bg-3) !important;
    border-radius: 0 !important;
    border: 1px solid var(--d-border);
    height: 8px;
}
.progress-bar {
    background-color: var(--d-accent) !important;
    border-radius: 0 !important;
}
.progress-bar.bg-success { background-color: #2F7D52 !important; }
.progress-bar.bg-warning { background-color: var(--d-gold) !important; }
.progress-bar.bg-danger  { background-color: var(--d-accent) !important; }
.progress-bar.bg-info    { background-color: #2D6E8E !important; }

/* ---- BORDERS ---- */
.border, .border-top, .border-bottom, .border-start, .border-end,
.border-1, .border-2, .border-3, .border-4, .border-5 {
    border-color: var(--d-border) !important;
}

/* ---- CARDS — universal ---- */
.card {
    border-radius: 0 !important;
    border: 1px solid var(--d-border) !important;
    background: var(--d-bg-2) !important;
    color: var(--d-cream) !important;
    box-shadow: none !important;
}
.card.shadow, .card.shadow-sm, .card.shadow-lg {
    box-shadow: none !important;
}
.card.border-0 {
    border: 1px solid var(--d-border) !important;
}

/* ---- LIST GROUPS ---- */
.list-group-item {
    background: var(--d-bg-2) !important;
    border-color: var(--d-border) !important;
    color: var(--d-cream) !important;
}
.list-group-item.active {
    background: var(--d-accent) !important;
    border-color: var(--d-accent) !important;
}

/* ---- MODALS ---- */
.modal-content {
    background: var(--d-bg-2) !important;
    border: 1px solid var(--d-border) !important;
    border-radius: 0 !important;
    color: var(--d-cream);
}
.modal-header, .modal-footer {
    border-color: var(--d-border) !important;
}
.modal-header.bg-danger, .modal-header.bg-primary, .modal-header.bg-success {
    background: var(--d-bg) !important;
    border-bottom: 2px solid var(--d-accent) !important;
}

/* ---- NAV TABS / PILLS ---- */
.nav-tabs, .nav-pills {
    border-bottom: 1px solid var(--d-border);
}
.nav-tabs .nav-link, .nav-pills .nav-link {
    color: var(--d-cream-dim);
    border-radius: 0 !important;
    border: 1px solid transparent;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}
.nav-tabs .nav-link:hover, .nav-pills .nav-link:hover {
    color: var(--d-cream);
    background: var(--d-bg-3);
    border-color: var(--d-border) var(--d-border) transparent;
}
.nav-tabs .nav-link.active, .nav-pills .nav-link.active {
    color: var(--d-cream) !important;
    background: var(--d-bg-2) !important;
    border-color: var(--d-border) var(--d-border) var(--d-bg-2) !important;
}
.nav-pills .nav-link.active {
    background: var(--d-accent) !important;
    border-color: var(--d-accent) !important;
}

/* ---- BREADCRUMB ---- */
.breadcrumb {
    background: transparent !important;
    padding: 0;
}
.breadcrumb-item, .breadcrumb-item a {
    color: var(--d-cream-dim) !important;
    font-family: 'JetBrains Mono', monospace;
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.breadcrumb-item.active { color: var(--d-cream) !important; }

/* ---- PAGINATION ---- */
.page-link {
    background: var(--d-bg-2) !important;
    border-color: var(--d-border) !important;
    color: var(--d-cream-dim) !important;
}
.page-link:hover {
    background: var(--d-bg-3) !important;
    color: var(--d-cream) !important;
}
.page-item.active .page-link {
    background: var(--d-accent) !important;
    border-color: var(--d-accent) !important;
    color: var(--d-cream) !important;
}

/* ---- DROPDOWN (non-navbar) ---- */
.dropdown-menu:not(.modern-dropdown) {
    background: var(--d-bg-2) !important;
    border: 1px solid var(--d-border) !important;
    border-radius: 0 !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.4) !important;
}
.dropdown-item {
    color: var(--d-cream-dim) !important;
}
.dropdown-item:hover, .dropdown-item:focus {
    background: var(--d-bg-3) !important;
    color: var(--d-cream) !important;
}

/* ---- LINKS in body content ---- */
.container a:not(.btn):not(.nav-link):not(.modern-nav-link):not(.modern-dropdown-item):not(.dropdown-item):not(.team-name):not(.team-name-mobile):not(.feature-link):not(.page-link):not(.breadcrumb-item) {
    color: var(--d-accent-2);
    text-decoration: none;
}
.container a:not(.btn):not(.nav-link):not(.modern-nav-link):not(.modern-dropdown-item):not(.dropdown-item):not(.team-name):not(.team-name-mobile):not(.feature-link):not(.page-link):not(.breadcrumb-item):hover {
    color: var(--d-cream);
    text-decoration: underline;
}

/* ---- DISPLAY headings (used in dashboards) ---- */
.display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {
    font-family: 'Plus Jakarta Sans', -apple-system, sans-serif;
    font-style: normal;
    font-weight: 700;
    color: var(--d-cream);
}

/* ---- LEAD copy ---- */
.lead { color: var(--d-cream-dim); }

/* ---- HR ---- */
hr { border-color: var(--d-border); opacity: 0.6; }

/* ---- KILL leftover hover transforms from old templates that bump cards up ---- */
.card:hover, .feature-card:hover, .stat-card:hover, .leader-card:hover {
    transform: none !important;
    box-shadow: none !important;
}

/* ---- Common hardcoded badge colors via .badge.bg-purple etc that some templates use ---- */
.badge.bg-purple { background: var(--d-gold) !important; color: var(--d-bg) !important; }

/* ---- Container backgrounds occasionally set via inline styles ---- */
[style*="background: #f8f9fa"], [style*="background-color: #f8f9fa"] {
    background: var(--d-bg-2) !important;
}
[style*="background: #ffffff"], [style*="background-color: #ffffff"],
[style*="background: white"], [style*="background-color: white"] {
    background: var(--d-bg-2) !important;
}

/* ---- Form text helpers ---- */
.form-text { color: var(--d-dim) !important; }
.invalid-feedback { color: var(--d-accent-2) !important; }
.valid-feedback   { color: #6FD49B !important; }

/* ---- Mobile base shell (base_mobile.html) bridge ---- */
.nav-link.active { background: var(--d-bg-3) !important; color: var(--d-cream) !important; }

/* =====================================================================
   DIRECTION D — SYSTEM-WIDE TYPOGRAPHY & BOOTSTRAP REMAP
   Catches all child templates that still use Bootstrap defaults.
   ===================================================================== */

/* ---- Page / section headings ---- */
h1, h2 {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    font-style: normal;
    color: var(--d-cream);
}
h3, h4, h5, h6 {
    font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--d-cream);
}
/* Don't override table headers — already JetBrains Mono via .table thead th */
.table thead th { font-style: normal; }
/* Don't italicise navbar or modal headers */
.navbar h1, .navbar h2, .modal h1, .modal h2,
.modal-title { font-style: normal !important; }

/* ---- Bootstrap text-color utilities ---- */
.text-primary   { color: var(--d-gold)      !important; }
.text-success   { color: #6FD49B            !important; }
.text-danger    { color: var(--d-accent-2)  !important; }
.text-warning   { color: var(--d-gold)      !important; }
.text-info      { color: var(--d-cream-dim) !important; }
.text-muted,
.text-secondary { color: var(--d-dim)       !important; }

/* ---- Bootstrap bg utilities ---- */
.bg-primary { background: var(--d-bg-3)               !important; color: var(--d-cream) !important; }
.bg-success { background: rgba(111,212,155,0.12)       !important; color: #6FD49B       !important; }
.bg-danger  { background: rgba(184,51,46,0.18)         !important; color: var(--d-accent-2) !important; }
.bg-warning { background: rgba(201,169,97,0.15)        !important; color: var(--d-gold) !important; }
.bg-info    { background: rgba(201,169,97,0.10)        !important; color: var(--d-gold) !important; }
.bg-light   { background: var(--d-bg-2)               !important; color: var(--d-cream) !important; }
.bg-dark    { background: var(--d-bg)                 !important; color: var(--d-cream) !important; }
.bg-secondary { background: var(--d-bg-3)             !important; color: var(--d-dim)   !important; }

/* ---- Badge remaps ---- */
.badge.bg-primary   { background: var(--d-gold)                !important; color: var(--d-bg)    !important; }
.badge.bg-success   { background: rgba(111,212,155,0.2)        !important; color: #6FD49B        !important; }
.badge.bg-danger    { background: var(--d-accent)              !important; color: var(--d-cream) !important; }
.badge.bg-warning   { background: var(--d-gold)                !important; color: var(--d-bg)    !important; }
.badge.bg-info      { background: rgba(201,169,97,0.2)         !important; color: var(--d-gold)  !important; }
.badge.bg-secondary { background: var(--d-bg-3)                !important; color: var(--d-dim)   !important; }
.badge.bg-dark      { background: var(--d-bg)                  !important; color: var(--d-cream) !important; }
.badge.bg-light     { background: var(--d-bg-3)                !important; color: var(--d-cream-dim) !important; }

/* ---- Game scoreboard vs/time badges ---- */
.badge.game-vs-badge,
.badge.game-time-badge {
    background: var(--d-bg-3) !important;
    color: var(--d-cream-dim) !important;
    border: 1px solid var(--d-border) !important;
}

/* ---- Bootstrap button remaps ---- */
.btn-primary { background: var(--d-accent)  !important; border-color: var(--d-accent)  !important; color: var(--d-cream) !important; }
.btn-primary:hover,
.btn-primary:focus  { background: var(--d-accent-2) !important; border-color: var(--d-accent-2) !important; }
.btn-success { background: transparent !important; border-color: #6FD49B !important; color: #6FD49B !important; }
.btn-success:hover  { background: rgba(111,212,155,0.12) !important; }
.btn-danger  { background: var(--d-accent) !important; border-color: var(--d-accent) !important; color: var(--d-cream) !important; }
.btn-danger:hover   { background: var(--d-accent-2) !important; border-color: var(--d-accent-2) !important; }
.btn-warning { background: transparent !important; border-color: var(--d-gold) !important; color: var(--d-gold) !important; }
.btn-warning:hover  { background: rgba(201,169,97,0.12) !important; }
.btn-info    { background: var(--d-bg-3) !important; border-color: var(--d-border) !important; color: var(--d-cream-dim) !important; }
.btn-purple,
[style*="background-color: #6f42c1"],
[style*="background-color:#6f42c1"] { background: var(--d-gold) !important; border-color: var(--d-gold) !important; color: var(--d-bg) !important; }

/* ---- Delete button (scoreboard / weekly_results) ---- */
.btn-delete-scheduled           { background-color: var(--d-accent)   !important; }
.btn-delete-scheduled:hover     { background-color: var(--d-accent-2) !important; }

/* ---- Alerts ---- */
.alert-primary,
.alert-info     { background: var(--d-bg-3) !important; border-color: var(--d-border) !important; color: var(--d-cream) !important; }
.alert-success  { background: rgba(111,212,155,0.10) !important; border-color: #6FD49B !important; color: #6FD49B !important; }
.alert-warning  { background: rgba(201,169,97,0.10) !important; border-color: var(--d-gold) !important; color: var(--d-gold) !important; }
.alert-danger   { background: rgba(184,51,46,0.15) !important; border-color: var(--d-accent) !important; color: var(--d-accent-2) !important; }

/* ---- Inline style attribute overrides (catches hardcoded values) ---- */
[style*="background-color: #f8f9fa"],
[style*="background: #f8f9fa"]          { background: var(--d-bg-2)  !important; }
[style*="color: #212529"],
[style*="color:#212529"]                { color: var(--d-cream)      !important; }
[style*="background: #e3f2fd"],
[style*="background-color: #e3f2fd"]    { background: var(--d-bg-3)  !important; }
[style*="background: #fff3e0"],
[style*="background-color: #fff3e0"]    { background: rgba(201,169,97,0.08) !important; }
[style*="rgba(25, 135, 84"]             { background: rgba(111,212,155,0.07) !important; }
[style*="rgba(255, 193, 7"]             { background: rgba(201,169,97,0.07)  !important; }

/* ---- table-light thead (child templates use this class) ---- */
.table-light,
thead.table-light tr,
.table thead.table-light { background: var(--d-bg) !important; color: var(--d-cream-dim) !important; }
.table-light th { color: var(--d-cream-dim) !important; border-color: var(--d-border) !important; }

/* ---- table-primary / table-success row highlights ---- */
.table-primary  { --bs-table-bg: rgba(201,169,97,0.08)  !important; color: var(--d-cream) !important; }
.table-success  { --bs-table-bg: rgba(111,212,155,0.08) !important; color: var(--d-cream) !important; }
.table-danger   { --bs-table-bg: rgba(184,51,46,0.10)   !important; color: var(--d-cream) !important; }
.table-warning  { --bs-table-bg: rgba(201,169,97,0.08)  !important; color: var(--d-cream) !important; }

/* =====================================================================
   RANKINGS TABLE — top-4 / CFP gold/crimson left-border accents
   ===================================================================== */
.table tbody tr.rank-top4 {
    border-left: 3px solid var(--d-gold) !important;
    background: rgba(201, 169, 97, 0.05);
}
.table tbody tr.rank-cfp {
    border-left: 3px solid var(--d-accent) !important;
}
/* suppress the generic hover border so the rank border shows through */
.table-hover tbody tr.rank-top4:hover,
.table-hover tbody tr.rank-cfp:hover {
    border-left-color: inherit !important;
}

/* =====================================================================
   CONFERENCE PILLS — per-conference brand colors
   ===================================================================== */
.conf-pill {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 3px;
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    border: 1px solid transparent;
    white-space: nowrap;
}
/* P4 */
.conf-pill.conf-sec            { background: rgba(187,0,0,0.18);   color: #FF7B7B; border-color: rgba(187,0,0,0.35); }
.conf-pill.conf-big-ten        { background: rgba(0,70,127,0.22);  color: #7FBDFF; border-color: rgba(0,70,127,0.40); }
.conf-pill.conf-big-xii,
.conf-pill.conf-big-12         { background: rgba(0,75,141,0.20);  color: #7BB8FF; border-color: rgba(0,75,141,0.38); }
.conf-pill.conf-acc            { background: rgba(0,50,160,0.20);  color: #7FA8FF; border-color: rgba(0,50,160,0.38); }
/* G5 */
.conf-pill.conf-american       { background: rgba(0,120,80,0.18);  color: #5CDBA8; border-color: rgba(0,120,80,0.35); }
.conf-pill.conf-conference-usa { background: rgba(180,80,0,0.18);  color: #FFB06A; border-color: rgba(180,80,0,0.35); }
.conf-pill.conf-mac            { background: rgba(0,90,160,0.18);  color: #70BDFF; border-color: rgba(0,90,160,0.35); }
.conf-pill.conf-mountain-west  { background: rgba(0,100,60,0.18);  color: #5DE0A8; border-color: rgba(0,100,60,0.35); }
.conf-pill.conf-sun-belt       { background: rgba(0,140,140,0.18); color: #5DE0E0; border-color: rgba(0,140,140,0.35); }
.conf-pill.conf-independent    { background: rgba(100,100,100,0.15); color: var(--d-cream-dim); border-color: var(--d-border); }

/* Light mode — swap to dark backgrounds so the text colors remain readable */
[data-theme="light"] .conf-pill.conf-sec            { background: rgba(187,0,0,0.12);   color: #9B0000; border-color: rgba(187,0,0,0.3); }
[data-theme="light"] .conf-pill.conf-big-ten        { background: rgba(0,70,127,0.12);  color: #00437A; border-color: rgba(0,70,127,0.3); }
[data-theme="light"] .conf-pill.conf-big-xii,
[data-theme="light"] .conf-pill.conf-big-12         { background: rgba(0,75,141,0.12);  color: #004B8D; border-color: rgba(0,75,141,0.3); }
[data-theme="light"] .conf-pill.conf-acc            { background: rgba(0,50,160,0.12);  color: #0032A0; border-color: rgba(0,50,160,0.3); }
[data-theme="light"] .conf-pill.conf-american       { background: rgba(0,120,80,0.12);  color: #006040; border-color: rgba(0,120,80,0.3); }
[data-theme="light"] .conf-pill.conf-conference-usa { background: rgba(180,80,0,0.12);  color: #8B3D00; border-color: rgba(180,80,0,0.3); }
[data-theme="light"] .conf-pill.conf-mac            { background: rgba(0,90,160,0.12);  color: #005AA0; border-color: rgba(0,90,160,0.3); }
[data-theme="light"] .conf-pill.conf-mountain-west  { background: rgba(0,100,60,0.12);  color: #00643C; border-color: rgba(0,100,60,0.3); }
[data-theme="light"] .conf-pill.conf-sun-belt       { background: rgba(0,140,140,0.12); color: #006B6B; border-color: rgba(0,140,140,0.3); }
[data-theme="light"] .conf-pill.conf-independent    { background: rgba(100,100,100,0.1); color: #3D3A35; border-color: #C8C2B8; }

/* Team name links — black in light theme */
[data-theme="light"] .rnk-team-link              { color: #1A1A1A !important; }
[data-theme="light"] .rnk-team-link:hover        { color: #8B6914 !important; }
[data-theme="light"] .team-name                  { color: #1A1A1A !important; }
[data-theme="light"] .team-name:hover            { color: #8B6914 !important; }
[data-theme="light"] .team-name-mobile           { color: #1A1A1A !important; }
[data-theme="light"] .team-name-mobile:hover     { color: #8B6914 !important; }

/* =====================================================================
   TEAM HERO — unified stat panel on team detail page
   ===================================================================== */
.team-hero-card {
    border: 1px solid var(--d-border) !important;
    border-left: 3px solid var(--d-gold) !important;
    overflow: hidden;
}
.team-hero-identity {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: 100% !important;
    gap: 14px;
    padding: 28px 28px 20px;
    border-bottom: 1px solid var(--d-border);
}
.team-hero-identity * {
    text-align: center !important;
}
.team-hero-logo {
    width: 80px;
    height: 80px;
    flex-shrink: 0;
    object-fit: contain;
    filter: drop-shadow(0 0 10px rgba(245, 235, 216, 0.4)) drop-shadow(0 0 20px rgba(201, 169, 97, 0.2));
}
.team-hero-name {
    font-size: clamp(1.4rem, 3vw, 2rem);
    font-weight: 800;
    color: var(--d-cream);
    margin: 0 0 6px;
    line-height: 1.1;
}
.team-hero-meta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}
.team-hero-standing {
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    color: var(--d-dim);
    letter-spacing: 0.08em;
}
.team-hero-stats {
    display: grid;
    grid-template-columns: 1fr 1.4fr 1fr;
    border-top: none;
}
.team-hero-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 20px 16px;
    border-right: 1px solid var(--d-border);
    gap: 4px;
}
.team-hero-stat:last-child { border-right: none; }
.team-hero-stat-value {
    font-size: 1.9rem;
    font-weight: 800;
    color: var(--d-cream);
    line-height: 1;
    letter-spacing: -0.02em;
}
.team-hero-score { color: var(--d-gold); }
.team-hero-stat-main .team-hero-stat-value { font-size: 2.6rem; }
.team-hero-stat-label {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--d-dim);
}
@media (max-width: 576px) {
    .team-hero-identity { padding: 16px; gap: 14px; }
    .team-hero-logo { width: 56px; height: 56px; }
    .team-hero-name { font-size: 1.2rem; }
    .team-hero-stat-value { font-size: 1.4rem; }
    .team-hero-stat-main .team-hero-stat-value { font-size: 1.8rem; }
    .team-hero-stat { padding: 14px 8px; }
}

/* ── Logo glow utility (use on any team logo img not covered by .team-logo) ── */
.logo-glow {
    object-fit: contain;
    filter: drop-shadow(0 0 6px rgba(245, 235, 216, 0.35)) drop-shadow(0 0 12px rgba(201, 169, 97, 0.15));
}