/*
 * Xenix Seasonal Theme 1.1.2 — colour-only scope.
 *
 * What this file is allowed to do:
 *   1. Define holiday colour variables on body.season-*.
 *   2. Style the plugin's own .seasonal-banner bar (static, in-flow).
 *   3. Accent-colour link/hover touches scoped behind body.season-*.
 *   4. (1.1.0) Style the plugin's own home-page popup card (.xst-popup,
 *      markup only ever printed on the front page while a season is
 *      active) — desktop corner card, mobile bottom-sheet.
 *   5. (1.1.0) Recolour PRIMARY buttons, scoped behind body.season-*:
 *      Blocksy/theme, WooCommerce and Xenix Sizer primary buttons.
 *      COLOUR ONLY: background-color, border-color and color, in the
 *      normal and hover/focus states. Nothing else.
 *   7. (1.1.2) A small decorative seasonal icon (.xst-popup-icon,
 *      inline SVG printed by PHP beside the popup headline) inside
 *      the popup only: 44px desktop, 32px in the mobile bottom-sheet.
 *      Popup width/max-height/padding are unchanged.
 *   6. (1.1.1) Also recolour the Xenix homepage hero Elementor
 *      'haru-button' (SHOP NOW), same palettes and same colour-only
 *      rule: .haru-button plus its generic nested anchor/span children
 *      (Elementor may nest the label in a span inside the anchor, or
 *      put a span directly inside an anchor-styled .haru-button).
 *      No layout property is touched for it either.
 *
 * Checkout-safety rules (still in force):
 *   - No background images / page reskin, no layout, spacing, font-size,
 *     display, position, width, padding or border-width/style changes
 *     to theme/WooCommerce/Sizer elements — border-COLOR only, so any
 *     existing border keeps its width/style. No opacity, no box-shadow:
 *     the Sizer's 2px accent shadow therefore stays its own colour.
 *   - !important is used ONLY on the three colour properties of the
 *     button rules below, because WooCommerce Blocks / theme button
 *     colours can be set with high-specificity or inline styles; it
 *     never touches a layout property.
 *   - Disabled buttons are excluded (:disabled / .disabled), so greyed
 *     Sizer Add to Cart and disabled checkout states stay as they are.
 *   - Nothing fixed/sticky is added (the banner cannot overlap the
 *     header or a sticky price bar).
 *   - Hero / template-preview accents: no unverified theme selectors
 *     are styled here; the --xst-* variables remain the hook.
 *   - Off = zero button changes: every button rule in this file is
 *     under body.season-halloween / body.season-thanksgiving /
 *     body.season-christmas, and when no season is active PHP adds no
 *     body.season-* class and does not enqueue this stylesheet at all.
 */

/* --- Halloween: deep orange / black / purple (October) --- */
body.season-halloween {
  --xst-accent: #e8641c;
  --xst-accent-2: #7b3fa0;
  --xst-banner-bg: #17101f; /* dark purple bar ... */
  --xst-banner-text: #ffb37a;
  --xst-banner-border: #e8641c; /* ... with the orange line */
  /* Buttons: burnt orange (darkened from #e85d04 for readable white
     text: #c2410c on #ffffff = 5.18:1), hover darker orange 7.31:1. */
  --xst-btn-bg: #c2410c;
  --xst-btn-border: #9a3412;
  --xst-btn-text: #ffffff;
  --xst-btn-bg-hover: #9a3412;
  --xst-btn-border-hover: #7c2d12;
}

/* --- Thanksgiving: rust / cream / brown / gold (November) --- */
body.season-thanksgiving {
  --xst-accent: #b3541e;
  --xst-accent-2: #c9962e;
  --xst-banner-bg: #3a2415;
  --xst-banner-text: #f7e8cf;
  --xst-banner-border: #c9962e;
  /* Buttons: rust #b3541e, white text 5.00:1; hover darker rust 7.27:1.
     Brown/gold stay in the banner/accent variables above. */
  --xst-btn-bg: #b3541e;
  --xst-btn-border: #8f3f14;
  --xst-btn-text: #ffffff;
  --xst-btn-bg-hover: #8f3f14;
  --xst-btn-border-hover: #7a3510;
}

