/*
 * AffDoppio "roast" design: roastworthy.coffee-style UI on the existing layout (cream surfaces, 2px espresso
 * borders, square cards, hard offset shadows, pill buttons and chips). Fonts stay the theme's own.
 *
 * Every page renders the `.ad-roast` marker (src/lib/roast.tsx), so the design rules are scoped to
 * html:has(.ad-roast). /draft/... pages also render `.ad-draft-marker`: put a future redesign under
 * html:has(.ad-draft-marker) to preview it there before it goes live.
 */

/* ------------------------------------------------------------------------------------------------------
 * Theme recolor (unscoped, lowest priority): the WP Coupon theme and its skin are purple / blue / green.
 * These rules move every themed color the design rules below don't restyle onto the AffDoppio palette.
 * ------------------------------------------------------------------------------------------------------ */
:root {
  --ad-amber: #b93d10; /* orange (WCAG AA on white and cream) */
  --ad-amber-light: #e9b44c; /* mustard */
  --ad-amber-dark: #9a330d; /* dark orange */
  --ad-brown: #231710; /* ink */
  --ad-coffee: #31221a; /* dark card */
  --ad-espresso: #231710; /* ink */
  --ad-header: #f5efe2; /* cream */
}

/* Header (was the purple pattern image) */
#primary-header,
.primary-header {
  background: var(--ad-header) !important;
}
.site-header .logo_area img {
  max-width: 100%;
  height: auto;
}

/* Top notification bar */
#notification-bar {
  background: linear-gradient(90deg, var(--ad-espresso), var(--ad-coffee), var(--ad-espresso)) !important;
}

/* Search button, scroll progress bar, menu arrows and focus outlines (were green) */
#header-search .header-search-submit,
.header-search-submit.ui.button,
.header-search-submit-mobile.ui.button {
  background-color: var(--ad-amber) !important;
  color: #fff !important;
}
#header-search .header-search-submit:hover,
.header-search-submit.ui.button:hover {
  background-color: var(--ad-amber-dark) !important;
}
.progress-bar {
  background: var(--ad-amber) !important;
}
.sf-arrows > li > .sf-with-ul:focus:after,
.sf-arrows > li:hover > .sf-with-ul {
  border-top-color: var(--ad-amber) !important;
}
.sf-arrows ul li > .sf-with-ul:focus:after,
.sf-arrows ul li:hover > .sf-with-ul {
  border-left-color: var(--ad-amber) !important;
}
.st-menu a:hover {
  color: var(--ad-amber-dark) !important;
}
textarea:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus {
  border-color: var(--ad-amber) !important;
}

/* Links and call-to-action buttons (were Google blue) */
.primary-color,
.primary-colored,
a,
.ui.breadcrumb a {
  color: var(--ad-amber-dark);
}
/* Every skin rule that used #1a73e8 / #174ea6 */
.post-entry p a,
.post-content p a,
.store-extra-info p a,
.header-content a,
#planFeatures a,
.howto-coupon a.primary,
body .howto-coupon a.primary,
#secondary #menu-related-category .coupon-menu-item a,
.cate-az .cate-parent > a,
.site-breadcrumb .ui.breadcrumb a.section,
.st-menu li.current-menu-item a,
.nav-user-action .st-menu .menu-box a,
.store-listing-item .latest-coupon .coupon-title a,
.store-listing-item .coupon-saved,
.coupon-listing-item .coupon-listing-footer ul li a.active,
.coupon-listing-item .coupon-exclusive strong i,
.coupon-modal .coupon-content .show-detail .show-detail-on {
  color: var(--ad-amber-dark) !important;
}
.post-content p a:hover,
.store-extra-info p a:hover,
.post-entry p a:hover,
.header-content a:hover,
.cate-az a:hover,
.popular-stores .store-name a:hover,
.store-listing-item .store-thumb-link .store-name a:hover,
.store-listing-item .coupon-save:hover,
.single-store-header .add-favorite:hover,
.coupon-listing-item .coupon-listing-footer ul li a:hover,
.coupon-modal .coupon-content .show-detail a:hover,
.coupon-modal .coupon-footer ul li a:hover,
.coupon-listing-item .coupon-detail .user-ratting .ui.button:hover i,
.coupon-listing-item .coupon-detail .user-ratting .ui.button.active i,
.coupon-modal .coupon-content .user-ratting .ui.button:hover i {
  color: var(--ad-brown) !important;
}
.site-footer a:hover {
  color: var(--ad-amber-light) !important;
}
.wp-block-button__link,
.cta,
.cta-sm,
.cta-xl {
  background: var(--ad-amber-dark) !important;
  color: #fff !important;
}
.ui.button.btn_primary,
.btn.btn_primary {
  background: var(--ad-amber-dark) !important;
  color: #fff !important;
}
.ui.button.btn_primary:hover,
.btn.btn_primary:hover {
  background: var(--ad-brown) !important;
}

/* Home: dark band behind the hero cards, "Fresh Brews" store cards, card buttons (were purple) */
.home-container.darken {
  background: linear-gradient(180deg, #2b1306 0%, #4a2208 100%) !important;
}
.box-card.spy_tools,
.box-card-container.spy_tools,
.darken .box-card-container {
  background-image: linear-gradient(rgba(180, 83, 9, 0.2) 0%, rgba(180, 83, 9, 0) 100%) !important;
}
/* "Fresh Brews" / "More Fresh Brews" titles on the dark band (were dim grey) */
.home-container.darken .card-collection-header {
  color: var(--ad-amber-light) !important;
  font-weight: 600 !important;
}
.blur,
.spy_tools .blur,
.box-card-container.spy_tools .blur {
  background-color: var(--ad-coffee) !important;
}
.ui-button.button-normal,
.box-card.spy_tools .go-btn,
.box-card-container.spy_tools .go-btn {
  background: linear-gradient(91deg, var(--ad-amber-dark) 0%, var(--ad-amber-light) 96%) !important;
}
/* Hero artwork drawn in purple: shift it to amber */
.box-card.spy_tools img,
.box-card-container.spy_tools img {
  filter: hue-rotate(140deg) saturate(1.1);
}

/* Store pages: image captions and the coupon table (were dark purple) */
figure.captioned figcaption,
.coupon-table-coupon {
  background: var(--ad-espresso) !important;
  color: #fff !important;
}

/* Author box (was lilac) */
section#author {
  border-color: #fcd34d !important;
}

