/* ============================================================================
 * Bollsen COMMON CSS — site-agnostic selectors shared across ALL markets
 * (common functional + common brand). Lives in the CHILD theme, enqueued by
 * functions.php AFTER Flatsome (so it wins the cascade like the old inline
 * Customizer CSS did). Market-specific CSS goes in style.css, not here.
 *
 * Consolidated 2026-07-02 from the mu-plugin sheets (bollsen-features / brand /
 * content / arki), which are retired. Keep this file byte-identical across
 * markets; put anything that differs per market in that market's style.css.
 * ========================================================================= */

/* ===================== FEATURES (global UI chrome) ===================== */
/* Bollsen functional CSS — GLOBAL UI chrome.
 * Pairs with mu-plugin 23 (reviews) + the theme custom.js UX features (Sticky CTA, Site Switcher,
 * ATC price). Extracted verbatim from the UK master Customizer (custom-css-audit.md) so each feature's
 * styling travels with its code in git instead of being stranded per-market in the Customizer.
 * Enqueued site-wide (front-end) by 30-bollsen-assets.php — small, cached, W3TC-combinable.
 *
 * 2026-07-02 (Armin, full-drain policy): COMMON-across-all-markets CSS now lives here even if
 *   brand-adjacent. Added below: top-bar USP ticker (.text-fade*), WQM cart-button theming, bullet-list
 *   styles, global resets (overflow/scroll), checkbox accent, .tag-list — all previously Customizer-only
 *   on all 16 markets (matrix §3a COMMON-36). Relocated verbatim from the UK Customizer (post 5400).
 *
 * STILL EXCLUDED (UK-brand/design → child style.css or design track, NOT common CSS):
 *   heading sizes, ::selection, faq-boxed, PDP button colours + spacing, bundle styling, product-gallery
 *   dots, PDP description full-width, sale-badge *content* (translatable → per-market style.css). */

/* ===== Trustpilot / BBR: hide the business header  (mu23 #61) — UK L86-103 ===== */
.bollsen-bbr-scope .brtpmj_reviews_container > .brtpmj_business_rating,
.bollsen-bbr-scope .brtpmj_reviews_container > .brtpnj_business_rating, /* alt class */
.bollsen-bbr-scope .brtpmj_reviews_container > [class*="business_rating"],
.bollsen-bbr-scope .brtpmj_reviews_container > [class*="business-header"] {
  display: none !important;
}
/* Fallback: if class names change, hide ONLY the first child inside the reviews container */
.bollsen-bbr-scope .brtpmj_reviews_container > :first-child {
  display: none !important;
}
.bollsen-bbr-scope .brtpmj_reviews_container {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* ===== Sticky CTA  (custom.js) — UK L427-476 ===== */
.sticky-cta,
.sticky-cta2{
    position: fixed;
    bottom: 0;
    padding: 10px 20px;
    background-color: #063c97;
    color: white;
    text-align: center;
    font-size: 16px;
    z-index: 9999;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
    pointer-events: none;
}
.sticky-cta.visible,
.sticky-cta2.visible{
    opacity: 1;
    pointer-events: auto;
}
.sticky-cta-transparent{
    position: fixed;
    bottom: -20px;
    left: 0;
    width: 100%;
    background-color: transparent;
    color: white;
    text-align: center;
    font-size: 16px;
    z-index: 9999;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
    pointer-events: none;
}
.sticky-cta-transparent.visible{
    opacity: 1;
    pointer-events: auto;
}

/* ===== Site Switcher / locale selector  (custom.js) — UK L484-556 ===== */
.bollsen-locale-switcher {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  position: relative;
  font-family: inherit;
}
.bollsen-locale-switcher .bls-label {
  font-size: 0.9rem;
  opacity: 0.9;
}
.bollsen-locale-switcher .bls-select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 8px;
  padding: 0.6rem 2.2rem 0.6rem 0.8rem;
  font-size: 0.95rem;
  line-height: 1.2;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}