/* --- Christmas: red / green / gold (December) --- */
body.season-christmas {
  --xst-accent: #b91f2e;
  --xst-accent-2: #1e7a3c;
  --xst-banner-bg: #123524;
  --xst-banner-text: #f6e7c8;
  --xst-banner-border: #c9962e;
  /* Buttons: CHOICE = deep red normal, deep green hover (not the
     reverse — red reads as the primary "buy" colour, green is the
     festive hover reward). White on red 7.75:1; white on hover
     green #146c43 6.45:1. Gold stays the banner border. */
  --xst-btn-bg: #a4161a;
  --xst-btn-border: #8f1216;
  --xst-btn-text: #ffffff;
  --xst-btn-bg-hover: #146c43;
  --xst-btn-border-hover: #14532d;
}

/* --- The banner itself (plugin-owned markup only) --- */
.seasonal-banner {
  position: static; /* in normal flow: pushes header down, never overlays it */
  width: 100%;
  margin: 0;
  padding: 10px 16px;
  box-sizing: border-box;
  text-align: center;
  background-color: var(--xst-banner-bg, #222222);
  color: var(--xst-banner-text, #ffffff);
  border-bottom: 3px solid var(--xst-banner-border, var(--xst-accent, #888888));
  z-index: 20; /* modest; irrelevant while static, harmless if filters move it */
}

.seasonal-banner__inner {
  max-width: 1200px;
  margin: 0 auto;
}

.seasonal-banner__text {
  margin: 0;
  padding: 0;
  font-weight: 600;
  line-height: 1.4;
}

/* If a link is ever added to the banner copy, it inherits the accent. */
.seasonal-banner a {
  color: var(--xst-banner-text, #ffffff);
  text-decoration: underline;
}
.seasonal-banner a:hover,
.seasonal-banner a:focus {
  color: var(--xst-accent, #ffffff);
}

/* --- Generic accent touches (colour only, no layout) --- */
/* Header link hover accent. Colour on hover cannot move layout or
   interfere with menus, cart, or checkout. */
body.season-halloween .site-header a:hover,
body.season-thanksgiving .site-header a:hover,
body.season-christmas .site-header a:hover {
  color: var(--xst-accent);
}

/* Text-selection accent: purely cosmetic, zero layout risk. */
body.season-halloween ::selection,
body.season-thanksgiving ::selection,
body.season-christmas ::selection {
  background-color: var(--xst-accent);
  color: #ffffff;
}

/* --- Seasonal primary buttons (1.1.0, colour only; .haru-button added 1.1.1) --- */
/*
 * Selectors touched (every one prefixed with body.season-*):
 *   Blocksy/theme : .ct-button, .button, .wp-block-button__link
 *   WooCommerce   : .button (classic), .wc-block-components-button
 *                   (Blocks), .single_add_to_cart_button,
 *                   .add_to_cart_button, .checkout-button,
 *                   #place_order, .wc-block-components-checkout-place-order-button
 *   Xenix Sizer   : .xcs-btn-acc (its primary submit: "Next: add
 *                   artwork" / "Add to cart" <button type="submit">)
 *                   — .xcs-btn-ghost is deliberately NOT touched.
 *   Hero (1.1.1)  : .haru-button (Elementor 'haru-button', the homepage
 *                   hero SHOP NOW) plus, generically, .haru-button a and
 *                   .haru-button span (and spans inside its anchor) so
 *                   the label text is recoloured however Elementor nests
 *                   it. Colour only, same three properties; disabled
 *                   excluded via :not(:disabled):not(.disabled) on the
 *                   button/anchor where sensible (anchors have no real
 *                   :disabled state, the guard is harmless there).
 * Only background-color / border-color / color change, normal +
 * hover/focus. Disabled buttons are excluded. When no season is
 * active none of this applies: no body.season-* class is added and
 * this stylesheet is not enqueued (see xst_enqueue_assets()).
 */
body.season-halloween .ct-button:not(:disabled):not(.disabled),
body.season-thanksgiving .ct-button:not(:disabled):not(.disabled),
body.season-christmas .ct-button:not(:disabled):not(.disabled),
body.season-halloween .button:not(:disabled):not(.disabled),
body.season-thanksgiving .button:not(:disabled):not(.disabled),
body.season-christmas .button:not(:disabled):not(.disabled),
body.season-halloween .wp-block-button__link:not(:disabled):not(.disabled),
body.season-thanksgiving .wp-block-button__link:not(:disabled):not(.disabled),
body.season-christmas .wp-block-button__link:not(:disabled):not(.disabled),
body.season-halloween .wc-block-components-button:not(:disabled):not(.disabled),
body.season-thanksgiving .wc-block-components-button:not(:disabled):not(.disabled),
body.season-christmas .wc-block-components-button:not(:disabled):not(.disabled),
body.season-halloween .single_add_to_cart_button:not(:disabled):not(.disabled),
body.season-thanksgiving .single_add_to_cart_button:not(:disabled):not(.disabled),
body.season-christmas .single_add_to_cart_button:not(:disabled):not(.disabled),
body.season-halloween .add_to_cart_button:not(:disabled):not(.disabled),
body.season-thanksgiving .add_to_cart_button:not(:disabled):not(.disabled),
body.season-christmas .add_to_cart_button:not(:disabled):not(.disabled),
body.season-halloween .checkout-button:not(:disabled):not(.disabled),
body.season-thanksgiving .checkout-button:not(:disabled):not(.disabled),
body.season-christmas .checkout-button:not(:disabled):not(.disabled),
body.season-halloween #place_order:not(:disabled):not(.disabled),
body.season-thanksgiving #place_order:not(:disabled):not(.disabled),
body.season-christmas #place_order:not(:disabled):not(.disabled),
body.season-halloween .wc-block-components-checkout-place-order-button:not(:disabled):not(.disabled),
body.season-thanksgiving .wc-block-components-checkout-place-order-button:not(:disabled):not(.disabled),
body.season-christmas .wc-block-components-checkout-place-order-button:not(:disabled):not(.disabled),
body.season-halloween .xcs-btn-acc:not(:disabled):not(.disabled),
body.season-thanksgiving .xcs-btn-acc:not(:disabled):not(.disabled),
body.season-christmas .xcs-btn-acc:not(:disabled):not(.disabled),
body.season-halloween button[type="submit"].xcs-btn-acc:not(:disabled):not(.disabled),
body.season-thanksgiving button[type="submit"].xcs-btn-acc:not(:disabled):not(.disabled),
body.season-christmas button[type="submit"].xcs-btn-acc:not(:disabled):not(.disabled),
body.season-halloween input[type="submit"].xcs-btn-acc:not(:disabled):not(.disabled),
body.season-thanksgiving input[type="submit"].xcs-btn-acc:not(:disabled):not(.disabled),
body.season-christmas input[type="submit"].xcs-btn-acc:not(:disabled):not(.disabled),
body.season-halloween .haru-button:not(:disabled):not(.disabled),
body.season-halloween .haru-button:not(:disabled):not(.disabled) a:not(:disabled):not(.disabled),
body.season-halloween .haru-button:not(:disabled):not(.disabled) span,
body.season-thanksgiving .haru-button:not(:disabled):not(.disabled),
body.season-thanksgiving .haru-button:not(:disabled):not(.disabled) a:not(:disabled):not(.disabled),
body.season-thanksgiving .haru-button:not(:disabled):not(.disabled) span,
body.season-christmas .haru-button:not(:disabled):not(.disabled),
body.season-christmas .haru-button:not(:disabled):not(.disabled) a:not(:disabled):not(.disabled),
body.season-christmas .haru-button:not(:disabled):not(.disabled) span {
  background-color: var(--xst-btn-bg) !important; /* colour only */
  border-color: var(--xst-btn-border) !important; /* colour only: width/style untouched */
  color: var(--xst-btn-text) !important; /* colour only */
}

body.season-halloween .ct-button:not(:disabled):not(.disabled):hover,
body.season-halloween .ct-button:not(:disabled):not(.disabled):focus-visible,
body.season-thanksgiving .ct-button:not(:disabled):not(.disabled):hover,
body.season-thanksgiving .ct-button:not(:disabled):not(.disabled):focus-visible,
body.season-christmas .ct-button:not(:disabled):not(.disabled):hover,
body.season-christmas .ct-button:not(:disabled):not(.disabled):focus-visible,
body.season-halloween .button:not(:disabled):not(.disabled):hover,
body.season-halloween .button:not(:disabled):not(.disabled):focus-visible,
body.season-thanksgiving .button:not(:disabled):not(.disabled):hover,
body.season-thanksgiving .button:not(:disabled):not(.disabled):focus-visible,
body.season-christmas .button:not(:disabled):not(.disabled):hover,
body.season-christmas .button:not(:disabled):not(.disabled):focus-visible,
body.season-halloween .wp-block-button__link:not(:disabled):not(.disabled):hover,
body.season-halloween .wp-block-button__link:not(:disabled):not(.disabled):focus-visible,
body.season-thanksgiving .wp-block-button__link:not(:disabled):not(.disabled):hover,
body.season-thanksgiving .wp-block-button__link:not(:disabled):not(.disabled):focus-visible,
body.season-christmas .wp-block-button__link:not(:disabled):not(.disabled):hover,
body.season-christmas .wp-block-button__link:not(:disabled):not(.disabled):focus-visible,
body.season-halloween .wc-block-components-button:not(:disabled):not(.disabled):hover,
body.season-halloween .wc-block-components-button:not(:disabled):not(.disabled):focus-visible,
body.season-thanksgiving .wc-block-components-button:not(:disabled):not(.disabled):hover,
body.season-thanksgiving .wc-block-components-button:not(:disabled):not(.disabled):focus-visible,
body.season-christmas .wc-block-components-button:not(:disabled):not(.disabled):hover,
body.season-christmas .wc-block-components-button:not(:disabled):not(.disabled):focus-visible,
body.season-halloween .single_add_to_cart_button:not(:disabled):not(.disabled):hover,
body.season-halloween .single_add_to_cart_button:not(:disabled):not(.disabled):focus-visible,
body.season-thanksgiving .single_add_to_cart_button:not(:disabled):not(.disabled):hover,
body.season-thanksgiving .single_add_to_cart_button:not(:disabled):not(.disabled):focus-visible,
body.season-christmas .single_add_to_cart_button:not(:disabled):not(.disabled):hover,
body.season-christmas .single_add_to_cart_button:not(:disabled):not(.disabled):focus-visible,
body.season-halloween .add_to_cart_button:not(:disabled):not(.disabled):hover,
body.season-halloween .add_to_cart_button:not(:disabled):not(.disabled):focus-visible,
body.season-thanksgiving .add_to_cart_button:not(:disabled):not(.disabled):hover,
body.season-thanksgiving .add_to_cart_button:not(:disabled):not(.disabled):focus-visible,
body.season-christmas .add_to_cart_button:not(:disabled):not(.disabled):hover,
body.season-christmas .add_to_cart_button:not(:disabled):not(.disabled):focus-visible,
body.season-halloween .checkout-button:not(:disabled):not(.disabled):hover,
body.season-halloween .checkout-button:not(:disabled):not(.disabled):focus-visible,
body.season-thanksgiving .checkout-button:not(:disabled):not(.disabled):hover,
body.season-thanksgiving .checkout-button:not(:disabled):not(.disabled):focus-visible,
body.season-christmas .checkout-button:not(:disabled):not(.disabled):hover,
body.season-christmas .checkout-button:not(:disabled):not(.disabled):focus-visible,
body.season-halloween #place_order:not(:disabled):not(.disabled):hover,
body.season-halloween #place_order:not(:disabled):not(.disabled):focus-visible,
body.season-thanksgiving #place_order:not(:disabled):not(.disabled):hover,
body.season-thanksgiving #place_order:not(:disabled):not(.disabled):focus-visible,
body.season-christmas #place_order:not(:disabled):not(.disabled):hover,
body.season-christmas #place_order:not(:disabled):not(.disabled):focus-visible,
body.season-halloween .wc-block-components-checkout-place-order-button:not(:disabled):not(.disabled):hover,
body.season-halloween .wc-block-components-checkout-place-order-button:not(:disabled):not(.disabled):focus-visible,
body.season-thanksgiving .wc-block-components-checkout-place-order-button:not(:disabled):not(.disabled):hover,
body.season-thanksgiving .wc-block-components-checkout-place-order-button:not(:disabled):not(.disabled):focus-visible,
body.season-christmas .wc-block-components-checkout-place-order-button:not(:disabled):not(.disabled):hover,
body.season-christmas .wc-block-components-checkout-place-order-button:not(:disabled):not(.disabled):focus-visible,
body.season-halloween .xcs-btn-acc:not(:disabled):not(.disabled):hover,
body.season-halloween .xcs-btn-acc:not(:disabled):not(.disabled):focus-visible,
body.season-thanksgiving .xcs-btn-acc:not(:disabled):not(.disabled):hover,
body.season-thanksgiving .xcs-btn-acc:not(:disabled):not(.disabled):focus-visible,
body.season-christmas .xcs-btn-acc:not(:disabled):not(.disabled):hover,
body.season-christmas .xcs-btn-acc:not(:disabled):not(.disabled):focus-visible,
body.season-halloween .haru-button:not(:disabled):not(.disabled):hover,
body.season-halloween .haru-button:not(:disabled):not(.disabled):focus-visible,
body.season-halloween .haru-button:not(:disabled):not(.disabled) a:not(:disabled):not(.disabled):hover,
body.season-halloween .haru-button:not(:disabled):not(.disabled) a:not(:disabled):not(.disabled):focus-visible,
body.season-halloween .haru-button:not(:disabled):not(.disabled):hover span,
body.season-halloween .haru-button:not(:disabled):not(.disabled):focus-visible span,
body.season-halloween .haru-button:not(:disabled):not(.disabled) a:not(:disabled):not(.disabled):hover span,
body.season-halloween .haru-button:not(:disabled):not(.disabled) a:not(:disabled):not(.disabled):focus-visible span,
body.season-thanksgiving .haru-button:not(:disabled):not(.disabled):hover,
body.season-thanksgiving .haru-button:not(:disabled):not(.disabled):focus-visible,
body.season-thanksgiving .haru-button:not(:disabled):not(.disabled) a:not(:disabled):not(.disabled):hover,
body.season-thanksgiving .haru-button:not(:disabled):not(.disabled) a:not(:disabled):not(.disabled):focus-visible,
body.season-thanksgiving .haru-button:not(:disabled):not(.disabled):hover span,
body.season-thanksgiving .haru-button:not(:disabled):not(.disabled):focus-visible span,
body.season-thanksgiving .haru-button:not(:disabled):not(.disabled) a:not(:disabled):not(.disabled):hover span,
body.season-thanksgiving .haru-button:not(:disabled):not(.disabled) a:not(:disabled):not(.disabled):focus-visible span,
body.season-christmas .haru-button:not(:disabled):not(.disabled):hover,
body.season-christmas .haru-button:not(:disabled):not(.disabled):focus-visible,
body.season-christmas .haru-button:not(:disabled):not(.disabled) a:not(:disabled):not(.disabled):hover,
body.season-christmas .haru-button:not(:disabled):not(.disabled) a:not(:disabled):not(.disabled):focus-visible,
body.season-christmas .haru-button:not(:disabled):not(.disabled):hover span,
body.season-christmas .haru-button:not(:disabled):not(.disabled):focus-visible span,
body.season-christmas .haru-button:not(:disabled):not(.disabled) a:not(:disabled):not(.disabled):hover span,
body.season-christmas .haru-button:not(:disabled):not(.disabled) a:not(:disabled):not(.disabled):focus-visible span {
  background-color: var(--xst-btn-bg-hover) !important; /* colour only */
  border-color: var(--xst-btn-border-hover) !important; /* colour only */
  color: var(--xst-btn-text) !important; /* colour only */
}

/* --- Home-page seasonal popup (1.1.0, plugin-owned markup) --- */
/* Printed only on the front page while a season is active, rendered
   `hidden`; seasonal-popup.js reveals it after ~1s unless the
   xst_popup_seen cookie / session flag is set. Non-modal, no overlay. */
body.season-halloween .xst-popup[hidden],
body.season-thanksgiving .xst-popup[hidden],
body.season-christmas .xst-popup[hidden] {
  display: none;
}

body.season-halloween .xst-popup,
body.season-thanksgiving .xst-popup,
body.season-christmas .xst-popup {
  position: fixed;
  right: 20px;
  bottom: 20px;
  left: auto;
  z-index: 9999;
  width: min(360px, calc(100vw - 40px));
  max-height: 70vh;
  overflow-y: auto;
  box-sizing: border-box;
  padding: 20px 44px 20px 20px;
  border-radius: 14px;
  border-bottom: 4px solid var(--xst-banner-border, var(--xst-accent, #888888));
  background-color: var(--xst-banner-bg, #222222);
  color: var(--xst-banner-text, #ffffff);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
}

body.season-halloween .xst-popup__headline,
body.season-thanksgiving .xst-popup__headline,
body.season-christmas .xst-popup__headline {
  margin: 0 0 8px;
  font-weight: 700;
  line-height: 1.3;
}

/* Seasonal popup icon (1.1.2): inline SVG beside the headline.
   Decorative only; popup box (width/max-height/padding) unchanged. */
body.season-halloween .xst-popup__head,
body.season-thanksgiving .xst-popup__head,
body.season-christmas .xst-popup__head {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
body.season-halloween .xst-popup__head .xst-popup__headline,
body.season-thanksgiving .xst-popup__head .xst-popup__headline,
body.season-christmas .xst-popup__head .xst-popup__headline {
  flex: 1 1 auto;
  min-width: 0;
}
body.season-halloween .xst-popup-icon,
body.season-thanksgiving .xst-popup-icon,
body.season-christmas .xst-popup-icon {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  line-height: 0;
}
body.season-halloween .xst-popup-icon svg,
body.season-thanksgiving .xst-popup-icon svg,
body.season-christmas .xst-popup-icon svg {
  display: block;
  width: 100%;
  height: 100%;
}

body.season-halloween .xst-popup__offer,
body.season-thanksgiving .xst-popup__offer,
body.season-christmas .xst-popup__offer {
  margin: 0 0 14px;
  line-height: 1.45;
}

body.season-halloween .xst-popup__cta-wrap,
body.season-thanksgiving .xst-popup__cta-wrap,
body.season-christmas .xst-popup__cta-wrap {
  margin: 0;
}

/* Popup CTA: same seasonal button colours as the primary buttons. */
body.season-halloween .xst-popup__cta,
body.season-thanksgiving .xst-popup__cta,
body.season-christmas .xst-popup__cta {
  display: inline-block;
  padding: 10px 18px;
  border: 1px solid var(--xst-btn-border);
  border-radius: 8px;
  background-color: var(--xst-btn-bg);
  color: var(--xst-btn-text);
  font-weight: 700;
  text-decoration: none;
}
body.season-halloween .xst-popup__cta:hover,
body.season-halloween .xst-popup__cta:focus-visible,
body.season-thanksgiving .xst-popup__cta:hover,
body.season-thanksgiving .xst-popup__cta:focus-visible,
body.season-christmas .xst-popup__cta:hover,
body.season-christmas .xst-popup__cta:focus-visible {
  background-color: var(--xst-btn-bg-hover);
  border-color: var(--xst-btn-border-hover);
  color: var(--xst-btn-text);
}

body.season-halloween .xst-popup__close,
body.season-thanksgiving .xst-popup__close,
body.season-christmas .xst-popup__close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background-color: transparent;
  color: var(--xst-banner-text, #ffffff);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
body.season-halloween .xst-popup__close:hover,
body.season-halloween .xst-popup__close:focus-visible,
body.season-thanksgiving .xst-popup__close:hover,
body.season-thanksgiving .xst-popup__close:focus-visible,
body.season-christmas .xst-popup__close:hover,
body.season-christmas .xst-popup__close:focus-visible {
  background-color: var(--xst-btn-bg);
  color: var(--xst-btn-text);
}

/* Mobile: bottom-sheet card — partial height, never full-screen. */
@media (max-width: 640px) {
  body.season-halloween .xst-popup,
  body.season-thanksgiving .xst-popup,
  body.season-christmas .xst-popup {
    right: 0;
    bottom: 0;
    left: 0;
    width: auto;
    max-height: 45vh;
    padding: 18px 44px 18px 18px;
    border-radius: 16px 16px 0 0;
  }
  body.season-halloween .xst-popup-icon,
  body.season-thanksgiving .xst-popup-icon,
  body.season-christmas .xst-popup-icon {
    width: 32px;
    height: 32px;
  }
  body.season-halloween .xst-popup__head,
  body.season-thanksgiving .xst-popup__head,
  body.season-christmas .xst-popup__head {
    gap: 8px;
  }
}