/* Banano Sports Pools — v5 styling for content pages (Roadmap, Feedback, Terms).
   Layered AFTER modern.css so equal-specificity rules win; !important only where
   Bootstrap/Bootswatch utilities (.bg-primary, .text-white) force it. Content unchanged. */
:root{
  --v5-brand:#FFC400;--v5-brand2:#FFA000;--v5-ink:#0c1726;--v5-surface:#fff;--v5-surface2:#f4f6fa;
  --v5-text:#16202e;--v5-muted:#64748b;--v5-border:#e6eaf0;
  --v5-sh:0 6px 24px rgba(16,30,54,.08);--v5-sh2:0 16px 40px rgba(16,30,54,.16);
}
body.dark-mode{
  --v5-surface:#101f33;--v5-surface2:#0a1626;--v5-text:#e7eef7;--v5-muted:#94a8c2;--v5-border:#22344c;
  --v5-sh:0 6px 24px rgba(0,0,0,.35);--v5-sh2:0 16px 40px rgba(0,0,0,.5);
}

body{font-family:'Inter',system-ui,-apple-system,sans-serif;color:var(--v5-text)}
h1,h2,h3,h4,h5,h6{font-family:'Inter',system-ui,-apple-system,sans-serif}

/* ---- hero ---- */
.jumbotron{background:linear-gradient(135deg,#16202e 0%,#0c1726 100%)!important;color:#fff;
  border-radius:0 0 20px 20px;box-shadow:var(--v5-sh);position:relative;overflow:hidden}
.jumbotron::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;
  background:linear-gradient(90deg,var(--v5-brand),var(--v5-brand2))}
.jumbotron h1{font-weight:900;letter-spacing:-.02em;color:#fff!important}
.jumbotron .lead{color:#cdd9e8!important}

/* standalone section headings (e.g. "Roadmap", "Release Notes") — exclude the hero */
.container-fluid:not(.jumbotron) > .row > .col-md-12 > h1{font-weight:900;letter-spacing:-.02em;color:var(--v5-text)}

/* ---- cards (generic + roadmap/release/feedback) ---- */
.card,.roadmap-card,.release-card{background:var(--v5-surface)!important;border:1px solid var(--v5-border)!important;
  border-radius:16px!important;box-shadow:var(--v5-sh)!important;color:var(--v5-text);overflow:hidden;transition:box-shadow .18s,transform .18s}
.roadmap-card:hover,.release-card:hover{box-shadow:var(--v5-sh2)!important}

/* headers — unify the slate/blue/info variants into navy + a gold accent */
.card .card-header,.roadmap-card .card-header,.release-card .card-header{
  background:linear-gradient(135deg,#16202e 0%,#0c1726 100%)!important;color:#fff!important;
  border-bottom:3px solid var(--v5-brand)!important;padding:14px 20px}
.card .card-header h4,.card .card-header h5,
.roadmap-card .card-header h4,.release-card .card-header h4{color:#fff!important;font-weight:800}
.card .card-header i,.roadmap-card .card-header i,.release-card .card-header i{color:var(--v5-brand)}

/* bodies + text (token-based so dark mode works) */
.card .card-body,.roadmap-card .card-body,.release-card .card-body{background:var(--v5-surface)!important;color:var(--v5-text);padding:20px 22px}
.card .card-body p,.card .card-body li,.card .card-body h3,
.roadmap-card .card-body li,.release-card .card-body li{color:var(--v5-text)}
.card .card-body small,.card .card-body .text-muted{color:var(--v5-muted)!important}
.card .card-body a,.roadmap-card .card-body a,.release-card .card-body a{color:var(--v5-brand2);font-weight:600;text-decoration:none}
.card .card-body a:hover,.release-card .card-body a:hover{text-decoration:underline}

/* ---- buttons ---- */
.btn-primary,.jumbotron .btn{background:linear-gradient(135deg,var(--v5-brand),var(--v5-brand2))!important;
  border:none!important;color:var(--v5-ink)!important;font-weight:700;border-radius:10px}
.btn-primary:hover,.jumbotron .btn:hover{box-shadow:0 6px 16px rgba(255,164,0,.35)!important;color:var(--v5-ink)!important}

/* ---- forms (feedback) ---- */
.form-control,select.form-control,textarea.form-control{border:1.5px solid var(--v5-border)!important;border-radius:10px!important;
  background:var(--v5-surface)!important;color:var(--v5-text)!important;font-family:inherit}
.form-control:focus,select.form-control:focus,textarea.form-control:focus{border-color:var(--v5-brand)!important;box-shadow:0 0 0 3px rgba(255,196,0,.22)!important}
label{font-weight:600;color:var(--v5-text)}

/* ---- info + donation cards ---- */
.info-card,.donation-card{background:var(--v5-surface)!important;border:1px solid var(--v5-border)!important;
  border-radius:16px!important;box-shadow:var(--v5-sh)!important;color:var(--v5-text)}
.info-card h5,.donation-card h5{font-weight:800;color:var(--v5-text)}
.info-card p{color:var(--v5-muted)}
