/* ============================================================
   WKR DESIGN SYSTEM v1.1 — light-first, motorsport/data-authority.
   Tokens derived from the WKR logo (charcoal wordmark + orange→red
   swoosh). White canvas, dark text, gradient used sparingly as accent.
   Replaces the old dark overlay. Maps to real frontend classes.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Saira+Condensed:ital,wght@0,600;0,700;0,800;1,700;1,800;1,900&family=Saira:ital,wght@0,400;0,500;0,600;0,700&family=IBM+Plex+Mono:wght@500;600&display=swap');

:root{
  --wkr-red:#C0282A; --wkr-red-600:#A81F22; --wkr-red-300:#E0595B;
  --wkr-orange:#E85D24; --wkr-orange-600:#CE4E18; --wkr-orange-300:#F4955F;
  --wkr-grad:linear-gradient(115deg,#E85D24 0%,#C0282A 78%);
  --logo-ink:#303030;
  --bg:#FFFFFF; --surf:#F6F6F7; --surf-2:#F0F1F3; --row:#FBFBFC;
  --line:#E5E6E9; --line-2:#D6D8DC;
  --tx:#1B1C1F; --tx-mut:#5C606A; --tx-faint:#8A8E97; --accent:#C0282A;
  --gold:#F4B11E; --silver:#9AA0A8; --bronze:#C77C39; --ok:#127C42; --warn:#B26A00;
  --r-sm:4px; --r-md:7px; --r-lg:11px; --r-pill:999px;
  --sh-1:0 1px 2px rgba(20,20,30,.06);
  --sh-2:0 10px 30px rgba(20,20,30,.10);
  --sh-glow:0 6px 20px rgba(192,40,42,.30);
  --e:cubic-bezier(.2,.7,.2,1); --t-fast:120ms; --t:200ms;
  --f-display:"Saira Condensed",system-ui,sans-serif;
  --f-ui:"Saira",system-ui,sans-serif;
  --f-data:"IBM Plex Mono",ui-monospace,monospace;
}

/* ---- LIGHT canvas: force readable page background + text everywhere ---- */
body{ background:var(--bg) !important; color:var(--tx) !important; }
.wkr-rankings-wrap, .wkr-drivers, .wkr-driver-profile, [class*="wkr-"]{
  font-family:var(--f-ui) !important; color:var(--tx) !important;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
.wkr-rankings-wrap, .wkr-drivers, .wkr-driver-profile{ background:var(--bg) !important; padding:var(--sp,24px) 0; }

/* ---- Display headings: Saira Condensed italic, uppercase ---- */
.wkr-rankings-wrap h1,.wkr-drivers h1,.wkr-driver-profile h1,
.wkr-cat-title,.wkr-header h1,.wkr-header h2,.wkr-header .wkr-title{
  font-family:var(--f-display) !important; font-style:italic !important;
  font-weight:800 !important; text-transform:uppercase; letter-spacing:.01em;
  line-height:.98; color:var(--tx) !important;
}
.wkr-cat-title{ font-size:1.5rem !important; }

/* ---- Header: light raised surface with a speed-line top accent ---- */
.wkr-header{
  position:relative; background:var(--surf) !important;
  border:1px solid var(--line) !important; border-radius:var(--r-lg) !important;
  box-shadow:var(--sh-1) !important; padding:18px 24px !important;
  margin-bottom:24px !important; overflow:hidden;
}
.wkr-header::before{ content:""; position:absolute; left:0; right:0; top:0; height:5px; background:var(--wkr-grad); }
.wkr-year{ font-family:var(--f-data) !important; font-weight:600 !important; color:var(--wkr-red) !important; }

/* ---- Rankings table: white card, mono data, zebra + hover ---- */
.wkr-table{
  width:100%; border-collapse:separate !important; border-spacing:0 !important;
  font-size:.92rem; background:#fff !important;
  border:1px solid var(--line) !important; border-radius:var(--r-lg) !important;
  overflow:hidden; box-shadow:var(--sh-1) !important;
}
.wkr-table thead th{
  font-family:var(--f-display) !important; font-style:italic !important;
  font-weight:700 !important; text-transform:uppercase; letter-spacing:.1em;
  font-size:.72rem !important; color:var(--tx-faint) !important; text-align:left;
  padding:12px 14px !important; background:var(--surf) !important;
  border-bottom:1px solid var(--line) !important;
}
.wkr-table tbody td{ padding:11px 14px !important; border-bottom:1px solid var(--line) !important; color:var(--tx) !important; vertical-align:middle; }
.wkr-table tbody tr:nth-child(even) td{ background:var(--row) !important; }
.wkr-table tbody tr{ transition:background var(--t) var(--e); }
.wkr-table tbody tr:hover td{ background:var(--surf-2) !important; }
.wkr-table tbody tr:last-child td{ border-bottom:none !important; }

/* Rank cell: mono; top-3 metallic medal badges */
.wkr-rank{ font-family:var(--f-data) !important; font-weight:600 !important; color:var(--tx-mut) !important; width:46px; }
.wkr-table tbody tr:nth-child(1) .wkr-rank,
.wkr-table tbody tr:nth-child(2) .wkr-rank,
.wkr-table tbody tr:nth-child(3) .wkr-rank{
  display:inline-grid; place-items:center; width:28px; height:28px;
  border-radius:7px; font-family:var(--f-display) !important; font-style:italic;
  font-weight:800 !important; font-size:.9rem; color:#1b1c1f !important;
}
.wkr-table tbody tr:nth-child(1) .wkr-rank{ background:var(--gold); }
.wkr-table tbody tr:nth-child(2) .wkr-rank{ background:var(--silver); color:#fff !important; }
.wkr-table tbody tr:nth-child(3) .wkr-rank{ background:var(--bronze); color:#fff !important; }

.wkr-score{ font-family:var(--f-data) !important; font-weight:600 !important; text-align:right; color:var(--tx) !important; }
.wkr-name{ font-weight:600 !important; color:var(--tx) !important; }
.wkr-name a, .wkr-driver-link{ color:var(--accent) !important; text-decoration:none; font-weight:600; transition:color var(--t) var(--e); border-bottom:0 !important; }
.wkr-name a:hover, .wkr-driver-link:hover{ color:var(--wkr-orange-600) !important; }
.wkr-nat{ font-family:var(--f-data) !important; font-size:.74rem; color:var(--tx-mut) !important; border:1px solid var(--line); padding:2px 7px; border-radius:5px; }

/* ---- Category filter / pills ---- */
.wkr-filter, .wkr-year,
.wkr-filters select, .wkr-filters input,
.wkr-drivers select, .wkr-drivers input[type="text"]{
  font-family:var(--f-ui) !important; font-weight:600 !important;
  background:#fff !important; color:var(--tx) !important;
  border:1.5px solid var(--line-2) !important; border-radius:var(--r-md) !important;
  padding:10px 14px !important; outline:none; transition:border var(--t),box-shadow var(--t);
}
.wkr-filter:focus, .wkr-year:focus,
.wkr-filters select:focus, .wkr-filters input:focus,
.wkr-drivers select:focus, .wkr-drivers input[type="text"]:focus{
  border-color:var(--wkr-orange) !important; box-shadow:0 0 0 3px rgba(232,93,36,.16) !important;
}
.wkr-filters{ display:flex; flex-wrap:wrap; gap:12px !important; margin-bottom:24px !important; align-items:center; }

/* ---- Drivers grid: white cards ---- */
.wkr-drivers .wkr-row, .wkr-grid{
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(230px,1fr)) !important; gap:16px !important;
}
.wkr-col{
  background:#fff !important; border:1px solid var(--line) !important;
  border-radius:var(--r-lg) !important; box-shadow:var(--sh-1) !important;
  padding:16px !important; transition:transform var(--t) var(--e),box-shadow var(--t) var(--e),border-color var(--t);
}
.wkr-col:hover{ transform:translateY(-2px); box-shadow:var(--sh-2) !important; border-color:var(--wkr-orange) !important; }

.wkr-stats{ color:var(--tx-mut) !important; font-weight:600; font-family:var(--f-ui) !important; }

/* ---- Pagination ---- */
.wkr-pages a, .wkr-pages button, .wkr-pages span{
  border-radius:var(--r-md) !important; min-width:38px; height:38px;
  display:inline-flex; align-items:center; justify-content:center;
  background:#fff !important; color:var(--tx) !important;
  border:1px solid var(--line-2) !important; margin:0 3px; font-weight:600;
  font-family:var(--f-ui) !important; transition:all var(--t) var(--e);
}
.wkr-pages a:hover, .wkr-pages button:hover{ border-color:var(--wkr-orange) !important; color:var(--wkr-red-600) !important; }
.wkr-pages .active, .wkr-pages [aria-current="page"]{ background:var(--wkr-grad) !important; color:#fff !important; border-color:transparent !important; box-shadow:0 3px 11px rgba(232,93,36,.32); }

.wkr-empty{ color:var(--tx-mut) !important; text-align:center; padding:48px 0; font-weight:500; }

/* ---- Buttons (Add Driver, Add Race, View Rankings) ---- */
.wkr-btn, .wkr-rankings-wrap .button, .wkr-drivers .button,
a.wkr-cta, .wkr-add-btn{
  font-family:var(--f-display) !important; font-style:italic !important;
  font-weight:800 !important; text-transform:uppercase; letter-spacing:.06em;
  border:0; border-radius:var(--r-md) !important; padding:12px 22px !important;
  cursor:pointer; color:#fff !important; background:var(--wkr-grad) !important;
  box-shadow:var(--sh-glow); text-decoration:none; display:inline-block;
  transition:transform var(--t-fast) var(--e),box-shadow var(--t) var(--e);
}
.wkr-btn:hover, .wkr-add-btn:hover{ transform:translateY(-1px); box-shadow:0 8px 26px rgba(192,40,42,.42); }

/* ---- Driver profile: hero + mono stat tiles ---- */
.wkr-driver-profile .wkr-hero, .wkr-profile-hero, .driver-hero{
  position:relative; background:var(--surf) !important; overflow:hidden;
  border:1px solid var(--line) !important; border-radius:var(--r-lg) !important;
  box-shadow:var(--sh-1) !important; padding:32px !important;
}
.wkr-driver-profile .wkr-hero::before, .driver-hero::before{ content:""; position:absolute; left:0; right:0; top:0; height:5px; background:var(--wkr-grad); }
.driver-stat, .wkr-stat-card{
  background:#fff !important; border:1px solid var(--line) !important;
  border-radius:var(--r-md) !important; box-shadow:var(--sh-1) !important;
  padding:16px !important; text-align:center;
}
.driver-stat .value, .wkr-stat-value{
  font-family:var(--f-data) !important; font-weight:600 !important;
  font-size:1.7rem; color:var(--tx) !important;
}
.driver-stat .label, .wkr-stat-label{ color:var(--tx-faint) !important; text-transform:uppercase; letter-spacing:.12em; font-size:.72rem; font-family:var(--f-display) !important; font-style:italic; font-weight:700; }

/* ---- Mini rating bar in the gradient (if present) ---- */
.wkr-bar, .rating-bar{ height:7px; border-radius:9px; background:var(--surf-2); overflow:hidden; margin-top:5px; }
.wkr-bar > i, .rating-bar > i{ display:block; height:100%; background:var(--wkr-grad); }

/* ---- Global ---- */
html{ scroll-behavior:smooth; }
::selection{ background:var(--wkr-red); color:#fff; }
*::-webkit-scrollbar{ height:10px; width:10px; }
*::-webkit-scrollbar-thumb{ background:var(--line-2); border-radius:999px; }
*::-webkit-scrollbar-thumb:hover{ background:var(--wkr-orange); }


/* ---- specificity overrides: beat .wkr-rankings-wrap scoped theme rules ---- */
.wkr-rankings-wrap .wkr-cat-title{ color:var(--tx) !important; font-family:var(--f-display) !important; font-style:italic !important; font-weight:800 !important; text-transform:uppercase; }
.wkr-rankings-wrap .wkr-year{ color:var(--wkr-red) !important; font-family:var(--f-data) !important; }
.wkr-rankings-wrap .wkr-name a, .wkr-rankings-wrap .wkr-driver-link{ color:var(--accent) !important; }
.wkr-rankings-wrap .wkr-score{ color:var(--tx) !important; font-family:var(--f-data) !important; }
.wkr-rankings-wrap .wkr-nat{ color:var(--tx-mut) !important; }
.wkr-drivers .wkr-col, .wkr-drivers .wkr-row .wkr-col{ background:#fff !important; color:var(--tx) !important; }
.wkr-drivers .wkr-stats{ color:var(--tx-mut) !important; }


/* ---- medal badges: .wkr-rank IS the td; outrank zebra ---- */
.wkr-rankings-wrap table.wkr-table tbody tr:nth-child(1) td.wkr-rank,.wkr-rankings-wrap table.wkr-table tbody tr:nth-child(2) td.wkr-rank,.wkr-rankings-wrap table.wkr-table tbody tr:nth-child(3) td.wkr-rank{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:7px;font-family:var(--f-display)!important;font-style:italic;font-weight:800!important;font-size:.9rem;color:#1b1c1f!important;}
.wkr-rankings-wrap table.wkr-table tbody tr:nth-child(1) td.wkr-rank{background:var(--gold)!important;}
.wkr-rankings-wrap table.wkr-table tbody tr:nth-child(2) td.wkr-rank{background:var(--silver)!important;color:#fff!important;}
.wkr-rankings-wrap table.wkr-table tbody tr:nth-child(3) td.wkr-rank{background:var(--bronze)!important;color:#fff!important;}

/* ---- thead: kill dark-navy theme header ---- */
.wkr-rankings-wrap table.wkr-table thead tr,.wkr-rankings-wrap table.wkr-table thead th{background:var(--surf)!important;color:var(--tx-faint)!important;}
.wkr-rankings-wrap table.wkr-table tbody tr:hover td{background:var(--surf-2)!important;}


/* ==== DRIVER PROFILE (real classes: wkr-profile-*) ==== */
.wkr-profile-card{position:relative;background:var(--surf)!important;border:1px solid var(--line)!important;border-radius:var(--r-lg)!important;box-shadow:var(--sh-1)!important;padding:28px!important;overflow:hidden;margin-bottom:24px;}
.wkr-profile-card::before{content:'';position:absolute;left:0;right:0;top:0;height:5px;background:var(--wkr-grad);}
.wkr-profile-avatar,.wkr-silhouette{background:#fff!important;border:1px solid var(--line)!important;border-radius:var(--r-md)!important;color:var(--tx-faint)!important;}
.wkr-profile-name{font-family:var(--f-display)!important;font-style:italic!important;font-weight:900!important;text-transform:uppercase;letter-spacing:.01em;line-height:.98;color:var(--tx)!important;}
.wkr-profile-meta,.wkr-profile-country,.wkr-profile-sep{color:var(--tx-mut)!important;font-family:var(--f-ui)!important;}
.wkr-profile-category{font-family:var(--f-data)!important;font-weight:600!important;color:var(--wkr-red)!important;}
.wkr-profile-stats{display:flex;flex-wrap:wrap;gap:12px!important;margin-top:8px;}
.wkr-stat{background:#fff!important;border:1px solid var(--line)!important;border-radius:var(--r-md)!important;box-shadow:var(--sh-1)!important;padding:14px 18px!important;text-align:center;min-width:96px;}
.wkr-stat-value{font-family:var(--f-data)!important;font-weight:600!important;font-size:1.6rem;color:var(--tx)!important;}
.wkr-stat-label{color:var(--tx-faint)!important;text-transform:uppercase;letter-spacing:.12em;font-size:.68rem;font-family:var(--f-display)!important;font-style:italic;font-weight:700;}
.wkr-results-table{width:100%;border-collapse:separate!important;border-spacing:0!important;background:#fff!important;border:1px solid var(--line)!important;border-radius:var(--r-lg)!important;overflow:hidden;box-shadow:var(--sh-1)!important;}
.wkr-results-table thead th{font-family:var(--f-display)!important;font-style:italic;font-weight:700;text-transform:uppercase;letter-spacing:.1em;font-size:.72rem;color:var(--tx-faint)!important;background:var(--surf)!important;text-align:left;padding:12px 14px!important;border-bottom:1px solid var(--line)!important;}
.wkr-results-table tbody td{padding:11px 14px!important;border-bottom:1px solid var(--line)!important;color:var(--tx)!important;}
.wkr-results-table tbody tr:nth-child(even) td{background:var(--row)!important;}
.wkr-results-table tbody tr:last-child td{border-bottom:none!important;}
.wkr-date,.wkr-event,.wkr-session{font-family:var(--f-ui)!important;color:var(--tx)!important;}
.wkr-date{font-family:var(--f-data)!important;color:var(--tx-mut)!important;}
.wkr-position{font-family:var(--f-data)!important;font-weight:600!important;color:var(--tx)!important;}