html:has(.ad-roast) {
  --rw-ink: #231710;
  --rw-text: #3f3227;
  --rw-orange: #b93d10; /* 5.6:1 on white, 5.4:1 on card: AA for text and white-on-orange buttons */
  --rw-orange-dark: #9a330d;
  --rw-mustard: #e9b44c;
  --rw-green: #3f7a4e;
  --rw-cream: #f5efe2;
  --rw-sand: #ede4d1;
  --rw-card: #fffaf0;
  --rw-dark-card: #31221a;
  --rw-dark-line: #5a4634;
  --rw-muted: #c9b8a6;
  --rw-radius: 0; /* square cards (pills stay on buttons and chips) */
  --rw-radius-lg: 0;
  --rw-border: 2px solid var(--rw-ink);
  --rw-shadow: 6px 6px 0 0 rgba(35, 23, 16, 0.92);
  --rw-shadow-sm: 4px 4px 0 0 rgba(35, 23, 16, 0.9);

  /* ------------------------------------------------------------ Base */
  & body {
    background: var(--rw-cream) !important;
    color: var(--rw-text) !important;
  }
  & h1,
  & h2,
  & h3,
  & h4,
  & h5 {
    color: var(--rw-ink);
  }
  & a {
    color: var(--rw-orange);
  }
  & a:hover {
    color: var(--rw-orange-dark);
  }
  & .progress-bar {
    background: var(--rw-orange) !important;
  }

  /* ---------------------------------------------------------- Header */
  & #primary-header,
  & .primary-header {
    background: var(--rw-cream) !important;
    border-bottom: var(--rw-border);
    color: var(--rw-ink) !important;
  }
  & .primary-header > .container {
    display: grid;
    grid-template-columns: 236px minmax(240px, 1fr) auto;
    align-items: center;
    column-gap: 22px;
  }
  & .primary-header > .container::before,
  & .primary-header > .container::after {
    content: none;
  }
  & .site-header .logo_area {
    grid-column: 1;
    grid-row: 1;
    float: none;
    margin: 0;
  }
  & .site-header .logo_area img {
    display: block;
    width: 236px;
    max-width: 100%;
    height: auto;
  }
  & .header_right {
    grid-column: 2;
    grid-row: 1;
    float: none;
    min-width: 0;
  }
  & .header-highlight {
    grid-column: 3;
    grid-row: 1;
    float: none;
    white-space: nowrap;
  }
  & #header-search {
    display: block;
    width: 100%;
  }
  & #header-search .header-search-input {
    display: flex;
    float: none;
    width: 100%;
  }
  & #header-search .header-search-input input.prompt {
    flex: 1;
    width: auto !important;
    min-width: 0;
  }
  @media (max-width: 1099px) {
    & .primary-header > .container {
      grid-template-columns: 236px minmax(0, 1fr);
    }
  }
  @media (max-width: 767px) {
    & .primary-header {
      padding: 12px 0;
    }
    & .primary-header > .container {
      grid-template-columns: minmax(0, 1fr);
      row-gap: 12px;
    }
    & .site-header .logo_area {
      float: none !important;
      display: flex;
      justify-content: center;
      margin: 0;
    }
    & .site-header .logo_area img {
      width: 210px;
    }
    & .header_right {
      grid-column: 1;
      grid-row: 2;
      float: none !important;
      clear: both;
      width: 100%;
    }
    & #header-search {
      display: block;
      width: 100%;
      margin: 0;
    }
    & #header-search .header-search-input {
      display: flex;
      float: none;
      width: 100%;
    }
    & #header-search .header-search-input input.prompt {
      flex: 1;
      width: auto !important;
      min-width: 0;
    }
  }
  & #header-search .header-search-input input.prompt {
    background: var(--rw-card) !important;
    border: var(--rw-border) !important;
    border-right: 0 !important;
    border-radius: 0 !important;
    color: var(--rw-ink) !important;
  }
  & #header-search .header-search-submit,
  & .header-search-submit.ui.button,
  & .header-search-submit-mobile.ui.button {
    background: var(--rw-orange) !important;
    border: var(--rw-border) !important;
    border-radius: 0 !important;
    color: #fff !important;
    font-weight: 700 !important;
  }
  & #header-search .header-search-submit:hover {
    background: var(--rw-orange-dark) !important;
  }
  & .search-sample,
  & .search-sample span {
    color: var(--rw-text) !important;
    font-size: 11.5px !important;
  }
  & .search-sample a {
    color: var(--rw-ink) !important;
    font-weight: 600;
  }
  & .search-sample a:hover {
    color: var(--rw-orange) !important;
  }
  & .header-highlight a {
    color: var(--rw-ink) !important;
  }
  & .header-highlight .highlight-icon i {
    color: var(--rw-orange) !important;
  }
  & .header-highlight .highlight-text {
    color: var(--rw-ink) !important;
    font-weight: 600 !important;
    letter-spacing: 0.06em;
  }
  & .header-highlight a:hover .highlight-text {
    color: var(--rw-orange) !important;
  }
  & .header-cta a {
    background: var(--rw-mustard) !important;
    border: var(--rw-border) !important;
    border-radius: 0 !important;
    color: var(--rw-ink) !important;
    font-weight: 700 !important;
    box-shadow: var(--rw-shadow-sm);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
  }
  & .header-cta a:hover {
    transform: translate(-1px, -1px);
    box-shadow: 5px 5px 0 0 var(--rw-ink);
  }

  /* ------------------------------------------------------ Main menu */
  & #nav-toggle,
  & #nav_toggle_close,
  & .nav-toggle-subarrow {
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    font-family: inherit;
    box-shadow: none;
    cursor: pointer;
  }
  & #nav-toggle,
  & #nav_toggle_close {
    min-width: 44px;
    min-height: 44px;
    font-size: 20px;
  }
  & .site-navigation {
    background: var(--rw-card) !important;
    border-bottom: var(--rw-border) !important;
    box-shadow: none !important;
  }
  & .site-navigation .st-menu > li > a,
  & .nav-user-action .st-menu > li > a {
    color: var(--rw-ink) !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
  }
  & .site-navigation .st-menu > li:hover > a,
  & .site-navigation .st-menu > li > a:hover {
    color: var(--rw-orange) !important;
  }
  & .st-menu .sub-menu,
  & .st-menu .children {
    background: var(--rw-card) !important;
    border: var(--rw-border) !important;
    border-radius: 0 !important;
    box-shadow: var(--rw-shadow-sm) !important;
    overflow: visible;
  }
  & .st-menu .sub-menu a {
    color: var(--rw-text) !important;
    font-weight: 500 !important;
  }
  & .st-menu .sub-menu a:hover {
    color: var(--rw-orange) !important;
    background: var(--rw-cream) !important;
  }

  /* ------------------------------------------------------------ Intro */
  & .frontpage-before-main .custom-html-widget h1 {
    color: var(--rw-ink) !important;
  }
  & .ad-intro {
    text-align: center;
  }
  & .ad-intro .ad-intro-sub {
    max-width: 760px;
    margin: 10px auto 0;
    color: var(--rw-text);
    font-size: 15px;
    line-height: 1.6;
  }
  & .ad-intro .ad-intro-stats {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin: 14px 0 4px;
  }
  & .ad-intro .ad-intro-stats span {
    padding: 5px 12px;
    border: 1px solid var(--rw-ink);
    background: var(--rw-card);
    color: var(--rw-ink);
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
  }
  & .ad-intro .ad-intro-stats strong {
    color: var(--rw-orange);
  }
  & .frontpage-before-main .widget_custom_html {
    background: transparent !important;
    border: 0 !important;
  }
  & .frontpage-before-main .widget_custom_html::before {
    content: "— Fresh deals · hand-verified · served daily";
    display: block;
    margin-bottom: 10px;
    color: var(--rw-orange);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  /* --------------------------------------------- Boxes (shared shells) */
  & .shadow-box {
    background: var(--rw-card) !important;
    border: var(--rw-border) !important;
    border-radius: var(--rw-radius) !important;
    box-shadow: none !important;
  }
  & .widget-title {
    color: var(--rw-orange) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
  }
  & .widget-title::before {
    content: "— ";
  }
  & .widget-title:empty {
    display: none !important;
  }
  /* Generated placeholder logos (/api/store-logo) are drawn purple: shift them to the coffee palette */
  & img[src*="/api/store-logo"],
  & .box-card img.cover[src*="/api/store-logo"] {
    filter: hue-rotate(118deg) saturate(1.15) brightness(0.95) !important;
  }
  /* Store cards don't need the category chip */
  & .card-collection-header + .box-card-container .highlight-icon {
    display: none !important;
  }

  /* ------------------------------------- Hero categories + Fresh Brews */
  & .frontpage-before-main > .shadow-box,
  & .frontpage-after-main > .shadow-box {
    background: var(--rw-sand) !important;
    border-radius: var(--rw-radius-lg) !important;
    box-shadow: var(--rw-shadow) !important;
    padding: 6px 0 22px;
    overflow: hidden;
  }
  & .home-container.darken {
    background: transparent !important;
  }
  & .box-card-container.direction-horizontal {
    padding: 22px 22px 0 !important;
    gap: 18px !important;
  }
  & .home-container.darken .card-collection-header {
    color: var(--rw-ink) !important;
    font-size: clamp(24px, 2.4vw, 32px) !important;
    font-weight: 700 !important;
    padding: 26px 22px 0 !important;
  }
  & .home-container.darken .card-collection-header::before {
    content: "— New on AffDoppio";
    display: block;
    margin-bottom: 6px;
    color: var(--rw-orange);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  /* Cards: from image overlays to "image on top, cream body" cards */
  & .box-card {
    display: flex !important;
    flex-direction: column;
    aspect-ratio: auto !important;
    background: var(--rw-card) !important;
    border: var(--rw-border);
    border-radius: 0 !important;
    overflow: hidden;
    color: var(--rw-ink);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
  }
  & .box-card:hover {
    transform: translate(-3px, -3px);
    box-shadow: var(--rw-shadow);
  }
  & .box-card .blur,
  & .box-card .mask {
    display: none !important;
  }
  & .box-card .cover,
  & .box-card.spy_tools img,
  & .box-card-container.spy_tools img {
    height: 170px;
    object-fit: cover;
    border-bottom: var(--rw-border);
    background: #fff;
    transform: none !important;
    filter: none !important; /* the theme recolor above hue-shifts the purple spy-tools artwork */
  }
  & .ad-hero-categories .ad-category-art {
    display: block;
    width: 100%;
    height: auto !important;
    aspect-ratio: 3 / 2;
    object-fit: contain;
    padding: 0;
    background: var(--rw-card) !important;
  }
  & .card-collection-header + .box-card-container .box-card .cover {
    height: 130px;
    object-fit: contain;
    padding: 18px 26px;
    background: #fff;
  }
  & .box-card-container .main-content {
    position: static !important;
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 16px 18px 18px !important;
    backdrop-filter: none !important;
    background: transparent !important;
  }
  & .box-card-container .main-content .header {
    margin-bottom: 8px !important;
    text-shadow: none !important;
  }
  & .box-card-container .main-content .header .title {
    color: var(--rw-ink) !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-transform: none !important;
  }
  & .box-card .highlight-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    margin-right: 10px !important;
    border: 1px solid var(--rw-ink);
    border-radius: 0;
    background: var(--rw-orange);
    flex: none;
  }
  & .box-card .highlight-icon i {
    margin: 0 !important;
    color: #fff !important;
    font-size: 15px !important;
  }
  & .box-card.affiliate_tracker .highlight-icon {
    background: var(--rw-mustard);
  }
  & .box-card.affiliate_tracker .highlight-icon i {
    color: var(--rw-ink) !important;
  }
  & .box-card.ai_content_generators .highlight-icon {
    background: var(--rw-green);
  }
  & .box-card.free_credits .highlight-icon {
    background: var(--rw-ink);
  }
  & .box-card-container .main-content .desc {
    -webkit-line-clamp: 3 !important;
    height: auto !important;
    margin-bottom: 14px !important;
    color: var(--rw-text) !important;
    font-size: 15px !important;
    line-height: 1.5 !important;
    text-shadow: none !important;
  }
  & .box-card-container .main-content .go-btn,
  & .box-card .go-btn {
    margin-top: auto !important;
    height: auto !important;
    width: auto !important;
    padding: 0 !important;
    background: none !important;
    box-shadow: none !important;
    color: var(--rw-orange) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em;
    text-align: left;
    text-transform: uppercase;
  }
  & .box-card .go-btn .button-inner {
    justify-content: flex-start !important;
    background: none !important;
  }
  & .box-card .go-btn .button-inner::after {
    content: " →";
    margin-left: 6px;
  }

  /* "More Fresh Brews": the dark band (like roastworthy's "Roast Science" section) */
  & .frontpage-after-main > .shadow-box {
    background: var(--rw-ink) !important;
  }
  & .frontpage-after-main .home-container.darken .card-collection-header {
    color: #fff !important;
  }
  & .frontpage-after-main .home-container.darken .card-collection-header::before {
    content: "— More to sip on";
    color: var(--rw-mustard);
  }
  & .frontpage-after-main .box-card {
    background: var(--rw-dark-card) !important;
    border-color: var(--rw-dark-line);
  }
  & .frontpage-after-main .box-card .cover {
    border-bottom-color: var(--rw-dark-line);
  }
  & .frontpage-after-main .box-card .main-content .header .title {
    color: #fff !important;
  }
  & .frontpage-after-main .box-card .main-content .desc {
    color: var(--rw-muted) !important;
  }
  & .frontpage-after-main .box-card .go-btn {
    color: var(--rw-mustard) !important;
  }
  & .frontpage-after-main .box-card:hover {
    box-shadow: 6px 6px 0 0 var(--rw-orange);
  }

  /* "Our Daily Grind" carousel */
  & .popular-stores.stores-thumbs {
    padding: 22px 22px 18px !important;
  }
  & .popular-stores.stores-thumbs .widget-title {
    color: var(--rw-ink) !important;
    font-size: 26px !important;
    font-weight: 700 !important;
    text-transform: none !important;
  }
  & .popular-stores.stores-thumbs .widget-title::before {
    content: "— Tools we brew with daily";
    display: block;
    margin-bottom: 6px;
    color: var(--rw-orange);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }
  & .store-carousel .store-thumb,
  & .widget_popular_stores .store-thumb {
    background: #fff !important;
    border: var(--rw-border) !important;
    border-radius: 0 !important;
    overflow: hidden;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
  }
  & .store-carousel .store-thumb:hover,
  & .widget_popular_stores .store-thumb:hover {
    transform: translate(-2px, -2px);
    box-shadow: var(--rw-shadow-sm);
  }
  & .store-carousel .store-name a {
    color: var(--rw-ink) !important;
    font-weight: 600;
  }
  & .slick-arrow {
    background: var(--rw-card) !important;
    border: var(--rw-border) !important;
    border-radius: 50% !important;
    color: var(--rw-ink) !important;
  }

  /* ---------------------------------------------------------- Coupons */
  & .coupon-filter .filter-coupons-by-tab {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  & .coupon-filter .filter-coupons-by-tab .item {
    border: var(--rw-border) !important;
    border-radius: 0 !important;
    background: var(--rw-card) !important;
    color: var(--rw-ink) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    flex: none !important;
    width: auto !important;
    padding: 9px 18px !important;
  }
  & .coupon-filter .filter-coupons-by-tab .item.active {
    background: var(--rw-mustard) !important;
  }
  & .coupon-filter .filter-coupons-by-tab .item::before,
  & .coupon-filter .filter-coupons-by-tab .item::after {
    display: none !important;
  }
  & .coupon-item.store-listing-item,
  & .store-listing-item.shadow-box {
    background: var(--rw-card) !important;
    border: var(--rw-border) !important;
    border-radius: var(--rw-radius) !important;
    box-shadow: none !important;
    margin-bottom: 16px !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
  }
  & .coupon-item.store-listing-item:hover {
    transform: translate(-2px, -2px);
    box-shadow: var(--rw-shadow-sm) !important;
  }
  & .store-listing-item .store-thumb-link .store-thumb {
    background: #fff !important;
    border: var(--rw-border) !important;
    border-radius: 0 !important;
    overflow: hidden;
  }
  & .store-listing-item .store-thumb-link .store-name a {
    color: var(--rw-ink) !important;
    font-weight: 600;
  }
  & .store-listing-item .latest-coupon .coupon-title,
  & .store-listing-item .latest-coupon .coupon-title a {
    color: var(--rw-ink) !important;
    font-size: 19px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
  }
  & .store-listing-item .latest-coupon .coupon-title a:hover {
    color: var(--rw-orange) !important;
  }
  & .store-listing-item .coupon-des,
  & .store-listing-item .coupon-des p,
  & .store-listing-item .coupon-des span {
    color: var(--rw-text) !important;
  }
  & .store-listing-item .coupon-des a.more {
    color: var(--rw-orange) !important;
    font-size: 12px;
    text-transform: uppercase;
  }
  & .coupon-button.coupon-deal,
  & .coupon-button.coupon-code,
  & a.coupon-button {
    background: var(--rw-orange) !important;
    background-image: none !important;
    border: var(--rw-border) !important;
    border-radius: 0 !important;
    color: #fff !important;
    font-weight: 700 !important;
    box-shadow: none !important;
    overflow: hidden;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
  }
  & a.coupon-button:hover {
    transform: translate(-1px, -1px);
    box-shadow: var(--rw-shadow-sm) !important;
  }
  /* "Get Code": same peel design as the live theme (orange tab + diagonal corner over a half-hidden code on a
     striped background), in the draft colors. */
  & .coupon-button.coupon-code {
    background: repeating-linear-gradient(135deg, rgba(35, 23, 16, 0.07) 0 2px, transparent 2px 6px), var(--rw-card) !important;
    color: var(--rw-text) !important;
  }
  & .coupon-button.coupon-code .code-text {
    background: transparent !important;
    color: var(--rw-text) !important;
    font-weight: 600 !important;
    border: 0 !important;
  }
  & .coupon-button.coupon-code .get-code {
    background: var(--rw-orange) !important;
    color: #fff !important;
  }
  & .coupon-button.coupon-code .get-code::after,
  & .coupon-button-type .coupon-code .get-code:after {
    border-left-color: var(--rw-orange) !important;
  }
  & .coupon-button i.icon {
    color: #fff !important;
  }
  & .c-type-sale .offer-count,
  & .offer-count,
  & .c-code,
  & .c-credits,
  & .coupon-details {
    border-radius: 0 !important;
    font-size: 11px !important;
    letter-spacing: 0.04em;
  }
  & .ui.button.btn.btn_primary,
  & .btn_large {
    background: var(--rw-orange) !important;
    border: var(--rw-border) !important;
    border-radius: 0 !important;
    color: #fff !important;
    font-weight: 700 !important;
    padding: 14px 28px !important;
  }
  & .ui.button.btn.btn_primary::after,
  & .btn_large::after {
    content: " →";
  }

  /* ----------------------------------------------- Categories + lists */
  & .list-categories {
    padding: 18px 20px !important;
  }
  & .list-categories li a {
    color: var(--rw-ink) !important;
    font-weight: 500;
  }
  & .list-categories li a:hover {
    color: var(--rw-orange) !important;
  }
  & .list-categories .coupon-count,
  & .widget_recent_entries .coupon-count {
    display: inline-block;
    min-width: 30px;
    padding: 1px 8px;
    margin-right: 6px;
    border: 1px solid var(--rw-ink);
    border-radius: 0;
    background: var(--rw-mustard) !important;
    color: var(--rw-ink) !important;
    font-size: 11px;
    font-weight: 600;
    text-align: center;
  }
  & .widget_recent_entries .coupon-count {
    display: inline;
    min-width: 0;
    padding: 0;
    margin: 0 0 0 4px;
    border: 0;
    background: transparent !important;
    color: var(--rw-text) !important;
    white-space: nowrap;
    opacity: 0.8;
  }
  & .widget_popular_stores .widget-content {
    padding: 18px !important;
  }
  & #main .widget_recent_entries {
    background: var(--rw-card);
    border: var(--rw-border);
    border-radius: var(--rw-radius);
    padding: 20px 22px;
  }
  & #main .widget_recent_entries li {
    border-bottom: 1px dashed rgba(35, 23, 16, 0.2);
    padding: 7px 0;
  }
  & #main .widget_recent_entries li a {
    color: var(--rw-ink) !important;
    font-weight: 600;
  }
  & #main .widget_recent_entries sup {
    color: var(--rw-text);
    font-size: 10.5px;
    opacity: 0.75;
  }

  /* ---------------------------------------------------------- Sidebar */
  & #secondary .widget {
    background: var(--rw-card) !important;
    border: var(--rw-border) !important;
    border-radius: var(--rw-radius) !important;
    box-shadow: none !important;
    padding: 18px 20px !important;
  }
  & #secondary .widget .shadow-box,
  & #secondary .widget .menu-container,
  & #secondary .widget ul.menu,
  & #secondary .widget .textwidget {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  /* The box padding is the only inset: drop the theme's second layer inside sidebar boxes */
  & #secondary .widget ul.menu,
  & #secondary .widget .menu-container,
  & #secondary .widget .list-categories,
  & #secondary .widget .widget-content,
  & #secondary .widget .menu-related-category-tools-container,
  & #secondary .widget .menu-related-category-container {
    padding: 0 !important;
    margin: 0 !important;
  }
  & #secondary .widget .widget-title {
    padding-left: 0 !important;
  }
  /* Category lists in the narrow sidebar: 2-column grid that wraps (theme floats 4 x 25% columns,
     one line each with "…", so names were cut and the rows spilled out of the box) */
  & #secondary .list-categories ul {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 2px 14px;
    margin: 0 !important;
    padding: 0 !important;
  }
  & #secondary .list-categories li {
    float: none !important;
    width: auto !important;
    min-width: 0;
    border-bottom: 1px dashed rgba(35, 23, 16, 0.18);
  }
  & #secondary .list-categories li a {
    display: block !important;
    width: auto !important;
    padding: 7px 0 !important;
    overflow: visible !important;
    white-space: normal !important;
    text-overflow: clip !important;
    line-height: 1.35 !important;
  }
  & #secondary .widget ul.menu li {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  & #secondary .widget_nav_menu ul.menu li {
    border-bottom: 1px dashed rgba(35, 23, 16, 0.18) !important;
  }
  & #secondary .widget_nav_menu ul.menu li:last-child {
    border-bottom: 0 !important;
  }
  & #secondary .widget_nav_menu ul.menu li a {
    color: var(--rw-ink) !important;
    font-weight: 500 !important;
  }
  & #secondary .widget_nav_menu ul.menu li a:hover {
    color: var(--rw-orange) !important;
  }
  & #secondary .ads-area img {
    border: var(--rw-border);
    border-radius: 0;
  }
  & #secondary .ui.horizontal.divider {
    color: var(--rw-orange) !important;
    font-size: 12px !important;
    letter-spacing: 0.06em;
  }

  /* ----------------------------------------------------------- Footer */
  & .site-footer {
    background: var(--rw-ink) !important;
    border-top: var(--rw-border);
    color: var(--rw-muted) !important;
  }
  & .site-footer .widget-title {
    color: var(--rw-mustard) !important;
    font-size: 14px !important;
  }
  & .site-footer p,
  & .site-footer .textwidget {
    color: var(--rw-muted) !important;
  }
  & .ad-footer-brand {
    display: inline-block;
    width: 260px;
    max-width: 100%;
    margin-bottom: 18px;
    line-height: 0;
  }
  & .ad-footer-brand img {
    display: block;
    width: 100%;
    height: auto;
  }
  & .site-footer a,
  & .site-footer .widget_nav_menu ul.menu li a {
    color: var(--rw-muted) !important;
  }
  & .site-footer a:hover {
    color: #fff !important;
  }
  & .site-footer .widget_nav_menu ul.menu li {
    border-color: rgba(201, 184, 166, 0.15) !important;
  }
  & .site-footer .socials a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    margin-right: 8px;
    border: 2px solid var(--rw-dark-line);
    border-radius: 50%;
    color: var(--rw-mustard) !important;
  }
  & .site-footer .socials a i.icon {
    margin: 0 !important;
    color: inherit !important;
    font-size: 16px !important;
    height: auto !important;
    width: auto !important;
  }
  & .site-footer .socials a:hover {
    border-color: var(--rw-mustard);
    color: #fff !important;
  }
  /* ~150 categories: show the first rows and fade out (All Categories is in Site Links) */
  & .site-footer .tagcloud {
    max-height: 300px;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(180deg, #000 75%, transparent);
    mask-image: linear-gradient(180deg, #000 75%, transparent);
  }
  & .site-footer .tagcloud a.tag-cloud-link {
    display: inline-block;
    margin: 0 6px 8px 0;
    padding: 4px 11px;
    border: 1px solid var(--rw-dark-line);
    border-radius: 0;
    color: var(--rw-muted) !important;
    font-size: 12px !important;
    line-height: 1.4;
  }
  & .site-footer .tagcloud a.tag-cloud-link:hover {
    border-color: var(--rw-mustard);
    color: var(--rw-mustard) !important;
  }
  & .site-footer .footer_copy {
    border-top: 1px solid var(--rw-dark-line) !important;
    color: var(--rw-muted) !important;
    font-size: 12px !important;
  }
  & .site-footer .footer_copy a {
    color: var(--rw-mustard) !important;
  }

  /* Social icons: the theme's icon font has no brand glyphs, so draw them with Font Awesome Brands */
  & .site-footer .socials a i.icon::before {
    font-family: "Font Awesome 5 Brands" !important;
    font-weight: 400 !important;
  }
  & .site-footer .socials a i.facebook.icon::before {
    content: "\f39e";
  }
  & .site-footer .socials a i.twitter.icon::before {
    content: "\f099";
  }
  & .site-footer .socials a i.instagram.icon::before {
    content: "\f16d";
  }

  /* ------------------------------------------------------- Store page */
  & .single-store-header .inner.shadow-box {
    padding: 22px 24px !important;
  }
  & .single-store-header .header-store-thumb {
    background: #fff !important;
    border: var(--rw-border) !important;
    overflow: hidden;
  }
  & .single-store-header .header-store-thumb img {
    border: 0 !important;
  }
  & .single-store-header .header-content h1 {
    color: var(--rw-ink) !important;
  }
  & .single-store-header .header-content h1 strong {
    color: var(--rw-orange);
  }
  & .single-store-header .updated-line,
  & .single-store-header .updated-line * {
    color: var(--rw-text) !important;
    opacity: 0.85;
  }
  & .single-store-header .intro,
  & .single-store-header .intro p {
    color: var(--rw-text) !important;
  }
  /* Gap between the store logo frame and the "Brew me a deal" button */
  & .single-store-header .surprise-widget {
    margin-top: 14px !important;
  }
  & #surpriseButton {
    display: block;
    text-align: center;
    padding: 12px 10px !important;
    background: var(--rw-mustard) !important;
    background-image: none !important;
    border: var(--rw-border) !important;
    color: var(--rw-ink) !important;
    font-weight: 700 !important;
    letter-spacing: 0.06em;
    transition: background 0.15s ease, color 0.15s ease;
  }
  & #surpriseButton:hover {
    background: var(--rw-orange) !important;
    color: #fff !important;
  }
  & #surpriseButton i.icon {
    color: inherit !important;
  }

  /* Strip: coupons valid from ... till ... */
  & .todays-deals {
    margin-bottom: 14px;
    padding: 12px 16px !important;
    border: var(--rw-border);
    background: var(--rw-ink) !important;
    color: var(--rw-mustard) !important;
  }
  & .todays-deals strong {
    color: var(--rw-mustard) !important;
    font-weight: 600;
  }

  /* All / Codes / Credits / Sales / Trial filters */
  & .coupon-filter .filter-coupons-by-type {
    display: flex !important;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }
  & .coupon-filter .filter-coupons-by-type .item {
    flex: 1 1 0 !important;
    min-width: 0;
    justify-content: center;
    padding: 10px 4px !important;
    white-space: nowrap;
    border: var(--rw-border) !important;
    background: var(--rw-card) !important;
    color: var(--rw-ink) !important;
    font-weight: 700 !important;
  }
  & .coupon-filter .filter-coupons-by-type .item:hover {
    background: var(--rw-sand) !important;
  }
  & .coupon-filter .filter-coupons-by-type .item.active {
    background: var(--rw-mustard) !important;
  }
  & .coupon-filter .filter-coupons-by-type .item::before,
  & .coupon-filter .filter-coupons-by-type .item::after {
    display: none !important;
  }
  & .coupon-filter .filter-coupons-by-type .item .offer-count {
    margin-left: 6px;
    padding: 2px 7px;
    background: var(--rw-ink) !important;
    color: #fff !important;
  }
  & .coupon-filter .filter-coupons-by-type .item.active .offer-count {
    background: var(--rw-orange) !important;
  }

  /* Deal labels (coupon cards + sidebar), in the palette */
  & .c-code {
    background: var(--rw-mustard) !important;
    color: var(--rw-ink) !important;
  }
  & .c-discount {
    background: var(--rw-orange) !important;
    color: #fff !important;
  }
  & .c-credits {
    background: var(--rw-green) !important;
    color: #fff !important;
  }
  & .c-money-back-guarantee {
    background: var(--rw-mustard) !important;
    color: var(--rw-ink) !important;
  }
  & .c-trial,
  & .c-freemium {
    background: var(--rw-ink) !important;
    color: #fff !important;
  }

  /* Coupon card footer: categories, uses, share/email */
  & .coupon-item .coupon-footer,
  & .coupon-item .coupon-listing-footer {
    border-top: 1px dashed rgba(35, 23, 16, 0.25) !important;
    background: transparent !important;
  }
  & .coupon-item .coupon-footer li,
  & .coupon-item .coupon-footer a,
  & .coupon-item .coupon-listing-footer li,
  & .coupon-item .coupon-listing-footer a {
    color: var(--rw-text) !important;
  }
  & .coupon-item .coupon-footer a:hover,
  & .coupon-item .coupon-listing-footer a:hover {
    color: var(--rw-orange) !important;
  }
  & .coupon-item .coupon-footer i.icon,
  & .coupon-item .coupon-listing-footer i.icon {
    color: var(--rw-orange) !important;
  }
  & .coupon-item .user-ratting .ui.button {
    background: var(--rw-card) !important;
    border: 1px solid var(--rw-ink) !important;
    box-shadow: none !important;
  }
  & .coupon-item .reveal-content {
    background: var(--rw-cream) !important;
    border: var(--rw-border) !important;
  }

  /* Sidebar: alternatives list, product family */
  & .menu-related-category-tools-container li {
    border-bottom: 1px dashed rgba(35, 23, 16, 0.18) !important;
  }
  & .menu-related-category-tools-container li a {
    color: var(--rw-ink) !important;
    font-weight: 600;
  }
  & .menu-related-category-tools-container li a:hover {
    color: var(--rw-orange) !important;
  }
  /* Alternatives list: name left, price tag right, compact badges underneath, even rows */
  & .menu-related-category-tools-container li:first-child {
    padding-bottom: 12px !important;
  }
  & .menu-related-category-tools-container li:first-child p {
    margin: 6px 0 0 !important;
    color: var(--rw-ink) !important;
    font-size: 15px !important;
    font-weight: 700;
    line-height: 1.35;
  }
  & .menu-related-category-tools-container .coupon-menu-item {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    padding: 12px 0 !important;
    margin: 0 !important;
  }
  & .menu-related-category-tools-container .coupon-menu-item .space-between {
    display: flex !important;
    width: 100%;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
  }
  & .menu-related-category-tools-container .coupon-menu-item .space-between a {
    flex: 1;
    min-width: 0;
    line-height: 1.35 !important;
  }
  & .menu-related-category-tools-container .price-from {
    flex: none;
    margin: 0 !important;
    padding: 2px 7px;
    border: 1px solid var(--rw-ink);
    background: var(--rw-cream);
    color: var(--rw-text) !important;
    font-size: 11.5px !important;
    line-height: 1.5;
    white-space: nowrap;
  }
  & .menu-related-category-tools-container .price-from i {
    color: var(--rw-orange) !important;
    font-style: normal !important;
    font-weight: 700;
  }
  & .menu-related-category-tools-container .coupon-menu-item .coupon-details {
    display: inline-block !important;
    width: auto !important;
    max-width: 100%;
    margin: 0 !important;
    padding: 3px 8px !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }
  & .menu-related-category-tools-container .store-visits {
    display: none !important;
  }
  & .widget-sister-coupons h3 {
    color: var(--rw-orange) !important;
    font-size: 13px !important;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }
  & .widget-sister-coupons .store-thumb img {
    border: var(--rw-border);
    background: #fff;
  }
  & .widget-sister-coupons .store-thumb strong,
  & .widget-sister-coupons .store-thumb a {
    color: var(--rw-ink) !important;
  }
  & .menu-related-category-container a {
    color: var(--rw-orange) !important;
    font-weight: 600;
  }
  & #secondary .widget_popular_stores li a {
    color: var(--rw-ink) !important;
  }

  /* Review content */
  & .store-extra-info {
    margin-top: 22px;
    padding: 26px 30px !important;
    background: var(--rw-card) !important;
    border: var(--rw-border) !important;
    box-shadow: none !important;
    color: var(--rw-text) !important;
  }
  & .store-extra-info h2 {
    padding-bottom: 10px;
    border-bottom: var(--rw-border);
    color: var(--rw-ink) !important;
  }
  & .store-extra-info h3 {
    padding-left: 12px;
    border-left: 4px solid var(--rw-orange);
    color: var(--rw-ink) !important;
  }
  & .store-extra-info h4 {
    color: var(--rw-ink) !important;
  }
  & .store-extra-info p,
  & .store-extra-info li {
    color: var(--rw-text) !important;
  }
  & .store-extra-info ul li::marker,
  & .store-extra-info ol li::marker {
    color: var(--rw-orange);
    font-weight: 700;
  }
  & .store-extra-info table {
    width: 100%;
    border-collapse: collapse !important;
    border: var(--rw-border) !important;
    background: #fff;
  }
  & .store-extra-info table th,
  & .store-extra-info table thead td {
    background: var(--rw-ink) !important;
    color: #fff !important;
    border-color: var(--rw-ink) !important;
  }
  & .store-extra-info table td,
  & .store-extra-info table th {
    padding: 9px 12px !important;
    border: 1px solid rgba(35, 23, 16, 0.18) !important;
  }
  & .store-extra-info table tr:nth-child(even) td {
    background: var(--rw-cream);
  }
  & .store-extra-info blockquote {
    border-left: 4px solid var(--rw-mustard) !important;
    background: var(--rw-sand) !important;
    color: var(--rw-ink) !important;
  }
  & .store-extra-info figure.captioned,
  & .store-extra-info img.clickable {
    border: var(--rw-border) !important;
  }
  & .store-extra-info .fact-box {
    background: var(--rw-cream) !important;
    border: var(--rw-border) !important;
  }
  & .store-extra-info .fact-box h3 {
    border-left: 0;
    padding-left: 0;
  }
  & .store-extra-info .coupon-insertion {
    background: var(--rw-sand) !important;
    border: 2px dashed var(--rw-ink) !important;
    box-shadow: none !important;
  }
  & .store-extra-info .cta-ribbon {
    background: var(--rw-orange) !important;
    color: #fff !important;
  }
  & .wp-block-button__link,
  & .contact-buttons a {
    background: var(--rw-orange) !important;
    border: var(--rw-border) !important;
    color: #fff !important;
  }

  /* Floating review table of contents */
  & #stickytoc {
    border: var(--rw-border) !important;
    background: var(--rw-card) !important;
    box-shadow: none !important;
  }
  & #stickytoc .toc-header {
    background-color: var(--rw-ink) !important;
  }
  & #stickytoc .author-name {
    color: var(--rw-text) !important;
  }
  & #stickytoc .toc-body a {
    color: var(--rw-ink) !important;
  }
  & #stickytoc .toc-body a:hover {
    color: var(--rw-orange) !important;
  }
  & #stickytoc button {
    background: var(--rw-mustard) !important;
    border: 1px solid var(--rw-ink) !important;
    color: var(--rw-ink) !important;
  }

  /* Store FAQ */
  & .store-faq h3 {
    margin-top: 12px !important;
    padding: 12px 16px !important;
    border: var(--rw-border) !important;
    background: var(--rw-cream);
  }
  & .store-faq h3 + p {
    margin: 0 0 6px !important;
    padding: 12px 16px;
    border: 2px solid var(--rw-ink);
    border-top: 0;
    background: #fff;
  }

  /* Exit popup */
  & .exit-intent-content {
    background: var(--rw-card) !important;
    border: var(--rw-border);
  }
  & .exit-intent-header {
    background: var(--rw-ink) !important;
    border-bottom: 2px dashed var(--rw-mustard) !important;
  }

  /* ------------------------------------------------- Coupon popup */
  & .aw-dimmer {
    background: rgba(35, 23, 16, 0.72) !important;
  }
  /* Centred on the screen (margin: auto in the flex dimmer; a popup taller than the screen still scrolls), cream
     border, soft shadow (a dark offset shadow reads as a stray edge on the dark backdrop). */
  & .aw-dimmer .ui.modal.coupon-modal {
    margin: auto !important;
    border: 2px solid #fffaf0 !important;
    border-radius: 0 !important;
    background: var(--rw-card) !important;
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.45) !important;
    overflow: hidden;
  }
  & .aw-dimmer .coupon-modal * {
    border-radius: 0 !important;
  }
  /* Header: logo + offer text */
  & .coupon-modal .coupon-header {
    background: var(--rw-card) !important;
    border-bottom: var(--rw-border) !important;
  }
  & .coupon-modal .coupon-store-thumb img {
    border: var(--rw-border) !important;
    background: #fff;
  }
  & .coupon-modal .coupon-header .coupon-title,
  & .coupon-modal .coupon-header .coupon-title * {
    color: var(--rw-ink) !important;
  }
  & .coupon-modal .cancel.close {
    opacity: 1 !important;
    color: var(--rw-ink) !important;
  }
  /* Body: the code box */
  & .coupon-modal .coupon-content {
    background: var(--rw-cream) !important;
  }
  & .coupon-modal .coupon-type-text {
    color: var(--rw-orange) !important;
    font-weight: 700 !important;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }
  & .coupon-modal .modal-code {
    background: transparent !important;
    box-shadow: none !important;
  }
  & .coupon-modal .modal-code .ui.action.input {
    display: flex !important;
    width: 100% !important;
    padding: 0 !important;
  }
  & .coupon-modal .modal-code .code-text,
  & .coupon-modal .coupon-content .modal-code .code-text {
    flex: 1 1 auto;
    min-width: 0;
    width: 100% !important;
    font-size: clamp(15px, 1.45vw, 22px) !important;
    letter-spacing: 1px !important;
    text-overflow: clip;
    background: #fff !important;
    border: 2px dashed var(--rw-ink) !important;
    border-right: 0 !important;
    color: var(--rw-ink) !important;
  }
  & .coupon-modal .modal-code .ui.action.input > .button,
  & .coupon-modal .modal-code button.btn_secondary {
    background: var(--rw-orange) !important;
    border: var(--rw-border) !important;
    color: #fff !important;
    box-shadow: none !important;
  }
  & .coupon-modal .modal-code button.btn_secondary:hover {
    background: var(--rw-orange-dark) !important;
  }
  & .coupon-modal .modal-code button.btn_secondary i.icon {
    background: rgba(0, 0, 0, 0.12) !important;
    color: #fff !important;
  }
  /* Votes + "Go to {store}" */
  & .coupon-modal .user-ratting .ui.button {
    background: var(--rw-card) !important;
    border: 1px solid var(--rw-ink) !important;
    box-shadow: none !important;
    color: var(--rw-ink) !important;
  }
  & .coupon-modal .user-ratting .ui.button:hover {
    background: var(--rw-mustard) !important;
  }
  & .coupon-modal a.go-store,
  & .coupon-modal a.go-store.btn_secondary {
    background: var(--rw-ink) !important;
    border: var(--rw-border) !important;
    color: #fff !important;
    box-shadow: none !important;
  }
  & .coupon-modal a.go-store:hover {
    background: var(--rw-orange) !important;
  }
  & .coupon-modal .user-ratting-text,
  & .coupon-modal .show-detail a {
    color: var(--rw-text) !important;
    font-weight: 600;
  }
  & .coupon-modal .show-detail a:hover {
    color: var(--rw-orange) !important;
  }
  & .coupon-modal .coupon-popup-detail {
    border-top: 1px dashed rgba(35, 23, 16, 0.25);
    color: var(--rw-text) !important;
  }
  /* Footer: uses + success */
  & .coupon-modal .coupon-footer {
    background: var(--rw-ink) !important;
    border-top: var(--rw-border) !important;
  }
  & .coupon-modal .coupon-footer,
  & .coupon-modal .coupon-footer span,
  & .coupon-modal .coupon-footer i.icon {
    color: var(--rw-mustard) !important;
  }

  /* ------------------------------------------------------------ Icons */
  /* Font Awesome 5 Free (solid) ships with the theme bundle. Menu items are targeted by WordPress id
     (menu-item-{id}), sidebar/footer boxes by title (widget-{slug}). */
  & .st-menu > li > a::before,
  & .header-highlight .highlight-icon::before,
  & .widget-title::before,
  & .ad-intro .ad-intro-stats span::before,
  & .coupon-filter .filter-coupons-by-tab .item.filter-nav::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
  }

  /* Main menu */
  & .st-menu > li > a::before {
    display: inline-block;
    margin-right: 7px;
    color: var(--rw-orange);
    font-size: 0.95em;
  }
  & .st-menu > li.menu-item-3966 > a::before { content: "\f518"; } /* The Menu: book-open */
  & .st-menu > li.menu-item-4026 > a::before { content: "\f5fd"; } /* Blends: layer-group */
  & .st-menu > li.menu-item-4071 > a::before { content: "\f0f4"; } /* Coffee Bar: coffee */
  & .st-menu > li.menu-item-4081 > a::before { content: "\f21b"; } /* Spy Shots: user-secret */
  & .st-menu > li.menu-item-4094 > a::before,
  & .st-menu > li.menu-item-4095 > a::before { content: "\f086"; } /* forums: comments */

  /* Header shortcuts: equal-width columns, square icon chip centred above the label */
  & .header-highlight > a {
    display: inline-flex !important;
    flex-direction: column;
    align-items: center;
    width: auto;
    min-width: 72px;
    padding: 0 6px;
    margin: 6px 0 0 8px !important;
    text-align: center;
    vertical-align: top;
  }
  & .header-highlight .highlight-icon {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    margin: 0 0 8px !important;
    border: var(--rw-border);
    background: var(--rw-card);
    box-shadow: none !important;
    transition: background 0.15s ease, color 0.15s ease;
  }
  & .header-highlight .highlight-icon i {
    display: none !important;
  }
  & .header-highlight .highlight-icon::before {
    color: var(--rw-orange);
    font-size: 18px;
    line-height: 1;
  }
  & .header-highlight .highlight-text {
    width: 100%;
    text-align: center !important;
    white-space: nowrap;
    line-height: 1.2 !important;
  }
  & .header-highlight > a:hover .highlight-icon {
    background: var(--rw-orange);
  }
  & .header-highlight a:hover .highlight-icon::before {
    color: #fff;
  }
  & .header-highlight a.menu-item-4118 .highlight-icon::before { content: "\f544"; } /* AI Tools: robot */
  & .header-highlight a.menu-item-4119 .highlight-icon::before { content: "\f1e5"; } /* Spy Tools: binoculars */
  & .header-highlight a.menu-item-4120 .highlight-icon::before { content: "\f3ff"; } /* Discount Coupons: ticket */
  & .header-highlight a.menu-item-4121 .highlight-icon::before { content: "\f06b"; } /* Free Credits: gift */

  /* Intro count badges */
  & .ad-intro .ad-intro-stats span::before {
    margin-right: 6px;
    color: var(--rw-orange);
  }
  & .ad-intro .ad-intro-stats span:nth-child(1)::before { content: "\f3ff"; } /* coupons: ticket */
  & .ad-intro .ad-intro-stats span:nth-child(2)::before { content: "\f552"; } /* tools: toolbox */
  & .ad-intro .ad-intro-stats span:nth-child(3)::before { content: "\f009"; } /* categories: th-large */
  & .ad-intro .ad-intro-stats span:nth-child(4)::before { content: "\f017"; } /* updated: clock */

  /* "Latest Coupons" tab */
  & .coupon-filter .filter-coupons-by-tab .item.filter-nav::before {
    content: "\f06d" !important; /* fire */
    display: inline-block !important;
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin-right: 7px;
    background: none !important;
    border: 0 !important;
    transform: none !important;
    color: var(--rw-orange-dark);
  }

  /* Store page */
  & .todays-deals::before,
  & .store-faq > h2::before {
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
    margin-right: 8px;
  }
  & .todays-deals::before {
    content: "\f073"; /* calendar-alt */
    color: var(--rw-mustard);
  }
  & .store-faq > h2::before {
    content: "\f059"; /* question-circle */
    color: var(--rw-orange);
  }

  /* Section + sidebar titles: the "— " becomes an icon */
  & .widget-title::before {
    content: "\f0da"; /* caret-right (fallback) */
    margin-right: 8px;
  }
  & #st_categories-4 .widget-title::before { content: "\f009"; } /* th-large */
  & .widget_popular_stores .widget-title::before { content: "\f004"; } /* heart */
  & #main .widget_recent_entries .widget-title:first-of-type::before { content: "\f021"; } /* sync */
  & #main .widget_recent_entries .widget-title:nth-of-type(2)::before { content: "\f4d8"; } /* seedling */
  & .widget-most-popular-coupons .widget-title::before { content: "\f005"; } /* star */
  & .widget-affiliate-trackers .widget-title::before { content: "\f201"; } /* chart-line */
  & .widget-affiliate-essentials .widget-title::before { content: "\f552"; } /* toolbox */
  & .widget-free-affiliate-courses .widget-title::before { content: "\f19d"; } /* graduation-cap */
  & .widget-traffic-optimization .widget-title::before { content: "\f3fd"; } /* tachometer-alt */
  & .widget-special-traffic-tricks .widget-title::before { content: "\f0d0"; } /* magic */

  /* Footer titles */
  & .site-footer .widget-title::before {
    content: "\f0da";
    margin-right: 8px;
    color: var(--rw-orange);
  }
  & .site-footer .widget_text .widget-title::before { content: "\f0f4"; } /* About: coffee */
  & .site-footer .widget-site-links .widget-title::before { content: "\f0c1"; } /* link */
  & .site-footer .widget-top-5-spy-tool-coupons .widget-title::before { content: "\f21b"; } /* user-secret */
  & .site-footer .widget-useful-website-tools .widget-title::before { content: "\f0ad"; } /* wrench */
  & .site-footer .widget-top-3-copywriter-coupons-deals .widget-title::before { content: "\f303"; } /* pencil-alt */
  & .site-footer .widget-affiliate-communities .widget-title::before { content: "\f0c0"; } /* users */
  & .site-footer .widget-affiliate-events .widget-title::before { content: "\f073"; } /* calendar-alt */
  & .site-footer .widget-best-of-the-roast .widget-title::before { content: "\f091"; } /* trophy */
  & .site-footer .widget_tag_cloud .widget-title::before { content: "\f02c"; } /* tags */

  /* The carousel title keeps its text label (not an icon) */
  & .popular-stores.stores-thumbs .widget-title::before {
    font-family: inherit !important;
    font-weight: 600 !important;
    margin-right: 0;
  }

  /* ------------------------------------------------- Square corners */
  /* No rounded corners anywhere in the redesign (cards, logos, buttons, tabs, search, badges)... */
  & #masthead *,
  & #siteNavigation *,
  & #content-wrap *,
  & .custom-page-header *,
  & #exit-intent *,
  & .site-footer * {
    border-radius: 0 !important;
  }
  /* ...except the small circular icons. */
  & #content-wrap .box-card .highlight-icon,
  & #content-wrap .slick-arrow,
  & .site-footer .socials a {
    border-radius: 50% !important;
  }
}

