/**
 * Sidebar recenzie „Casino HUB v2" + TOC (stil metodologie) + pills mobil.
 * Scop: .czhs (sidebar), .czhs-toc (cuprins), .czhs-pills (bara mobil fixă).
 * Tokenii sunt locali ca să nu depindem de editorial-page.css.
 */
/* Coloana se întinde pe înălțimea articolului (rândul e flex, stretch),
   iar .czhs preia acea înălțime — ca sticky-ul TOC să aibă pe unde călători. */
#right-sidebar{ display:flex; flex-direction:column; }
.czhs {
  --n500:#59737F; --n600:#3D5866; --n700:#26404C; --n800:#203540;
  --orange:#F36620; --border:#DDE6EB; --green:#09AE4E; --green-d:#067434;
  --bg-soft:#F0F3F5; --green-050:#F5FCF8;
  display:flex; flex-direction:column; gap:16px; flex:1 1 auto;
}

/* ── Sheet wrappers ──
   Desktop (și mobil fără ofertă): coloană normală. Lanțul flex întinde
   .czhs pe toată înălțimea coloanei ca sticky-ul TOC să aibă pe unde călători.
   Cromul de sheet (backdrop/handle/close/CTA) + bara sunt ascunse implicit. */
.czhs-sheet,.czhs-sheet__panel,.czhs-sheet__content{ display:flex; flex-direction:column; flex:1 1 auto; min-height:0; }
.czhs-sheet__backdrop,.czhs-sheet__handle,.czhs-sheet__close,.czhs-sheet__cta-wrap,.czhs-bar{ display:none; }

