/* =====================================================================
   NSFWRating — Kolet UI, site-wide (2026-08-05)
   Retires the dark "midnight lounge" theme on every inner page. The theme
   is token-driven, so remapping --aihub-* flips all components at once;
   below that are targeted fixes for rules that hardcoded dark values, plus
   the Kolet component language (pill buttons with sticker shadow, rotated
   badges, black score chips).
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,300..800&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Space+Mono:wght@400;700&display=swap');

:root, html {
  /* Kolet palette */
  --k-black:#0A0A0A; --k-white:#fff; --k-cream:#FFF8EF; --k-cream-2:#FFF2E0; --k-grey:#F3F1F4;
  --k-pink:#F92FBB; --k-pink-2:#D40F9C; --k-pink-soft:#FFE4F6;
  --k-violet:#8B5CF6; --k-violet-2:#6D33F0; --k-violet-soft:#EEE6FF;
  --k-butter:#FFE36E; --k-sky:#2AA7E8; --k-green:#00B67A;
  --k-line:#EDE6DB; --k-stk:3px 3px 0 var(--k-black);
  --k-display:"Bricolage Grotesque",Georgia,serif;
  --k-sans:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

  /* ---- remap the theme's tokens onto Kolet ---- */
  --aihub-bg:#FFF8EF;
  --aihub-bg-2:#FFFFFF;
  --aihub-surface:#FFFFFF;
  --aihub-surface-2:#FFF2E0;
  --aihub-border:rgba(10,10,10,.14);
  --aihub-border-soft:rgba(10,10,10,.08);
  --aihub-text:#0A0A0A;
  --aihub-muted:rgba(10,10,10,.62);
  --aihub-primary:#F92FBB;
  --aihub-primary-ink:#D40F9C;
  --aihub-secondary:#8B5CF6;
  --aihub-accent:#6D33F0;
  --aihub-success:#00B67A;
  --aihub-warning:#F59E0B;
  --aihub-danger:#EF4444;
  --aihub-radius:18px;
  --aihub-radius-sm:12px;
  --aihub-display:var(--k-display);
  --aihub-font:var(--k-sans);
  --aihub-shadow:0 2px 8px rgba(10,10,10,.06), 0 6px 22px rgba(10,10,10,.07);
  --aihub-shadow-lift:0 18px 50px rgba(10,10,10,.16);
  --global-palette-btn-bg:#F92FBB;
  --global-palette-btn-bg-hover:#D40F9C;
}