/* ------------------------------------------- Category, pages, search, 404 */
html:has(.ad-roast) {
  /* -------------------------------------------------- Coupon category */
  & .custom-page-header .inner.shadow-box.category-header {
    position: relative;
    background: var(--rw-card) !important;
    background-image: none !important;
    padding: 24px 120px 22px 26px !important;
  }
  /* Tag badge in place of the old isometric illustration */
  & .custom-page-header .inner.shadow-box.category-header::after {
    content: "\f02b";
    position: absolute;
    top: 22px;
    right: 24px;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: var(--rw-border);
    background: var(--rw-mustard);
    box-shadow: var(--rw-shadow-sm);
    color: var(--rw-ink);
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 26px;
  }
  & .category-header .header-content h1 {
    color: var(--rw-ink) !important;
    margin-bottom: 12px !important;
  }
  & .category-header .header-content h1 strong {
    color: var(--rw-orange) !important;
  }
  & .category-header .ad-verified-note {
    display: inline-block;
    margin-bottom: 12px !important;
    padding: 5px 12px !important;
    border: 1px solid var(--rw-ink) !important;
    background: var(--rw-sand);
    color: var(--rw-ink);
    font-size: 12.5px !important;
    font-weight: 500;
  }
  & .category-header .category-meta p {
    margin: 0;
    color: var(--rw-text) !important;
  }
  & .category-header .category-meta strong {
    color: var(--rw-ink);
  }
  & .category-header .category-meta u {
    text-decoration: none;
    border-bottom: 2px solid var(--rw-mustard);
  }

  /* Store grids (category page "N sites", search results): one card per store */
  & #store-listings > .widget-title {
    margin: 26px 0 12px !important;
  }
  & #store-listings .list-stores.shadow-box {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
  }
  & #store-listings .list-stores .ui.grid {
    margin: 0 !important;
  }
  & #store-listings .list-stores ul.row {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin: 0 !important;
    padding: 0 !important;
  }
  & #store-listings .list-stores li.column {
    width: auto !important;
    margin: 0 !important;
    padding: 12px 12px 14px !important;
    border: var(--rw-border);
    background: var(--rw-card);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
  }
  & #store-listings .list-stores li.column:hover {
    transform: translate(-2px, -2px);
    box-shadow: var(--rw-shadow-sm);
  }
  & #store-listings .list-stores li.column img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: contain;
    margin-bottom: 10px;
    border: 1px solid var(--rw-ink);
    background: #fff;
  }
  & #store-listings .list-stores li.column > div {
    color: var(--rw-text);
    font-size: 12px;
  }
  & #store-listings .list-stores .store-title {
    margin: 4px 0 0 !important;
    font-size: 15px !important;
  }
  & #store-listings .list-stores .store-title a {
    color: var(--rw-ink) !important;
  }
  & #store-listings .list-stores li.column:hover .store-title a {
    color: var(--rw-orange) !important;
  }

  /* Full-width pages (search): four smaller cards per row */
  & .no-sidebar #store-listings .list-stores ul.row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  & #store-listings .list-stores .store-title a {
    font-weight: 700;
  }

  /* Pagination */
  & .ui.pagination.menu {
    display: inline-flex !important;
    flex-wrap: wrap;
    gap: 6px;
    min-height: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  & .ui.pagination.menu .item {
    min-width: 40px !important;
    justify-content: center;
    padding: 9px 12px !important;
    border: var(--rw-border) !important;
    background: var(--rw-card) !important;
    color: var(--rw-ink) !important;
    font-weight: 600;
  }
  & .ui.pagination.menu .item::before {
    display: none !important;
  }
  & .ui.pagination.menu .item:hover {
    background: var(--rw-mustard) !important;
  }
  & .ui.pagination.menu .item.active {
    background: var(--rw-orange) !important;
    color: #fff !important;
  }

  /* ----------------------------------------- Page hero (text pages etc.) */
  & .article .hero {
    height: auto !important;
    margin-bottom: 18px;
    padding: 42px 24px 38px !important;
    border: var(--rw-border);
    background: var(--rw-ink) !important;
    text-shadow: none !important;
    text-transform: none !important;
  }
  & .article .hero .wrap {
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 0 !important;
  }
  & .article .hero .wrap::before {
    content: "— AffDoppio —";
    color: var(--rw-mustard);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
  }
  & .page-template-stores_az .hero .wrap::before {
    content: "— Every tool on the menu, A to Z —";
  }
  & .page-template-coupon_categories .hero .wrap::before {
    content: "— Every blend we pour —";
  }
  & .page-template-contact .hero .wrap::before {
    content: "— Pull up a chair —";
  }
  & .article .hero h1 {
    display: block !important;
    padding: 0 !important;
    background: transparent !important;
    color: var(--rw-cream) !important;
    font-size: 34px !important;
    line-height: 1.25 !important;
  }

  /* Text content (privacy, disclaimer, about...) */
  & .article .content-box.article-content {
    padding: 30px 36px !important;
  }
  & .article .article-content p,
  & .article .article-content li {
    color: var(--rw-text);
    line-height: 1.75;
  }
  & .article .article-content h2 {
    margin: 28px 0 12px !important;
    padding-left: 12px;
    border-left: 6px solid var(--rw-orange);
    color: var(--rw-ink) !important;
    font-size: 22px !important;
  }
  & .article .article-content h3,
  & .article .article-content h3 a {
    color: var(--rw-ink) !important;
  }
  & .article .article-content p a,
  & .article .article-content li a {
    color: var(--rw-orange) !important;
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  & .article .article-content em {
    display: inline-block;
    padding: 3px 10px;
    border: 1px solid var(--rw-ink);
    background: var(--rw-sand);
    color: var(--rw-ink);
    font-size: 12.5px;
    font-style: normal;
  }
  & .ad-page-lead {
    margin: 0 0 22px !important;
    padding: 12px 16px;
    border-left: 6px solid var(--rw-mustard);
    background: var(--rw-sand);
    color: var(--rw-ink) !important;
    font-size: 16px;
  }

  /* --------------------------------------------------------- All Stores */
  & .store-az.shadow-box {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }
  & .article .content-box:has(.store-az),
  & .article .content-box:has(> .list-categories) {
    padding: 24px !important;
  }
  & .store-az .store-az-letters.ui.pagination.menu {
    display: flex !important;
    gap: 6px;
    margin: 0 0 22px !important;
    padding: 12px !important;
    border: var(--rw-border) !important;
    background: var(--rw-ink) !important;
    box-shadow: none !important;
  }
  & .store-az .store-az-letters.ui.pagination.menu .item {
    min-width: 38px !important;
    justify-content: center;
    padding: 8px 10px !important;
    border: 2px solid var(--rw-cream) !important;
    background: transparent !important;
    color: var(--rw-cream) !important;
    font-weight: 700;
    text-decoration: none !important;
  }
  & .store-az .store-az-letters.ui.pagination.menu .item::before {
    display: none !important;
  }
  & .store-az .store-az-letters.ui.pagination.menu .item:hover {
    border-color: var(--rw-mustard) !important;
    background: var(--rw-mustard) !important;
    color: var(--rw-ink) !important;
  }
  & .store-az .store-az-group {
    margin-bottom: 22px;
    padding: 18px 20px 12px;
    border: var(--rw-border);
    background: var(--rw-card);
    scroll-margin-top: 20px;
  }
  & .store-az .store-az-group > h3.widget-title {
    margin: 0 0 10px !important;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--rw-ink);
    color: var(--rw-ink) !important;
    font-size: 26px !important;
    letter-spacing: 0 !important;
  }
  & .store-az .store-az-group > h3.widget-title::before {
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-right: 10px;
    background: var(--rw-orange);
  }
  & .store-az .store-az-group ul.grid {
    margin: 0 !important;
  }
  & .store-az .store-az-group li.column {
    padding: 7px 8px !important;
    border-bottom: 1px dashed rgba(35, 23, 16, 0.18);
  }
  & .store-az .store-az-group li.column a {
    color: var(--rw-ink) !important;
    font-weight: 600;
    text-decoration: none !important;
  }
  & .store-az .store-az-group li.column a:hover {
    color: var(--rw-orange) !important;
  }
  & .store-az .store-az-group .coupon-count {
    color: var(--rw-text);
    font-size: 12px;
    opacity: 0.75;
  }

  /* ------------------------------------------------- Coupon Categories */
  & .article .content-box > .list-categories {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }
  & .article .content-box > .list-categories ul.row {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0 !important;
  }
  & .article .content-box > .list-categories li.column {
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  & .article .content-box > .list-categories li.column a {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 100%;
    padding: 10px 12px;
    border: var(--rw-border);
    background: var(--rw-card);
    color: var(--rw-ink) !important;
    font-weight: 600;
    text-decoration: none !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
  }
  & .article .content-box > .list-categories li.column a:hover {
    transform: translate(-2px, -2px);
    box-shadow: var(--rw-shadow-sm);
    color: var(--rw-orange) !important;
  }
  & .article .content-box > .list-categories .coupon-count {
    flex: none;
    min-width: 40px;
    margin: 0 !important;
  }

  /* ------------------------------------------------------------ Contact */
  & .wpcf7-form .field {
    margin-bottom: 16px !important;
  }
  & .ui.form.wpcf7-form .field > label {
    margin-bottom: 6px !important;
    color: var(--rw-ink) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }
  & .ui.form.wpcf7-form input[type],
  & .ui.form.wpcf7-form textarea {
    width: 100% !important;
    max-width: 640px;
    padding: 11px 13px !important;
    border: var(--rw-border) !important;
    border-radius: 0 !important;
    background: #fff !important;
    color: var(--rw-ink) !important;
    box-shadow: none !important;
  }
  & .ui.form.wpcf7-form input[type]:focus,
  & .ui.form.wpcf7-form textarea:focus {
    border-color: var(--rw-orange) !important;
    box-shadow: 4px 4px 0 0 var(--rw-mustard) !important;
    outline: none;
  }
  & .wpcf7-form .ui.message {
    max-width: 640px;
    border: var(--rw-border) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  /* ---------------------------------------- Search + Blog page headers */
  & #content-wrap > .custom-page-header {
    margin-bottom: 18px;
  }
  & #content-wrap > .custom-page-header .inner.shadow-box {
    padding: 26px 28px !important;
    background: var(--rw-ink) !important;
  }
  & #content-wrap > .custom-page-header h1 {
    margin: 0 !important;
    color: var(--rw-cream) !important;
  }
  & #content-wrap > .custom-page-header h1::before {
    content: "— AffDoppio —";
    display: block;
    margin-bottom: 8px;
    color: var(--rw-mustard);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
  }
  & #content-wrap > .custom-page-header p,
  & #content-wrap > .custom-page-header .archive-description {
    color: var(--rw-muted) !important;
  }
  & .ui.message {
    border: var(--rw-border) !important;
    border-radius: 0 !important;
    background: var(--rw-card) !important;
    box-shadow: none !important;
    color: var(--rw-ink) !important;
  }
  & .st-list-coupons > .widget-title,
  & #main > section > .widget-title {
    margin: 22px 0 12px !important;
  }
  & .post-item.shadow-box {
    padding: 0 0 16px !important;
    overflow: hidden;
  }
  & .post-item .entry-title a {
    color: var(--rw-ink) !important;
  }

  /* ---------------------------------------------------------------- 404 */
  & .error-404.not-found {
    padding: 48px 28px !important;
  }
  & .error-404.not-found::before {
    content: "\f0f4";
    display: flex;
    align-items: center;
    justify-content: center;
    width: 84px;
    height: 84px;
    margin: 0 auto 18px;
    border: var(--rw-border);
    background: var(--rw-mustard);
    box-shadow: var(--rw-shadow-sm);
    color: var(--rw-ink);
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    font-size: 34px;
  }
  & .error-404 .page-title {
    color: var(--rw-ink) !important;
    font-size: 32px !important;
  }
  & .error-404 p {
    color: var(--rw-text);
  }
  & .error-404 .ui.button.btn:not(.btn_primary) {
    padding: 12px 20px !important;
    border: var(--rw-border) !important;
    background: var(--rw-card) !important;
    color: var(--rw-ink) !important;
    font-weight: 700 !important;
  }
  & .error-404 .ui.button.btn:not(.btn_primary):hover {
    background: var(--rw-mustard) !important;
  }

  /* ------------------------------------------------------------- Mobile */
  @media (max-width: 767px) {
    & #store-listings .list-stores ul.row,
    & .no-sidebar #store-listings .list-stores ul.row,
    & .article .content-box > .list-categories ul.row {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    & .custom-page-header .inner.shadow-box.category-header {
      padding-right: 26px !important;
    }
    & .custom-page-header .inner.shadow-box.category-header::after {
      display: none;
    }
    & .article .hero h1 {
      font-size: 26px !important;
    }
    & .article .content-box.article-content {
      padding: 22px 18px !important;
    }
  }
}

