/*
Theme Name: BetBanksy Child
Theme URI: https://www.betbanksy.com
Description: Child theme of Astra for BetBanksy — native dark crypto-betting design. Built for the bettor.
Author: BetBanksy
Template: astra
Version: 1.0.0
Text Domain: betbanksy-child
*/

/* ============================================================
   BETBANKSY DESIGN TOKENS (real platform values)
   ============================================================ */
:root{
  --bb-bg:#150f0a;
  --bb-bg-2:#0e0a06;
  --bb-card:#241c12;
  --bb-card-2:#2e2417;
  --bb-line:#3c3224;
  --bb-gold:#D4AF37;
  --bb-gold-bright:#E8B84B;
  --bb-gold-deep:#C9A227;
  --bb-gold-title:#a07c30;
  --bb-silver:#8E908F;
  --bb-paper:#F5F0E6;
  --bb-muted:#9a8f7d;
  --bb-text:#E4DDCE;
  --bb-green:#2E7D54;
  --bb-green-soft:#3FB37F;
  --bb-red:#d9745f;
}

/* ============================================================
   GLOBAL: dark background everywhere, native (no !important wars)
   ============================================================ */
body,
.site,
.ast-container,
#content,
.site-content{
  background:var(--bb-bg);
  color:var(--bb-paper);
}

body{
  background:radial-gradient(900px 460px at 78% -8%, rgba(232,184,75,.08), transparent 60%),
             linear-gradient(180deg, var(--bb-bg), var(--bb-bg-2));
  font-family:ProximaNova,"Proxima Nova","Helvetica Neue",Helvetica,Arial,sans-serif;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

/* Remove Astra's white content boxes / entry padding */
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single,
.ast-separate-container #primary,
.ast-plain-container.ast-no-sidebar #primary{
  background:transparent;
  padding:0;
}
.ast-separate-container{background:transparent}

/* Kill the auto page title + meta Astra adds (we use our own hero) */
.bb-page .entry-title,
.single .entry-header.ast-no-thumbnail,
.page .entry-header{display:none}

/* Links default gold */
a{color:var(--bb-gold)}
a:hover{color:var(--bb-gold-bright)}

/* Container full width for our pages */
.bb-page{
  max-width:none;
  margin:0;
  color:var(--bb-paper);
}

/* ============================================================
   CONTENT PAGE STYLES (.bb-page) — native, used by all pages
   ============================================================ */
