/* FPL Parrot - Design System
   Brand: deep navy base, electric blue accent, sharp typography
   -------------------------------------------------------- */

/* === BRAND TOKENS === */
:root {
    --bg-base:      #080c14;
    --bg-surface:   #0f1623;
    --bg-raised:    #162032;
    --bg-hover:     #1a2840;
    --border:       #1e2d45;
    --border-light: #243450;
    --accent:       #3b82f6;
    --accent-glow:  rgba(59,130,246,0.18);
    --accent-hover: #60a5fa;
    --green:        #22c55e;
    --green-dim:    rgba(34,197,94,0.12);
    --red:          #ef4444;
    --red-dim:      rgba(239,68,68,0.12);
    --amber:        #f59e0b;
    --amber-dim:    rgba(245,158,11,0.12);
    --purple:       #a78bfa;
    --text-primary: #f0f4f8;
    --text-secondary: #7a91b0;
    --text-muted:   #4a6080;
    --gold:         #d4a017;
    --silver:       #8a9bb0;
    --bronze:       #a0694a;
}

/* === BASE === */
body {
    background: var(--bg-base) !important;
    color: var(--text-primary) !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    -webkit-font-smoothing: antialiased;
}

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

h1, h2, h3, h4, h5, h6 { color: var(--text-primary); }

/* === BOOTSTRAP OVERRIDES === */

.container, .container-fluid { color: var(--text-primary); }

.alert-info {
    background-color: var(--bg-surface) !important;
    border-color: var(--border) !important;
    color: var(--text-primary) !important;
}
.alert-success {
    background-color: var(--green-dim) !important;
    border-color: rgba(34,197,94,0.3) !important;
    color: var(--green) !important;
}
.alert-danger {
    background-color: var(--red-dim) !important;
    border-color: rgba(239,68,68,0.3) !important;
    color: var(--red) !important;
}

/* Badges */
.badge-primary   { background-color: var(--accent) !important; }
.badge-secondary { background-color: var(--bg-raised) !important; color: var(--text-secondary) !important; }
.badge-warning   { background-color: rgba(245,158,11,0.2) !important; color: var(--amber) !important; }
.badge-danger    { background-color: var(--red-dim) !important; color: var(--red) !important; }