.bollsen-locale-switcher::after {
  content: "";
  position: absolute;
  right: 0.8rem;
  top: 50%;
  width: 0.5rem;
  height: 0.5rem;
  margin-top: -0.35rem;
  pointer-events: none;
  border-right: 2px solid #222;
  border-bottom: 2px solid #222;
  transform: rotate(45deg);
}
.bollsen-locale-switcher.small .bls-select {
  padding: 0.4rem 1.8rem 0.4rem 0.6rem;
  font-size: 0.85rem;
}
.is-dark .bollsen-locale-switcher .bls-select {
  background: #111;
  color: #fff;
  border-color: rgba(255, 255, 255, 0.25);
}
.is-dark .bollsen-locale-switcher::after {
  border-color: #fff;
}
@media (max-width: 480px) {
  .bollsen-locale-switcher { width: 100%; }
  .bollsen-locale-switcher .bls-select { width: 100%; }
}

/* ===== ATC price display target  (custom.js ATC) — UK L631-635, 700-703 ===== */
.embedded-product-price .price.wqm-total-price {
  font-size: 1.5em;
  font-weight: 700;
  text-align: left;
}
.price.wqm-total-price {
  margin-top: 0px;
  margin-bottom: 0px;
}

/* ============================================================================
 * COMMON-36 relocations (2026-07-02) — verbatim from UK Customizer post 5400.
 * These were Customizer-only on all 16 markets; now git-controlled + market-agnostic.
 * ========================================================================= */

/* ===== Top-bar USP ticker  (header-block moving-topbar) — UK Cust. L22-75 ===== */
.text-fade{
  max-width:1080px;
  height:32px;
  margin:auto;
  position:relative;
  font-weight:700;
  line-height:22px;
  text-align:center;
  margin-top: 7px;
  font-size: 90%;
	white-space:nowrap;
}
.text-fade ul{margin:0;padding:0;list-style:none}
.text-fade li{
  position:absolute;
	white-space:nowrap;
	inset:0;
	display:flex;
	align-items:center;
	justify-content:center;
  opacity:0;
	animation:fadeCycle 16.8s linear infinite both; /* 4 * (3s + 0.6s + 0.6s) */
}
/* 4 slides */
.text-fade--4 li{ animation: fadeCycle4 16.8s linear infinite both }         /* 4 * 4.2s */
.text-fade--4 li:nth-child(1){animation-delay:0s}
.text-fade--4 li:nth-child(2){animation-delay:-4.2s}
.text-fade--4 li:nth-child(3){animation-delay:-8.4s}
.text-fade--4 li:nth-child(4){animation-delay:-12.6s}
.text-fade li:nth-child(1){ animation-delay: 0s; }
.text-fade li:nth-child(2){ animation-delay: -4.2s; }
.text-fade li:nth-child(3){ animation-delay: -8.4s; }
.text-fade li:nth-child(4){ animation-delay: -12.6s; }
@keyframes fadeCycle4{
  0%{opacity:0} 3.571%{opacity:1} 21.429%{opacity:1} 25%{opacity:0} 100%{opacity:0}
}
/* 3 slides */
.text-fade--3 li{ animation: fadeCycle3 12.6s linear infinite both }         /* 3 * 4.2s */
.text-fade--3 li:nth-child(1){animation-delay:0s}
.text-fade--3 li:nth-child(2){animation-delay:-4.2s}
.text-fade--3 li:nth-child(3){animation-delay:-8.4s}
@keyframes fadeCycle3{
  0%{opacity:0} 4.762%{opacity:1} 28.571%{opacity:1} 33.333%{opacity:0} 100%{opacity:0}
}

/* ===== WQM cart-button theming  (WQM Pro + ATC) — UK Cust. L405-474 ===== */
.add_to_cart_button,
.single_add_to_cart_button {
color: #000000;
}
.add_to_cart_button::before,
.single_add_to_cart_button::before {
font-family: "fl-icons";
content: "\e908" " ";
}
.wqm-qty-label {
display:none;
}
.single_add_to_cart_button{
border-radius:5px;
}
.wqm-heading {
font-size:130%;
}
/* `.wqm-qty-wrapper` prefix is load-order insurance, not decoration. The plugin's
 * dyo_wide_swatches.css declares `.wqm-variant-wrapper select{max-width:100px}` and
 * `.wqm-highlight{background-color:var(--wqm-hbg);border-radius:50px}` at the SAME specificity as
 * ours, so the winner used to be whichever stylesheet WordPress happened to print last. On most
 * PDPs the plugin enqueues early and we win; on pages where it enqueues late (DE-MY
 * /shop/schuheinlagen/einlegesohlen/) it printed AFTER us and the badge reverted to the yellow
 * pill with a truncated variant select. The extra ancestor class makes us win regardless of order. */
