/*
File:         site.css  (assets/css)
Title:        Site styles — deep rink blue with ice-white and hockey-line red
Created:      2026-11-08   Created By: Seb & AI
Last Updated: 2026-11-08   Updated By: Seb & AI
*/
:root {
  --bi-night: #092440;
  --bi-night-deep: #05182c;
  --bi-glow: #8fdcff;
  --bi-glow-2: #c4eeff;
  --bi-sea: #1a63b8;
  --bi-ink: #1d2433;
  --bi-soft: #eef6fb;
  --ria-red: #d62839;
}

body { font-family: 'Inter', system-ui, sans-serif; color: var(--bi-ink); }
h1, h2, h3, h4, .navbar-brand { font-family: 'Poppins', 'Inter', system-ui, sans-serif; }

.bg-night { background-color: var(--bi-night) !important; }
.bg-night-deep { background-color: var(--bi-night-deep) !important; }
.bg-soft { background-color: var(--bi-soft) !important; }
.text-glow { color: var(--bi-glow) !important; }
.text-sea { color: var(--bi-sea) !important; }

a { color: #0f4c81; }
a:hover { color: var(--bi-sea); }

.btn-glow { background-color: var(--bi-glow); border-color: var(--bi-glow); color: #062033; font-weight: 600; }
.btn-glow:hover, .btn-glow:focus { background-color: var(--bi-glow-2); border-color: var(--bi-glow-2); color: #062033; }
.btn-outline-glow { border-color: var(--bi-glow); color: var(--bi-glow); }
.btn-outline-glow:hover { background: var(--bi-glow); color: #062033; }

.bi-brand-mark { display:inline-flex; width:30px; height:30px; border-radius:50%; align-items:center; justify-content:center;
  background: radial-gradient(circle at 40% 35%, #ffffff, var(--bi-glow-2) 55%, var(--bi-glow)); color:#062033; font-size:1rem;
  box-shadow: 0 0 12px rgba(143,220,255,.55); }
.navbar .nav-link.active { color: var(--bi-glow) !important; }

.bi-skip-link { position:absolute; left:-9999px; top:0; background:#fff; color:#000; padding:.75rem 1rem; z-index:2000; }
.bi-skip-link:focus { left:0; }

/* Hero */
.bi-hero { position:relative; overflow:hidden; border-radius:1rem; color:#fff;
  background: linear-gradient(160deg, #092440 0%, #0f3a66 55%, #1a5c92 100%); }
.bi-hero::before { content:""; position:absolute; inset:0;
  background-image:
    radial-gradient(circle at 12% 30%, rgba(143,220,255,.55) 0 2px, transparent 3px),
    radial-gradient(circle at 28% 70%, rgba(220,245,255,.5) 0 2px, transparent 3px),
    radial-gradient(circle at 45% 25%, rgba(255,255,255,.45) 0 1.5px, transparent 2.5px),
    radial-gradient(circle at 62% 60%, rgba(143,220,255,.5) 0 2px, transparent 3px),
    radial-gradient(circle at 78% 35%, rgba(120,200,255,.5) 0 2px, transparent 3px),
    radial-gradient(circle at 90% 75%, rgba(220,245,255,.55) 0 2px, transparent 3px),
    radial-gradient(circle at 70% 85%, rgba(214,40,57,.45) 0 2px, transparent 3px),
    radial-gradient(circle at 35% 90%, rgba(255,255,255,.35) 0 1.5px, transparent 2.5px);
  pointer-events:none; }
.bi-hero::after { content:""; position:absolute; left:0; right:0; bottom:0; height:38%;
  background: linear-gradient(180deg, transparent, rgba(30,111,176,.35)); pointer-events:none; }
.bi-hero > * { position:relative; z-index:1; }
.bi-hero .lead { color: rgba(255,255,255,.88); }
.bi-hero h1 { text-shadow: 0 0 18px rgba(143,220,255,.35); }

/* Section tiles */
.bi-tile { border:1px solid #e6e2d8; border-radius:.75rem; background:#fff; transition: transform .15s ease, box-shadow .15s ease; color: var(--bi-ink); }
.bi-tile:hover { transform: translateY(-3px); box-shadow: 0 8px 22px rgba(11,26,58,.12); color: var(--bi-ink); }
.bi-tile-icon { font-size:1.8rem; color: var(--bi-sea); }

/* Article body */
.bi-article { line-height:1.7; font-size:1.03rem; }
.bi-article h2 { font-size:1.35rem; margin-top:2rem; margin-bottom:.75rem; }
.bi-article h3 { font-size:1.1rem; margin-top:1.5rem; }
.bi-article .lead { font-size:1.15rem; color:#3b4252; }
.bi-article table { width:100%; }
.bi-article .bi-callout { border-left:4px solid var(--ria-red); background:#fff4f5; padding:.9rem 1.1rem; border-radius:.4rem; }
.bi-article .bi-tip { border-left:4px solid var(--bi-sea); background:#eef6fc; padding:.9rem 1.1rem; border-radius:.4rem; }

.bi-sidebar-sticky { position: sticky; top: 80px; }
@media (max-width: 991.98px) { .bi-sidebar-sticky { position: static; } }

.bi-honeypot { position:absolute; left:-9999px; top:-9999px; }

/* Amazon card */
.bi-shop-card { border:1px solid #b9dcf2; background:#f7fbff; }
.bi-shop-img { width:64px; height:64px; object-fit:contain; background:#fff; border:1px solid #eee; border-radius:.3rem; flex-shrink:0; }
.bi-shop-title { font-size:.9rem; font-weight:600; line-height:1.25; }
.bi-shop-price { font-size:1.05rem; font-weight:700; color:#0f4c81; margin-top:.25rem; }

/* Stat strip */
.bi-stat { background:#fff; border:1px solid #e6e2d8; border-radius:.75rem; padding:1rem 1.25rem; }
.bi-stat .num { font-family:'Poppins',sans-serif; font-weight:700; font-size:1.6rem; color: var(--bi-night); }
.bi-stat .lbl { font-size:.8rem; color:#6c757d; text-transform:uppercase; letter-spacing:.04em; }

/* Season banner (includes/season.php) */
.bi-season-banner { background: linear-gradient(90deg, #fff3dc, #fff8ea); border:1px solid #f0d9a0; border-radius:.6rem; padding:.8rem 1.1rem; margin-bottom:1.5rem; font-size:1.02rem; }
.bi-season-banner.muted { background:#f5f1e8; border-color:#e6e2d8; }
.bi-prevnext a { text-decoration:none; font-weight:600; }

/* Print: article only */
@media print {
  nav, footer, aside, .bi-prevnext, .btn, .bi-hero .btn, form { display:none !important; }
  main { padding:0 !important; }
  .bi-article { font-size:11pt; }
  a[href]::after { content:" (" attr(href) ")"; font-size:.85em; color:#555; }
  a[href^="/"]::after { content:" (raceplus.co.uk" attr(href) ")"; }
}

/* Site-wide "not the official site" strip */
.ria-notice { background:#fff4d6; color:#4a3b00; border-bottom:1px solid #f0dca0; }
.ria-notice a { color:#4a3b00; text-decoration:underline; margin-left:.35rem; }
.ria-official { border:1px solid #b9dcf2; background:#f2f9ff; border-radius:.6rem; padding:1rem 1.2rem; }

/* ── Race Plus theme (2026-11-12): track navy with amber, overriding the palette above ── */
:root {
  --bi-night: #14213d;
  --bi-night-deep: #0b1426;
  --bi-glow: #ffb703;
  --bi-glow-2: #ffd166;
  --bi-sea: #c2410c;
  --bi-ink: #1d2433;
  --bi-soft: #fff7e6;
  --ria-red: #e63946;
}
a { color: #0b4f8a; }
.btn-glow, .btn-glow:hover, .btn-glow:focus { color: #1a1300; }
.bi-brand-mark { background: radial-gradient(circle at 40% 35%, #fff, var(--bi-glow-2) 55%, var(--bi-glow)); color: #1a1300; box-shadow: 0 0 12px rgba(255,183,3,.5); }
.bi-hero { background: linear-gradient(160deg, #14213d 0%, #1f3a68 55%, #2a5a9a 100%); }
.bi-hero::before { background-image:
    repeating-linear-gradient(100deg, rgba(255,255,255,.05) 0 2px, transparent 2px 90px); }
.bi-hero::after { background: linear-gradient(180deg, transparent, rgba(255,183,3,.12)); }

/* Event lists in columns */
.rp-cols { columns: 2; column-gap: 2rem; padding-left: 1.1rem; }
.rp-cols li { break-inside: avoid; margin-bottom: .3rem; }
@media (max-width: 575.98px) { .rp-cols { columns: 1; } }

/* Pace tables, calculators and the pace band */
.rp-pace td, .rp-pace th { font-variant-numeric: tabular-nums; white-space: nowrap; }
.rp-num-sm { font-size: 1.05rem !important; line-height: 1.3; }
.rp-calc { border-left: 4px solid var(--bi-glow); }
.rp-formula { background: var(--bi-soft); border-radius: .5rem; padding: .75rem 1rem; }
.rp-band { max-width: 22rem; border: 2px dashed #9aa4b2; border-radius: .5rem; padding: .75rem; }
.rp-band-title { font-weight: 600; margin-bottom: .5rem; }
@media print {
  .navbar, footer, .ria-notice, .breadcrumb, aside, .bi-prevnext, .d-print-none { display: none !important; }
  .rp-band { border-style: solid; }
}
