/* horse.bet UK Racing Data — styles
   Forces a self-contained light "panel" so content stays readable
   regardless of the host theme's light/dark mode. */

.hbuk-main {
  /* Transparent so theme dark/light mode shows through */
  background: transparent !important;
  padding: 32px 0 64px;
  min-height: 60vh;
}

.hbuk-main * {
  /* Reset any inherited dark-mode text colors from the theme */
  color: inherit;
}

.hbuk-shell {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  line-height: 1.5;
  background: transparent;
}
.hbuk-container, .hbuk-page {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 20px;
  color: #1a1a1a;
}

.hbuk-breadcrumbs { font-size: 12px; color: #6b6b66 !important; margin-bottom: 20px; }
.hbuk-breadcrumbs ol { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 4px; }
.hbuk-breadcrumbs li::after { content: " › "; color: #b5b5ad; margin: 0 4px; }
.hbuk-breadcrumbs li:last-child::after { content: ""; }
.hbuk-breadcrumbs a { color: #1d5fa5 !important; text-decoration: none; }
.hbuk-breadcrumbs a:hover { text-decoration: underline; }
.hbuk-breadcrumbs li[aria-current] { color: #1a1a1a !important; }

/* H1 / page header */
.hbuk-page-header,
.hbuk-race-header {
  background: #fff !important;
  color: #1a1a1a !important;
  border: 0.5px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  padding: 24px 28px;
  margin-bottom: 20px;
}
.hbuk-eyebrow {
  font-size: 11px;
  letter-spacing: 1.2px;
  color: #6b6b66 !important;
  margin-bottom: 6px;
  font-weight: 500;
  text-transform: uppercase;
}
.hbuk-page-header h1,
.hbuk-race-header h1,
.hbuk-main h1 {
  font-size: 28px !important;
  font-weight: 600 !important;
  margin: 0 0 8px !important;
  line-height: 1.2 !important;
  color: #1a1a1a !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  text-align: left !important;
  background: transparent !important;
  text-shadow: none !important;
  padding: 0 !important;
}
.hbuk-summary { font-size: 15px; color: #4a4a45 !important; margin: 0; }
.hbuk-region { font-size: 16px; color: #6b6b66 !important; font-weight: 400; }

/* Tags */
.hbuk-tag-row { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.hbuk-tag { background: #f5f4ef; color: #444 !important; padding: 3px 9px; border-radius: 4px; font-size: 12px; }
.hbuk-tag-info { background: #E6F1FB; color: #0C447C !important; }

/* Sections */
.hbuk-section {
  background: #fff !important;
  color: #1a1a1a !important;
  border: 0.5px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  padding: 20px 24px;
  margin-bottom: 20px;
}
.hbuk-section h2,
.hbuk-main h2 {
  font-size: 18px !important;
  font-weight: 600 !important;
  margin: 0 0 14px !important;
  color: #1a1a1a !important;
  text-align: left !important;
  background: transparent !important;
}
.hbuk-section-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 12px; flex-wrap: wrap; gap: 8px; }
.hbuk-section-head h2 { margin: 0 !important; }

.hbuk-updated { font-size: 12px; color: #6b6b66 !important; display: inline-flex; align-items: center; gap: 6px; }
.hbuk-dot { width: 6px; height: 6px; border-radius: 50%; background: #1D9E75; display: inline-block; }

/* Meetings grid */
.hbuk-meetings-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; margin-bottom: 28px; }
.hbuk-meeting-card { background: #fff !important; color: #1a1a1a !important; border: 0.5px solid rgba(0,0,0,0.08); border-radius: 10px; padding: 16px 18px; }
.hbuk-meeting-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 12px; padding-bottom: 10px; border-bottom: 0.5px solid rgba(0,0,0,0.06); }
.hbuk-meeting-head h2 { font-size: 17px !important; font-weight: 600 !important; margin: 0 !important; }
.hbuk-meeting-head h2 a { color: #1a1a1a !important; text-decoration: none; }
.hbuk-meeting-head h2 a:hover { color: #1d5fa5 !important; }
.hbuk-going { font-size: 12px; color: #6b6b66 !important; }

/* Race list */
.hbuk-race-list { list-style: none; margin: 0; padding: 0; }
.hbuk-race-link { display: grid; grid-template-columns: 50px 1fr auto; gap: 10px; padding: 8px 0; color: #1a1a1a !important; text-decoration: none; align-items: baseline; border-bottom: 0.5px solid rgba(0,0,0,0.04); }
.hbuk-race-link:hover { background: #fafaf7; }
.hbuk-time { font-variant-numeric: tabular-nums; font-weight: 600; color: #1a1a1a !important; }
.hbuk-race-name { font-size: 14px; color: #1a1a1a !important; }
.hbuk-race-meta { font-size: 11px; color: #6b6b66 !important; }

/* Racecard table */
.hbuk-racecard-table-wrap { border: 0.5px solid rgba(0,0,0,0.08); border-radius: 10px; overflow-x: auto; background: #fff; }
.hbuk-racecard-table, .hbuk-results-table { width: 100%; border-collapse: collapse; font-size: 13px; background: #fff !important; color: #1a1a1a !important; }
.hbuk-racecard-table thead tr, .hbuk-results-table thead tr { background: #f5f4ef !important; color: #6b6b66 !important; font-size: 11px; letter-spacing: 0.5px; }
.hbuk-racecard-table th, .hbuk-results-table th { text-align: left; padding: 10px 12px; font-weight: 600; text-transform: uppercase; white-space: nowrap; color: #6b6b66 !important; }
.hbuk-racecard-table th.hbuk-num, .hbuk-racecard-table td.hbuk-num, .hbuk-results-table th.hbuk-num, .hbuk-results-table td.hbuk-num, .hbuk-col-odds, .hbuk-col-best, .hbuk-col-form { text-align: right; }
.hbuk-col-num { width: 36px; text-align: center !important; }
.hbuk-racecard-table td, .hbuk-results-table td { padding: 11px 12px; vertical-align: middle; border-top: 0.5px solid rgba(0,0,0,0.06); color: #1a1a1a !important; }
.hbuk-racecard-table tbody tr:hover, .hbuk-results-table tbody tr:hover { background: #fafaf7 !important; }
.hbuk-row-fav { background: #f5faf8 !important; }
.hbuk-row-fav:hover { background: #effaf3 !important; }

.hbuk-horse-name a { color: #1a1a1a !important; text-decoration: none; font-weight: 600; }
.hbuk-horse-name a:hover { color: #1d5fa5 !important; }
.hbuk-horse-meta { font-size: 12px; color: #6b6b66 !important; margin-top: 2px; }
.hbuk-horse-meta a { color: #6b6b66 !important; text-decoration: none; }
.hbuk-horse-meta a:hover { color: #1d5fa5 !important; }

.hbuk-pill { font-size: 10px; padding: 1px 6px; border-radius: 3px; margin-left: 6px; letter-spacing: 0.4px; }
.hbuk-pill-fav { background: #E1F5EE; color: #085041 !important; }

.hbuk-form-string { font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; font-size: 12px; color: #6b6b66 !important; }
.hbuk-best-price { font-weight: 600; color: #085041 !important; }
.hbuk-best-book { display: block; font-size: 10px; color: #6b6b66 !important; }

.hbuk-pos { display: inline-block; padding: 2px 8px; border-radius: 4px; background: #f5f4ef; color: #444 !important; font-weight: 600; font-size: 12px; min-width: 28px; text-align: center; }
.hbuk-pos-win { background: #E1F5EE; color: #085041 !important; }
.hbuk-pos-place { background: #FEF6E8; color: #854F0B !important; }

/* Stats grid */
.hbuk-stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 10px; margin-bottom: 20px; }
.hbuk-stat { background: #fff !important; border: 0.5px solid rgba(0,0,0,0.08); border-radius: 8px; padding: 14px 16px; }
.hbuk-stat-label { font-size: 11px; color: #6b6b66 !important; text-transform: uppercase; letter-spacing: 0.5px; }
.hbuk-stat-value { font-size: 22px; font-weight: 600; margin-top: 6px; font-variant-numeric: tabular-nums; color: #1a1a1a !important; }

/* Meeting blocks */
.hbuk-meeting-races { display: grid; gap: 12px; margin-bottom: 24px; }
.hbuk-race-block { background: #fff !important; color: #1a1a1a !important; border: 0.5px solid rgba(0,0,0,0.08); border-radius: 10px; padding: 16px 20px; }
.hbuk-race-block-link { display: flex; gap: 14px; align-items: baseline; color: #1a1a1a !important; text-decoration: none; }
.hbuk-time-large { font-size: 20px; font-weight: 600; font-variant-numeric: tabular-nums; min-width: 64px; color: #1a1a1a !important; }
.hbuk-race-block-name { font-size: 15px; color: #1a1a1a !important; }
.hbuk-runner-strip { list-style: none; margin: 10px 0 8px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.hbuk-runner-strip li { font-size: 12px; background: #f5f4ef; padding: 3px 8px; border-radius: 4px; color: #444 !important; }
.hbuk-runner-strip li a { color: #444 !important; text-decoration: none; }
.hbuk-runner-more { color: #6b6b66 !important; }
.hbuk-race-block-cta { display: inline-block; margin-top: 8px; font-size: 13px; color: #1d5fa5 !important; text-decoration: none; }
.hbuk-race-block-cta:hover { text-decoration: underline; }

/* CTA cards */
.hbuk-cta-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.hbuk-cta-card { display: block; background: #fff !important; color: #1a1a1a !important; border: 0.5px solid rgba(0,0,0,0.08); border-radius: 10px; padding: 18px 20px; text-decoration: none; transition: border-color 0.15s, transform 0.15s; }
.hbuk-cta-card:hover { border-color: #1d5fa5; transform: translateY(-1px); }
.hbuk-cta-eyebrow { font-size: 11px; letter-spacing: 1px; color: #6b6b66 !important; font-weight: 600; }
.hbuk-cta-title { font-size: 18px; font-weight: 600; margin-top: 6px; color: #1a1a1a !important; }
.hbuk-cta-sub { font-size: 13px; color: #6b6b66 !important; margin-top: 4px; }

/* Lists */
.hbuk-quick-list { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 6px; }
.hbuk-quick-list a { display: flex; justify-content: space-between; padding: 10px 14px; background: #fafaf7 !important; border-radius: 6px; color: #1a1a1a !important; text-decoration: none; font-size: 14px; }
.hbuk-quick-list a:hover { background: #f0efe8 !important; color: #1d5fa5 !important; }
.hbuk-quick-count { color: #6b6b66 !important; font-size: 12px; }

.hbuk-courses-grid { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 8px; }
.hbuk-courses-grid a { display: block; padding: 10px 14px; background: #fafaf7 !important; border-radius: 6px; color: #1a1a1a !important; text-decoration: none; font-size: 14px; }
.hbuk-courses-grid a:hover { background: #e6f1fb !important; color: #1d5fa5 !important; }

.hbuk-variance { background: #E1F5EE; color: #085041 !important; padding: 2px 8px; border-radius: 4px; font-weight: 600; font-variant-numeric: tabular-nums; }

/* SEO text */
.hbuk-seo-text { background: #fff !important; color: #1a1a1a !important; border: 0.5px solid rgba(0,0,0,0.08); border-radius: 12px; padding: 24px 28px; margin-top: 20px; }
.hbuk-seo-text h2 { font-size: 18px !important; font-weight: 600 !important; margin: 0 0 12px !important; color: #1a1a1a !important; }
.hbuk-seo-text p { font-size: 14px; line-height: 1.7; color: #2c2c2a !important; margin: 0 0 12px; }
.hbuk-seo-text p:last-child { margin-bottom: 0; }
.hbuk-seo-text a { color: #1d5fa5 !important; text-decoration: none; }
.hbuk-seo-text a:hover { text-decoration: underline; }
.hbuk-related { font-size: 13px; color: #6b6b66 !important; margin-top: 16px; }
.hbuk-related a { color: #1d5fa5 !important; text-decoration: none; margin: 0 4px; }

/* Empty / 404 */
.hbuk-empty { background: #fff !important; color: #6b6b66 !important; border: 0.5px solid rgba(0,0,0,0.08); border-radius: 12px; padding: 40px 28px; text-align: center; }
.hbuk-error-detail { font-size: 12px; margin-top: 8px; }
.hbuk-404 { text-align: center; padding: 60px 20px; }
.hbuk-404 h1 { font-size: 32px !important; margin: 0 0 12px !important; color: #1a1a1a !important; }

/* Reset against aggressive theme styles
   (some themes give h1/h2 huge fonts, image backgrounds, text-shadows) */
.hbuk-main h1, .hbuk-main h2, .hbuk-main h3,
.hbuk-main h4, .hbuk-main h5, .hbuk-main h6 {
  text-shadow: none !important;
  background-image: none !important;
  -webkit-text-fill-color: initial !important;
  letter-spacing: normal !important;
}

/* Mobile */
@media (max-width: 720px) {
  .hbuk-main { padding: 16px 0 32px; }
  .hbuk-container { padding: 0 14px; }
  .hbuk-page-header, .hbuk-race-header { padding: 18px; }
  .hbuk-page-header h1, .hbuk-race-header h1, .hbuk-main h1 { font-size: 22px !important; }
  .hbuk-section, .hbuk-seo-text { padding: 16px 18px; }
  .hbuk-racecard-table th.hbuk-col-odds:nth-child(n+5),
  .hbuk-racecard-table td.hbuk-col-odds:nth-child(n+5) { display: none; }
}
@media (max-width: 480px) {
  .hbuk-racecard-table th.hbuk-col-odds, .hbuk-racecard-table td.hbuk-col-odds { display: none; }
}

/* Custom site header (replaces theme's hero header) */
.hbuk-site-header {
  background: #0e1924;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  padding: 16px 0;
}
.hbuk-site-header-inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.hbuk-site-logo {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  color: #d4b896 !important;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: 0.5px;
}
.hbuk-logo-img {
  max-height: 40px;
  width: auto;
}
.hbuk-site-title {
  color: #d4b896 !important;
}
.hbuk-site-nav {
  display: flex;
  align-items: center;
}
.hbuk-site-nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  gap: 28px;
}
.hbuk-site-nav li { margin: 0; padding: 0; }
.hbuk-site-nav a {
  color: #e8e6e0 !important;
  text-decoration: none;
  font-size: 15px;
  transition: color 0.15s;
}
.hbuk-site-nav a:hover {
  color: #d4b896 !important;
}

@media (max-width: 720px) {
  .hbuk-site-header-inner { padding: 0 14px; gap: 12px; }
  .hbuk-site-nav ul { gap: 16px; }
  .hbuk-site-nav a { font-size: 13px; }
  .hbuk-site-logo { font-size: 18px; }
}

/* ===== HIDE THEME'S PAGE HERO ON PLUGIN PAGES ===== */
/* The theme injects a hero block with the post title on every singular page.
   We hide common patterns. Adjust selectors if your theme uses different ones. */

/* Site-specific theme hero is handled by the .hs-page-header rule below.
   We deliberately do not use broad selectors like [class*="hero"] because
   they would also match our own .hbuk-hero-v2 class. */

/* Some themes use a wave SVG divider after the hero */
body.hbuk-plugin-page .wave-divider,
body.hbuk-plugin-page .wp-block-spacer + svg,
body.hbuk-plugin-page svg.divider {
  display: none !important;
}

/* ===== HIDE ONLY THE SPECIFIC THEME HERO ===== */
/* The horse.bet theme uses .hs-page-header for its hero block. We hide only
   that class so we don't accidentally hide our own .hbuk-hero-v2 etc. */
body.hbuk-plugin-page .hs-page-header {
  display: none !important;
}

/* Trim any leftover top padding from the main wrapper */
body.hbuk-plugin-page .site-content,
body.hbuk-plugin-page main.site-main,
body.hbuk-plugin-page #main,
body.hbuk-plugin-page #content {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* ===== MANUAL OVERRIDE ===== */
/* If the hero is still visible after the rules above, inspect the element in your
   browser (right-click → Inspect) and find the wrapper div/section that contains
   it. Then add its class here, e.g.:

   body.hbuk-plugin-page .your-theme-hero-class { display: none !important; }
*/

/* ===== PRECISE THEME HERO REMOVAL ===== */
/* horse.bet theme renders a hero with class "hs-page-header" on every page.
   Kill it on plugin pages only. */
body.hbuk-plugin-page .hs-page-header {
  display: none !important;
}

/* ===== MOBILE FIXES ===== */

/* Container — tighter padding on phones */
@media (max-width: 768px) {
  .hbuk-shell, .hbuk-main { padding: 12px 0 32px !important; }
  .hbuk-container, .hbuk-page { padding: 0 12px !important; }

  /* Headers more compact */
  .hbuk-page-header, .hbuk-race-header {
    padding: 16px 14px !important;
    margin-bottom: 12px !important;
    border-radius: 8px !important;
  }
  .hbuk-page-header h1, .hbuk-race-header h1, .hbuk-main h1 {
    font-size: 20px !important;
    line-height: 1.25 !important;
  }
  .hbuk-summary { font-size: 13px; }

  /* Sections */
  .hbuk-section, .hbuk-seo-text {
    padding: 14px 14px !important;
    margin-bottom: 12px !important;
    border-radius: 8px !important;
  }
  .hbuk-section h2, .hbuk-seo-text h2 {
    font-size: 16px !important;
    margin-bottom: 10px !important;
  }
  .hbuk-section-head { flex-direction: column; align-items: flex-start; gap: 4px; }
  .hbuk-updated { font-size: 11px; }

  /* Tags */
  .hbuk-tag { font-size: 11px; padding: 2px 7px; }
  .hbuk-tag-row { gap: 4px; }

  /* Stats grid — 2 columns on mobile, smaller */
  .hbuk-stats-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
  .hbuk-stat { padding: 10px 12px !important; }
  .hbuk-stat-label { font-size: 10px !important; }
  .hbuk-stat-value { font-size: 18px !important; margin-top: 4px !important; }

  /* Meetings grid */
  .hbuk-meetings-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
  .hbuk-meeting-card { padding: 14px !important; }

  /* CTA grid */
  .hbuk-cta-grid { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .hbuk-cta-card { padding: 14px 14px !important; }
  .hbuk-cta-title { font-size: 15px !important; }
  .hbuk-cta-sub { font-size: 11px !important; }

  /* Quick lists, courses grid */
  .hbuk-quick-list, .hbuk-courses-grid {
    grid-template-columns: 1fr !important;
  }

  /* Race links — stack better */
  .hbuk-race-link {
    grid-template-columns: 48px 1fr !important;
    gap: 8px !important;
    padding: 10px 6px !important;
  }
  .hbuk-race-link .hbuk-race-meta {
    grid-column: 1 / -1 !important;
    margin-left: 56px;
    margin-top: 2px;
  }
  .hbuk-time { font-size: 14px !important; }
  .hbuk-race-name { font-size: 13px !important; }

  /* Tables — horizontal scroll wrapper */
  .hbuk-racecard-table-wrap {
    margin-left: -14px;
    margin-right: -14px;
    border-radius: 0 !important;
    border-left: none !important;
    border-right: none !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .hbuk-racecard-table, .hbuk-results-table {
    font-size: 12px !important;
    min-width: 100%;
  }
  .hbuk-racecard-table th, .hbuk-results-table th,
  .hbuk-racecard-table td, .hbuk-results-table td {
    padding: 8px 8px !important;
  }
  .hbuk-horse-meta { font-size: 11px !important; }

  /* Hide secondary columns on race tables to reduce horizontal scroll */
  .hbuk-racecard-table th.hbuk-col-form,
  .hbuk-racecard-table td.hbuk-col-form { display: none; }

  /* Hide all bookmaker odds columns, keep only "best" */
  .hbuk-racecard-table th.hbuk-col-odds,
  .hbuk-racecard-table td.hbuk-col-odds { display: none; }

  /* Breadcrumbs — smaller, wrap */
  .hbuk-breadcrumbs { font-size: 11px; margin-bottom: 12px; }
  .hbuk-breadcrumbs ol { gap: 2px; }
  .hbuk-breadcrumbs li::after { margin: 0 2px; }

  /* SEO copy text */
  .hbuk-seo-text p { font-size: 13px !important; line-height: 1.65 !important; }

  /* Site header (your theme's nav) — let it scroll if it overflows */
  body.hbuk-plugin-page { overflow-x: hidden !important; }
}

/* Very small phones */
@media (max-width: 380px) {
  .hbuk-page-header h1, .hbuk-race-header h1, .hbuk-main h1 {
    font-size: 18px !important;
  }
  .hbuk-cta-grid { grid-template-columns: 1fr !important; }
  .hbuk-stats-grid { grid-template-columns: 1fr 1fr !important; }
  .hbuk-stat-value { font-size: 16px !important; }
}

/* Make sure nothing in the plugin pushes wider than the viewport */
body.hbuk-plugin-page .hbuk-main * {
  max-width: 100%;
  box-sizing: border-box;
}
body.hbuk-plugin-page .hbuk-main table { max-width: none; }

/* ========== AFFILIATE BANNERS ========== */

/* SLOT A: Hero banner (top of race / meeting / hub pages) */
.hbuk-aff-hero {
  border-radius: 12px;
  padding: 14px 18px;
  margin: 0 0 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  color: #fff !important;
  text-decoration: none;
  position: relative;
  overflow: hidden;
}
.hbuk-aff-hero-logo {
  background: #fff;
  border-radius: 8px;
  padding: 8px 10px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 90px;
  height: 50px;
}
.hbuk-aff-hero-logo img {
  max-height: 32px;
  max-width: 70px;
  width: auto;
  height: auto;
}
.hbuk-aff-hero-text { flex: 1; min-width: 0; }
.hbuk-aff-hero-eyebrow {
  font-size: 10px;
  opacity: 0.7;
  letter-spacing: 1px;
  color: #fff;
}
.hbuk-aff-hero-offer {
  font-size: 17px;
  font-weight: 500;
  line-height: 1.2;
  margin-top: 2px;
  color: #fff !important;
}
.hbuk-aff-hero-terms {
  font-size: 10px;
  opacity: 0.65;
  margin-top: 4px;
  color: #fff;
}
.hbuk-aff-hero-btn {
  padding: 10px 16px;
  border-radius: 6px;
  text-decoration: none !important;
  font-weight: 500;
  font-size: 13px;
  white-space: nowrap;
  flex-shrink: 0;
  border: none;
  cursor: pointer;
  transition: opacity 0.15s;
}
.hbuk-aff-hero-btn:hover { opacity: 0.92; }

@media (max-width: 600px) {
  .hbuk-aff-hero {
    flex-wrap: wrap;
    padding: 12px 14px;
  }
  .hbuk-aff-hero-logo {
    min-width: 70px;
    height: 42px;
    padding: 6px 8px;
  }
  .hbuk-aff-hero-logo img { max-height: 26px; max-width: 56px; }
  .hbuk-aff-hero-offer { font-size: 15px; }
  .hbuk-aff-hero-btn {
    width: 100%;
    text-align: center;
    margin-top: 6px;
    padding: 10px;
  }
}

/* SLOT C: Best price on favourite */
.hbuk-aff-bestprice {
  background: linear-gradient(90deg, #fffaeb 0%, #fef6e3 100%);
  border: 0.5px solid #FAC775;
  border-radius: 12px;
  padding: 14px 16px;
  margin: 0 0 8px;
  display: flex;
  align-items: center;
  gap: 14px;
}
.hbuk-aff-bp-icon {
  width: 36px;
  height: 36px;
  background: #BA7517;
  color: #fff !important;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 18px;
  font-weight: 500;
}
.hbuk-aff-bp-body { flex: 1; min-width: 0; }
.hbuk-aff-bp-lbl {
  font-size: 10px;
  color: #854F0B !important;
  letter-spacing: 0.5px;
  font-weight: 500;
}
.hbuk-aff-bp-title {
  font-size: 14px;
  font-weight: 500;
  color: #2C2C2A !important;
  line-height: 1.3;
  margin-top: 2px;
}
.hbuk-aff-bp-race {
  font-weight: 400;
  color: #6b6b66 !important;
}
.hbuk-aff-bp-meta {
  font-size: 11px;
  color: #6b6b66 !important;
  margin-top: 3px;
}
.hbuk-aff-bp-priceblock {
  text-align: right;
  flex-shrink: 0;
}
.hbuk-aff-bp-price {
  font-size: 20px;
  font-weight: 500;
  color: #014230 !important;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.hbuk-aff-bp-bookie {
  font-size: 10px;
  color: #6b6b66 !important;
  margin-top: 2px;
}
.hbuk-aff-bp-btn {
  background: #014230 !important;
  color: #fff !important;
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 11px;
  text-decoration: none !important;
  font-weight: 500;
  margin-top: 6px;
  display: inline-block;
  white-space: nowrap;
}
.hbuk-aff-bp-btn:hover { opacity: 0.92; }

.hbuk-aff-disclaimer {
  font-size: 10px;
  color: var(--color-text-secondary) !important;
  text-align: center;
  margin: 0 0 18px;
  opacity: 0.7;
}

@media (max-width: 600px) {
  .hbuk-aff-bestprice {
    flex-wrap: wrap;
    padding: 12px 14px;
    gap: 10px;
  }
  .hbuk-aff-bp-priceblock {
    width: 100%;
    text-align: left;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-top: 8px;
    border-top: 0.5px solid #FAC775;
  }
  .hbuk-aff-bp-btn { margin-top: 0; margin-left: auto; }
}

/* ============================================================
   v2 REDESIGN — dark hero, editorial cards, runner rows with silks
   ============================================================ */

.hbuk-page.hbuk-race-v2 {
  max-width: 760px;
  margin: 0 auto;
  padding: 16px 12px 40px;
}

/* Dark gradient hero */
.hbuk-hero-v2 {
  background: linear-gradient(135deg, #0e1924 0%, #1a2a3a 100%) !important;
  border-radius: 14px;
  padding: 22px 22px 16px;
  color: #fff !important;
  margin-bottom: 16px;
  border: none !important;
}
.hbuk-hero-v2 * { color: #fff !important; }
.hbuk-hero-v2-eyebrow {
  font-size: 10px;
  letter-spacing: 1.5px;
  opacity: 0.65;
}
.hbuk-hero-v2 h1 {
  font-size: 24px !important;
  font-weight: 500 !important;
  line-height: 1.15 !important;
  margin: 4px 0 14px !important;
  color: #fff !important;
}
.hbuk-hero-v2-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 16px;
}
.hbuk-hero-v2 .hbuk-pill {
  background: rgba(255,255,255,0.12);
  color: #fff !important;
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 12px;
  font-weight: 400;
}
.hbuk-hero-v2 .hbuk-pill-prize {
  background: #d4b896 !important;
  color: #0e1924 !important;
  font-weight: 500;
}
.hbuk-hero-v2-keyinfo {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,0.08);
}
.hbuk-hero-v2-keyinfo > div { text-align: center; }
.hbuk-hero-v2-kl {
  font-size: 10px;
  opacity: 0.6;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}
.hbuk-hero-v2-kv {
  font-size: 15px;
  font-weight: 500;
  margin-top: 3px;
  color: #fff !important;
}

/* Editor's verdict card */
.hbuk-verdict {
  background: #fffaeb !important;
  border-left: 3px solid #BA7517 !important;
  border-radius: 0 10px 10px 0;
  padding: 14px 18px;
  margin: 0 0 16px;
}
.hbuk-verdict-h {
  font-size: 11px;
  letter-spacing: 1px;
  color: #854F0B !important;
  font-weight: 500;
}
.hbuk-verdict p {
  font-family: var(--font-serif, Georgia, serif);
  font-style: italic;
  font-size: 14px;
  line-height: 1.65;
  margin: 6px 0 0;
  color: #2C2C2A !important;
}
.hbuk-verdict-byline {
  font-size: 11px;
  color: #6b6b66 !important;
  margin-top: 10px;
  font-family: inherit;
  font-style: normal;
}

/* v2 cards */
.hbuk-card-v2 {
  background: #fff !important;
  border: 0.5px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  padding: 18px 18px 8px;
  margin-bottom: 16px;
}
.hbuk-card-v2 h2 {
  font-size: 16px !important;
  font-weight: 500 !important;
  margin: 0 0 14px !important;
  color: #1a1a1a !important;
  display: flex;
  align-items: center;
  gap: 8px;
}
.hbuk-card-v2 .hbuk-ic {
  font-style: normal;
  color: #6b6b66;
  font-size: 14px;
}

/* Tips row */
.hbuk-tips-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
  margin-bottom: 8px;
}
.hbuk-tip-card {
  background: #f5f4ef;
  padding: 10px 12px;
  border-radius: 8px;
}
.hbuk-tip-lbl {
  font-size: 10px;
  color: #6b6b66 !important;
  letter-spacing: 0.5px;
  font-weight: 500;
}
.hbuk-tip-name {
  font-size: 13px;
  font-weight: 500;
  margin-top: 4px;
  color: #1a1a1a !important;
}
.hbuk-tip-reason {
  font-size: 11px;
  color: #6b6b66 !important;
  margin-top: 3px;
  line-height: 1.4;
}

/* Runner row */
.hbuk-runner-v2 {
  display: grid;
  grid-template-columns: 36px 36px 1fr auto;
  gap: 10px;
  padding: 12px 0;
  border-bottom: 0.5px solid rgba(0,0,0,0.06);
  align-items: center;
}
.hbuk-runner-v2:last-child { border-bottom: 0; }
.hbuk-runner-v2.is-fav {
  background: #f5faf8;
  margin: 0 -8px;
  padding: 12px 8px;
  border-radius: 6px;
}
.hbuk-runner-num {
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  font-size: 15px;
  color: #1a1a1a !important;
  text-align: center;
  background: #f5f4ef;
  border-radius: 6px;
  padding: 5px 0;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.hbuk-draw {
  display: block;
  font-size: 9px;
  color: #6b6b66 !important;
  font-weight: 400;
  margin-top: 2px;
}
.hbuk-runner-silk {
  width: 36px;
  height: 36px;
  border-radius: 6px;
  overflow: hidden;
  background: #f5f4ef;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hbuk-runner-silk img,
.hbuk-runner-silk svg {
  width: 32px;
  height: 32px;
}
.hbuk-runner-body { min-width: 0; }
.hbuk-runner-name {
  font-weight: 500;
  font-size: 14px;
  color: #1a1a1a !important;
  line-height: 1.3;
}
.hbuk-runner-name a {
  color: #1a1a1a !important;
  text-decoration: none;
}
.hbuk-runner-name a:hover { color: #1d5fa5 !important; }
.hbuk-fav-tag {
  background: #E1F5EE;
  color: #085041 !important;
  font-size: 9px;
  font-weight: 500;
  padding: 1px 6px;
  border-radius: 3px;
  margin-left: 4px;
  letter-spacing: 0.5px;
  vertical-align: 2px;
}
.hbuk-tag-value {
  background: #FAEEDA;
  color: #854F0B !important;
}
.hbuk-tag-ew {
  background: #E6F1FB;
  color: #0C447C !important;
}
.hbuk-runner-meta {
  font-size: 11px;
  color: #6b6b66 !important;
  margin-top: 3px;
  line-height: 1.4;
}
.hbuk-runner-meta a {
  color: #6b6b66 !important;
  text-decoration: none;
}
.hbuk-runner-meta a:hover { color: #1d5fa5 !important; text-decoration: underline; }
.hbuk-runner-form {
  font-size: 11px;
  color: #6b6b66 !important;
  margin-top: 4px;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.hbuk-form-row {
  display: inline-flex;
  gap: 2px;
}
.hbuk-form-digit {
  display: inline-flex;
  width: 18px;
  height: 18px;
  border-radius: 3px;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}
.hbuk-fd-win { background: #E1F5EE; color: #085041 !important; }
.hbuk-fd-place { background: #FEF6E8; color: #854F0B !important; }
.hbuk-fd-other { background: #f5f4ef; color: #6b6b66 !important; }
.hbuk-fd-sep { color: #b5b5ad !important; font-size: 11px; padding: 0 2px; }
.hbuk-form-empty {
  font-style: italic;
  color: #b5b5ad !important;
}
.hbuk-last-run { color: #b5b5ad !important; }
.hbuk-runner-odds {
  text-align: right;
  min-width: 50px;
}
.hbuk-runner-price {
  font-size: 17px;
  font-weight: 500;
  color: #085041 !important;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}
.hbuk-runner-price.hbuk-no-price {
  color: #b5b5ad !important;
  font-weight: 400;
}
.hbuk-runner-bookie {
  font-size: 10px;
  color: #6b6b66 !important;
  margin-top: 3px;
}

/* Mobile tweaks for the new design */
@media (max-width: 600px) {
  .hbuk-hero-v2 { padding: 18px 16px 14px; border-radius: 12px; }
  .hbuk-hero-v2 h1 { font-size: 19px !important; }
  .hbuk-hero-v2-keyinfo { gap: 4px; }
  .hbuk-hero-v2-kv { font-size: 12px; }
  .hbuk-card-v2 { padding: 14px 14px 6px; }
  .hbuk-tips-row { grid-template-columns: 1fr; gap: 6px; }
  .hbuk-tip-card { padding: 10px 12px; }
  .hbuk-runner-v2 {
    grid-template-columns: 32px 32px 1fr auto;
    gap: 8px;
    padding: 10px 0;
  }
  .hbuk-runner-num { font-size: 14px; padding: 3px 0; }
  .hbuk-runner-silk { width: 32px; height: 32px; }
  .hbuk-runner-silk img, .hbuk-runner-silk svg { width: 28px; height: 28px; }
  .hbuk-runner-name { font-size: 13px; }
  .hbuk-runner-price { font-size: 15px; }
}

/* ===== CRITICAL FIXES FOR v2 DESIGN ===== */
/* The earlier .hbuk-main * { color: inherit } rule was leaking light-context
   colors into the dark hero and affiliate banners. Override here. */

/* Dark hero text must stay white */
.hbuk-page.hbuk-race-v2 .hbuk-hero-v2,
.hbuk-page.hbuk-race-v2 .hbuk-hero-v2 *,
.hbuk-hero-v2,
.hbuk-hero-v2 h1,
.hbuk-hero-v2 .hbuk-pill,
.hbuk-hero-v2 .hbuk-hero-v2-eyebrow,
.hbuk-hero-v2 .hbuk-hero-v2-kl,
.hbuk-hero-v2 .hbuk-hero-v2-kv {
  color: #fff !important;
}
.hbuk-hero-v2 .hbuk-pill-prize {
  color: #0e1924 !important;
}

/* Affiliate hero banner — force white text on dark background */
.hbuk-aff-hero,
.hbuk-aff-hero * {
  color: #fff !important;
}
.hbuk-aff-hero .hbuk-aff-hero-btn {
  /* button text uses its inline-style color, not white */
  color: inherit !important;
}
/* Override the inline-style fallback — let inline color win */
.hbuk-aff-hero a.hbuk-aff-hero-btn[style*="color"] {
  color: #014230 !important;
}

/* Best-price banner — keep its darker text colors visible */
.hbuk-aff-bestprice .hbuk-aff-bp-title { color: #2C2C2A !important; }
.hbuk-aff-bestprice .hbuk-aff-bp-lbl { color: #854F0B !important; }
.hbuk-aff-bestprice .hbuk-aff-bp-meta,
.hbuk-aff-bestprice .hbuk-aff-bp-race,
.hbuk-aff-bestprice .hbuk-aff-bp-bookie { color: #6b6b66 !important; }
.hbuk-aff-bestprice .hbuk-aff-bp-price { color: #014230 !important; }
.hbuk-aff-bestprice .hbuk-aff-bp-icon { color: #fff !important; background: #BA7517 !important; }
.hbuk-aff-bestprice .hbuk-aff-bp-btn { color: #fff !important; background: #014230 !important; }

/* Editor's verdict text — readable on the amber background */
.hbuk-verdict, .hbuk-verdict * { color: #2C2C2A !important; }
.hbuk-verdict-h { color: #854F0B !important; }
.hbuk-verdict-byline { color: #6b6b66 !important; }

/* Tip card text colors */
.hbuk-tip-card .hbuk-tip-lbl { color: #6b6b66 !important; }
.hbuk-tip-card .hbuk-tip-name { color: #1a1a1a !important; }
.hbuk-tip-card .hbuk-tip-reason { color: #6b6b66 !important; }

/* Runner row colors */
.hbuk-runner-v2 .hbuk-runner-num { color: #1a1a1a !important; }
.hbuk-runner-v2 .hbuk-runner-name,
.hbuk-runner-v2 .hbuk-runner-name a { color: #1a1a1a !important; }
.hbuk-runner-v2 .hbuk-runner-meta,
.hbuk-runner-v2 .hbuk-runner-meta a,
.hbuk-runner-v2 .hbuk-runner-form,
.hbuk-runner-v2 .hbuk-runner-bookie,
.hbuk-runner-v2 .hbuk-draw,
.hbuk-runner-v2 .hbuk-last-run { color: #6b6b66 !important; }
.hbuk-runner-v2 .hbuk-runner-price { color: #085041 !important; }
.hbuk-runner-v2 .hbuk-runner-price.hbuk-no-price { color: #b5b5ad !important; }

/* Form-digit colors */
.hbuk-fd-win { background: #E1F5EE !important; color: #085041 !important; }
.hbuk-fd-place { background: #FEF6E8 !important; color: #854F0B !important; }
.hbuk-fd-other { background: #f5f4ef !important; color: #6b6b66 !important; }
.hbuk-fd-sep { color: #b5b5ad !important; }

/* Make sure the article container doesn't constrain */
.hbuk-page.hbuk-race-v2 {
  max-width: 760px !important;
  margin: 0 auto !important;
  padding: 16px 12px 40px !important;
}
.hbuk-card-v2 { 
  background: #fff !important;
  color: #1a1a1a !important;
}
.hbuk-card-v2 h2 { color: #1a1a1a !important; }

/* ============================================================
   v2 GLOBAL DESIGN SYSTEM — applied to all pages
   ============================================================ */

.hbuk-page.hbuk-v2 {
  max-width: 760px !important;
  margin: 0 auto !important;
  padding: 16px 12px 40px !important;
}

/* Hero — applies to ALL v2 pages now */
.hbuk-v2 .hbuk-hero-v2 {
  background: linear-gradient(135deg, #0e1924 0%, #1a2a3a 100%) !important;
  border-radius: 14px !important;
  padding: 22px 22px 16px !important;
  color: #fff !important;
  margin-bottom: 16px !important;
  border: none !important;
}
.hbuk-v2 .hbuk-hero-v2 * { color: #fff !important; }
.hbuk-v2 .hbuk-hero-v2 h1 {
  font-size: 24px !important;
  font-weight: 500 !important;
  line-height: 1.15 !important;
  margin: 4px 0 14px !important;
  color: #fff !important;
}
.hbuk-v2 .hbuk-hero-v2-eyebrow { font-size: 10px; letter-spacing: 1.5px; opacity: 0.65; }
.hbuk-v2 .hbuk-hero-v2-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.hbuk-v2 .hbuk-hero-v2 .hbuk-pill {
  background: rgba(255,255,255,0.12) !important;
  color: #fff !important;
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 12px;
}
.hbuk-v2 .hbuk-hero-v2 .hbuk-pill-prize {
  background: #d4b896 !important;
  color: #0e1924 !important;
  font-weight: 500;
}

/* Hero variant: horse profile with silk */
.hbuk-v2 .hbuk-hero-v2-profile { display: flex; gap: 16px; align-items: center; }
.hbuk-v2 .hbuk-hero-v2-silk { width: 56px; height: 56px; border-radius: 10px; overflow: hidden; background: rgba(255,255,255,0.1); flex-shrink: 0; }
.hbuk-v2 .hbuk-hero-v2-silk svg { width: 56px; height: 56px; }
.hbuk-v2 .hbuk-hero-v2-text { flex: 1; min-width: 0; }
.hbuk-v2 .hbuk-hero-v2-reg { font-size: 15px; opacity: 0.55; font-weight: 400; }
.hbuk-v2 .hbuk-hero-v2-sub { font-size: 13px; opacity: 0.85; line-height: 1.45; margin-top: 6px; }

/* Cards */
.hbuk-v2 .hbuk-card-v2 {
  background: #fff !important;
  border: 0.5px solid rgba(0,0,0,0.08) !important;
  border-radius: 12px !important;
  padding: 18px 18px 8px !important;
  margin-bottom: 16px !important;
  color: #1a1a1a !important;
}
.hbuk-v2 .hbuk-card-v2 h2 {
  font-size: 16px !important;
  font-weight: 500 !important;
  margin: 0 0 14px !important;
  color: #1a1a1a !important;
  display: flex;
  align-items: center;
  gap: 8px;
}
.hbuk-v2 .hbuk-card-v2 .hbuk-ic { font-style: normal; color: #6b6b66 !important; font-size: 14px; }

/* Verdict */
.hbuk-v2 .hbuk-verdict {
  background: #fffaeb !important;
  border-left: 3px solid #BA7517 !important;
  border-radius: 0 10px 10px 0 !important;
  padding: 14px 18px !important;
  margin: 0 0 16px !important;
}
.hbuk-v2 .hbuk-verdict, .hbuk-v2 .hbuk-verdict * { color: #2C2C2A !important; }
.hbuk-v2 .hbuk-verdict-h { font-size: 11px !important; letter-spacing: 1px !important; color: #854F0B !important; font-weight: 500 !important; }
.hbuk-v2 .hbuk-verdict p {
  font-family: Georgia, var(--font-serif, serif) !important;
  font-style: italic !important;
  font-size: 14px !important;
  line-height: 1.65 !important;
  margin: 6px 0 0 !important;
  color: #2C2C2A !important;
}
.hbuk-v2 .hbuk-verdict-byline {
  font-size: 11px !important;
  color: #6b6b66 !important;
  margin-top: 10px !important;
  font-style: normal !important;
  font-family: -apple-system, sans-serif !important;
}

/* Race row (used on today, tomorrow, meeting, course, home) */
.hbuk-race-row-v2 {
  display: grid;
  grid-template-columns: 60px 1fr auto;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 0.5px solid rgba(0,0,0,0.06);
  text-decoration: none !important;
  color: inherit !important;
  align-items: center;
}
.hbuk-race-row-v2:last-child { border-bottom: 0; }
.hbuk-race-row-v2:hover {
  background: #fafaf7;
  margin: 0 -8px;
  padding: 12px 8px;
  border-radius: 6px;
}
.hbuk-race-row-time {
  font-variant-numeric: tabular-nums;
  font-weight: 500;
  font-size: 15px;
  color: #1a1a1a !important;
}
.hbuk-race-row-body { min-width: 0; }
.hbuk-race-row-name { font-size: 14px; color: #1a1a1a !important; font-weight: 500; }
.hbuk-race-row-meta { font-size: 11px; color: #6b6b66 !important; margin-top: 2px; line-height: 1.4; }
.hbuk-race-row-fav { text-align: right; min-width: 50px; }
.hbuk-race-row-fav-lbl { font-size: 9px; color: #6b6b66 !important; letter-spacing: 0.5px; font-weight: 500; }
.hbuk-race-row-fav-price { font-size: 15px; font-weight: 500; color: #085041 !important; font-variant-numeric: tabular-nums; margin-top: 2px; }

/* Meeting header (today page sections) */
.hbuk-meeting-h-v2 {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 0.5px solid rgba(0,0,0,0.08);
  flex-wrap: wrap;
  gap: 8px;
}
.hbuk-meeting-h-v2 h2 { font-size: 17px !important; margin: 0 !important; font-weight: 500 !important; }
.hbuk-meeting-h-v2 h2 a { color: #1a1a1a !important; text-decoration: none !important; }
.hbuk-meeting-h-v2 h2 a:hover { color: #1d5fa5 !important; }
.hbuk-meeting-h-meta { display: flex; gap: 6px; }
.hbuk-pill-soft {
  background: #f5f4ef;
  color: #444 !important;
  padding: 3px 9px;
  border-radius: 4px;
  font-size: 11px;
}

/* CTA row */
.hbuk-cta-row-v2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 16px 0;
}
.hbuk-cta-row-v2.hbuk-cta-4 { grid-template-columns: repeat(2, 1fr); }
.hbuk-cta-v2 {
  display: block;
  background: #fff !important;
  border: 0.5px solid rgba(0,0,0,0.1) !important;
  border-radius: 10px;
  padding: 14px 16px;
  text-decoration: none !important;
  transition: border-color 0.15s;
  color: #1a1a1a !important;
}
.hbuk-cta-v2:hover { border-color: #1d5fa5 !important; }
.hbuk-cta-v2-title { font-size: 14px; font-weight: 500; color: #1a1a1a !important; }
.hbuk-cta-v2-sub { font-size: 11px; color: #6b6b66 !important; margin-top: 3px; }

/* Stats grid v2 */
.hbuk-stats-grid-v2 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
.hbuk-stat-v2 {
  background: #f5f4ef !important;
  border-radius: 8px;
  padding: 12px 10px;
  text-align: center;
}
.hbuk-stat-v2-val {
  font-size: 22px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  color: #1a1a1a !important;
  line-height: 1.1;
}
.hbuk-stat-v2-val.hbuk-stat-pos { color: #085041 !important; }
.hbuk-stat-v2-val.hbuk-stat-neg { color: #A32D2D !important; }
.hbuk-stat-v2-lbl {
  font-size: 10px;
  color: #6b6b66 !important;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  margin-top: 4px;
}

/* Form readout */
.hbuk-form-readout {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: #f5f4ef;
  border-radius: 8px;
  margin: 12px 0;
  flex-wrap: wrap;
}
.hbuk-form-readout-lbl { font-size: 11px; color: #6b6b66 !important; font-weight: 500; }
.hbuk-form-readout-hint { font-size: 10px; color: #b5b5ad !important; margin-left: auto; }

/* Race history row */
.hbuk-race-history-row {
  display: grid;
  grid-template-columns: 40px 1fr auto;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 0.5px solid rgba(0,0,0,0.06);
  align-items: center;
}
.hbuk-race-history-row:last-child { border-bottom: 0; }
.hbuk-race-history-pos {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  font-size: 15px;
  font-variant-numeric: tabular-nums;
}
.hbuk-pos-win-v2 { background: #E1F5EE !important; color: #085041 !important; }
.hbuk-pos-place-v2 { background: #FEF6E8 !important; color: #854F0B !important; }
.hbuk-pos-other-v2 { background: #f5f4ef !important; color: #6b6b66 !important; }

.hbuk-race-history-date { font-size: 11px; color: #6b6b66 !important; }
.hbuk-race-history-meta { font-size: 13px; color: #1a1a1a !important; font-weight: 500; margin-top: 2px; }
.hbuk-race-history-meta a { color: #1a1a1a !important; text-decoration: none; }
.hbuk-race-history-detail { font-size: 11px; color: #6b6b66 !important; margin-top: 2px; }
.hbuk-race-history-detail a { color: #6b6b66 !important; text-decoration: none; }
.hbuk-race-history-detail a:hover { color: #1d5fa5 !important; }
.hbuk-race-history-sp { text-align: right; min-width: 50px; }
.hbuk-race-history-sp-price { font-weight: 500; font-size: 14px; color: #1a1a1a !important; }
.hbuk-race-history-sp-lbl { font-size: 9px; color: #6b6b66 !important; letter-spacing: 0.5px; margin-top: 2px; }

/* Breeding grid */
.hbuk-breed-grid-v2 {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px 16px;
  font-size: 13px;
}
.hbuk-breed-lbl { color: #6b6b66 !important; }
.hbuk-breed-val { font-weight: 500; color: #1a1a1a !important; }
.hbuk-breed-val a { color: #1d5fa5 !important; text-decoration: none; }

/* Course performance table */
.hbuk-coursetable-wrap {
  border: 0.5px solid rgba(0,0,0,0.08);
  border-radius: 8px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.hbuk-coursetable {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.hbuk-coursetable thead { background: #f5f4ef; }
.hbuk-coursetable th {
  text-align: left;
  padding: 10px 12px;
  font-weight: 500;
  font-size: 10px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: #6b6b66 !important;
}
.hbuk-coursetable th.hbuk-num, .hbuk-coursetable td.hbuk-num { text-align: right; }
.hbuk-coursetable td {
  padding: 10px 12px;
  border-top: 0.5px solid rgba(0,0,0,0.06);
  color: #1a1a1a !important;
  font-variant-numeric: tabular-nums;
}
.hbuk-coursetable .hbuk-pl-pos { color: #085041 !important; font-weight: 500; }
.hbuk-coursetable .hbuk-pl-neg { color: #A32D2D !important; font-weight: 500; }

/* Best odds list */
.hbuk-bestodds-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 0.5px solid rgba(0,0,0,0.06);
  align-items: center;
}
.hbuk-bestodds-row:last-child { border-bottom: 0; }
.hbuk-bestodds-horse { font-weight: 500; font-size: 14px; color: #1a1a1a !important; }
.hbuk-bestodds-horse a { color: #1a1a1a !important; text-decoration: none; }
.hbuk-bestodds-race { font-size: 11px; color: #6b6b66 !important; margin-top: 2px; }
.hbuk-bestodds-race a { color: #6b6b66 !important; text-decoration: none; }
.hbuk-bestodds-price { text-align: right; min-width: 70px; }
.hbuk-bestodds-frac { font-size: 16px; font-weight: 500; color: #085041 !important; font-variant-numeric: tabular-nums; }
.hbuk-bestodds-bookie { font-size: 10px; color: #6b6b66 !important; margin-top: 2px; }
.hbuk-bestodds-spread {
  background: #E1F5EE;
  color: #085041 !important;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: 500;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

/* Mobile */
@media (max-width: 600px) {
  .hbuk-page.hbuk-v2 { padding: 12px 10px 32px !important; }
  .hbuk-v2 .hbuk-hero-v2 { padding: 18px 16px 14px !important; border-radius: 12px !important; }
  .hbuk-v2 .hbuk-hero-v2 h1 { font-size: 20px !important; }
  .hbuk-v2 .hbuk-card-v2 { padding: 14px 14px 6px !important; }
  .hbuk-stats-grid-v2 { grid-template-columns: repeat(2, 1fr); }
  .hbuk-cta-row-v2 { grid-template-columns: 1fr; }
  .hbuk-cta-row-v2.hbuk-cta-4 { grid-template-columns: 1fr 1fr; }
  .hbuk-race-row-v2 { grid-template-columns: 50px 1fr auto; gap: 8px; padding: 10px 0; }
  .hbuk-race-row-name { font-size: 13px; }
  .hbuk-race-history-row { grid-template-columns: 36px 1fr auto; gap: 10px; }
  .hbuk-race-history-pos { width: 36px; height: 36px; font-size: 13px; }
  .hbuk-race-history-meta { font-size: 12px; }
  .hbuk-bestodds-row { grid-template-columns: 1fr auto; gap: 8px; padding: 10px 0; }
  .hbuk-bestodds-spread { grid-column: 1 / -1; justify-self: start; }
}

/* ===== COURSES INDEX PAGE ===== */
.hbuk-courses-grid-v2 {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 8px;
}
.hbuk-course-card-v2 {
  display: block;
  padding: 14px 16px;
  background: #f5f4ef !important;
  border: 0.5px solid rgba(0,0,0,0.08);
  border-radius: 8px;
  text-decoration: none !important;
  color: #1a1a1a !important;
  transition: border-color 0.15s, background 0.15s;
}
.hbuk-course-card-v2:hover {
  border-color: #1d5fa5 !important;
  background: #fafaf7 !important;
}
.hbuk-course-card-v2.is-racing {
  background: #E1F5EE !important;
  border-color: #1D9E75 !important;
}
.hbuk-course-card-v2.is-racing:hover {
  background: #d4eee3 !important;
}
.hbuk-course-card-name {
  font-size: 14px;
  font-weight: 500;
  color: #1a1a1a !important;
  line-height: 1.3;
}
.hbuk-course-card-v2.is-racing .hbuk-course-card-name {
  color: #044229 !important;
}
.hbuk-course-card-sub {
  font-size: 11px;
  color: #085041 !important;
  margin-top: 3px;
  font-weight: 500;
}
@media (max-width: 600px) {
  .hbuk-courses-grid-v2 { grid-template-columns: repeat(2, 1fr); gap: 6px; }
  .hbuk-course-card-v2 { padding: 10px 12px; }
  .hbuk-course-card-name { font-size: 13px; }
}
