/*
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:" (romfordicearena.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; }