/* CTA verde (bară + sheet) — vizibile doar pe mobil (vezi media query). */
.czhs-bar__cta,.czhs-sheet__cta{ display:none; align-items:center; justify-content:center; gap:8px; background:#09AE4E; color:#fff !important; font-weight:700; text-decoration:none !important; border:none; border-radius:12px; cursor:pointer; transition:background .15s ease; }
.czhs-bar__cta:hover,.czhs-sheet__cta:hover{ background:#0BB855; color:#fff; }
.czhs-bar__cta .arw svg,.czhs-sheet__cta .arw svg{ display:block; }

/* ── Recap în sheet (scor editorial + ofertă) — ascuns implicit, doar în sheet ── */
.czhs-recap{ display:none; flex-direction:column; gap:14px; }
.czhs-recap__score{ display:flex; align-items:center; gap:14px; }
.czhs-ring{ position:relative; width:62px; height:62px; flex:none; }
.czhs-ring b{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:20px; font-weight:800; letter-spacing:-.02em; }
.czhs-ring-label{ font-size:17px; font-weight:700; color:var(--n800); line-height:1.15; }
.czhs-ring-sub{ font-size:12.5px; color:var(--n500); font-weight:500; margin-top:2px; }
.czhs-offer{ background:#FFF7F2; border:1px solid #F3D9C6; border-left:3px solid var(--orange); border-radius:0 12px 12px 0; padding:12px 14px; }
.czhs-offer .k{ font-size:10px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:#D55515; margin-bottom:6px; }
.czhs-offer .l1{ font-size:17px; font-weight:600; color:var(--n800); line-height:1.35; }
.czhs-offer .l1 b{ color:var(--green-d); font-weight:700; }
.czhs-offer .l2{ font-size:14.5px; font-weight:600; color:var(--n600); margin-top:3px; }
.czhs-offer .l2 b{ color:#D55515; font-weight:700; }

/* ── Testat pe cont real (badge discret, NU concurează cu CTA verde) ── */
.czhs-tested{ display:flex; align-items:center; gap:10px; padding:10px 13px; border-radius:12px; background:var(--green-050); border:1px solid #ABEDC7; color:var(--green-d); }
.czhs-tested svg{ flex:none; }
.czhs-tested b{ display:block; font-size:13.5px; font-weight:700; line-height:1.25; }
.czhs-tested small{ display:block; font-size:11.5px; font-weight:500; color:var(--n500); margin-top:1px; }

/* ── Card generic ── */
.czhs-card{ border:1px solid var(--border); border-radius:14px; background:#fff; padding:16px 18px; box-shadow:0 2px 12px rgba(23,46,82,.06); }
.czhs-k{ font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--n500); margin:0 0 12px; }

/* ── Facts (label stânga, valoare dreapta) ── */
.czhs-facts{ list-style:none; margin:0; padding:0; }
.czhs-facts li{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0; border-bottom:1px solid var(--bg-soft); font-size:14px; }
.czhs-facts li:first-child{ padding-top:0; }
.czhs-facts li:last-child{ padding-bottom:0; border-bottom:none; }
.czhs-facts .l{ color:var(--n600); font-weight:500; }
.czhs-facts .v{ color:var(--n800); font-weight:700; text-align:right; white-space:nowrap; }
.czhs-facts .v.is-good{ color:var(--green-d); }

/* ── Licență ONJN ── */
.czhs-lic{ display:flex; align-items:center; gap:10px; padding:10px 12px; background:var(--green-050); border:1px solid #ABEDC7; border-radius:10px; margin-bottom:14px; }
.czhs-lic img{ width:30px; height:30px; flex:none; }
.czhs-lic .t{ font-size:11px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--green-d); line-height:1.3; }
.czhs-lic .t span{ display:block; font-size:13px; letter-spacing:0; text-transform:none; color:var(--n700); font-weight:600; }

/* ── Chips jocuri ── */
.czhs-games{ display:flex; flex-wrap:wrap; gap:8px; list-style:none; margin:0; padding:0; }
.czhs-games li{ display:inline-flex; align-items:center; gap:7px; padding:6px 12px 6px 9px; border:1px solid var(--border); border-radius:999px; background:#fff; }
.czhs-games li svg,.czhs-games li img{ width:20px; height:20px; display:block; flex:none; }
.czhs-games li span{ font-size:13px; font-weight:600; color:var(--n800); line-height:1; white-space:nowrap; }


.czhs-card--tc{ background:#FAFBFC; }
.czhs-tc{ font-size:12px; line-height:1.55; color:var(--n500); margin:0; }

/* ── CUPRINS (stil metodologie 1:1) ── */
.czhs-toc{ position:sticky; top:90px; align-self:start; }
.czhs-toc-card{ border:1px solid var(--border); border-radius:14px; background:#fff; padding:18px 8px 18px 18px; box-shadow:0 2px 12px rgba(23,46,82,.06); }
.czhs-toc-k{ display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; border:none; background:none; text-align:left; cursor:default; font-family:inherit; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--n600); margin:0 0 12px; padding:0 10px 0 0; }
.czhs-toc-k .chev{ display:none; }
.czhs-toc-card nav{ display:flex; flex-direction:column; gap:1px; }
.czhs-toc-card nav a{ font-size:13.5px; font-weight:500; color:var(--n500); padding:6px 10px 6px 12px; border-left:2px solid transparent; text-decoration:none; transition:color .15s ease,border-color .15s ease; }
.czhs-toc-card nav a:hover{ color:var(--n700); text-decoration:none; }
.czhs-toc-card nav a.is-active{ color:var(--n800); font-weight:700; border-left-color:var(--orange); }

/* ── PILLS MOBIL (bara fixă sus, scroll orizontal auto) ── */
.czhs-pills{ display:none; }

@media(max-width:767.98px){
  /* pe mobil TOC-ul din sidebar dispare — îl înlocuiesc pills-urile fixe */
  .czhs-toc{ display:none; }

  /* Bară fixă. Poziționare 100% prin transform (compositor-only, zero layout).
     - implicit (sus de tot): ascunsă deasupra ecranului;
     - past-fold + header vizibil: andocată sub header (translateY = înălțime header);
     - past-fold + header ascuns: urcă la top.
     --czhs-header-h e măsurat o dată în JS. */
  .czhs-pills{
    display:block; position:fixed; left:0; right:0; top:0; z-index:1000;
    background:#fff; border-bottom:1px solid var(--border);
    box-shadow:0 4px 14px rgba(23,46,82,.08);
    transform:translateY(-110%); transition:transform .24s cubic-bezier(.2,.8,.2,1);
  }
  body.past-fold .czhs-pills{ transform:translateY(var(--czhs-header-h, 56px)); }
  body.past-fold.header-hidden .czhs-pills{ transform:translateY(0); }
  .czhs-pills__track{
    display:flex; gap:18px; overflow-x:auto; scroll-behavior:smooth;
    padding:8px 16px; margin:0; list-style:none;
    -ms-overflow-style:none; scrollbar-width:none;
  }
  .czhs-pills__track::-webkit-scrollbar{ display:none; }
  /* Identic ca linkurile TOC de pe desktop: text simplu, activ portocaliu cu
     accent (bară jos, echivalentul border-left-ului vertical de pe desktop). */
  .czhs-pill{
    flex:none; display:inline-flex; align-items:center; white-space:nowrap;
    padding:7px 2px; border:none; background:none; border-bottom:2px solid transparent;
    color:var(--n500); font-size:13.5px; font-weight:500;
    text-decoration:none !important; transition:color .15s ease,border-color .15s ease;
  }
  .czhs-pill:hover{ color:var(--n700); }
  .czhs-pill.is-active{ color:var(--n800); font-weight:700; border-bottom-color:var(--orange); }
  /* compensăm bara fixă când sar la ancoră: offset prin scroll-margin pe headinguri */
}

/* headingurile din conținut: offset ancoră (desktop header + bară mobil) */
.czh2-anchor-offset :is(h2,h3,h4)[id]{ scroll-margin-top:96px; }
@media(max-width:767.98px){ .czh2-anchor-offset :is(h2,h3,h4)[id]{ scroll-margin-top:120px; } }

@media (prefers-reduced-motion:reduce){
  .czhs-pills{ transition:none; }
  .czhs-pills__track{ scroll-behavior:auto; }
}

/* ══ Bottom sheet + bară colapsată (doar mobil, doar când există ofertă) ══ */
@media(max-width:767.98px){
  /* Coloana nu mai ocupă spațiu în flow — sheet-ul e fixed. */
  .czhs-col--sheet .czhs-sheet{
    position:fixed; inset:0; z-index:1050; display:block;
    visibility:hidden; transition:visibility 0s linear .32s;
  }
  .czhs-col--sheet .czhs-sheet.is-open{ visibility:visible; transition-delay:0s; }
  .czhs-col--sheet .czhs-sheet__backdrop{
    display:block; position:absolute; inset:0; background:rgba(15,30,40,.5);
    opacity:0; transition:opacity .3s;
  }
  .czhs-col--sheet .czhs-sheet.is-open .czhs-sheet__backdrop{ opacity:1; }
  .czhs-col--sheet .czhs-sheet__panel{
    position:absolute; left:0; right:0; bottom:0; display:flex; flex-direction:column;
    max-height:88vh; background:#fff; border-radius:18px 18px 0 0;
    box-shadow:0 -10px 34px rgba(0,0,0,.2); padding:0 16px;
    transform:translateY(100%); transition:transform .32s cubic-bezier(.2,.8,.2,1);
  }
  .czhs-col--sheet .czhs-sheet.is-open .czhs-sheet__panel{ transform:translateY(0); }
  .czhs-col--sheet.is-dragging .czhs-sheet__panel{ transition:none; }

  .czhs-sheet__handle{ display:block; flex:none; width:42px; height:4px; border-radius:2px; background:#D1D5DB; margin:10px auto 6px; touch-action:none; }
  .czhs-sheet__close{ display:flex; align-items:center; justify-content:center; position:absolute; right:12px; top:12px; width:32px; height:32px; padding:0; border:0; border-radius:50%; background:#F0F3F5; color:#26404C; font-size:20px; line-height:1; cursor:pointer; z-index:2; }
  .czhs-col--sheet .czhs-sheet__content{ flex:1 1 auto; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; padding:2px 2px calc(12px + env(safe-area-inset-bottom,0px)); scrollbar-width:thin; scrollbar-color:#CBD5DD transparent; }
  .czhs-col--sheet .czhs-sheet__content::-webkit-scrollbar{ width:5px; }
  .czhs-col--sheet .czhs-sheet__content::-webkit-scrollbar-thumb{ background:#CBD5DD; border-radius:3px; }
  .czhs-col--sheet .czhs-sheet__content::-webkit-scrollbar-track{ background:transparent; }

  /* CTA lipit jos în sheet */
  .czhs-sheet__cta-wrap{ display:block; position:sticky; bottom:0; background:linear-gradient(180deg,rgba(255,255,255,0),#fff 32%); padding:10px 0 calc(6px + env(safe-area-inset-bottom,0px)); }
  .czhs-sheet__cta{ display:flex; width:100%; height:54px; font-size:16px; box-shadow:0 8px 18px rgba(9,174,78,.3); }

  /* Bara colapsată */
  .czhs-bar{
    display:flex; align-items:stretch; gap:10px; position:fixed; left:0; right:0; bottom:0; z-index:1035;
    background:#fff; border-top:1px solid var(--border); box-shadow:0 -4px 18px rgba(23,46,82,.12);
    padding:12px 12px calc(12px + env(safe-area-inset-bottom,0px));
    transform:translateY(120%); transition:transform .26s cubic-bezier(.2,.8,.2,1), opacity .2s ease;
  }
  /* Apare doar după ce CTA-ul din hero iese din viewport (clasă pusă via IO). */
  .czhs-bar.is-shown{ transform:translateY(0); }
  body.czhs-sheet-open .czhs-bar{ opacity:0; pointer-events:none; }
  .czhs-bar__info{
    flex:0 0 35%; max-width:35%; min-width:0; min-height:46px; position:relative; display:flex; align-items:center; justify-content:center;
    cursor:pointer; padding:6px 18px 6px 8px;
    border:1px solid #F3D9C6; background:#FFF7F2; border-radius:10px;
  }
  .czhs-bar__info .lbl{ font-size:12px; font-weight:700; color:#203540; line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .czhs-bar__info .chev{ position:absolute; right:6px; top:50%; transform:translateY(-50%); color:#D55515; display:flex; }
  .czhs-bar__cta{ display:inline-flex; flex:1 1 auto; min-width:0; min-height:46px; font-size:15px; padding:0 14px; }

  .czhs-bar--stare{ align-items:center; }
  .czhs-bar--stare .czhs-bar__who{ display:flex; align-items:center; gap:8px; flex:1; min-width:0; }
  .czhs-bar--stare .czhs-bar__who img{ width:54px; height:auto; flex:none; border-radius:6px; filter:grayscale(1); opacity:.7; }
  .czhs-bar--stare .czhs-bar__who > div{ min-width:0; }
  .czhs-bar--stare .n{ font-size:13px; font-weight:700; color:#203540; line-height:1.3; overflow-wrap:anywhere; }
  .czhs-bar--stare .s{ font-size:11.5px; font-weight:600; color:#59737F; line-height:1.35; margin-top:2px; }
  .czhs-bar--stare .czh2-bl-cta{ min-height:46px; padding:5px 12px; font-size:13px; gap:7px; }
  .czhs-bar--stare .czh2-bl-cta__txt small{ font-size:10.5px; }

  /* Recap-ul (scor + ofertă) apare doar în sheet (nu în layout-ul în flow). */
  .czhs-col--sheet .czhs-recap{ display:flex; }
}

/* Primul bloc din articol aliniat la top cu sidebar-ul (elimină marginea de sus
   care împingea conținutul cu ~22px sub cardul „Testat pe cont real"). */
.czh2-anchor-offset > :first-child{ margin-top:0 !important; }

/* Doar pe acest template: fără umbră pe tabelele din conținut.
   !important ca să bată regula temei din main.css (încărcată după, specificitate egală). */
.czh2-anchor-offset figure.wp-block-table,
.czh2-anchor-offset figure.custom-table,
.czh2-anchor-offset .wp-block-table{ box-shadow:none !important; }