/* ------------------------------------------------------ Accessibility */
html:has(.ad-roast) {
  /* Visible keyboard focus everywhere (the theme removes outlines). */
  & a:focus-visible,
  & button:focus-visible,
  & input:focus-visible,
  & select:focus-visible,
  & textarea:focus-visible,
  & [tabindex]:focus-visible,
  & .ui.button:focus-visible {
    outline: 3px solid var(--rw-orange) !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 5px var(--rw-mustard) !important;
  }
  & .site-footer a:focus-visible,
  & .todays-deals a:focus-visible {
    outline-color: var(--rw-mustard) !important;
    box-shadow: none !important;
  }
  /* Footer legal links: 24px+ tap targets */
  & .site-footer .footer_copy a {
    display: inline-block;
    padding: 6px 2px;
  }
  /* Store page H1 (inline line-height 3rem) reads tighter on phones */
  @media (max-width: 767px) {
    & .single-store-header .header-content h1 {
      line-height: 1.3 !important;
    }
  }
}

/* ------------------------------------------------------- Small screens */
html:has(.ad-roast) {
  /* Store page logo box: own size, so a category page's `.header-thumb { width: 120px }` (still loaded after an
     in-site navigation) can't squeeze and crop the logo. */
  & .single-store-header .header-thumb {
    width: auto !important;
  }
  & .single-store-header .header-store-thumb img {
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain;
  }

  /* The old theme hides coupon buttons, descriptions and votes below 790px: phones got cards without a button. */
  @media (max-width: 790px) {
    & .store-listing-item .coupon-detail .coupon-button {
      display: flex !important;
      align-items: center;
      justify-content: center;
      width: 100% !important;
      min-height: 46px;
      margin: 0 !important;
    }
    & .store-listing-item .coupon-detail .coupon-button.coupon-code {
      justify-content: space-between;
    }
    & .store-listing-item .coupon-detail {
      float: none !important;
      clear: both;
      width: 100% !important;
      margin: 12px 0 0 !important;
      padding: 0 !important;
    }
    & .store-listing-item .coupon-des {
      display: block !important;
      font-size: 13.5px;
    }
    & .store-listing-item .latest-coupon {
      float: none !important;
      max-width: none !important;
      width: auto !important;
      overflow: hidden;
    }
    & .store-listing-item .store-thumb-link {
      width: 96px !important;
      margin-right: 12px !important;
    }
  }

  @media (max-width: 767px) {
    & .single-store-header .header-thumb {
      width: 100% !important;
      float: none !important;
    }

    /* Home card grids (category heroes, Fresh Brews, More Fresh Brews): 2 per row */
    & .box-card-container.grid-4,
    & .box-card-container.grid-3,
    & .box-card-container.direction-horizontal {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      gap: 12px !important;
      padding: 16px 12px 0 !important;
    }
    & .box-card-container .main-content {
      padding: 12px !important;
    }
    & .box-card-container .main-content .header .title {
      font-size: 15px !important;
      line-height: 1.25 !important;
    }
    & .box-card-container .main-content .desc {
      font-size: 13px !important;
      line-height: 1.45 !important;
    }
    & .box-card-container .main-content .go-btn,
    & .box-card .go-btn {
      width: 100% !important;
      padding: 9px 8px !important;
      font-size: 11.5px !important;
      white-space: normal !important;
    }
    & .home-container.darken .card-collection-header {
      padding: 18px 12px 0 !important;
    }

    /* Category and A-Z lists: 2 per row instead of 3 squeezed columns (the Coupon Categories page and the
       store-card grids already lay out as CSS grids, so they are left alone) */
    & #content-wrap:not(.article) .list-categories:not(.list-stores) .ui.grid > .three.column.row > .column,
    & #content-wrap:not(.article) .list-categories:not(.list-stores) ul.three.column.row > li.column,
    & .store-az .ui.three.column.grid > .column {
      width: 50% !important;
    }
    /* More room for the A-Z store names */
    & .article .content-box:has(.store-az) {
      padding: 12px !important;
    }
    & .store-az .store-az-group {
      padding: 14px 12px 8px !important;
    }
    & .store-az .store-az-group li.column {
      padding: 7px 4px !important;
    }
  }

  /* Sidebar category list: one per row on narrow phones */
  @media (max-width: 380px) {
    & #secondary .list-categories ul {
      grid-template-columns: minmax(0, 1fr) !important;
    }
  }
  @media (max-width: 340px) {
    & .box-card-container.grid-4,
    & .box-card-container.grid-3,
    & .box-card-container.direction-horizontal {
      grid-template-columns: minmax(0, 1fr) !important;
    }
  }

  /* "Free Credits" hero icon uses Semantic UI's outline icon font, which isn't loaded: draw it with Font Awesome. */
  & .box-card .highlight-icon i.money.bill.outline.icon::before {
    content: "\f3d1";
    font-family: "Font Awesome 5 Free" !important;
    font-weight: 900 !important;
  }
}