.wqm-qty-wrapper .wqm-variant-wrapper select{
max-width:none
}
.cart{
padding-top:0px
}
/* Removed 2026-07-14: `.wqm-qty-selector wqm-swatch { border:2px solid; padding-top:20px; }`
 * — DEAD RULE. `wqm-swatch` was written as an ELEMENT and as a DESCENDANT, but the real node is
 * `label.wqm-qty-selector.wqm-swatch` (both classes on the SAME element), so it never matched
 * anything on any market. It made the WQM plugin's dyo_wide_swatches.css look like it was
 * "overriding" our CSS when in fact nothing of ours was competing. Correcting the selector was
 * tried and REJECTED: it added a black outline + a 20px white strip above each quantity tier
 * (it was written for older markup). The plugin's styling is the correct look here. */
.wqm-qty-wrapper .wqm-highlight {
position: absolute;
top: 0;
left: 50%;
transform: translate(-50%, -60%);
background-color: var(--wp--preset--color--primary);
color: #fff;
font-weight: bold;
font-size: 1em;
padding: 3px 7px;
border-radius: 3px;
width: max-content;
}
.wqm-swatch.highlight .wqm-inner {
border-top-left-radius: 5px !important;
border-top-right-radius: 5px !important;
}
.single_add_to_cart_button {
width: 100%;
font-size: 1.2em;
padding: 5px;
}
.dark .button{
	color:#000000;
}
.button, button, fieldset, input, select, textarea{
	margin-bottom:0em;
	border-radius:5px;
}

/* ===== Bullet-list styles  — UK Cust. L328-333 ===== */
li.bullet-checkmark,
li.bullet-cross,
li.bullet-star,
li.bullet-arrow{
	border-bottom: none!important;
}

/* ===== Global resets + brand form controls  — UK Cust. L77-84, L198-203, L484-486 ===== */
body {
	overflow-x: hidden;
}
html {
  scroll-behavior: smooth;
}
.tag-list {
  list-style: none;
}
input[type="checkbox"]{
	accent-color: rgb(246, 17, 33);
	 height: 20px;
   width: 20px;
	margin-top: -5px;
}

/* ===================== BRAND (global brand/design) ==================== */
/* Bollsen brand / design CSS — GLOBAL brand tokens shared by all markets.
 * Enqueued site-wide by 30-bollsen-assets.php. Relocated 2026-07-02 (Armin full-drain policy) from the
 * UK master Customizer (post 5400) — the last category-C blocks, so the Customizer drains to empty and
 * every brand rule is git-controlled + identical across markets. Verbatim from the UK Customizer.
 *
 * Contents: heading sizes, ::selection, FAQ boxed layout, PDP button colours + spacing, Flatsome
 * secondary-large hide, product bundle styling, PDP description full-width, product-gallery dots.
 *
 * NB (gallery dots): complements 12-bollsen-pdp-gallery.php (that plugin ENABLES page dots + hides
 * thumbnails; this STYLES the dots). UK runs its own template overrides, not 12-pdp — reconcile when
 * 12-pdp rolls to a market that also loads this sheet (rules are additive, not conflicting). */

/* ===== Custom headings size (Semantic SEO friendly) — UK Cust. L1-18 ===== */
h1, .h1 {
  font-size: 24px !important;
  font-weight: 700 !important;
}
h2, .h2 {
  font-size: 22px !important;
  font-weight: 600 !important;
}
@media (max-width: 767px) {
  h1, .h1 { font-size: 22px !important; }
  h2, .h2 { font-size: 18px !important; }
  h3, .h3 { font-size: 15px !important; }
}