.bb-page *{box-sizing:border-box}
.bb-page .wrap{max-width:880px;margin:0 auto;padding:0 20px}
.bb-page .hero{padding:54px 0 40px;border-bottom:1px solid var(--bb-line)}
.bb-page .eyebrow{font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--bb-gold);font-weight:700;margin-bottom:14px}
.bb-page h1{font-size:clamp(28px,5vw,44px);line-height:1.1;font-weight:800;letter-spacing:-.01em;margin-bottom:16px;color:var(--bb-paper)}
.bb-page h1 .accent{color:var(--bb-gold)}
.bb-page .lede{font-size:clamp(16px,2.4vw,19px);color:var(--bb-muted);max-width:660px}
.bb-page section{padding:38px 0}
.bb-page h2{font-size:clamp(22px,3.4vw,29px);font-weight:800;letter-spacing:-.01em;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--bb-line);color:var(--bb-gold)}
.bb-page h3{font-size:19px;font-weight:700;margin:22px 0 8px;color:var(--bb-paper)}
.bb-page p{margin-bottom:14px;color:var(--bb-text)}
.bb-page .muted{color:var(--bb-muted)}
.bb-page strong{color:#fff}

/* CTA buttons */
.bb-page .cta{
  display:inline-block;
  background:linear-gradient(180deg,rgba(212,175,55,.18),rgba(60,50,36,.4));
  border:1px solid var(--bb-gold);
  color:var(--bb-gold-bright);
  font-weight:800;font-size:16px;text-decoration:none;
  padding:13px 26px;border-radius:8px;
  transition:transform .15s ease,box-shadow .15s ease,background .15s ease;
}
.bb-page .cta:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(212,175,55,.18);background:linear-gradient(180deg,rgba(232,184,75,.28),rgba(60,50,36,.5))}
.bb-page .cta.solid{background:linear-gradient(180deg,var(--bb-gold-bright),var(--bb-gold-deep));color:#1a1205;border-color:var(--bb-gold-bright)}
.bb-page .cta.solid:hover{box-shadow:0 12px 26px rgba(232,184,75,.3)}
.bb-page .cta-row{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-top:22px}
.bb-page .cta-note{font-size:12px;color:var(--bb-muted)}

/* Inline links */
.bb-page a.inline{color:var(--bb-gold);text-decoration:none;border-bottom:1px solid rgba(212,175,55,.4)}
.bb-page a.inline:hover{border-color:var(--bb-gold)}

/* Numbered steps */
.bb-page ol.steps{list-style:none;counter-reset:s;margin:10px 0 6px;padding:0}
.bb-page ol.steps li{counter-increment:s;position:relative;padding:12px 0 12px 52px;border-bottom:1px solid var(--bb-line);color:var(--bb-text)}
.bb-page ol.steps li:last-child{border-bottom:0}
.bb-page ol.steps li::before{content:counter(s);position:absolute;left:0;top:11px;width:32px;height:32px;border-radius:50%;background:rgba(212,175,55,.14);border:1px solid rgba(212,175,55,.3);color:var(--bb-gold);font-weight:800;display:flex;align-items:center;justify-content:center;font-size:15px}
.bb-page ol.steps li strong{color:#fff}

/* Cards grid */
.bb-page .grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:8px}
.bb-page .card{background:linear-gradient(180deg,var(--bb-card-2),var(--bb-card));border:1px solid var(--bb-line);border-radius:12px;padding:20px}
.bb-page .card h3{margin-top:0;font-size:17px;color:var(--bb-gold)}
.bb-page .card p{font-size:14px;margin:0;color:var(--bb-muted)}

/* Callouts */
.bb-page .callout{background:linear-gradient(180deg,var(--bb-card-2),var(--bb-card));border:1px solid var(--bb-line);border-left:4px solid var(--bb-gold);border-radius:10px;padding:18px 20px;margin:18px 0}
.bb-page .callout .t{font-weight:800;color:var(--bb-gold);margin-bottom:6px;font-size:15px}
.bb-page .callout p{margin:0;color:var(--bb-muted);font-size:15px}
.bb-page .callout.tip{border-left-color:var(--bb-green-soft)}
.bb-page .callout.tip .t{color:var(--bb-green-soft)}

/* Tables */
.bb-page .table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:12px;border:1px solid var(--bb-line);margin:8px 0}
.bb-page table{border-collapse:collapse;width:100%;min-width:520px;font-size:15px}
.bb-page thead th{background:#1b140d;text-align:left;padding:13px 16px;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--bb-muted);border-bottom:1px solid var(--bb-line);white-space:nowrap}
.bb-page tbody td{padding:13px 16px;border-bottom:1px solid var(--bb-line);color:var(--bb-text)}
.bb-page tbody tr:last-child td{border-bottom:0}
.bb-page tbody td:first-child{color:#fff;font-weight:600}

/* FAQ accordion */
.bb-page .faq{border-top:1px solid var(--bb-line)}
.bb-page .faq details{border-bottom:1px solid var(--bb-line)}
.bb-page .faq summary{list-style:none;cursor:pointer;padding:18px 40px 18px 0;position:relative;font-weight:700;color:#fff;font-size:16px}
.bb-page .faq summary::-webkit-details-marker{display:none}
.bb-page .faq summary::after{content:"+";position:absolute;right:6px;top:16px;color:var(--bb-gold);font-size:22px;font-weight:400}
.bb-page .faq details[open] summary::after{content:"\2013"}
.bb-page .faq details p{padding:0 0 18px;color:var(--bb-muted);font-size:15px}

/* Responsible gambling / disclaimer footer block */
.bb-page .rg{margin-top:30px;padding:18px 0 50px;border-top:1px solid var(--bb-line);color:var(--bb-muted);font-size:13px}
.bb-page .rg strong{color:var(--bb-paper)}

/* Mobile */
@media (max-width:640px){
  .bb-page .grid{grid-template-columns:1fr}
}


/* ============================================================
   PAGE-SPECIFIC COMPONENTS
   (jetx hero cards, review boxes, comparison tables, login pages)
   ============================================================ */
.bb-page .prob{background:linear-gradient(180deg,var(--bb-card-2),var(--bb-card));border:1px solid var(--bb-line);border-radius:12px;padding:18px 20px;margin-bottom:14px}
.bb-page .prob h3{margin:0 0 6px;font-size:17px;color:var(--bb-gold)}
.bb-page .prob p{margin:0;font-size:15px;color:var(--bb-muted)}
.bb-page .faq .a{padding:0 18px 16px;color:var(--bb-muted);font-size:15px}
.bb-page .final{background: radial-gradient(700px 300px at 50% 120%, rgba(232,184,75,.16), transparent 60%), var(--bb-card-2); border:1px solid var(--bb-gold-deep);border-radius:16px; padding:36px 28px;text-align:center;margin:8px 0;}
.bb-page .final h2{border:0;padding:0;margin-bottom:10px}
.bb-page .final p{max-width:520px;margin:0 auto 22px}
.bb-page .disc{font-size:12px;color:var(--bb-muted);margin-top:14px;font-style:italic}
.bb-page .herocard{margin-top:26px; background: radial-gradient(600px 240px at 85% 0%, rgba(232,184,75,.16), transparent 60%), linear-gradient(180deg,var(--bb-card-2),var(--bb-card)); border:1px solid var(--bb-line);border-radius:14px;padding:24px; box-shadow:0 10px 34px rgba(0,0,0,.4);}
.bb-page .badge{display:inline-block;background:var(--bb-green);color:#fff;font-size:12px;font-weight:700;letter-spacing:.04em;padding:4px 12px;border-radius:999px;margin-bottom:12px}
.bb-page .herocard h2{font-size:23px;border:0;padding:0;margin:0 0 8px}
.bb-page .herocard h2 .g{color:var(--bb-gold-bright)}
.bb-page .herocard p{color:var(--bb-muted);font-size:15px;margin-bottom:0}
.bb-page .step-n{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:rgba(212,175,55,.14);color:var(--bb-gold);font-weight:800;font-size:15px;margin-bottom:10px;border:1px solid rgba(212,175,55,.3)}
.bb-page tbody tr:last-child td{border-bottom:0}
.bb-page tbody td:first-child{font-weight:700;color:var(--bb-paper);white-space:nowrap}
.bb-page .related{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px}
.bb-page .related a{flex:1;min-width:220px;background:linear-gradient(180deg,var(--bb-card-2),var(--bb-card));border:1px solid var(--bb-line);border-radius:10px;padding:16px 18px;text-decoration:none;transition:border-color .15s ease}
.bb-page .related a:hover{border-color:var(--bb-gold)}
.bb-page .related .k{color:var(--bb-gold);font-weight:800;font-size:16px;display:block;margin-bottom:3px}
.bb-page .related .d{color:var(--bb-muted);font-size:13px}
.bb-page .updated{margin-top:20px;font-size:13px;color:var(--bb-muted)}
.bb-page .updated strong{color:var(--bb-paper)}
.bb-page .verdict{margin:28px 0 0; background:linear-gradient(180deg,var(--bb-card-2),#10151c); border:1px solid var(--bb-gold-deep); border-radius:14px;padding:24px; box-shadow:0 8px 30px rgba(0,0,0,.35);}
.bb-page .verdict .label{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--bb-gold);font-weight:700}
.bb-page .verdict h2{font-size:22px;margin:6px 0 10px;border:0;padding:0}
.bb-page .verdict p{color:var(--bb-muted);font-size:15px;margin-bottom:18px}
.bb-page .cta.small{font-size:14px;padding:10px 18px}
.bb-page .rank{font-weight:800;color:var(--bb-gold);font-size:16px;width:38px}
.bb-page .site{font-weight:700;white-space:nowrap}
.bb-page .site .tag{display:block;font-size:12px;font-weight:600;color:var(--bb-gold);letter-spacing:.02em}
.bb-page .row-top{background:linear-gradient(90deg,rgba(232,184,75,.10),transparent 70%)}
.bb-page .row-top td{border-bottom:1px solid rgba(232,184,75,.25)}
.bb-page .yes{color:var(--bb-green);font-weight:700}
.bb-page .no{color:var(--bb-red);font-weight:700}
.bb-page .pill{display:inline-block;font-size:12px;font-weight:700;padding:3px 9px;border-radius:999px;background:rgba(63,179,127,.14);color:var(--bb-green)}
.bb-page .pill.slow{background:rgba(224,106,90,.14);color:var(--bb-red)}
.bb-page .pill.mid{background:rgba(232,184,75,.14);color:var(--bb-gold)}
.bb-page .card .ic{font-size:20px;margin-bottom:8px;color:var(--bb-gold)}

/* === Scoate underline de pe butoane (Astra il pune pe linkuri) === */
.bb-page .cta,
.bb-page .cta:hover,
.bb-page .cta:focus,
.bb-page a.cta,
.bb-page .related a,
.bb-page .related a:hover{
  text-decoration:none !important;
}


/* ============================================================
   SITE LAYOUT: header (topbar) + sidebar + footer
   ============================================================ */

  /* ============================================
     BETBANKSY WORDPRESS LAYOUT
     Header + Sidebar + Footer matching platform
     Colors extracted from real platform:
     - bg main/header: #181818
     - sidebar: #2a2a2a / #1d1d1f
     - gold: #D4AF37 / #E8B84B
     - text: #f5f0e6 / muted #9a9a9a
     ============================================ */
  
  
  body{
    background:var(--bg);
    color:var(--paper);
    font-family:ProximaNova,"Proxima Nova","Helvetica Neue",Helvetica,Arial,sans-serif;
    line-height:1.6;-webkit-font-smoothing:antialiased;
  }
  a{text-decoration:none;color:inherit}

  /* ====== TOP BAR ====== */
  .bb-topbar{
    position:sticky;top:0;z-index:100;
    display:flex;align-items:center;justify-content:space-between;
    height:60px;padding:0 18px;
    background:var(--topbar);border-bottom:1px solid var(--line);
  }
  .bb-topbar-left{display:flex;align-items:center;gap:16px}
  .bb-burger{
    display:flex;align-items:center;justify-content:center;
    width:38px;height:38px;border:1px solid var(--line);border-radius:6px;
    background:#1c1c1c;color:var(--gold);cursor:pointer;font-size:18px;
  }
  .bb-logo{font-size:22px;font-weight:700;letter-spacing:.02em;white-space:nowrap}
  .bb-logo .bet{color:var(--silver)}
  .bb-logo .banksy{color:var(--gold)}
  .bb-topbar-right{display:flex;align-items:center;gap:10px}
  .bb-search{
    width:40px;height:40px;border:none;border-radius:8px;
    background:#262626;color:#e0e0e0;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:17px;
  }
  .bb-search:hover{background:#303030}
  .bb-btn{
    padding:9px 18px;border-radius:7px;font-weight:700;font-size:14px;cursor:pointer;
    border:1px solid var(--gold);white-space:nowrap;transition:all .15s ease;
    color:#ffffff;
  }
  .bb-btn-signup{
    background:#DFAB70;color:#2a1f0e;
  }
  .bb-btn-signup:hover{background:#e8b984}
  .bb-btn-login{background:linear-gradient(180deg, #2a2208, #1a1404)}
  .bb-btn-login:hover{background:linear-gradient(180deg, #36300f, #221a06)}

  /* ====== LAYOUT ====== */
  .bb-layout{display:flex;min-height:calc(100vh - 60px)}

  /* ====== SIDEBAR ====== */
  .bb-sidebar{
    width:248px;flex-shrink:0;background:var(--sidebar);
    border-right:1px solid var(--line);padding:12px 10px;overflow-y:auto;
  }
  /* Promo banner top */
  .bb-promo{
    width:100%;height:88px;border-radius:10px;margin-bottom:14px;
    background:linear-gradient(120deg,#3a2a14,#1a120a);
    display:flex;align-items:center;justify-content:center;
    color:var(--gold);font-size:13px;font-weight:600;overflow:hidden;
  }
  /* All nav items: WHITE BOLD text, icon left */
  .bb-nav-item{
    display:flex;align-items:center;gap:13px;padding:11px 14px;
    color:#ffffff;font-size:15px;font-weight:700;cursor:pointer;
    border-radius:8px;transition:background .15s ease;position:relative;
  }
  .bb-nav-item .ic{
    width:22px;text-align:center;color:#e0e0e0;font-size:16px;flex-shrink:0;
    filter:grayscale(1) brightness(1.6);
  }
  /* HOVER + ACTIVE: gold #DFAB70 solid to 30%, gradual fade to black at 100% */
  .bb-nav-item:hover{
    background:linear-gradient(90deg, #DFAB70 0%, #DFAB70 15%, #000000 55%, #000000 100%);
  }
  .bb-nav-item.active{
    background:linear-gradient(90deg, #DFAB70 0%, #DFAB70 15%, #000000 55%, #000000 100%);
  }
  .bb-nav-item.active .ic{color:#2a1f0e}
  /* Grouped cards (Sports, Casino) - lighter bg container */
  .bb-nav-card{
    background:var(--sidebar-hover);border-radius:12px;
    padding:4px;margin-bottom:10px;
  }
  .bb-nav-group{
    display:flex;align-items:center;justify-content:space-between;
    padding:11px 14px;color:#ffffff;font-size:15px;font-weight:700;cursor:pointer;
    border-radius:8px;
  }
  .bb-nav-group .left{display:flex;align-items:center;gap:13px}
  .bb-nav-group .left .ic{width:22px;text-align:center;color:#e0e0e0;font-size:16px;filter:grayscale(1) brightness(1.6)}
  .bb-nav-group .arrow{color:#9a9a9a;font-size:11px;transition:transform .2s ease}
  .bb-nav-group:hover{
    background:linear-gradient(90deg, #DFAB70 0%, #DFAB70 15%, #000000 55%, #000000 100%);
  }
  .bb-nav-sub .bb-nav-item{font-size:14px;font-weight:700;color:#ffffff}
  /* Standalone items each on subtle card */
  .bb-nav-standalone{
    background:var(--sidebar-hover);border-radius:10px;margin-bottom:8px;
  }
  .bb-section-title{color:var(--gold-title);font-size:25px;font-weight:600;padding:16px 14px}

  /* ====== CONTENT ====== */
  .bb-content{flex:1;min-width:0;padding:0}
  /* The WordPress page content (your articles) renders inside .bb-content */

  /* ====== FOOTER ====== */
  .bb-footer{background:var(--topbar);border-top:1px solid var(--line);padding:0}
  .bb-crypto{
    display:flex;align-items:center;justify-content:center;gap:34px;flex-wrap:wrap;
    padding:22px;border-bottom:1px solid var(--line);
  }
  .bb-crypto span{color:#5a5a5a;font-size:14px;font-weight:700;opacity:.7}
  .bb-footer-main{max-width:1100px;margin:0 auto;padding:34px 22px;display:flex;gap:40px;flex-wrap:wrap}
  .bb-footer-brand{flex:1;min-width:220px}
  .bb-footer-brand .bb-logo{font-size:24px;margin-bottom:10px}
  .bb-footer-tag{color:var(--muted);font-size:14px;max-width:240px}
  .bb-footer-cols{display:flex;gap:36px;flex-wrap:wrap}
  .bb-footer-col h4{color:var(--paper);font-size:15px;font-weight:600;margin-bottom:12px}
  .bb-footer-col a{display:block;color:var(--muted);font-size:13px;padding:3px 0;transition:color .12s ease}
  .bb-footer-col a:hover{color:var(--gold)}
  .bb-footer-legal{
    max-width:1100px;margin:0 auto;padding:18px 22px;border-top:1px solid var(--line);
    text-align:center;color:#6a6a6a;font-size:12px;line-height:1.6;
  }
  .bb-footer-copy{text-align:center;padding:14px;color:var(--muted);font-size:13px;border-top:1px solid var(--line)}

  /* ====== MOBILE ====== */
  .bb-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:90}
  @media (max-width:900px){
    .bb-sidebar{
      position:fixed;top:60px;left:0;bottom:0;z-index:95;
      transform:translateX(-100%);transition:transform .25s ease;
    }
    .bb-sidebar.open{transform:translateX(0)}
    .bb-overlay.show{display:block}
    .bb-btn-login{display:none}
    .bb-footer-main{flex-direction:column;gap:24px}
    .bb-crypto{gap:18px}
  }

/* === Integrare layout cu Astra content === */
.bb-content{flex:1;min-width:0}
.bb-content .ast-container,
.bb-content #content,
.bb-content .site-content{background:transparent;padding:0;max-width:none}
/* .bb-page (paginile de continut) umple zona de content */
.bb-content .bb-page{width:100%}
/* Ascund header/footer Astra default (folosim ale noastre) */
.site-header, .ast-primary-header-bar, .main-header-bar,
.site-footer, .ast-small-footer, .footer-adv{display:none !important}
/* Body fara padding ca layout-ul nostru sa lipeasca de margini */
body.ast-separate-container .site-content{padding:0}

/* === FORCE DARK: layout background peste Astra === */
html, body,
.site, #page, #content, .site-content,
.ast-container, .ast-separate-container,
.ast-separate-container .ast-article-single,
#primary, .entry-content, .ast-article-post{
  background:#150f0a !important;
  background-color:#150f0a !important;
}
body{
  background:radial-gradient(900px 460px at 78% -8%, rgba(232,184,75,.08), transparent 60%),linear-gradient(180deg,#150f0a,#0e0a06) !important;
  color:#F5F0E6 !important;
}
/* Sidebar fundal + text alb bold */
.bb-sidebar{background:#1e1e1e !important}
.bb-sidebar .bb-nav-item,
.bb-sidebar .bb-nav-group{color:#ffffff !important}
.bb-nav-card{background:#2a2a2a !important}
.bb-nav-standalone{background:#2a2a2a !important}
/* Topbar fundal */
.bb-topbar{background:#141414 !important}
.bb-content{background:transparent !important}
/* Footer fundal */
.bb-footer{background:#141414 !important}

/* === Promo banner welcome bonus (auriu) === */
.bb-promo{
  background:linear-gradient(135deg,#E8B84B,#C9A227) !important;
  border:none !important;
  border-radius:10px;margin-bottom:14px;
  box-shadow:0 4px 14px rgba(232,184,75,.25);
  transition:transform .15s ease;
}
.bb-promo:hover{transform:translateY(-2px)}

/* === Logo imagine === */
.bb-logo-img{height:28px;width:auto;max-width:160px;display:block}
.bb-footer .bb-logo-img{height:30px;width:auto;margin-bottom:10px}

/* ============================================================
   DAILY PREDICTIONS (.bb-page .pred-*)
   ============================================================ */
.bb-page .pred-date{display:inline-block;background:rgba(212,175,55,.14);border:1px solid rgba(212,175,55,.3);color:var(--bb-gold);font-weight:800;font-size:13px;letter-spacing:.06em;text-transform:uppercase;padding:7px 16px;border-radius:999px;margin-bottom:8px}
.bb-page .pred-card{background:linear-gradient(180deg,var(--bb-card-2),var(--bb-card));border:1px solid var(--bb-line);border-radius:14px;padding:20px 22px;margin:16px 0}
.bb-page .pred-top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.bb-page .pred-league{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--bb-muted);font-weight:700}
.bb-page .pred-time{font-size:12px;color:var(--bb-muted);font-weight:600;white-space:nowrap}
.bb-page .pred-match{font-size:20px;font-weight:800;color:#fff;margin:2px 0 12px;line-height:1.25}
.bb-page .pred-pick-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.bb-page .pred-pick{display:inline-flex;align-items:center;gap:8px;background:rgba(63,179,127,.12);border:1px solid rgba(63,179,127,.4);color:var(--bb-green-soft);font-weight:800;font-size:15px;padding:8px 16px;border-radius:8px}
.bb-page .pred-pick .lbl{font-size:11px;color:var(--bb-muted);font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.bb-page .pred-odds{font-size:13px;color:var(--bb-muted);font-weight:600}
.bb-page .pred-reason{font-size:14px;color:var(--bb-text);margin-bottom:14px;line-height:1.55}
.bb-page .pred-conf{display:inline-block;font-size:12px;font-weight:700;padding:3px 10px;border-radius:6px;margin-left:6px}
.bb-page .pred-conf.high{background:rgba(63,179,127,.15);color:var(--bb-green-soft);border:1px solid rgba(63,179,127,.35)}
.bb-page .pred-conf.med{background:rgba(232,184,75,.14);color:var(--bb-gold-bright);border:1px solid rgba(232,184,75,.35)}
.bb-page .pred-conf.low{background:rgba(217,116,95,.14);color:var(--bb-red);border:1px solid rgba(217,116,95,.35)}
.bb-page a.pred-cta{display:inline-block;background:linear-gradient(180deg,var(--bb-gold-bright),var(--bb-gold-deep));color:#1a1205;font-weight:800;font-size:14px;text-decoration:none;padding:11px 22px;border-radius:8px;transition:transform .15s ease,box-shadow .15s ease}
.bb-page a.pred-cta:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(232,184,75,.28)}
.bb-page .pred-disclaimer{background:rgba(217,116,95,.08);border:1px solid rgba(217,116,95,.25);border-radius:10px;padding:14px 18px;margin:18px 0;font-size:13px;color:var(--bb-muted)}
.bb-page .pred-disclaimer strong{color:var(--bb-paper)}

/* ============================================================
   PREDICTIONS RESULTS / TRACK RECORD
   ============================================================ */
.bb-page .pred-stats{display:flex;gap:12px;flex-wrap:wrap;margin:8px 0 20px}
.bb-page .pred-stat{flex:1;min-width:90px;background:linear-gradient(180deg,var(--bb-card-2),var(--bb-card));border:1px solid var(--bb-line);border-radius:12px;padding:16px 12px;text-align:center}
.bb-page .pred-stat .num{display:block;font-size:28px;font-weight:900;color:var(--bb-paper);line-height:1}
.bb-page .pred-stat .num.won{color:var(--bb-green-soft)}
.bb-page .pred-stat .num.lost{color:var(--bb-red)}
.bb-page .pred-stat .num.rate{color:var(--bb-gold-bright)}
.bb-page .pred-stat .lab{display:block;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--bb-muted);font-weight:700;margin-top:6px}
.bb-page .pred-card.result-won{border-left:4px solid var(--bb-green-soft)}
.bb-page .pred-card.result-lost{border-left:4px solid var(--bb-red);opacity:.85}

/* === Articles pagination === */
.bb-page .bb-pagination{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:30px}
.bb-page .bb-page-link{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 10px;border:1px solid var(--bb-line);border-radius:8px;color:var(--bb-text);text-decoration:none;font-weight:700;background:var(--bb-card)}
.bb-page .bb-page-link:hover{border-color:var(--bb-gold);color:var(--bb-gold)}
.bb-page .bb-page-link.active{background:linear-gradient(180deg,var(--bb-gold-bright),var(--bb-gold-deep));color:#1a1205;border-color:var(--bb-gold-bright)}

/* === Upcoming predictions: day headers === */
.bb-page .bb-day-head{font-size:18px;font-weight:800;color:var(--bb-gold);margin:26px 0 4px;padding-bottom:8px;border-bottom:1px solid var(--bb-line);letter-spacing:.01em}
.bb-page .bb-day-head:first-child{margin-top:4px}