/* ------------------------------------------------------ Layout fixes */
html:has(.ad-roast) {
  /* Coupon cards: a fixed logo | text | button grid. The theme's floats only sit side by side while everything
     fits within ~20px, so at some zoom levels/font sizes the button column dropped below the title and left big
     empty areas. */
  @media (min-width: 791px) {
    & .store-listing-item.coupon-item {
      display: grid !important;
      grid-template-columns: 150px minmax(0, 1fr) 210px;
      column-gap: 22px;
      align-items: start;
    }
    & .store-listing-item.coupon-item > .store-thumb-link,
    & .store-listing-item.coupon-item > .latest-coupon,
    & .store-listing-item.coupon-item > .coupon-detail {
      float: none !important;
      width: auto !important;
      max-width: none !important;
      margin: 0 !important;
    }
    & .store-listing-item.coupon-item > .coupon-detail {
      display: flex !important;
      flex-direction: column;
      align-items: stretch;
      gap: 10px;
      padding: 0 !important;
    }
    & .store-listing-item.coupon-item > .coupon-detail .coupon-button {
      display: flex !important;
      align-items: center;
      width: 100% !important;
      min-height: 44px;
      margin: 0 !important;
    }
    & .store-listing-item.coupon-item > .coupon-detail .coupon-button.coupon-deal {
      justify-content: center;
    }
    & .store-listing-item.coupon-item > .coupon-detail .user-ratting {
      align-self: flex-start;
      margin: 0 !important;
    }
    /* Footer (tags, used count, share) and anything else spans the full card */
    & .store-listing-item.coupon-item > :not(.store-thumb-link):not(.latest-coupon):not(.coupon-detail) {
      grid-column: 1 / -1;
    }
    & .store-listing-item.coupon-item > .clear {
      display: none !important;
    }
  }

  /* Phones: one clear "Get Code" button; the code itself shows in the popup after the tap. */
  @media (max-width: 790px) {
    & .store-listing-item .coupon-detail .coupon-button.coupon-code {
      justify-content: center !important;
      background: var(--rw-orange) !important;
      color: #fff !important;
    }
    & .store-listing-item .coupon-button.coupon-code .code-text {
      display: none !important;
    }
    & .store-listing-item .coupon-button.coupon-code .get-code {
      position: static !important;
      width: 100% !important;
      padding: 0 !important;
      background: transparent !important;
      text-align: center;
    }
    & .store-listing-item .coupon-button.coupon-code .get-code::after,
    & .store-listing-item .coupon-button-type .coupon-code .get-code:after {
      display: none !important;
    }
  }

  /* Sidebar product family (AdPlexity, AdPlexity Adult, ...): logo and name side by side, never overlapping */
  & .widget-sister-coupons .store-thumb,
  & .widget-sister-coupons .store-thumb > a {
    display: flex !important;
    align-items: center;
    gap: 12px;
    min-width: 0;
  }
  & .widget-sister-coupons .store-thumb img {
    flex: none;
    width: 90px !important;
    height: auto !important;
    margin: 0 !important;
    position: static !important;
    object-fit: contain;
  }

  /* Review table of contents: logo shown whole on white, byline underneath (not pulled up over the logo) */
  & #stickytoc .toc-header {
    height: 110px;
    padding: 0 !important;
    border: 0 !important;
    border-bottom: var(--rw-border) !important;
    border-radius: 0 !important;
    background-color: #fff !important;
    background-size: auto 72% !important;
    background-position: center !important;
  }
  & .store-extra-info .author {
    margin-top: 0 !important;
    padding: 10px 20px !important;
    color: var(--rw-text) !important;
  }
  & .store-extra-info .author span,
  & #stickytoc .author span {
    padding-top: 0 !important;
    color: var(--rw-text) !important;
  }
  /* Floating version: below the sticky site header, and only where there is room beside the content */
  & #stickytoc.sticky-toc {
    top: 236px !important;
    left: 16px !important;
    min-width: 260px !important;
    max-width: 300px !important;
    max-height: calc(100vh - 252px) !important;
    border-radius: 0 !important;
  }
  @media (max-width: 1499px) {
    & #stickytoc.sticky-toc {
      position: static !important;
      min-width: 0 !important;
      max-width: none !important;
      max-height: none !important;
    }
  }

  /* Home category heroes: show the whole illustration instead of cropping it */
  & .box-card-container:not(.ad-hero-categories):not(.card-collection-header + .box-card-container) .box-card .cover {
    object-fit: contain !important;
    padding: 12px;
  }
  /* The old Spy Tools rule sets "cover" on its hero art; keep all four category illustrations uncropped */
  & .ad-hero-categories .box-card .ad-category-art {
    object-fit: contain !important;
  }
}
html:has(.ad-roast) .st-menu > li.ad-forum-link > a::before { content: "\f086"; }