/* Progress bar */
.progress {
    background-color: var(--bg-raised) !important;
    border: 1px solid var(--border);
    border-radius: 6px;
}
.progress-bar            { background-color: var(--accent) !important; }
.progress-bar.bg-success { background: linear-gradient(90deg, #16a34a, #22c55e) !important; }
.progress-bar.bg-danger  { background-color: var(--red) !important; }

/* Text helpers */
.text-muted { color: var(--text-secondary) !important; }

/* List groups (index.php navigation) */
.list-group-item {
    background-color: var(--bg-surface) !important;
    border-color: var(--border) !important;
    color: var(--text-primary) !important;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.list-group-item-action:hover,
.list-group-item-action:focus {
    background-color: var(--bg-hover) !important;
    border-color: var(--accent) !important;
    color: var(--accent-hover) !important;
}

/* Form controls */
.form-control {
    background-color: var(--bg-surface) !important;
    border-color: var(--border) !important;
    color: var(--text-primary) !important;
    border-radius: 8px;
}
.form-control:focus {
    background-color: var(--bg-raised) !important;
    border-color: var(--accent) !important;
    color: var(--text-primary) !important;
    box-shadow: 0 0 0 3px var(--accent-glow) !important;
}
label { color: var(--text-primary); }

/* Buttons */
.btn-primary {
    background: linear-gradient(135deg, #1d4ed8, #3b82f6) !important;
    border-color: #1d4ed8 !important;
    color: #fff !important;
    border-radius: 8px;
    font-weight: 600;
}
.btn-primary:hover {
    background: linear-gradient(135deg, #2563eb, #60a5fa) !important;
    border-color: #2563eb !important;
}
.btn-secondary {
    background-color: var(--bg-raised) !important;
    border-color: var(--border) !important;
    color: var(--text-secondary) !important;
    border-radius: 8px;
}
.btn-secondary:hover {
    background-color: var(--bg-hover) !important;
    border-color: var(--accent) !important;
    color: var(--text-primary) !important;
}
.btn-outline-secondary {
    border-color: var(--border) !important;
    color: var(--text-secondary) !important;
    border-radius: 8px;
}
.btn-outline-secondary:hover {
    background-color: var(--bg-raised) !important;
    border-color: var(--border-light) !important;
    color: var(--text-primary) !important;
}
.btn-outline-primary {
    border-color: var(--accent) !important;
    color: var(--accent) !important;
    border-radius: 8px;
}
.btn-outline-primary:hover {
    background-color: var(--accent-glow) !important;
    color: var(--accent-hover) !important;
}
.btn-outline-success {
    border-color: var(--green) !important;
    color: var(--green) !important;
    border-radius: 8px;
}
.btn-outline-success:hover {
    background-color: var(--green-dim) !important;
    color: var(--green) !important;
}

/* === TABLES === */
.table { color: var(--text-primary) !important; }
.table-bordered { border-color: var(--border) !important; }
.table-bordered th,
.table-bordered td { border-color: var(--border) !important; }
.table-striped tbody tr:nth-of-type(odd)  { background-color: var(--bg-surface) !important; }
.table-striped tbody tr:nth-of-type(even) { background-color: var(--bg-base) !important; }
.table thead th {
    background-color: var(--bg-raised) !important;
    color: var(--text-secondary) !important;
    border-color: var(--border) !important;
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    font-weight: 600;
}

/* DataTables overrides */
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_processing,
.dataTables_wrapper .dataTables_paginate {
    color: var(--text-secondary) !important;
}
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
    background-color: var(--bg-surface) !important;
    border: 1px solid var(--border) !important;
    color: var(--text-primary) !important;
    border-radius: 6px;
    padding: 4px 8px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
    color: var(--text-secondary) !important;
    background: var(--bg-surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: 6px !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: var(--bg-raised) !important;
    color: var(--text-primary) !important;
    border-color: var(--accent) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--accent) !important;
    color: #fff !important;
    border-color: var(--accent) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
    color: var(--text-muted) !important;
    background: var(--bg-base) !important;
    border-color: var(--border) !important;
}
table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after { opacity: 0.4; color: var(--text-muted) !important; }
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after { opacity: 1; color: var(--accent) !important; }
table.dataTable tbody tr           { background-color: var(--bg-base) !important; }
table.dataTable tbody tr:hover     { background-color: var(--bg-hover) !important; }
table.dataTable.stripe tbody tr.odd,
table.dataTable.display tbody tr.odd  { background-color: var(--bg-surface) !important; }
table.dataTable.stripe tbody tr.even,
table.dataTable.display tbody tr.even { background-color: var(--bg-base) !important; }

/* DataTables FixedColumns (md_points.php) */
.dtfc-fixed-left {
    background-color: var(--bg-surface) !important;
    box-shadow: 4px 0 12px rgba(0,0,0,0.6) !important;
}
table.dataTable thead th.dtfc-fixed-left { background-color: var(--bg-raised) !important; }

/* === RAW DATA PAGES === */
pre {
    background-color: var(--bg-surface) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 16px;
    overflow-x: auto;
}

/* === FORM CHECKER === */
.budget-bar {
    background: var(--bg-surface) !important;
    border-color: var(--border) !important;
}
.budget-item .budget-label { color: var(--text-secondary) !important; }
.budget-item .budget-value { color: var(--text-primary) !important; }

.player-card {
    background: var(--bg-surface) !important;
    border-color: var(--border) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.4) !important;
}
.player-card-header { border-bottom-color: var(--accent) !important; }
.player-card-row .label { color: var(--text-secondary) !important; }
.player-card-row .value { color: var(--text-primary) !important; }
.section-label { color: var(--text-secondary) !important; }

.gw-chip, .form-guide-row .gw-chip {
    background: var(--bg-raised) !important;
    border-color: var(--border) !important;
    color: var(--text-primary) !important;
}
.gw-chip .gw-label, .form-guide-row .gw-chip .gw-label { color: var(--text-secondary) !important; }

.transfer-card {
    background: var(--bg-surface) !important;
    border-color: var(--border) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.4) !important;
}
.transfer-card .transfer-header {
    background: var(--bg-raised) !important;
    color: var(--text-primary) !important;
}
.transfer-player.out {
    background: rgba(239,68,68,0.05) !important;
    border-right-color: var(--border) !important;
}
.transfer-player.in { background: rgba(34,197,94,0.05) !important; }
.transfer-player.out .tp-label { color: var(--red) !important; }
.transfer-player.in  .tp-label { color: var(--green) !important; }
.transfer-player .tp-name   { color: var(--text-primary) !important; }
.transfer-player .tp-meta   { color: var(--text-secondary) !important; }
.transfer-player .tp-stat-row .stat-label { color: var(--text-secondary) !important; }
.transfer-player .tp-stat-row .stat-value { color: var(--text-primary) !important; }
.transfer-player .tp-gw-chip {
    background: var(--bg-raised) !important;
    border-color: var(--border) !important;
    color: var(--text-primary) !important;
}
.transfer-player .tp-gw-chip .gw-label { color: var(--text-secondary) !important; }

/* === SELECT (best_xi.php) === */
select.form-control option { background-color: var(--bg-surface); color: var(--text-primary); }

/* === SCROLLBAR === */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--bg-base); }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--border-light); }

