/**
* Fantasy Fairways — Dark Theme Global Overrides
* File: static/css/dark-theme.css
*
* HOW TO USE:
* 1. Copy this file to static/css/dark-theme.css
* 2. In base.html, add this line after the ui.bundle.css link:
*
* 3. Add this script to base.html BEFORE any CSS loads:
*
* 4. The tag needs:
* (the script above overrides this on load from localStorage)
*
* COVERAGE:
* - Body, page backgrounds
* - Cards (league cards, settings cards, info cards)
* - Modals (join league, join club, player picker, league info)
* - Forms (inputs, selects, textareas)
* - Tables (leaderboard, tee times, tour schedule, payment history)
* - Tabs (capsule tabs, filter pills)
* - Sidebar + bottom nav
* - Tour leaderboard section
* - Browse leagues page
* - Settings page
* - Payment history section
* - Player picker modal
* - Action sheet
* - More options menu
* - Toast notifications (unchanged — already themed)
*/
/* ════════════════════════════════════════════════════════════
DARK THEME TOKEN OVERRIDES
(these extend variables.css — must be loaded after it)
════════════════════════════════════════════════════════════ */
[data-theme="dark"] {
/* ── Midnight Fairway palette ── */
--bg-white: #152724; /* card surface */
--bg-light: #0e1c1a; /* page background */
--bg-gray: #1c3330; /* elevated / inputs */
--bg-dark: #0b1917; /* sidebar / topbar */
--bg-green-tint: rgba(0, 106, 78, 0.15);
--bg-blue-tint: rgba(59, 130, 246, 0.1);
--border-light: rgba(255, 255, 255, 0.08);
--border-medium: rgba(255, 255, 255, 0.13);
--border-dark: rgba(255, 255, 255, 0.08);
--text-heading: #edf4f3;
--text-dark: #c4d8d5;
--text-muted: #6da09b;
--text-light: #375c58;
--text-secondary: #6da09b;
--text-subtle: #375c58;
--surface-white: #152724;
--surface-light: #0e1c1a;
--surface-border: rgba(255, 255, 255, 0.08);
}
/* Light theme explicit restore (for toggle) */
[data-theme="light"] {
--bg-white: #ffffff;
--bg-light: #f9fafb;
--bg-gray: #f3f4f6;
--border-light: #e5e7eb;
--border-medium: #d1d5db;
--text-heading: #1a1a2e;
--text-dark: #1f2937;
--text-muted: #6b7280;
--text-light: #9ca3af;
}
/* ════════════════════════════════════════════════════════════
BODY + PAGE BACKGROUNDS
════════════════════════════════════════════════════════════ */
[data-theme="dark"] body {
background-color: #0e1c1a;
color: #c4d8d5;
}
[data-theme="dark"] .dashboard-wrapper,
[data-theme="dark"] .dashboard-content,
[data-theme="dark"] .content-container {
background-color: #0e1c1a;
}
/* Remove all light gradient backgrounds on page wrappers */
[data-theme="dark"] .settings-wrapper,
[data-theme="dark"] .ae-page,
[data-theme="dark"] .ee-page,
[data-theme="dark"] .form-wrapper {
background: #0e1c1a;
}
/* ════════════════════════════════════════════════════════════
CARDS — white cards → dark surfaces
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .settings-section,
[data-theme="dark"] .form-section,
[data-theme="dark"] .card,
[data-theme="dark"] .info-card,
[data-theme="dark"] .league-card,
[data-theme="dark"] .dashboard-league-card,
[data-theme="dark"] .add-entry-league-form,
[data-theme="dark"] .summary-section,
[data-theme="dark"] .ae-payout-stripe,
[data-theme="dark"] .ae-payout-club,
[data-theme="dark"] .player-analytics-card,
[data-theme="dark"] .rivalry-card,
[data-theme="dark"] .getting-started-card,
[data-theme="dark"] .next-action-card,
[data-theme="dark"] .club-leagues-hero,
[data-theme="dark"] .league-invite-banner,
[data-theme="dark"] .onboarding-card,
[data-theme="dark"] .welcome-back-card {
background: #152724;
border-color: rgba(255, 255, 255, 0.08);
color: #c4d8d5;
}
[data-theme="dark"] .auth-container{
background: var(--bg-light);
}
[data-theme="dark"] .auth-card h1 {
color: var(--text-heading);
}
/* Settings section specifically */
[data-theme="dark"] .settings-section {
background: #152724;
box-shadow: none;
border: 1px solid rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .settings-header {
background: linear-gradient(135deg, #004d38, #006a4e);
box-shadow: none;
}
[data-theme="dark"] .section-header {
border-bottom-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .section-title {
color: #edf4f3;
}
[data-theme="dark"] .section-description {
color: #6da09b;
}
[data-theme="dark"] .section-icon {
background: rgba(0, 106, 78, 0.2);
color: #00a872;
}
/* ════════════════════════════════════════════════════════════
LEAGUE CARDS — text colours
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .league-card__name,
[data-theme="dark"] .lc-name {
color: #edf4f3;
}
[data-theme="dark"] .league-card__tournament,
[data-theme="dark"] .league-card__host,
[data-theme="dark"] .league-card__date,
[data-theme="dark"] .lc-tournament {
color: #6da09b;
}
[data-theme="dark"] .stat-value,
[data-theme="dark"] .lc-val {
color: #edf4f3;
}
[data-theme="dark"] .stat-label,
[data-theme="dark"] .lc-key {
color: #375c58;
}
[data-theme="dark"] .league-card__type--club { background: rgba(0,106,78,0.2); color: #00a872; }
[data-theme="dark"] .league-card__type--public { background: rgba(59,130,246,0.15); color: #7cb9ff; }
[data-theme="dark"] .league-card__type--private { background: rgba(139,92,246,0.15); color: #c4b5fd; }
/* Status left-border coding */
[data-theme="dark"] .league-card[data-status="live"],
[data-theme="dark"] .dashboard-league-card[data-status="live"] {
border-left: 3px solid #22c55e;
}
[data-theme="dark"] .league-card[data-status="upcoming"],
[data-theme="dark"] .dashboard-league-card[data-status="upcoming"] {
border-left: 3px solid #ffc72c;
}
[data-theme="dark"] .league-card[data-status="past"],
[data-theme="dark"] .dashboard-league-card[data-status="past"] {
opacity: 0.6;
}
/* ════════════════════════════════════════════════════════════
MODALS — Join League, Join Club, League Info, Player Picker
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .modal,
[data-theme="dark"] .join-league-modal-simplified,
[data-theme="dark"] .player-picker-modal,
[data-theme="dark"] .league-info-modal,
[data-theme="dark"] .modal-content {
background: #152724;
border: 1px solid rgba(255, 255, 255, 0.1);
color: #c4d8d5;
}
[data-theme="dark"] .modal-header h3,
[data-theme="dark"] .modal-title {
color: #edf4f3;
}
[data-theme="dark"] .modal-subtitle,
[data-theme="dark"] .modal-helper,
[data-theme="dark"] .modal-browse-link {
color: #6da09b;
}
[data-theme="dark"] .modal-footer {
border-top-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .close-btn,
[data-theme="dark"] .modal-close-btn {
color: #6da09b;
}
[data-theme="dark"] .close-btn:hover,
[data-theme="dark"] .modal-close-btn:hover {
background: rgba(255, 255, 255, 0.08);
color: #edf4f3;
}
/* Join league modal input */
[data-theme="dark"] .modal-input {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.13);
color: #edf4f3;
}
[data-theme="dark"] .modal-input::placeholder { color: #375c58; }
[data-theme="dark"] .modal-input:focus {
border-color: #00a872;
box-shadow: 0 0 0 3px rgba(0, 168, 114, 0.15);
}
[data-theme="dark"] .modal-submit-btn {
background: #006a4e;
color: #fff;
}
[data-theme="dark"] .modal-submit-btn:disabled {
background: #1c3330;
color: #375c58;
}
/* League info modal — purple header → green */
[data-theme="dark"] .league-info-header,
[data-theme="dark"] .modal-header-purple {
background: linear-gradient(135deg, #004d38, #006a4e);
}
/* Rule rows inside league info modal */
[data-theme="dark"] .rule-row,
[data-theme="dark"] .game-rule-item {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.08);
color: #c4d8d5;
}
/* ════════════════════════════════════════════════════════════
FORMS — inputs, selects, textareas
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .form-input,
[data-theme="dark"] input[type="text"],
[data-theme="dark"] input[type="email"],
[data-theme="dark"] input[type="number"],
[data-theme="dark"] input[type="password"],
[data-theme="dark"] input[type="search"],
[data-theme="dark"] select,
[data-theme="dark"] textarea {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.13);
color: #edf4f3;
}
[data-theme="dark"] .form-input::placeholder,
[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
color: #375c58;
}
[data-theme="dark"] .form-input:focus,
[data-theme="dark"] input:focus,
[data-theme="dark"] select:focus,
[data-theme="dark"] textarea:focus {
border-color: #00a872;
box-shadow: 0 0 0 3px rgba(0, 168, 114, 0.15);
outline: none;
}
[data-theme="dark"] .form-label { color: #c4d8d5; }
[data-theme="dark"] .form-hint { color: #375c58; }
/* Search bars specifically */
[data-theme="dark"] .search-bar input,
[data-theme="dark"] .player-search-input,
[data-theme="dark"] .search-input {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.13);
color: #edf4f3;
}
/* Filter dropdowns */
[data-theme="dark"] select option {
background: #152724;
color: #edf4f3;
}
/* ════════════════════════════════════════════════════════════
TABS + FILTER PILLS
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .tabs-container,
[data-theme="dark"] .capsule-tabs {
background: #1c3330;
border: none;
}
[data-theme="dark"] .tab-button,
[data-theme="dark"] .tab {
color: #375c58;
}
[data-theme="dark"] .tab-button.active,
[data-theme="dark"] .tab.active {
background: #223f3c;
color: #edf4f3;
}
[data-theme="dark"] .filter-pill {
border-color: rgba(255, 255, 255, 0.13);
color: #6da09b;
background: transparent;
}
[data-theme="dark"] .filter-pill:hover {
border-color: rgba(255, 255, 255, 0.25);
color: #c4d8d5;
}
[data-theme="dark"] .filter-pill.active {
background: #006a4e;
color: #fff;
border-color: #006a4e;
}
/* Tour tab buttons (PGA TOUR / DP WORLD) */
[data-theme="dark"] .tour-tab-btn,
[data-theme="dark"] .tour-filter-btn {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.1);
color: #6da09b;
}
[data-theme="dark"] .tour-tab-btn.active,
[data-theme="dark"] .tour-filter-btn.active {
background: #006a4e;
color: #fff;
border-color: #006a4e;
}
/* ════════════════════════════════════════════════════════════
TOUR LEADERBOARD SECTION
(dashboard + leaderboards section — .leaderboard-card)
════════════════════════════════════════════════════════════ */
/* Card shell */
[data-theme="dark"] .leaderboard-card,
[data-theme="dark"] .form-card.leaderboard-card {
background: #152724;
border-color: rgba(255, 255, 255, 0.08);
box-shadow: none;
}
/* Card header */
[data-theme="dark"] .leaderboard-card .leaderboard-header {
background: #1c3330;
border-bottom-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .leaderboard-card .leaderboard-header h4,
[data-theme="dark"] #leaderboard-title {
color: #edf4f3 !important;
}
[data-theme="dark"] .leaderboard-subtitle {
color: #6da09b !important;
}
/* Section heading above the card */
[data-theme="dark"] .leaderboards-section h2,
[data-theme="dark"] .leaderboards-section h3 {
color: #edf4f3;
}
[data-theme="dark"] .leaderboards-section p {
color: #6da09b;
}
/* Tour tab buttons (PGA TOUR / DP WORLD toggle) */
[data-theme="dark"] .tour-tabs-container {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .tour-tab-btn,
[data-theme="dark"] .tour-filter-btn,
[data-theme="dark"] .leaderboard-card .tour-tab {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.1);
color: #6da09b;
}
[data-theme="dark"] .tour-tab-btn.active,
[data-theme="dark"] .tour-filter-btn.active,
[data-theme="dark"] .leaderboard-card .tour-tab.active {
background: #006a4e;
color: #fff;
border-color: #006a4e;
}
/* Tournament name row above table */
[data-theme="dark"] .tournament-header-row,
[data-theme="dark"] .leaderboard-card .leaderboard-header h4 + p {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.08);
color: #edf4f3;
}
[data-theme="dark"] .leaderboard-header h4{
color: #edf4f3 !important;
}
[data-theme="dark"] .live-leaderboard-table thead th {
background: #334540;
}
[data-theme="dark"] .popup-header{
background: #334540;
}
[data-theme="dark"] .schedule-badge-start {
background: linear-gradient(135deg, #334540 0%, #425e56 100%);
border: none;
}
[data-theme="dark"] .schedule-badge-end{
background: linear-gradient(135deg, #f02d2d 0%, #680000 100%);
}
[data-theme="dark"] .schedule-badge-end .badge-label {
color: #f7aaaa;
}
[data-theme="dark"] .schedule-badge-deadline{
background: linear-gradient(135deg, #f5c400 0%, #846900 100%);
}
[data-theme="dark"] .btn-modal-secondary {
background: #425e56;
}
/* Table container */
[data-theme="dark"] .leaderboard-table-container {
background: #152724;
}
/* Table itself */
[data-theme="dark"] .leaderboard-table.wide,
[data-theme="dark"] .leaderboard-table-wide {
background: #152724;
}
/* thead */
[data-theme="dark"] .leaderboard-table.wide thead,
[data-theme="dark"] .leaderboard-table.wide thead th {
background: #1c3330 !important;
color: #375c58 !important;
border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}
/* tbody rows */
[data-theme="dark"] .leaderboard-table.wide tbody tr {
border-bottom-color: rgba(255, 255, 255, 0.05);
background: transparent;
}
[data-theme="dark"] .leaderboard-table.wide tbody tr:hover {
background: #1c3330 !important;
transform: none;
}
/* All td text */
[data-theme="dark"] .leaderboard-table.wide tbody td {
color: #c4d8d5 !important;
}
/* .player-name td — was invisible dark-on-dark */
[data-theme="dark"] .leaderboard-table.wide td.player-name,
[data-theme="dark"] td.player-name {
color: #edf4f3 !important;
}
/* Position column */
[data-theme="dark"] .leaderboard-table.wide tbody td:first-child {
color: #375c58 !important;
}
/* Leader row — deep gold tint */
[data-theme="dark"] .leaderboard-table tbody tr.leader-row,
[data-theme="dark"] .leaderboard-table.wide tbody tr.leader-row {
background: rgba(251, 191, 36, 0.08) !important;
border-left-color: #fbbf24;
}
[data-theme="dark"] .leaderboard-table tbody tr.leader-row td,
[data-theme="dark"] .leaderboard-table.wide tbody tr.leader-row td {
color: #edf4f3 !important;
}
/* Score columns */
/* Golf scoring convention for leaderboard:
score-negative / score-under = red (good — under par)
score-even = green
score-positive / score-over = white (bad — over par) */
[data-theme="dark"] .leaderboard-table .score-negative,
[data-theme="dark"] .leaderboard-table .score-under { color: #f87171 !important; } /* red */
[data-theme="dark"] .leaderboard-table .score-positive,
[data-theme="dark"] .leaderboard-table .score-over { color: #edf4f3 !important; } /* white */
[data-theme="dark"] .leaderboard-table .score-even { color: #4ade80 !important; } /* green */
/* THRU column inline white color override from JS */
[data-theme="dark"] .leaderboard-table td[style*="color:white"],
[data-theme="dark"] .leaderboard-table td[style*="color: white"],
[data-theme="dark"] .leaderboard-table td[style*="font-weight: 600; color:white"],
[data-theme="dark"] .leaderboard-table td[style*="font-weight: 600; color: white"] {
color: #6da09b !important;
}
/* Tour leaderboard page title */
[data-theme="dark"] .leaderboards-section .section-header h2,
[data-theme="dark"] .leaderboards-section .page-section-title,
[data-theme="dark"] h1.leaderboard-page-title {
color: #edf4f3 !important;
}
/* ════════════════════════════════════════════════════════════
TEE TIMES SECTION
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .tee-times-wrapper,
[data-theme="dark"] .tee-times-container {
background: #0e1c1a;
}
[data-theme="dark"] .tee-time-card,
[data-theme="dark"] .tee-group-card {
background: #152724;
border-color: rgba(255, 255, 255, 0.08);
color: #c4d8d5;
}
[data-theme="dark"] .tee-time-search {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.13);
color: #edf4f3;
}
/* Empty state */
[data-theme="dark"] .tee-times-empty,
[data-theme="dark"] .empty-state {
color: #375c58;
}
[data-theme="dark"] .empty-state-icon { color: #223f3c; }
/* ════════════════════════════════════════════════════════════
TOUR SCHEDULE SECTION
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .schedule-section,
[data-theme="dark"] .tour-schedule-wrapper {
background: #0e1c1a;
}
[data-theme="dark"] .schedule-month-group {
background: #152724;
border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .schedule-month-label {
color: #375c58;
background: #1c3330;
border-bottom-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .schedule-row,
[data-theme="dark"] .tournament-row {
background: #152724;
border-bottom-color: rgba(255, 255, 255, 0.05);
color: #c4d8d5;
}
[data-theme="dark"] .schedule-row:hover,
[data-theme="dark"] .tournament-row:hover {
background: #1c3330;
}
[data-theme="dark"] .tournament-name {
color: #edf4f3;
}
[data-theme="dark"] .tournament-venue {
color: #6da09b;
}
/* ════════════════════════════════════════════════════════════
PAYMENT HISTORY SECTION
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .payment-history-wrapper,
[data-theme="dark"] .payment-section {
background: #0e1c1a;
}
[data-theme="dark"] .payment-stats-card,
[data-theme="dark"] .payment-stat-tile {
background: #152724;
border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .payment-stat-label {
color: #375c58;
}
[data-theme="dark"] .payment-stat-value {
color: #edf4f3;
}
[data-theme="dark"] .payment-row,
[data-theme="dark"] .transaction-row {
background: #152724;
border-bottom-color: rgba(255, 255, 255, 0.05);
}
[data-theme="dark"] .transaction-title { color: #edf4f3; }
[data-theme="dark"] .transaction-meta { color: #6da09b; }
[data-theme="dark"] .payment-icon-wrap {
background: rgba(239, 68, 68, 0.15);
}
/* Filter dropdown */
[data-theme="dark"] .filter-select,
[data-theme="dark"] .type-filter {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.13);
color: #edf4f3;
}
/* ── Transactions list (payment-history.css) ── */
[data-theme="dark"] .transactions-list,
[data-theme="dark"] #transactions-list {
background: transparent;
}
[data-theme="dark"] .transaction-item {
background: #152724;
border-bottom-color: rgba(255, 255, 255, 0.05);
color: #c4d8d5;
}
[data-theme="dark"] .transaction-item:hover {
background: #1c3330;
}
[data-theme="dark"] .transaction-item:last-child {
border-bottom: none;
}
/* Transaction type label (ENTRY FEE etc) */
[data-theme="dark"] .transaction-type,
[data-theme="dark"] .transaction-category {
color: #375c58;
font-size: 10px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.08em;
}
/* Transaction title / description */
[data-theme="dark"] .transaction-description,
[data-theme="dark"] .transaction-name {
color: #edf4f3;
font-weight: 600;
}
/* Transaction meta (date, league link) */
[data-theme="dark"] .transaction-date,
[data-theme="dark"] .transaction-league {
color: #6da09b;
}
/* League link inside transaction */
[data-theme="dark"] .transaction-item a {
color: #00a872;
}
[data-theme="dark"] .transaction-item a:hover {
color: #4ade80;
}
/* Transaction icon */
[data-theme="dark"] .transaction-icon,
[data-theme="dark"] .transaction-icon-wrap {
background: rgba(239, 68, 68, 0.15);
color: #f87171;
}
/* Amount — negative (debit) */
[data-theme="dark"] .transaction-amount.negative {
color: #f87171;
}
/* Amount — positive (winnings) */
[data-theme="dark"] .transaction-amount.positive {
color: #4ade80;
}
/* Status badge (Completed etc) */
[data-theme="dark"] .transaction-status,
[data-theme="dark"] .status-completed {
background: rgba(34, 197, 94, 0.12);
color: #4ade80;
border: none;
}
/* Pagination */
[data-theme="dark"] .transactions-pagination button {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.1);
color: #6da09b;
}
[data-theme="dark"] .transactions-pagination button:hover {
background: #223f3c;
color: #edf4f3;
}
[data-theme="dark"] .transactions-pagination button.active {
background: #006a4e;
color: #fff;
border-color: #006a4e;
}
/* ════════════════════════════════════════════════════════════
BROWSE LEAGUES PAGE
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .browse-leagues-wrapper,
[data-theme="dark"] .browse-section {
background: #0e1c1a;
}
[data-theme="dark"] .browse-league-card {
background: #152724;
border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .browse-league-card:hover {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.13);
}
[data-theme="dark"] .section-group-label {
color: #375c58;
border-bottom-color: rgba(255, 255, 255, 0.08);
}
/* ════════════════════════════════════════════════════════════
VIEW LEAGUE PAGE
════════════════════════════════════════════════════════════ */
/* Remove the purple gradient body override from league_view.css */
[data-theme="dark"] body.league-view-page,
[data-theme="dark"] .vl-body {
background: #0e1c1a;
}
/* League view header */
[data-theme="dark"] .vl-header,
[data-theme="dark"] .league-view-header {
background: linear-gradient(180deg, #004d38 0%, #0b1917 100%);
border-bottom-color: rgba(255, 255, 255, 0.08);
}
/* Registered players / leaderboard container */
[data-theme="dark"] .registered-players-section,
[data-theme="dark"] .leaderboard-section {
background: #152724;
border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .leaderboard-header {
background: #1c3330;
color: #edf4f3;
border-bottom-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .leaderboard-col-header {
color: #375c58;
}
[data-theme="dark"] .entry-row {
border-bottom-color: rgba(255, 255, 255, 0.05);
color: #c4d8d5;
}
[data-theme="dark"] .entry-row:hover { background: #1c3330; }
[data-theme="dark"] .entry-row.current-user-row {
background: rgba(0, 106, 78, 0.12);
border-left: 3px solid #00a872;
}
/* No entries state */
[data-theme="dark"] .no-entries-card,
[data-theme="dark"] .empty-entries {
background: #152724;
border-color: rgba(255, 255, 255, 0.08);
color: #6da09b;
}
/* Sidebar card (Ready to Compete, Entry Deadline) */
[data-theme="dark"] .league-sidebar-card,
[data-theme="dark"] .sidebar-info-card,
[data-theme="dark"] .entry-deadline-card {
background: #152724;
border-color: rgba(255, 255, 255, 0.08);
color: #c4d8d5;
}
[data-theme="dark"] .league-sidebar-card h3,
[data-theme="dark"] .sidebar-info-card h3 {
color: #edf4f3;
}
[data-theme="dark"] .league-sidebar-card p,
[data-theme="dark"] .sidebar-info-card p {
color: #6da09b;
}
/* Countdown tiles */
[data-theme="dark"] .countdown-tile {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.08);
color: #edf4f3;
}
[data-theme="dark"] .countdown-tile .countdown-label {
color: #375c58;
}
/* Teams hidden warning banner */
[data-theme="dark"] .teams-hidden-banner,
[data-theme="dark"] .warning-banner {
background: rgba(251, 191, 36, 0.1);
border-color: rgba(251, 191, 36, 0.3);
color: #fcd34d;
}
/* ════════════════════════════════════════════════════════════
PLAYER PICKER MODAL (Select a Player)
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .player-picker-overlay,
[data-theme="dark"] .player-select-modal {
background: rgba(0, 0, 0, 0.75);
}
[data-theme="dark"] .player-picker-container,
[data-theme="dark"] .player-select-content {
background: #152724;
border: 1px solid rgba(255, 255, 255, 0.1);
color: #c4d8d5;
}
[data-theme="dark"] .player-picker-header {
background: #1c3330;
border-bottom-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .player-picker-header h2,
[data-theme="dark"] .player-picker-title {
color: #edf4f3;
}
[data-theme="dark"] .player-picker-search {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.13);
color: #edf4f3;
}
[data-theme="dark"] .player-picker-search::placeholder { color: #375c58; }
[data-theme="dark"] .player-card,
[data-theme="dark"] .player-item {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.08);
color: #c4d8d5;
}
[data-theme="dark"] .player-card:hover,
[data-theme="dark"] .player-item:hover {
background: #223f3c;
border-color: rgba(255, 255, 255, 0.15);
}
[data-theme="dark"] .player-name { color: #edf4f3; }
[data-theme="dark"] .player-country { color: #6da09b; }
/* Headshot fallback initials circle */
[data-theme="dark"] .player-headshot-fallback {
background: #223f3c;
color: #00a872;
}
/* ════════════════════════════════════════════════════════════
ADD ENTRY / EDIT ENTRY PAGES
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .ae-header,
[data-theme="dark"] .ee-header {
background: #0b1917;
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
/* Remove gradient */
background-image: none;
}
[data-theme="dark"] .ae-header h1,
[data-theme="dark"] .ee-header h1,
[data-theme="dark"] .ae-back,
[data-theme="dark"] .ee-back {
color: #edf4f3;
}
[data-theme="dark"] .ae-header p,
[data-theme="dark"] .ee-header p {
color: #6da09b;
opacity: 1;
}
[data-theme="dark"] .add-entry-league-form {
/* background: #152724; */
border-color: rgba(255, 255, 255, 0.08);
box-shadow: none;
}
[data-theme="dark"] .ae-payout-stripe {
background: rgba(0, 106, 78, 0.15);
border-color: rgba(0, 168, 114, 0.25);
color: #4ade80;
}
[data-theme="dark"] .ae-payout-club {
background: rgba(251, 146, 60, 0.1);
border-color: rgba(251, 146, 60, 0.25);
color: #fb923c;
}
/* Player slots */
[data-theme="dark"] .player-slot {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.1);
}
[data-theme="dark"] .player-slot:hover {
background: #223f3c;
border-color: #00a872;
box-shadow: none;
}
[data-theme="dark"] .player-slot.empty .player-slot-text { color: #6da09b; }
[data-theme="dark"] .player-slot.empty .player-slot-hint { color: #375c58; }
/* Selected Player Styling — solid green */
[data-theme="dark"] .player-slot:not(.empty) {
background: #00453d;
border: 1.5px solid rgba(255, 255, 255, 0.15);
color: #fff;
padding: 1rem;
}
/* Handicap summary section */
[data-theme="dark"] .handicap-summary,
[data-theme="dark"] .hcap-summary-section {
background: #152724;
border-color: rgba(255, 255, 255, 0.08);
color: #c4d8d5;
}
[data-theme="dark"] .hcap-summary-label { color: #6da09b; }
[data-theme="dark"] .hcap-progress-track {
background: #223f3c;
}
/* Tie-breaker section */
[data-theme="dark"] .tie-breaker-section,
[data-theme="dark"] .tiebreaker-card {
background: #152724;
border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .tie-breaker-section h3,
[data-theme="dark"] .tiebreaker-label {
color: #edf4f3;
}
/* Bottom sticky bar (Players: 0/3 · Handicap: 0/100) */
[data-theme="dark"] .entry-sticky-bar,
[data-theme="dark"] .sticky-progress-bar {
background: #0b1917;
border-top-color: rgba(255, 255, 255, 0.08);
color: #6da09b;
}
.sticky-summary {
background: #00453d;
color: rgb(174 255 239 / 30%);
}
/* ════════════════════════════════════════════════════════════
SIDEBAR
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .sidebar {
background: #0b1917;
border-right-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .sidebar-header .username {
color: #edf4f3;
}
[data-theme="dark"] .sidebar-nav a,
[data-theme="dark"] .sidebar-nav button {
color: #6da09b;
}
[data-theme="dark"] .sidebar-nav li.active > a,
[data-theme="dark"] .sidebar-nav a:hover,
[data-theme="dark"] .sidebar-nav button:hover {
color: #00a872;
background: rgba(0, 168, 114, 0.08);
}
[data-theme="dark"] .sidebar-nav li.active > a {
border-left-color: #00a872;
}
[data-theme="dark"] .nav-dropdown-menu {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .sidebar-footer {
border-top-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .sidebar-footer a,
[data-theme="dark"] .support-links a,
[data-theme="dark"] .support-links span {
color: #375c58;
}
[data-theme="dark"] .sidebar-ad-slot {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.08);
}
/* ════════════════════════════════════════════════════════════
BRAND HEADER (mobile top bar)
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .mobile-brand-header {
background: #0b1917;
border-bottom-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .brand-header-name {
color: #edf4f3;
}
/* ════════════════════════════════════════════════════════════
ACTION SHEET + MORE MENU
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .action-sheet {
background: #152724;
border-top-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .action-sheet-title { color: #edf4f3; }
[data-theme="dark"] .action-sheet-item {
color: #c4d8d5;
}
[data-theme="dark"] .action-sheet-item:hover {
background: #1c3330;
}
[data-theme="dark"] .action-sheet-cancel {
background: #1c3330;
color: #6da09b;
border-top-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .more-options-menu {
background: #152724;
border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .menu-header {
border-bottom-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .menu-header h4 { color: #edf4f3; }
[data-theme="dark"] #close-menu-btn { color: #6da09b; }
[data-theme="dark"] .menu-list li a,
[data-theme="dark"] .menu-list li button {
color: #c4d8d5;
}
[data-theme="dark"] .menu-list li a:hover { background: #1c3330; }
[data-theme="dark"] .menu-group-label { color: #375c58; }
/* ════════════════════════════════════════════════════════════
PAGE TITLES + HEADINGS (global catch-all)
════════════════════════════════════════════════════════════ */
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4 {
color: #edf4f3;
}
[data-theme="dark"] p {
color: #c4d8d5;
}
[data-theme="dark"] .page-title,
[data-theme="dark"] .section-title,
[data-theme="dark"] .content-title {
color: #edf4f3;
}
[data-theme="dark"] .page-subtitle,
[data-theme="dark"] .content-subtitle {
color: #6da09b;
}
/* Dividers */
[data-theme="dark"] hr,
[data-theme="dark"] .divider {
border-color: rgba(255, 255, 255, 0.08);
}
/* ════════════════════════════════════════════════════════════
SCORE CHIPS — brighter on dark bg
════════════════════════════════════════════════════════════ */
/* Score chips — golf convention:
under par (eagle, birdie, score-under) = red
even par = green
over par (bogey, score-over) = white */
[data-theme="dark"] .score-chip.score-under,
[data-theme="dark"] .score-chip.score-birdie,
[data-theme="dark"] .score-chip.score-eagle {
background: rgba(239, 68, 68, 0.15);
color: #f87171; /* red — under par */
border: none;
}
[data-theme="dark"] .score-chip.score-even {
background: rgba(34, 197, 94, 0.15);
color: #4ade80; /* green — even par */
border: none;
}
[data-theme="dark"] .score-chip.score-over,
[data-theme="dark"] .score-chip.score-bogey {
background: rgba(255, 255, 255, 0.08);
color: #edf4f3; /* white — over par */
border: none;
}
/* ════════════════════════════════════════════════════════════
LIVE PILL + BADGES
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .live-pill {
background: rgba(34, 197, 94, 0.12);
border-color: rgba(34, 197, 94, 0.25);
color: #4ade80;
}
[data-theme="dark"] .badge-success { background: rgba(34,197,94,0.12); color: #4ade80; }
[data-theme="dark"] .badge-error { background: rgba(239,68,68,0.12); color: #f87171; }
[data-theme="dark"] .badge-warning { background: rgba(245,158,11,0.12); color: #fbbf24; }
[data-theme="dark"] .badge-info { background: rgba(59,130,246,0.12); color: #7cb9ff; }
[data-theme="dark"] .badge-green { background: #006a4e; color: #fff; }
[data-theme="dark"] .badge-gold { background: rgba(251,191,36,0.15); color: #fbbf24; }
/* ════════════════════════════════════════════════════════════
NOTIFICATION / WARNING BANNERS
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .notification-banner {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.08);
color: #c4d8d5;
}
[data-theme="dark"] .preview-banner {
background: rgba(251, 191, 36, 0.1);
border-color: rgba(251, 191, 36, 0.25);
color: #fcd34d;
}
/* ════════════════════════════════════════════════════════════
AFFILIATE ADS
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .affiliate-ad-card,
[data-theme="dark"] .sponsored-card {
background: #152724;
border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .sponsored-label { color: #375c58; }
[data-theme="dark"] .ad-title { color: #edf4f3; }
[data-theme="dark"] .ad-cta { color: #00a872; }
/* ════════════════════════════════════════════════════════════
ONBOARDING WIZARD
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .wizard-container {
background: #152724;
color: #c4d8d5;
}
[data-theme="dark"] .wizard-step-title { color: #edf4f3; }
[data-theme="dark"] .wizard-step-desc { color: #6da09b; }
/* ════════════════════════════════════════════════════════════
LEAGUE DETAILS MODAL — #league-details-modal
Rule rows use inline styles so we override via the modal container
════════════════════════════════════════════════════════════ */
/* Modal shell */
[data-theme="dark"] #league-details-modal .modal-content {
background: #152724;
border: 1px solid rgba(255, 255, 255, 0.1);
color: #c4d8d5;
}
/* Header (purple by default → deep green) */
[data-theme="dark"] #league-details-modal .modal-header {
background: linear-gradient(135deg, #004d38, #006a4e);
border-bottom-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] #league-details-modal .modal-header h2 {
color: #edf4f3;
}
[data-theme="dark"] #league-details-modal .modal-header p {
color: rgba(255, 255, 255, 0.7);
}
[data-theme="dark"] #league-details-modal .modal-header-icon {
background: rgba(255, 255, 255, 0.15);
color: #fff;
}
/* Section headings */
[data-theme="dark"] #league-details-modal .modal-section h3 {
color: #edf4f3;
}
[data-theme="dark"] #league-details-modal .modal-section p,
[data-theme="dark"] #league-details-modal .section-content {
color: #6da09b;
}
[data-theme="dark"] #league-details-modal .section-icon {
background: rgba(0, 106, 78, 0.2);
color: #00a872;
}
/* Section dividers */
[data-theme="dark"] #league-details-modal .modal-section {
border-bottom-color: rgba(255, 255, 255, 0.08);
}
/* ── Inline-styled rule rows — override all background/color combos ── */
/* Green rule row (handicap limit) */
[data-theme="dark"] #league-details-modal div[style*="background:#f0fdf4"],
[data-theme="dark"] #league-details-modal div[style*="background: #f0fdf4"] {
background: rgba(0, 106, 78, 0.2) !important;
border-left-color: #00a872 !important;
}
[data-theme="dark"] #league-details-modal div[style*="background:#f0fdf4"] span[style*="color:var(--success-text)"],
[data-theme="dark"] #league-details-modal div[style*="background:#f0fdf4"] span[style*="color: var(--success-text)"] {
color: #4ade80 !important;
}
/* Orange rule row (no favorites) */
[data-theme="dark"] #league-details-modal div[style*="background:#fff7ed"],
[data-theme="dark"] #league-details-modal div[style*="background: #fff7ed"] {
background: rgba(234, 88, 12, 0.15) !important;
border-left-color: #fb923c !important;
}
[data-theme="dark"] #league-details-modal div[style*="background:#fff7ed"] span[style*="color:#ea580c"] {
color: #fb923c !important;
}
/* Blue rule row (top 10 pick limit) */
[data-theme="dark"] #league-details-modal div[style*="background:var(--bg-blue-tint)"],
[data-theme="dark"] #league-details-modal div[style*="background: var(--bg-blue-tint)"] {
background: rgba(59, 130, 246, 0.12) !important;
border-left-color: #60a5fa !important;
}
[data-theme="dark"] #league-details-modal div[style*="background:var(--bg-blue-tint)"] span {
color: #7cb9ff !important;
}
/* Purple rule row (custom rules) */
[data-theme="dark"] #league-details-modal div[style*="background:#faf5ff"],
[data-theme="dark"] #league-details-modal div[style*="background: #faf5ff"] {
background: rgba(124, 58, 237, 0.15) !important;
border-left-color: #a78bfa !important;
}
[data-theme="dark"] #league-details-modal div[style*="background:#faf5ff"] span[style*="color:#7c3aed"] {
color: #a78bfa !important;
}
/* Red rule rows (penalties — missing cut, withdrawals) */
[data-theme="dark"] #league-details-modal div[style*="background:var(--error-bg)"],
[data-theme="dark"] #league-details-modal div[style*="background: var(--error-bg)"] {
background: rgba(239, 68, 68, 0.12) !important;
border-left-color: #f87171 !important;
}
[data-theme="dark"] #league-details-modal div[style*="background:var(--error-bg)"] span[style*="color:var(--error-red)"] {
color: #f87171 !important;
}
/* All rule row text spans */
[data-theme="dark"] #league-details-modal span[style*="color:var(--text-dark)"],
[data-theme="dark"] #league-details-modal span[style*="color: var(--text-dark)"] {
color: #c4d8d5 !important;
}
/* Blue inline rule in the main view (not just modal) */
[data-theme="dark"] div[style*="background:var(--bg-blue-tint)"][style*="border-left"] {
background: rgba(59, 130, 246, 0.12) !important;
border-left-color: #60a5fa !important;
}
[data-theme="dark"] div[style*="background:var(--bg-blue-tint)"][style*="border-left"] span {
color: #7cb9ff !important;
}
/* Prize / badge chips inside modal */
[data-theme="dark"] #league-details-modal .badge,
[data-theme="dark"] #league-details-modal [style*="background:#f0fdf4"][style*="border-radius"] {
background: rgba(0, 106, 78, 0.2) !important;
color: #4ade80 !important;
}
/* Close button */
[data-theme="dark"] #league-details-modal .modal-close-btn {
color: #6da09b;
background: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] #league-details-modal .modal-close-btn:hover {
background: rgba(255, 255, 255, 0.13);
color: #edf4f3;
}
/* ════════════════════════════════════════════════════════════
PLAYER DETAIL CARDS (expanded leaderboard row)
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .player-detail {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.08);
color: #c4d8d5;
}
[data-theme="dark"] .player-detail:hover {
border-color: #00a872;
background: #223f3c;
}
[data-theme="dark"] .player-detail-name {
color: #6da09b;
}
[data-theme="dark"] .player-name-link {
color: #00a872;
}
[data-theme="dark"] .player-name-link:hover {
color: #4ade80;
}
/* Score badges on player detail cards */
/* player-detail-score chips — golf convention:
score-negative = red (under par)
score-even = green
score-positive = white/muted (over par) */
[data-theme="dark"] .player-detail-score.score-negative { background: rgba(239,68,68,0.15); color: #f87171; } /* red */
[data-theme="dark"] .player-detail-score.score-even { background: rgba(34,197,94,0.15); color: #4ade80; } /* green */
[data-theme="dark"] .player-detail-score.score-positive { background: rgba(255,255,255,0.08); color: #edf4f3; } /* white */
[data-theme="dark"] .player-detail-score.score-locked { background: rgba(255,255,255,0.06); color: #375c58; }
/* ════════════════════════════════════════════════════════════
NOTIF NUDGE CARD
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .notif-nudge {
background: #152724;
background-image: none;
border-color: rgba(0, 168, 114, 0.2);
box-shadow: none;
}
[data-theme="dark"] .notif-nudge-body {
background: #152724;
}
[data-theme="dark"] .notif-nudge-sub {
color: #6da09b;
}
[data-theme="dark"] .notif-nudge-time {
color: #375c58;
}
[data-theme="dark"] .notif-nudge-howto-toggle {
color: #00a872;
}
[data-theme="dark"] .notif-nudge-steps {
border-top-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .notif-nudge-steps ol {
color: #6da09b;
}
[data-theme="dark"] .notif-nudge-success {
background: rgba(34, 197, 94, 0.1);
border-top-color: rgba(34, 197, 94, 0.2);
color: #4ade80;
}
[data-theme="dark"] .notif-modal {
background: #152724;
}
[data-theme="dark"] .notif-modal .modal-body ul {
color: #6da09b;
}
[data-theme="dark"] .notif-modal-time {
color: #375c58;
}
[data-theme="dark"] .notif-modal-success {
background: rgba(34, 197, 94, 0.1);
border-top-color: rgba(34, 197, 94, 0.2);
color: #4ade80;
}
/* ════════════════════════════════════════════════════════════
LEADERBOARD ROWS — view_league.html
════════════════════════════════════════════════════════════ */
/* Base row — no background, just border */
[data-theme="dark"] .leaderboard-main-row {
background: transparent;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
color: #c4d8d5;
}
/* Hover — subtle lift, NOT black */
[data-theme="dark"] .leaderboard-main-row:hover {
background: #1c3330 !important;
}
/* Current user row */
[data-theme="dark"] .leaderboard-main-row.my-entry {
background: rgba(0, 106, 78, 0.15) !important;
border-left: 3px solid #00a872;
}
[data-theme="dark"] .leaderboard-main-row.my-entry:hover {
background: rgba(0, 106, 78, 0.22) !important;
}
/* Winner row — deep gold tint, not the light yellow */
[data-theme="dark"] .leaderboard-main-row.winner-row,
[data-theme="dark"] .winner-row {
background: rgba(251, 191, 36, 0.1) !important;
background-image: none !important;
border-left: 4px solid #fbbf24;
}
[data-theme="dark"] .leaderboard-main-row.winner-row:hover {
background: rgba(251, 191, 36, 0.16) !important;
}
/* Expanded details row */
[data-theme="dark"] .leaderboard-details-row {
background: #0b1917 !important;
border-top-color: rgba(255, 255, 255, 0.05);
}
[data-theme="dark"] .leaderboard-details-row td {
background: none !important;
}
[data-theme="dark"] .details-wrapper {
background: #0b1917 !important;
background-image: none !important;
}
/* Table cells */
[data-theme="dark"] .leaderboard-table td,
[data-theme="dark"] .leaderboard-table th,
[data-theme="dark"] .league-main-content td,
[data-theme="dark"] .league-main-content th {
color: #c4d8d5;
border-bottom-color: rgba(255, 255, 255, 0.05);
}
[data-theme="dark"] .leaderboard-table th,
[data-theme="dark"] .league-main-content th {
background: #1c3330;
color: #375c58;
}
/* Table container */
[data-theme="dark"] .leaderboard-table-container,
[data-theme="dark"] .league-main-content,
[data-theme="dark"] .leaderboard-container {
background: #0b1917;
border-color: rgba(255, 255, 255, 0.08);
}
/* Score columns — golf convention:
under par (score-negative) = red
even par (score-even) = green
over par (score-positive) = white */
[data-theme="dark"] .score-positive { color: #edf4f3; } /* over par — white */
[data-theme="dark"] .score-negative { color: #f87171; } /* under par — red */
[data-theme="dark"] .score-even { color: #4ade80; } /* even par — green */
/* Rank number */
[data-theme="dark"] .rank-cell,
[data-theme="dark"] .td-rank { color: #375c58; }
/* Entry name */
[data-theme="dark"] .entry-name,
[data-theme="dark"] .td-entry { color: #edf4f3; font-weight: 600; }
/* Player mini-chips inside expanded row */
[data-theme="dark"] .player-detail-chip,
[data-theme="dark"] .detail-player-card {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.08);
color: #c4d8d5;
}
/* ════════════════════════════════════════════════════════════
TOURNAMENT HISTORY PANEL (schedule section)
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .tournament-history-panel {
background: #1c3330;
border-left-color: #00a872;
}
[data-theme="dark"] .tournament-history-content {
color: #c4d8d5;
}
[data-theme="dark"] .history-header {
border-bottom-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .history-header h4 {
color: #edf4f3;
}
[data-theme="dark"] .history-header h4 i,
[data-theme="dark"] .history-header h4 .icon {
color: #00a872;
}
[data-theme="dark"] .history-years {
border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .history-year-row {
background: #152724;
border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .history-year-row:hover {
background: #223f3c;
}
[data-theme="dark"] .history-year {
color: #00a872;
font-weight: 700;
}
[data-theme="dark"] .history-course {
color: #c4d8d5;
}
[data-theme="dark"] .history-course i,
[data-theme="dark"] .history-course .icon {
color: #375c58;
}
[data-theme="dark"] .history-date {
color: #6da09b;
}
[data-theme="dark"] .history-date i,
[data-theme="dark"] .history-date .icon {
color: #375c58;
}
[data-theme="dark"] .history-winner {
color: #edf4f3;
font-weight: 600;
}
[data-theme="dark"] .history-empty {
color: #375c58;
}
[data-theme="dark"] .history-loading {
color: #6da09b;
}
/* ════════════════════════════════════════════════════════════
SIDEBAR NAV — FONT WEIGHT FIX
Inactive items were Inter 400/500 — too thin on dark bg.
Bump to 600 for all items, 700 for active.
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .sidebar-nav a,
[data-theme="dark"] .sidebar-nav button,
[data-theme="dark"] .sidebar-nav .nav-dropdown-toggle {
font-family: 'Inter', -apple-system, sans-serif;
font-weight: 600;
font-size: 14px;
letter-spacing: 0.01em;
color: #6da09b;
}
[data-theme="dark"] .sidebar-nav li.active > a,
[data-theme="dark"] .sidebar-nav li.active > button {
font-weight: 700;
color: #00a872;
}
[data-theme="dark"] .sidebar-nav a:hover,
[data-theme="dark"] .sidebar-nav button:hover {
color: #c4d8d5;
}
/* User name in sidebar header — Poppins 700 */
[data-theme="dark"] .sidebar-header .username {
font-family: 'Poppins', sans-serif;
font-weight: 700;
font-size: 15px;
color: #edf4f3;
}
/* Role label (Founding Player, Club Admin etc) */
[data-theme="dark"] .sidebar-header {
color: #6da09b;
font-size: 12px;
font-weight: 500;
}
/* ════════════════════════════════════════════════════════════
SCORE-VALUE SPANS — view_league leaderboard table
Structure: .score.score-negative > .score-value
Golf convention: negative=red, even=green, positive=white
════════════════════════════════════════════════════════════ */
/* Container reset */
[data-theme="dark"] .leaderboard-table .score {
background: none !important;
border: none !important;
}
/* Under par — red */
[data-theme="dark"] .leaderboard-table .score.score-negative .score-value,
[data-theme="dark"] .leaderboard-table .score.score-under .score-value,
[data-theme="dark"] .score.score-negative .score-value,
[data-theme="dark"] .score.score-under .score-value {
background-color: rgba(239, 68, 68, 0.15) !important;
color: #f87171 !important;
}
/* Even par — green */
[data-theme="dark"] .leaderboard-table .score.score-even .score-value,
[data-theme="dark"] .score.score-even .score-value {
background-color: rgba(34, 197, 94, 0.15) !important;
color: #4ade80 !important;
}
/* Over par — white */
[data-theme="dark"] .leaderboard-table .score.score-positive .score-value,
[data-theme="dark"] .leaderboard-table .score.score-over .score-value,
[data-theme="dark"] .score.score-positive .score-value,
[data-theme="dark"] .score.score-over .score-value {
background-color: rgba(255, 255, 255, 0.08) !important;
color: #edf4f3 !important;
}
/* Bare .score-value with no parent modifier (JS-rendered rows) */
[data-theme="dark"] span.score-value,
[data-theme="dark"] div.score-value {
background-color: rgba(255, 255, 255, 0.08) !important;
color: #edf4f3 !important;
}
/* Score-value that IS the modifier class directly */
[data-theme="dark"] .score-value.score-negative { background-color: rgba(239,68,68,0.15) !important; color: #f87171 !important; }
[data-theme="dark"] .score-value.score-positive { background-color: rgba(255,255,255,0.08) !important; color: #edf4f3 !important; }
[data-theme="dark"] .score-value.score-even { background-color: rgba(34,197,94,0.15) !important; color: #4ade80 !important; }
[data-theme="dark"] .score-value.score-locked { background-color: rgba(255,255,255,0.06) !important; color: #375c58 !important; }
/* my-team sidebar score-value */
[data-theme="dark"] .my-team-section .total-score .score-value.score-negative { background: rgba(239,68,68,0.15) !important; color: #f87171 !important; }
[data-theme="dark"] .my-team-section .total-score .score-value.score-positive { background: rgba(255,255,255,0.08) !important; color: #edf4f3 !important; }
[data-theme="dark"] .my-team-section .total-score .score-value.score-even { background: rgba(34,197,94,0.15) !important; color: #4ade80 !important; }
[data-theme="dark"] .my-team-section .total-score .score-value { background: rgba(255,255,255,0.08) !important; color: #edf4f3 !important; }
/* (these were dark-on-dark in some card states)
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .league-card__host,
[data-theme="dark"] .dashboard-league-card .league-card__host {
color: #6da09b !important;
}
[data-theme="dark"] .league-card__date,
[data-theme="dark"] .dashboard-league-card .league-card__date {
color: #375c58 !important;
}
[data-theme="dark"] .league-card__tournament {
color: #6da09b !important;
}
/* ════════════════════════════════════════════════════════════
MY CLUBS SECTION — org-card
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .organisations-section,
[data-theme="dark"] .club-memberships-container {
background: transparent;
}
[data-theme="dark"] .org-cards-list {
background: transparent;
}
[data-theme="dark"] .org-card {
background: #152724;
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: var(--radius-sm);
}
[data-theme="dark"] .org-card:hover {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.13);
}
[data-theme="dark"] .org-card-name {
color: #edf4f3;
font-family: 'Poppins', sans-serif;
font-weight: 700;
}
[data-theme="dark"] .org-card-meta {
color: #6da09b !important;
font-family: 'Inter', sans-serif;
font-weight: 400;
font-size: 13px;
}
[data-theme="dark"] .org-card-badge {
background: rgba(0, 106, 78, 0.2);
color: #00a872;
border-color: rgba(0, 168, 114, 0.25);
font-weight: 700;
font-size: 11px;
text-transform: uppercase;
letter-spacing: 0.05em;
}
/* View Leaderboard button */
[data-theme="dark"] .club-badge.leaderboard {
background: var(--masters-accent);
color: #0e1c1a;
font-weight: 700;
}
/* Pending state */
[data-theme="dark"] .club-badge.pending {
background: rgba(245, 158, 11, 0.12);
border-color: rgba(245, 158, 11, 0.25);
color: #fbbf24;
}
[data-theme="dark"] .pending-label {
color: #6da09b;
}
/* Empty state */
[data-theme="dark"] .org-empty-state {
color: #375c58;
}
/* Section header */
[data-theme="dark"] .dashboard-section-header {
border-bottom-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .dashboard-section-title {
color: #375c58;
font-size: 11px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.1em;
}
/* ════════════════════════════════════════════════════════════
BROWSE CLUBS PAGE — club-card
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .club-card {
background: #152724;
border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .club-card:hover {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.13);
box-shadow: none;
}
[data-theme="dark"] .club-card.member {
border-left-color: #00a872;
}
[data-theme="dark"] .club-card-header {
border-bottom-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .club-card-body {
color: #c4d8d5;
}
[data-theme="dark"] .club-card-body h3,
[data-theme="dark"] .club-card-body .club-name {
color: #edf4f3;
}
[data-theme="dark"] .club-card-body p,
[data-theme="dark"] .club-card-body .club-meta,
[data-theme="dark"] .club-member-count {
color: #6da09b !important;
}
[data-theme="dark"] .club-card-footer {
border-top-color: rgba(255, 255, 255, 0.08);
background: #1c3330;
}
/* (add this wherever you put the toggle — settings page etc.)
════════════════════════════════════════════════════════════ */
.theme-toggle-btn {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 8px 16px;
border-radius: var(--radius-full);
border: 1.5px solid var(--border-medium);
background: transparent;
color: var(--text-muted);
font-family: 'Inter', sans-serif;
font-size: 13px;
font-weight: 600;
cursor: pointer;
transition: all var(--transition-base);
}
.theme-toggle-btn:hover {
border-color: var(--primary-green);
color: var(--primary-green);
}
/* ════════════════════════════════════════════════════════════
ADD ENTRY / EDIT ENTRY — header + layout spacing fixes
════════════════════════════════════════════════════════════ */
/* Header inner — flex column layout */
[data-theme="dark"] .ae-header-inner,
[data-theme="dark"] .ee-header-inner {
display: flex;
flex-direction: column;
gap: 6px;
padding: 12px 16px 16px;
}
/* Back link row */
[data-theme="dark"] .ae-back,
[data-theme="dark"] .ee-back {
display: inline-flex;
align-items: center;
gap: 6px;
font-size: 13px;
font-weight: 600;
color: #6da09b;
text-decoration: none;
margin-bottom: 4px;
}
[data-theme="dark"] .ae-back:hover,
[data-theme="dark"] .ee-back:hover {
color: #edf4f3;
}
/* Title + rules button row */
[data-theme="dark"] .ae-header-row,
[data-theme="dark"] .ee-header-row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
}
[data-theme="dark"] .ae-header h1,
[data-theme="dark"] .ee-header h1 {
font-family: 'Poppins', sans-serif;
font-size: 18px;
font-weight: 800;
color: #edf4f3;
margin: 0;
display: flex;
align-items: center;
gap: 8px;
}
/* Rules button */
[data-theme="dark"] .ae-rules-btn,
[data-theme="dark"] .ee-rules-btn {
display: inline-flex;
align-items: center;
gap: 6px;
background: rgba(255,255,255,0.08);
border: 1px solid rgba(255,255,255,0.13);
border-radius: var(--radius-full);
color: #c4d8d5;
font-size: 12px;
font-weight: 600;
padding: 5px 12px;
cursor: pointer;
white-space: nowrap;
flex-shrink: 0;
transition: all var(--transition-fast);
}
[data-theme="dark"] .ae-rules-btn:hover,
[data-theme="dark"] .ee-rules-btn:hover {
background: rgba(255,255,255,0.14);
color: #edf4f3;
}
/* Joining subtitle */
[data-theme="dark"] .ae-header p,
[data-theme="dark"] .ee-header p {
font-size: 13px;
color: #6da09b;
margin: 0;
}
[data-theme="dark"] .ae-header p strong,
[data-theme="dark"] .ee-header p strong {
color: #edf4f3;
}
/* Remove double-padding from the header wrapper itself */
[data-theme="dark"] .ae-header,
[data-theme="dark"] .ee-header {
padding: 0;
}
/* Content area padding so nothing bunches against the header */
[data-theme="dark"] .ae-content,
[data-theme="dark"] .ee-content {
padding: var(--space-md) var(--space-md) calc(var(--space-3xl) + 20px);
max-width: 900px;
margin: 0 auto;
}
/* Give the form breathing room between its direct children */
[data-theme="dark"] .add-entry-league-form > *,
[data-theme="dark"] #edit-entry-form > * {
margin-bottom: var(--space-md);
}
/* Team progress line */
[data-theme="dark"] .team-progress {
font-size: 13px;
font-weight: 600;
color: #6da09b;
padding: var(--space-sm) 0;
}
/* Info rule box */
[data-theme="dark"] .info-rule-box {
display: flex;
align-items: center;
gap: 8px;
background: rgba(59, 130, 246, 0.12);
border: 1px solid rgba(59, 130, 246, 0.25);
border-radius: var(--radius-sm);
padding: var(--space-sm) var(--space-md);
font-size: 13px;
color: #7cb9ff;
}
/* Player picks grid — proper gap on dark bg */
[data-theme="dark"] .player-picks-container {
gap: var(--space-md);
margin-bottom: var(--space-md);
}
/* Summary sections (Handicap, Tie-Breaker) */
[data-theme="dark"] .summary-section {
padding: var(--space-lg);
margin-bottom: var(--space-md);
}
[data-theme="dark"] .summary-section h3 {
font-family: 'Poppins', sans-serif;
font-weight: 700;
font-size: 15px;
color: #edf4f3;
margin: 0 0 var(--space-md) 0;
}
[data-theme="dark"] .summary-section p {
color: #6da09b;
font-size: 14px;
margin-bottom: var(--space-sm);
}
/* Handicap summary inner card — was hardcoded white */
[data-theme="dark"] .hcap-summary {
background: #1c3330;
border: 1px solid rgba(255, 255, 255, 0.08);
border-radius: var(--radius-sm);
padding: var(--space-md);
}
[data-theme="dark"] .hcap-progress-label {
color: #6da09b;
}
[data-theme="dark"] .hcap-progress-bar {
background: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .hcap-row {
border-bottom-color: rgba(255, 255, 255, 0.07);
}
[data-theme="dark"] .hcap-label {
color: #6da09b;
}
[data-theme="dark"] .hcap-value {
color: #4ade80;
}
[data-theme="dark"] .hcap-value.invalid {
color: #f87171;
}
/* Projected field notice */
[data-theme="dark"] .projected-field-notice {
background: rgba(245, 158, 11, 0.08);
border: 1px solid rgba(245, 158, 11, 0.25);
border-radius: var(--radius-sm);
padding: var(--space-sm) var(--space-md);
margin-bottom: var(--space-md);
font-size: 13px;
color: #fcd34d;
}
[data-theme="dark"] .projected-field-expand {
color: #00a872;
cursor: pointer;
font-weight: 600;
margin-left: 8px;
}
[data-theme="dark"] .projected-field-body p {
color: #c4d8d5;
margin-top: var(--space-sm);
}
/* Payout banners */
[data-theme="dark"] .ae-payout-banner {
border-radius: var(--radius-sm);
padding: var(--space-sm) var(--space-md);
margin-bottom: var(--space-md);
font-size: 13px;
display: flex;
align-items: center;
gap: 8px;
}
/* Trust badges */
[data-theme="dark"] .trust-badge-stripe,
[data-theme="dark"] .trust-badge-free {
display: flex;
align-items: center;
justify-content: center;
gap: 6px;
font-size: 12px;
color: #6da09b;
padding: var(--space-sm) 0;
}
/* Submit button spacing */
[data-theme="dark"] .save-btn,
[data-theme="dark"] .btn-save-entry {
margin-top: var(--space-sm);
}
/* ════════════════════════════════════════════════════════════
PLAYER PICKER POPUP — dark mode fixes
(popup-container, popup-body, player-card-grid were still light)
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .popup-container {
background: #152724;
border: 1px solid rgba(255, 255, 255, 0.1);
}
[data-theme="dark"] .popup-body {
background: #0e1c1a;
}
[data-theme="dark"] .search-container {
background: #0b1917;
border-bottom-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .search-input {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.13);
color: #edf4f3;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236da09b'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z'/%3E%3C/svg%3E");
}
[data-theme="dark"] .search-input::placeholder {
color: #375c58;
}
[data-theme="dark"] .search-input:focus {
border-color: #00a872;
box-shadow: 0 0 0 3px rgba(0, 168, 114, 0.15);
}
/* Player card grid */
[data-theme="dark"] .player-card-grid {
background: #0e1c1a;
}
[data-theme="dark"] .player-selection-card {
background: #152724;
border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .player-selection-card:hover {
background: #1c3330;
border-color: #00a872;
box-shadow: 0 4px 12px rgba(0, 168, 114, 0.15);
}
[data-theme="dark"] .player-card-name {
color: #edf4f3;
}
[data-theme="dark"] .player-card-meta {
color: #6da09b;
opacity: 1;
}
[data-theme="dark"] .player-card-headshot-fallback {
background: #1c3330;
color: #6da09b;
border-color: rgba(255, 255, 255, 0.1);
}
/* Handicap number + tier label — light so readable on dark bg */
[data-theme="dark"] .player-card-handicap {
color: #edf4f3;
}
[data-theme="dark"] .handicap-tier {
color: #6da09b;
opacity: 1;
}
/* TOP 10 badge */
[data-theme="dark"] .badge-top10 {
background: rgba(245, 158, 11, 0.85);
color: #fff;
}
/* No results */
[data-theme="dark"] .no-results {
color: #6da09b;
}
/* Rules modal body */
[data-theme="dark"] .popup-body ul {
color: #c4d8d5 !important;
}
/* ════════════════════════════════════════════════════════════
LEAGUE CARD CTA — lighter green leaning white
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .league-card__cta {
background: rgba(0, 106, 78, 0.25);
color: #a7f3d0;
border: 1px solid rgba(0, 168, 114, 0.3);
}
[data-theme="dark"] .league-card__cta:hover {
background: rgba(0, 106, 78, 0.4);
color: #d1fae5;
}
/* ════════════════════════════════════════════════════════════
LEAGUE CARD NAME — remove 13px override, let 1.1rem through
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .league-card__name,
[data-theme="dark"] .lc-name {
font-size: 1.1rem !important;
}
/* ════════════════════════════════════════════════════════════
PLAYER SLOT — deeper green background
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .player-slot.empty {
background: #334540;
border-color: rgba(255, 255, 255, 0.1);
}
[data-theme="dark"] .player-slot.empty:hover {
background: #3d524d;
border-color: #00a872;
}
/* ════════════════════════════════════════════════════════════
PLAYER HCAP BADGE — redesigned
Replace gold/yellow with clean dark-teal + white text
════════════════════════════════════════════════════════════ */
[data-theme="dark"] .player-hcap-badge {
background: #0b1917;
border: 1.5px solid rgba(0, 168, 114, 0.5);
color: #edf4f3;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
width: 42px;
height: 42px;
}
[data-theme="dark"] .player-hcap-badge .hcap-label {
font-size: 0.55rem;
color: #6da09b;
opacity: 1;
font-weight: 700;
letter-spacing: 0.04em;
}
[data-theme="dark"] .player-hcap-badge .hcap-value {
font-size: 0.75rem;
font-weight: 800;
color: #edf4f3;
}
/* ── Prospect Outreach page ── */
[data-theme="dark"] .pp-page {
background: var(--surface-1);
}
[data-theme="dark"] .pp-header-text h1 { color: var(--text-on-dark-1); }
[data-theme="dark"] .pp-header-text p { color: var(--text-on-dark-2); }
[data-theme="dark"] .stat-pill {
background: var(--surface-2);
border-color: var(--border-dark-theme);
}
[data-theme="dark"] .stat-pill .stat-num { color: var(--text-on-dark-1); }
[data-theme="dark"] .stat-pill .stat-label { color: var(--text-on-dark-2); }
[data-theme="dark"] .campaign-card,
[data-theme="dark"] .pp-table-card {
background: var(--surface-2);
border-color: var(--border-dark-theme);
}
[data-theme="dark"] .pp-card-heading { color: var(--text-on-dark-1); }
[data-theme="dark"] .pp-section-label { color: var(--text-on-dark-2); }
[data-theme="dark"] .pp-hint { color: var(--text-on-dark-2); }
[data-theme="dark"] .pp-hint code { background: var(--surface-3); color: var(--text-on-dark-1); }
[data-theme="dark"] .pp-divider { border-color: var(--border-dark-theme); }
[data-theme="dark"] .pp-file-input {
background: var(--surface-3);
border-color: var(--border-dark-theme2);
color: var(--text-on-dark-1);
}
[data-theme="dark"] .tpl-tabs { border-color: var(--border-dark-theme); }
[data-theme="dark"] .tpl-tab { color: var(--text-on-dark-2); }
[data-theme="dark"] .tpl-tab:hover { color: var(--text-on-dark-1); }
[data-theme="dark"] .tpl-tab.active { color: var(--green-bright); border-bottom-color: var(--green-bright); }
[data-theme="dark"] .pp-form-label { color: var(--text-on-dark-2); }
[data-theme="dark"] .quill-editor {
border-color: var(--border-dark-theme2);
background: var(--surface-3);
}
[data-theme="dark"] .quill-editor .ql-toolbar {
background: var(--surface-3);
border-color: var(--border-dark-theme);
}
[data-theme="dark"] .quill-editor .ql-editor { color: var(--text-on-dark-1); }
[data-theme="dark"] .quill-editor .ql-editor.ql-blank::before { color: var(--text-on-dark-2); }
[data-theme="dark"] .pp-table-toolbar { border-color: var(--border-dark-theme); }
[data-theme="dark"] .pp-filter-pill {
border-color: var(--border-dark-theme);
color: var(--text-on-dark-2);
}
[data-theme="dark"] .pp-filter-pill:hover {
border-color: var(--green-bright);
color: var(--green-bright);
}
[data-theme="dark"] .pp-filter-pill.active {
background: var(--green-bright);
border-color: var(--green-bright);
color: #fff;
}
[data-theme="dark"] .pp-filter-pill:not(.active) .pp-pill-count {
background: var(--surface-4);
color: var(--text-on-dark-2);
}
[data-theme="dark"] .pp-table-search {
background: var(--surface-3);
border-color: var(--border-dark-theme2);
}
[data-theme="dark"] .pp-table-search input { color: var(--text-on-dark-1); }
[data-theme="dark"] .pp-table-search svg { color: var(--text-on-dark-2); }
[data-theme="dark"] .pp-table th {
background: var(--surface-3);
border-color: var(--border-dark-theme);
color: var(--text-on-dark-2);
}
[data-theme="dark"] .pp-table td { border-color: var(--border-dark-theme); color: var(--text-on-dark-1); }
[data-theme="dark"] .pp-table tr:hover td { background: var(--surface-3); }
[data-theme="dark"] .pp-badge-pending { background: rgba(245, 158, 11, 0.15); color: #fbbf24; }
[data-theme="dark"] .pp-badge-sent { background: rgba(59, 130, 246, 0.15); color: #7cb9ff; }
[data-theme="dark"] .pp-badge-followup { background: rgba(139, 92, 246, 0.15); color: #c4b5fd; }
[data-theme="dark"] .pp-badge-converted { background: rgba(16, 185, 129, 0.15); color: #34d399; }
[data-theme="dark"] .pp-badge-failed { background: rgba(239, 68, 68, 0.15); color: #f87171; }
[data-theme="dark"] .pp-btn-icon {
border-color: var(--border-dark-theme2);
color: var(--text-on-dark-2);
}
[data-theme="dark"] .pp-btn-icon:hover {
background: var(--surface-3);
color: var(--text-on-dark-1);
}
[data-theme="dark"] .pp-btn-icon.danger {
color: #f87171;
border-color: rgba(239, 68, 68, 0.25);
}
[data-theme="dark"] .pp-btn-icon.danger:hover {
background: rgba(239, 68, 68, 0.12);
border-color: rgba(239, 68, 68, 0.5);
}
[data-theme="dark"] .pp-failed-banner {
background: rgba(239, 68, 68, 0.1);
border-color: rgba(239, 68, 68, 0.25);
}
[data-theme="dark"] .pp-failed-banner-text { color: #f87171; }
[data-theme="dark"] .pp-result.ok {
background: rgba(16, 185, 129, 0.1);
color: #34d399;
border-color: rgba(16, 185, 129, 0.2);
}
[data-theme="dark"] .pp-result.error {
background: rgba(239, 68, 68, 0.1);
color: #f87171;
border-color: rgba(239, 68, 68, 0.2);
}
[data-theme="dark"] .pp-save-result.ok { color: #34d399; }
[data-theme="dark"] .pp-save-result.error { color: #f87171; }
/* ════════════════════════════════════════════════════════════
USER DASHBOARD — #profile-section
════════════════════════════════════════════════════════════ */
/* Wrapper — kill the light gradient */
[data-theme="dark"] #profile-section .profile-wrapper {
background: transparent;
background-image: none;
}
/* Header — replace bright gradient with deep midnight tone */
[data-theme="dark"] #profile-section .profile-header {
background: linear-gradient(135deg, #0b1917 0%, #142f2a 50%, #0e2826 100%);
border: 1px solid rgba(255, 255, 255, 0.08);
box-shadow: none;
}
[data-theme="dark"] #profile-section .profile-header::before {
background: radial-gradient(circle, rgba(0, 168, 114, 0.08) 0%, transparent 70%);
}
[data-theme="dark"] #profile-section .profile-name { color: #edf4f3; }
[data-theme="dark"] #profile-section .profile-subtitle { color: #c4d8d5; opacity: 0.9; }
/* Avatar — keep gold but tone down */
[data-theme="dark"] #profile-section .profile-avatar {
background: linear-gradient(45deg, #d4a017, #f0c44a);
color: #0b1917;
border: 4px solid rgba(255, 255, 255, 0.15);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
}
[data-theme="dark"] #profile-section .profile-avatar-badge {
background: #00a872;
border-color: #0b1917;
color: #ffffff;
}
/* Badges */
[data-theme="dark"] #profile-section .profile-badge {
background: rgba(255, 255, 255, 0.1);
color: #edf4f3;
}
[data-theme="dark"] #profile-section .profile-badge.elite {
background: rgba(59, 130, 246, 0.25);
color: #93c5fd;
}
[data-theme="dark"] #profile-section .profile-badge.active {
background: rgba(0, 168, 114, 0.2);
color: #6ee7b7;
}
/* Edit profile button — white pill on dark header */
[data-theme="dark"] #profile-section .btn-edit-profile {
background: rgba(255, 255, 255, 0.95);
color: #0b1917;
}
[data-theme="dark"] #profile-section .btn-edit-profile:hover {
background: #ffffff;
}
/* Quick Stats cards */
[data-theme="dark"] #profile-section .quick-stats .stat-card {
background: #152724;
border: 1px solid rgba(255, 255, 255, 0.08);
box-shadow: none;
}
[data-theme="dark"] #profile-section .quick-stats .stat-card:hover {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.13);
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
}
[data-theme="dark"] #profile-section .quick-stats .stat-card::before {
background: linear-gradient(90deg, #00a872, #3b82f6);
}
[data-theme="dark"] #profile-section .quick-stats .stat-icon { color: #00a872; }
[data-theme="dark"] #profile-section .quick-stats .stat-value { color: #edf4f3; }
[data-theme="dark"] #profile-section .quick-stats .stat-title { color: #6da09b; }
/* Section panels (Achievements / Activity / History) */
[data-theme="dark"] #profile-section .achievements-section,
[data-theme="dark"] #profile-section .activity-section,
[data-theme="dark"] #profile-section .history-section {
background: #152724;
border: 1px solid rgba(255, 255, 255, 0.08);
box-shadow: none;
}
/* Section headers */
[data-theme="dark"] #profile-section .section-header {
border-bottom-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] #profile-section .section-icon { color: #f0c44a; }
[data-theme="dark"] #profile-section .section-title { color: #edf4f3; }
/* Achievement cards */
[data-theme="dark"] #profile-section .achievement-card {
background: #1c3330;
border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] #profile-section .achievement-card.unlocked {
background: linear-gradient(135deg, rgba(0, 168, 114, 0.15), rgba(0, 168, 114, 0.08));
border-color: rgba(0, 168, 114, 0.4);
}
[data-theme="dark"] #profile-section .achievement-card.unlocked::before {
background: #00a872;
color: #0b1917;
}
[data-theme="dark"] #profile-section .achievement-card.unlocked .achievement-icon { color: #00a872; }
[data-theme="dark"] #profile-section .achievement-card:not(.unlocked) .achievement-icon { color: #375c58; }
[data-theme="dark"] #profile-section .achievement-title { color: #edf4f3; }
[data-theme="dark"] #profile-section .achievement-description { color: #6da09b; }
/* Progress bars */
[data-theme="dark"] #profile-section .progress-bar {
background: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] #profile-section .progress-fill {
background: linear-gradient(90deg, #00a872, #3b82f6);
}
[data-theme="dark"] #profile-section .progress-text { color: #6da09b; }
/* Activity feed */
[data-theme="dark"] #profile-section .activity-item {
background: #1c3330;
border-left-color: #00a872;
color: #c4d8d5;
}
[data-theme="dark"] #profile-section .activity-item:hover {
background: #223f3c;
}
[data-theme="dark"] #profile-section .activity-icon { color: #00a872; }
[data-theme="dark"] #profile-section .activity-title { color: #edf4f3; }
[data-theme="dark"] #profile-section .activity-time { color: #6da09b; }
/* League history list */
[data-theme="dark"] #profile-section .league-history-item {
background: #1c3330;
border: 2px solid transparent;
}
[data-theme="dark"] #profile-section .league-history-item:hover {
background: #223f3c;
border-color: rgba(0, 168, 114, 0.4);
}
[data-theme="dark"] #profile-section .league-history-name { color: #edf4f3; }
[data-theme="dark"] #profile-section .league-history-item:hover .league-history-name {
color: #00a872;
}
[data-theme="dark"] #profile-section .league-history-crown { color: #f0c44a; }
/* Rank pills */
[data-theme="dark"] #profile-section .league-history-rank.rank-1 {
background: linear-gradient(135deg, #d4a017 0%, #f0c44a 100%);
color: #0b1917;
}
[data-theme="dark"] #profile-section .league-history-rank.rank-2 {
background: linear-gradient(135deg, #9ca3af 0%, #d1d5db 100%);
color: #0b1917;
}
[data-theme="dark"] #profile-section .league-history-rank.rank-3 {
background: linear-gradient(135deg, #b45309 0%, #d97706 100%);
color: #ffffff;
}
[data-theme="dark"] #profile-section .league-history-rank.rank-other {
background: rgba(255, 255, 255, 0.08);
color: #6da09b;
}
[data-theme="dark"] #profile-section .league-history-empty {
color: #6da09b;
}
[data-theme="dark"] #profile-section .league-history-empty i {
color: #375c58;
}