/* ===== FAQ boxed layout — UK Cust. L86-99 ===== */
.faq-boxed {
  max-width: 1000px;   /* desktop max width */
  margin: 0 auto;      /* center align */
  padding: 0 20px;     /* space left & right */
  box-sizing: border-box;
}
@media (max-width: 768px) {
  .faq-boxed {
    padding: 0 15px;   /* less padding on small screens */
  }
}

/* ===== Selection highlight (brand) — UK Cust. L101-106 ===== */
::selection {
	background: #ffbc03;
	color: #fff;
}

/* ===== PDP button colours + spacing — UK Cust. L115-141 ===== */
/* `#single_add_to_cart_button` was pruned from this group on 2026-07-17 (Armin: "an old selector for
 * an old plugin, you can drop it. Match it to UK."). It is an artifact of a previous plugin — the live
 * button is `<button class="single_add_to_cart_button …">` with NO id, and `id="single_add_to_cart_button"`
 * renders 0x on all 16 markets. Only the dead id was removed: the two selectors below are LIVE and keep
 * the yellow-button styling, so the rule itself stays. */
input[type="submit"].button.leave-yellow-color,
.button.secondary {
	color: var(--wp--preset--color--primary);
}
input[type="submit"].button.leave-yellow-color {
  background-color: var(--wp--preset--color--secondary);
}
.product-main{
	padding: 0;
}
.product-short-description{
	padding-top: 10px;
}
.single-product header {
	margin-bottom: 20px;
}

/* ===== Flatsome secondary-large button hide — UK Cust. L396-398 ===== */
.button.secondary.is-secondary.is-large {
  display: none;
}

/* ===== Product bundle styling — UK Cust. L488-501 ===== */
.bundle_button > div:nth-child(1) {
	display:none;
}
.bundle_availability {
	display:none;
}
td.bundled_item_qty_col .quantity {
  display: flex !important;
  align-items: center;
  float: none;
  margin: 0;
}