/* === SHARED PAGE COMPONENTS === */

/* Page header (injury_watch, fpl_summary, manager_compare) */
.page-header {
    padding: 32px 0 20px;
    text-align: center;
}
.page-header h1 {
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--text-primary);
    margin-bottom: 4px;
}
.page-header .sub {
    font-size: 0.82rem;
    color: var(--text-secondary);
}
.back-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    color: var(--text-secondary);
    text-decoration: none;
    margin-bottom: 20px;
}
.back-link:hover { color: var(--accent); text-decoration: none; }

/* Site footer */
.site-footer {
    text-align: center;
    padding: 24px 0 16px;
    font-size: 0.72rem;
    color: var(--text-muted);
}

/* Error box */
.error-box {
    background: var(--red-dim);
    border: 1px solid rgba(239,68,68,0.3);
    border-radius: 10px;
    padding: 14px 16px;
    color: var(--red);
    font-size: 0.88rem;
    margin-bottom: 20px;
}

/* Input card (fpl_summary, manager_compare) */
.input-card {
    background: var(--bg-surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 24px;
}
.input-card label {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 6px;
    display: block;
}

/* Go button (fpl_summary, manager_compare) */
.btn-go {
    background: var(--accent);
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 8px 20px;
    font-weight: 700;
    font-size: 0.9rem;
    cursor: pointer;
    white-space: nowrap;
}
.btn-go:hover { opacity: 0.88; }

/* Chart card (fpl_summary, manager_compare) */
.chart-card {
    background: var(--bg-surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 20px;
}
.chart-card h2 {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 4px;
}
.chart-card .chart-sub {
    font-size: 0.75rem;
    color: var(--text-secondary);
    margin-bottom: 16px;
}
.chart-wrap {
    position: relative;
    width: 100%;
}

/* Chip legend (fpl_summary, manager_compare) */
.chip-legend {
    margin-top: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.chip-badge {
    font-size: 0.68rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 10px;
}
.chip-wildcard { background: rgba(167,139,250,0.15); color: #c4b5fd; border: 1px solid rgba(167,139,250,0.35); }
.chip-freehit  { background: rgba(96,165,250,0.15);  color: #60a5fa; border: 1px solid rgba(96,165,250,0.35); }
.chip-3xc      { background: rgba(239,68,68,0.15);   color: #f87171; border: 1px solid rgba(239,68,68,0.35); }
.chip-bboost   { background: rgba(234,179,8,0.15);   color: #facc15; border: 1px solid rgba(234,179,8,0.35); }