/*
Theme Name: Best Bookmakers Rank
Author: TACTIC SOFTEC
Description: Free auto fixtures widgets, live clock, daily tip rotation, country-aware bookies. No paid API required.
Version: 4.4.0
Text Domain: best-bookmakers-rank
*/
:root{
  --bg:#0a0f0c;--card:#121a14;--text:#f2f7f3;--muted:#9bb0a3;
  --border:#1e2e24;--green:#22c55e;--lime:#a3e635;--gold:#fbbf24;
  --blue:#3b82f6;--red:#ef4444;--nav:rgba(10,15,12,.97);
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:Segoe UI,system-ui,sans-serif;background:var(--bg);color:var(--text);line-height:1.55;padding-bottom:76px}
a{color:var(--lime);text-decoration:none}a:hover{opacity:.92}
.wrap{width:min(1100px,94%);margin:0 auto}
.clockbar{background:#0d1510;border-bottom:1px solid var(--border);padding:8px 0;font-size:.82rem}
.clockbar-in{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;justify-content:space-between}
.clock-main{font-weight:900;color:var(--gold);font-variant-numeric:tabular-nums;font-size:1.05rem}
.clock-meta{color:var(--muted)}
.nav{position:sticky;top:0;z-index:60;background:var(--nav);border-bottom:1px solid var(--border);backdrop-filter:blur(10px)}
.nav-in{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between;padding:10px 0}
.logo{font-weight:900;color:#fff}.logo span{color:var(--green)}
.menu{display:flex;flex-wrap:wrap;gap:5px 9px;list-style:none;margin:0;padding:0;align-items:center}
.menu a{color:var(--muted);font-weight:700;font-size:.76rem}
.menu a:hover{color:var(--lime)}
.loc-pill{background:#15241a;border:1px solid #2a4a35;border-radius:999px;padding:4px 9px;font-size:.7rem;font-weight:700;color:var(--gold)}
.btn{display:inline-block;padding:10px 14px;border-radius:10px;font-weight:800;border:0;cursor:pointer;text-align:center;font-size:.88rem}
.btn-g{background:var(--green);color:#04140a}
.btn-y{background:var(--gold);color:#1a1200}
.btn-b{background:var(--blue);color:#fff}
.btn-outline{border:1px solid var(--border);background:transparent;color:var(--text)}
.btn-sm{padding:7px 11px;font-size:.78rem}
.hero{padding:40px 0 26px;background:radial-gradient(ellipse at 15% 0%,#143222 0%,transparent 50%),radial-gradient(ellipse at 90% 40%,#2a2208 0%,transparent 40%)}
.hero h1{font-size:clamp(1.5rem,4vw,2.35rem);line-height:1.15;margin:10px 0}
.hero h1 em{font-style:normal;color:var(--green)}
.hero p{color:var(--muted);max-width:640px}
.badge{display:inline-flex;background:#15241a;border:1px solid #2a4a35;border-radius:999px;padding:5px 10px;font-size:.74rem;font-weight:700;color:var(--gold)}
.btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
section{padding:36px 0;border-top:1px solid var(--border)}
section h2{margin:0 0 6px;font-size:1.3rem}
.sub{color:var(--muted);margin:0 0 14px;max-width:720px;font-size:.9rem}
.grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.grid-2{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px}
.card h3{margin:0 0 8px;color:var(--lime);font-size:.98rem}
.card p{margin:0;color:var(--muted);font-size:.88rem}
.book-grid{display:flex;flex-wrap:wrap;gap:12px}
.bcard{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:14px;display:flex;flex-direction:column;flex:1 1 250px}
.logo-box{background:#0d1510;border:1px solid var(--border);border-radius:12px;padding:12px;min-height:58px;display:flex;align-items:center;justify-content:center;margin-bottom:8px}
.brand{font-weight:900;font-size:1.15rem}
.brand-sporty{color:#1db954}.brand-betway{color:#00a826}.brand-1x{color:#86efac}
.grade{display:flex;gap:5px;flex-wrap:wrap;margin:6px 0}
.pill{border-radius:8px;padding:4px 8px;font-weight:800;font-size:.68rem}
.pill-a{background:rgba(34,197,94,.15);color:#4ade80;border:1px solid rgba(34,197,94,.35)}
.pill-hot{background:rgba(251,191,36,.12);color:var(--gold);border:1px solid rgba(251,191,36,.35)}
.stars{color:var(--gold)}
.bcard .btn{margin-top:8px;width:100%}
.tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.tab{padding:8px 12px;border-radius:999px;border:1px solid var(--border);background:#0d1510;color:var(--muted);font-weight:800;font-size:.8rem;cursor:pointer}
.tab.active{background:var(--green);color:#04140a;border-color:var(--green)}
.widget-frame{width:100%;min-height:520px;border:1px solid var(--border);border-radius:12px;background:#0d1510;overflow:hidden}
.widget-frame iframe{width:100%;height:560px;border:0;background:#fff}
.tip-card{border-left:3px solid var(--green);padding-left:10px}
.motd{background:linear-gradient(135deg,#15241a,#1a2a10);border:1px solid #2a4a35;border-radius:16px;padding:16px}
.table{width:100%;border-collapse:collapse;font-size:.84rem}
.table th,.table td{border-bottom:1px solid var(--border);padding:9px 6px;text-align:left}
.table th{color:var(--muted);font-size:.75rem}
.best{background:rgba(34,197,94,.18);color:#4ade80;font-weight:900;border-radius:6px;padding:2px 6px}
.won{color:#4ade80;font-weight:800}.lost{color:#f87171;font-weight:800}
.bar{height:10px;background:#0d1510;border-radius:99px;overflow:hidden;margin:8px 0}
.bar>i{display:block;height:100%;background:linear-gradient(90deg,var(--green),var(--lime))}
.calc input,.calc select,.code-box input{width:100%;padding:9px;border-radius:8px;border:1px solid var(--border);background:#0d1510;color:var(--text);margin:3px 0 8px}
.calc label{font-size:.8rem;color:var(--muted);font-weight:700}
.calc-out{font-size:1.2rem;font-weight:900;color:var(--gold);margin-top:6px}
.acca-item{display:flex;gap:8px;align-items:center;margin:5px 0;font-size:.88rem}
.sticky-bar{position:fixed;bottom:0;left:0;right:0;z-index:70;background:#0d1510f2;border-top:1px solid var(--border);padding:9px;backdrop-filter:blur(8px)}
.sticky-in{display:flex;gap:7px;justify-content:center;flex-wrap:wrap;max-width:1100px;margin:0 auto}
.footer{padding:24px;text-align:center;color:var(--muted);font-size:.82rem;border-top:1px solid var(--border)}
.faq details{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:11px 13px;margin:7px 0}
.faq summary{font-weight:800;cursor:pointer;color:#fff;font-size:.92rem}
.faq p{color:var(--muted);margin:7px 0 0;font-size:.86rem}
.auto-note{font-size:.75rem;color:var(--muted);margin-top:8px}
.code-row{display:flex;gap:8px;align-items:center}
.code-row input{flex:1;margin:0;padding:9px;border-radius:8px;border:1px solid var(--border);background:#0d1510;color:var(--text)}
.copy-ok{color:var(--green);font-size:.8rem;font-weight:700;display:none}

.widget-clean{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:#0d1510}
.widget-frame{position:relative}
.widget-frame iframe{background:#0b0f0c}

.highlights-grid{display:grid;gap:12px;grid-template-columns:1fr}
@media(min-width:860px){.highlights-grid{grid-template-columns:1fr 1fr}}
.widget-mobi iframe{height:640px;max-width:480px;margin:0 auto;display:block;width:100%}
.widget-mobi{display:flex;justify-content:center;background:#0a0f0c}

/* Crop external score site header/footer branding inside our frame */
.fs-crop{
  height:520px;
  overflow:hidden;
  position:relative;
  border-radius:14px;
  background:#0a0f0c;
}
.fs-crop .fs-iframe{
  position:absolute;
  top:-72px;          /* hide top logo/nav */
  left:50%;
  transform:translateX(-50%);
  width:110%;         /* slight side crop */
  max-width:1200px;
  height:640px;       /* taller so bottom still fills after top crop */
  border:0;
  display:block;
  background:#0a0f0c;
  pointer-events:auto;
}
.fs-crop::before,
.fs-crop::after{
  content:"";
  position:absolute;
  left:0;right:0;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(to bottom, #0a0f0c, transparent);
}
.fs-crop::before{top:0;height:18px}
.fs-crop::after{
  bottom:0;height:28px;
  background:linear-gradient(to top, #0a0f0c, transparent);
}
@media(max-width:700px){
  .fs-crop{height:440px}
  .fs-crop .fs-iframe{top:-64px;height:560px;width:120%}
}

/* Crop Flashscore top chrome/ads */
.widget-crop{position:relative;height:560px;overflow:hidden;border:1px solid var(--border);border-radius:12px;background:#0d1510}
.widget-crop iframe{position:absolute;left:0;width:1px;min-width:100%;border:0;background:#fff}
.widget-crop.fs iframe{top:-132px;height:720px}
.widget-crop.hl iframe{top:0;height:560px;width:100%}

/* Live feel animations */
@keyframes pulseGlow{0%,100%{box-shadow:0 0 0 0 rgba(34,197,94,.45)}50%{box-shadow:0 0 0 10px rgba(34,197,94,0)}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes shimmer{0%{background-position:0% 50%}100%{background-position:200% 50%}}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes liveDot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.75)}}
@keyframes borderRun{to{background-position:200% 0}}

.live-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#ef4444;margin-right:6px;animation:liveDot 1.2s ease-in-out infinite}
.anim-float{animation:floaty 3.2s ease-in-out infinite}
.btn{transition:transform .2s,box-shadow .2s,filter .2s}
.btn:hover{transform:translateY(-2px);filter:brightness(1.06)}
.btn-g{animation:pulseGlow 2.8s ease-in-out infinite}
.bcard,.card,.motd{animation:fadeUp .7s ease both}
.bcard:nth-child(2){animation-delay:.08s}
.bcard:nth-child(3){animation-delay:.16s}
.hero h1 em{
  background:linear-gradient(90deg,#22c55e,#a3e635,#fbbf24,#22c55e);
  background-size:200% auto;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:shimmer 4s linear infinite;
}
.clock-main{animation:pulseGlow 3s ease-in-out infinite;border-radius:8px;padding:2px 8px}
.line-live{height:2px;border:0;margin:18px 0;background:linear-gradient(90deg,transparent,#22c55e,#fbbf24,#22c55e,transparent);background-size:200% 100%;animation:borderRun 3s linear infinite}
.tab.active{animation:pulseGlow 2.4s ease-in-out infinite}
.sticky-bar .btn{animation:none}
.sticky-bar .btn-g{animation:pulseGlow 3s ease-in-out infinite}

/* ===== v4.3 solid score frames (fix broken crop) ===== */
.widget-frame,
.widget-crop,
.widget-crop.fs,
.widget-crop.hl{
  position:relative !important;
  width:100% !important;
  max-width:100% !important;
  height:640px !important;
  min-height:640px !important;
  overflow:hidden !important;
  border:1px solid var(--border) !important;
  border-radius:14px !important;
  background:#0d1510 !important;
  display:block !important;
}
.widget-frame iframe,
.widget-crop iframe,
.widget-crop.fs iframe,
.widget-crop.hl iframe{
  position:absolute !important;
  left:0 !important;
  width:100% !important;
  min-width:100% !important;
  max-width:none !important;
  border:0 !important;
  background:#fff !important;
  display:block !important;
}
/* Mild top crop only for Flashscore — keep content visible */
.widget-crop.fs iframe{
  top:-72px !important;
  height:720px !important;
}
/* Highlights: no crop, full visible player */
.widget-crop.hl iframe,
.widget-frame iframe{
  top:0 !important;
  height:640px !important;
}
#scores .wrap{max-width:1100px}
#scores .score-panel{width:100%}