/* ===== PDP description full width — UK Cust. L503-524 ===== */
@media (max-width: 990px) {
    .product-footer .container {
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
    }
    .product-footer .wc-tabs,
    .woocommerce-product-attributes,
    .Wsrspfapp-container,
    .woocommerce-Tabs-panel--ux_custom_tab,
    .gpsr-tab-content,
    .woocommerce-Tabs-panel--ux_global_tab,
    .related.related-products-wrapper.product-section {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
}

/* ===== Product gallery dots: white fill + dark shadow ring — UK Cust. L526-543 ===== */
.product-gallery-slider .flickity-page-dots .dot {
    background: rgba(255,255,255,0.9);
    border: none;
    box-shadow: 0 0 0 1.5px rgba(0,0,0,0.45), 0 1px 3px rgba(0,0,0,0.25);
    opacity: 0.65;
    width: 11px;
    height: 11px;
}
.product-gallery-slider .flickity-page-dots .dot:hover {
    opacity: 0.9;
}
.product-gallery-slider .flickity-page-dots .dot.is-selected {
    background: #fff;
    box-shadow: 0 0 0 1.5px rgba(0,0,0,0.5), 0 1px 3px rgba(0,0,0,0.3);
    opacity: 1;
}

/* ===================== CONTENT (blog/archive chrome) ================== */
/* Bollsen functional CSS — BLOG / CONTENT chrome.
 * Pairs with mu-plugin 21 (Bollsen Content & Blog). Extracted verbatim from the UK master Customizer
 * (custom-css-audit.md, UK lines ~134-188) so the feature's styling travels with its code in git.
 * Conditionally enqueued by 30-bollsen-assets.php on posts / blog home / archives only. */

/* ===== LLM "Summarize" box  (mu21 #67) — UK L134-167 ===== */
.summarize-box{
  display:flex; align-items:center; justify-content:center; gap:16px;
  padding:14px 16px; margin:14px 0 24px; border:1px solid rgba(0,0,0,.08);
  border-radius:14px; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.04);
}
.summarize-box .title{
  font-weight:600; white-space:nowrap;
}
.summarize-box .logos{
  display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content: center;
}
.summarize-box .logos button{
  margin:unset;
}
.summarize-box .sum-btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px; border:1px solid rgba(0,0,0,.18); border-radius:999px;
  text-decoration:none; line-height:1; font-size:14px;
  transition:transform .12s ease, background .12s ease, border-color .12s ease;
}
.summarize-box .sum-btn img{ display:block; }
.summarize-box .sum-btn:hover{ transform:translateY(-1px); border-color: rgba(0,0,0,.3); }
.summarize-box .sum-chatgpt:hover{ background:#F3F6F8; }
.summarize-box .sum-perplexity:hover{ background:#F4F6FF; }
.summarize-box .sum-gemini:hover{ background:#F4F8FF; }
@media (max-width: 640px){
  .summarize-box{ flex-direction:column; align-items:flex-start; gap:10px; }
}

/* ===== Reading time  (mu21 #54) — UK L169-173 ===== */
.reading-time {
  font-size: 12px;
  color: #666;
  margin-bottom: 12px;
}

/* ===== Blog-archive pills / "Buttons above Blog Archive"  (mu21 #53) — UK L175-188 ===== */
.bollsen-archive-pills { margin: 10px 0 24px; }
.bollsen-archive-pills .pill-list{
  display:flex; flex-wrap:wrap; gap:10px; list-style:none; padding:0; margin:0;
  justify-content:center;
}
.bollsen-archive-pills .pill{
  display:inline-block; padding:6px 14px; border:1px solid currentColor;
  border-radius:999px; text-decoration:none; line-height:1; font-size:14px;
  transition:transform .12s ease, background .12s ease, color .12s ease;
}
.bollsen-archive-pills .pill:hover{ transform:translateY(-1px); }
.bollsen-archive-pills .pill.is-active{ background:#222; color:#fff; border-color:#222; }

/* ===================== ARKI (measurement page) ======================== */
/* Bollsen functional CSS — ARKI measurement page ONLY.
 * Pairs with the theme custom.js ARKI/CF7 redirect feature. Extracted verbatim from the UK master
 * Customizer (custom-css-audit.md, UK lines ~226-301, 418-425). This sheet is the clearest conditional
 * win: it loads ONLY on the ARKI page (30-bollsen-assets.php detects the `.arki-multistep` markup —
 * market-agnostic, no hard-coded page/form IDs), so 99% of pages never request it. */

/* ===== Multistep progress icons — UK L226-260 ===== */
.arki-multistep-container::before{
  content: "";
  position: absolute;
  display: block;
  background-color: rgba(0, 128, 0,0.5);
  width: 7px;
  height: 30%;
  top: 20%;
  left: 48%;
}
.arki-multistep-container::after{
  content: "";
  position: absolute;
  display: block;
  background-color: rgba(211, 211, 211, 0.5);
  width: 7px;
  height: 40%;
  bottom: 5%;
  right: 50%;
}
@media only screen and (min-width: 768px) {
  .arki-multistep-container::before{
    width: 30%;
    height: 7px;
    top: 40%;
    left: 15%;
  }
  .arki-multistep-container::after{
    width: 30%;
    height: 7px;
    top: 40%;
    right: 25%;
  }
}
.arki-multistep{
  position: relative;
  z-index: 2;
}

/* ===== CF7 submit / spinner / file-upload styling — UK L262-301, 423-425 ===== */
.wpcf7-form-control[disabled],
.wpcf7-form-control[disabled]:hover{
  opacity: 0.4;
}
.cf7-fallback-btn.is-hidden {
  display: none;
}
.wpcf7-form [type="submit"] + .wpcf7-spinner {
  display: none;
}
input[type="submit"].button.leave-yellow-color + .wpcf7-spinner {
  display: none;
}
input::file-selector-button {
  font-weight: bold;
  color: #000;
  background-color:#ffbc03;
  padding: 0.5em;
  border: thin solid transparent;
}
.file-upload-field{
  background: #fff;
  color: #000;
  width: 100%;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
}
.file-upload-field:hover{
  box-shadow: inset 0 -1.8em 1em 0 transparent;
}

/* Byline: separate the modified date from the published date (stock Flatsome prints both
   <time> elements with no separator -> "date1date2"). Adjacent-sibling => never fires on
   the equal-date single <time>. Fleet-wide. Added 2026-07-18. */
.posted-on time.published + time.updated::before{content:" · updated ";opacity:.75}