/* ---------- canvas ---------- */
html { background:var(--k-cream); }
body { background-color:var(--k-cream) !important; color:var(--k-black); font-family:var(--k-sans); }
#inner-wrap, .content-area, .content-container, #primary, #main, .entry-content-wrap,
.site, .site-container, #wrapper { background-color:var(--k-cream) !important; color:var(--k-black); }
::selection { background:var(--k-pink); color:#fff; }
* { scrollbar-color:rgba(10,10,10,.22) var(--k-cream-2); }

/* ---------- type ---------- */
.aihub h1, .aihub h2, .aihub h3, .aihub h4,
h1, h2, h3, h4, .entry-title { font-family:var(--k-display); color:var(--k-black); letter-spacing:-.03em; }
.aihub, .aihub p, .aihub li, .entry-content { color:var(--k-black); }
.aihub a { color:var(--k-violet-2); }
.aihub a:hover { color:var(--k-pink-2); }
.aihub-muted, .aihub .aihub-muted, .aihub-lede { color:rgba(10,10,10,.62) !important; }

/* ---------- surfaces: white cards, hairline, soft shadow ---------- */
.aihub-card, .aihub-panel, .aihub-collection__item, .aihub-artcard, .aihub-authorbox,
.aihub-trend__card, .aihub-gcard, .aihub-toolfaq__item, .aihub-form,
.wp-block-kadence-advanced-form, .aihub-embed__code, .aihub-t20, .aihub-vband,
.aihub-quiz, .aihub-cmp, .aihub-hcard, .aihub-feed__item, .aihub-dealspot {
  background:var(--k-white) !important;
  border:1px solid var(--k-line) !important;
  border-radius:18px !important;
  box-shadow:0 2px 8px rgba(10,10,10,.05);
  color:var(--k-black);
}
.aihub-card:hover, .aihub-collection__item:hover, .aihub-artcard:hover, .aihub-trend__card:hover {
  border-color:var(--k-black) !important;
  box-shadow:var(--k-stk);
  transform:translateY(-2px);
}

/* ---------- buttons: Kolet pill + sticker offset ---------- */
.aihub-cta, .aihub-btn, .aihub .wp-block-button__link, .aihub-btn--primary,
.aihub-collection__cta .aihub-cta, .aihub-dealspot__cta .aihub-cta {
  border-radius:999px !important;
  font-family:var(--k-sans);
  font-weight:750;
  min-height:48px;
  padding:0 26px;
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  transition:transform .16s cubic-bezier(.2,.9,.3,1), box-shadow .16s ease, background .16s ease;
}
.aihub-cta, .aihub-btn--primary, .aihub .wp-block-button__link {
  background:var(--k-pink) !important;
  color:#fff !important;
  border:1.5px solid var(--k-black) !important;
  box-shadow:var(--k-stk) !important;
}
.aihub-cta:hover, .aihub-btn--primary:hover, .aihub .wp-block-button__link:hover {
  background:var(--k-pink-2) !important;
  transform:translate(-1px,-1px);
  box-shadow:5px 5px 0 var(--k-black) !important;
  text-decoration:none !important;
}
.aihub-btn--ghost, .aihub-btn--secondary {
  background:var(--k-white) !important;
  color:var(--k-black) !important;
  border:1.5px solid var(--k-black) !important;
  box-shadow:none !important;
}
.aihub-btn--ghost:hover, .aihub-btn--secondary:hover { box-shadow:var(--k-stk) !important; }

/* ---------- eyebrows / badges: butter stickers ---------- */
.aihub-eyebrow, .aihub-badge, .aihub-feed__tag, .aihub-artcard__type, .aihub-pill {
  font-family:var(--k-display) !important;
  font-weight:800 !important;
  letter-spacing:-.02em !important;
  background:var(--k-butter) !important;
  color:var(--k-black) !important;
  border:1.5px solid var(--k-black) !important;
  border-radius:999px !important;
  padding:6px 13px !important;
  box-shadow:var(--k-stk);
  text-transform:none !important;
  display:inline-flex; align-items:center; gap:6px;
}
.aihub-badge--featured, .aihub-t20__adtag, .aihub-featslot__ad {
  background:var(--k-violet-soft) !important; color:var(--k-violet-2) !important;
}

/* ---------- score chips: black pill ---------- */
.aihub-score, .aihub-score__value, .aihub-t20__score, .aihub-collection__score,
.aihub-trend__score, .aihub-catcol__score, .aihub-dealspot__score {
  font-family:var(--k-display) !important;
  font-weight:800 !important;
  background:var(--k-black) !important;
  color:#fff !important;
  border:0 !important;
  border-radius:10px !important;
  padding:5px 10px !important;
}
.aihub-score--strong, .aihub-catcol__score--strong { background:var(--k-green) !important; color:#fff !important; }
.aihub-score--weak, .aihub-catcol__score--weak { background:var(--aihub-danger) !important; color:#fff !important; }

/* ---------- tables ---------- */
.aihub table, .aihub-table, .wp-block-table table { background:var(--k-white); color:var(--k-black); border-radius:18px; overflow:hidden; }
.aihub th, .aihub-table th { background:var(--k-cream-2) !important; color:var(--k-black) !important; font-family:var(--k-display); border-bottom:1.5px solid var(--k-black) !important; }
.aihub td, .aihub-table td { border-color:var(--k-line) !important; color:var(--k-black); }
.aihub tr:hover td { background:var(--k-cream) !important; }

/* ---------- inputs ---------- */
.aihub input[type=text], .aihub input[type=search], .aihub input[type=email], .aihub select,
.aihub textarea, .aihub-form__row input, .aihub-form__row select, .aihub-form__row textarea,
.kb-advanced-form .kb-field, .wp-block-kadence-advanced-form .kb-field {
  background:var(--k-white) !important;
  color:var(--k-black) !important;
  border:1.5px solid var(--k-black) !important;
  border-radius:999px !important;
}
.aihub textarea, .wp-block-kadence-advanced-form textarea { border-radius:18px !important; }

/* ---------- chips / filters ---------- */
.aihub-chip, .aihub-quickfilters .aihub-chip, .aihub-bonuschip, .aihub-dealbadge {
  background:var(--k-white) !important;
  color:var(--k-black) !important;
  border:1.5px solid var(--k-black) !important;
  border-radius:999px !important;
}
.aihub-quickfilters .aihub-chip.is-on { background:var(--k-pink) !important; color:#fff !important; }
.aihub-bonuschip { background:var(--k-green) !important; color:#fff !important; border-color:var(--k-black) !important; }
.aihub .aihub-dealbadge { background:var(--k-butter) !important; color:var(--k-black) !important; }

/* ---------- misc dark leftovers ---------- */
.aihub-band { background:var(--k-violet-soft) !important; color:var(--k-black) !important; border:1.5px solid var(--k-black); border-radius:24px; }
.aihub-band p, .aihub-gcard__count { color:rgba(10,10,10,.7) !important; }
.aihub-disclosure { background:var(--k-cream-2) !important; border:1px dashed rgba(10,10,10,.25) !important; color:rgba(10,10,10,.7) !important; border-radius:18px; }
.aihub-authorbox__eyebrow { color:var(--k-pink-2) !important; }
.aihub-pagination a, .aihub-pagination span { background:var(--k-white); border:1.5px solid var(--k-black); color:var(--k-black); border-radius:999px; }
.aihub-pagination .current { background:var(--k-pink); color:#fff; }
.aihub-progress, .aihub-bar { background:rgba(10,10,10,.08) !important; }
.aihub-bar__fill, .aihub-progress__fill { background:var(--k-pink) !important; }

/* ---------- Kadence header / footer to light ---------- */
#masthead, .site-header, .site-header-row, .site-top-header-wrap, .site-main-header-wrap,
#colophon, .site-footer, .site-footer-row, .footer-html, .site-bottom-footer-wrap {
  background:var(--k-white) !important;
  color:var(--k-black) !important;
  border-color:var(--k-line) !important;
}
#masthead a, .site-header a, .site-branding a, .header-navigation a,
#colophon a, .site-footer a { color:var(--k-black) !important; }
#masthead a:hover, .header-navigation a:hover, .site-footer a:hover { color:var(--k-pink-2) !important; }
.site-header { border-bottom:1.5px solid var(--k-black) !important; }
#colophon { border-top:1.5px solid var(--k-black) !important; }
.aihub-navcta {
  background:var(--k-butter) !important; color:var(--k-black) !important;
  border:1.5px solid var(--k-black) !important; box-shadow:var(--k-stk);
  border-radius:999px !important;
}

/* ---------- video band stays dark (media reads better) ---------- */
.aihub-vband { background:var(--k-black) !important; border-color:var(--k-black) !important; }
.aihub-vband h2, .aihub-vband p, .aihub-vband .aihub-vband__name { color:#fff !important; }

@media (prefers-reduced-motion: reduce) {
  .aihub-card:hover, .aihub-cta:hover { transform:none; }
}

/* =====================================================================
   Chrome polish (2026-08-05) — fixes found on the category page
   ===================================================================== */

/* 1. Kill inherited underlines in the header, promo bar and footer.
      Kadence/theme underline every <a>; the Kolet chrome must stay clean. */
.promo a, .hdr a, .ftr a, .hdr button, .mm a, .cloud a, .nav__b,
.promo a:hover, .hdr a:hover, .ftr a:hover, .mm a:hover, .cloud a:hover {
  text-decoration: none !important;
}
/* Keep an affordance on hover for text links only */
.mm a:hover, .ftr__cols a:hover { color: var(--k-pink) !important; }
.cloud a:hover { border-color: #fff !important; }

/* 2. Footer legibility: headings were 38% white — too faint to read. */
.ftr__h { color: rgba(255,255,255,.72) !important; letter-spacing:.08em; }
.ftr__cols a, .ftr p, .ftr__st span { color: rgba(255,255,255,.82) !important; }
.ftr__st b { color: #fff !important; }
.ftr a { color: rgba(255,255,255,.86) !important; }

/* 3. Retired sections must not appear in navigation anywhere.
      The review CPT 301s to tool pages, so linking it is a dead end. */
.aihub-rail a[href*="/reviews"],
.aihub-side a[href*="/reviews"],
.ftr a[href*="/reviews"],
.mm a[href*="/reviews"] { display: none !important; }

/* 4. Sidebar rail: match the Kolet card language */
.aihub-rail {
  background: #fff !important;
  border: 1px solid var(--k-line) !important;
  border-radius: 18px !important;
  box-shadow: 0 2px 8px rgba(10,10,10,.05);
}
.aihub-rail a { color: var(--k-black) !important; border-radius: 999px; }
.aihub-rail a:hover { background: var(--k-cream-2) !important; color: var(--k-pink-2) !important; }
.aihub-rail a[aria-current], .aihub-rail .is-active {
  background: var(--k-pink-soft) !important; color: var(--k-pink-2) !important; font-weight: 700;
}
.aihub-rail__h, .aihub-rail p { color: rgba(10,10,10,.5) !important; letter-spacing:.08em; }

/* 5. Sticky header must never sit on top of anchored content */
:target { scroll-margin-top: 96px; }
/* =====================================================================
   Card imagery (2026-08-05): the mock used small flat illustrations; we
   swapped in real portrait screenshots, which blew the cards out. Give
   every injected image a fixed ratio, cover-crop and a sane cap so the
   cards stay equal height and behave on small screens.
   ===================================================================== */
.ben { display:flex; flex-direction:column; overflow:hidden; }
.ben__t { flex:1 1 auto; }
.ben__img {
  width:100% !important;
  aspect-ratio: 16 / 10;
  height:auto !important;
  max-height:260px;
  object-fit:cover !important;
  object-position:center 22%;
  display:block;
  border-radius:0 0 18px 18px;
}
.deal__img, .closer__img {
  width:100% !important;
  height:100% !important;
  max-height:420px;
  object-fit:cover !important;
  object-position:center 20%;
  display:block;
}
.deal, .closer { overflow:hidden; }

@media (max-width: 900px) {
  .ben__img { aspect-ratio: 16 / 9; max-height:200px; }
  .deal__img, .closer__img { max-height:260px; aspect-ratio:16/9; height:auto !important; }
  .deal, .closer { display:block !important; }
}
@media (max-width: 560px) {
  .ben__img { max-height:170px; }
  .deal__img, .closer__img { max-height:200px; }
}