/* Shared storefront surfaces: catalogue mention, cart suggestion and complementary packs.
   Theme tokens, nested surfaces, blue prices, green savings; no decorative accent stripes. */
.tlc-pack, .tlc-offer-catalogue, .tlc-offer-adjust {
  --offer-ink: var(--tlc-color-ink, var(--wp--preset--color--ink, #202020));
  --offer-paper: var(--tlc-color-paper, var(--wp--preset--color--paper, #fff));
  --offer-surface: var(--tlc-color-surface, var(--wp--preset--color--surface, #f3f3f3));
  --offer-brand: var(--tlc-color-brand, var(--wp--preset--color--brand, #ffb91f));
  --offer-urgent: var(--tlc-color-brand-strong, var(--wp--preset--color--brand-strong, #d43811));
  --offer-price: var(--tlc-color-price, #2457a7);
  --offer-success: var(--tlc-color-success, #207c3c);
  --offer-focus: var(--tlc-color-info, var(--wp--preset--color--info, #006799));
  --offer-muted: color-mix(in srgb, var(--offer-ink) 67%, var(--offer-paper));
  --offer-line: color-mix(in srgb, var(--offer-ink) 10%, transparent);
  --offer-wash: color-mix(in srgb, var(--offer-surface) 55%, var(--offer-paper));
  --offer-saving-wash: color-mix(in srgb, var(--offer-success) 9%, var(--offer-paper));
  --offer-ease: cubic-bezier(.32, .72, 0, 1);
}

/* Catalogue cards: a compact mention, conditions on the second line. */
.tlc-offer-catalogue { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 1px; max-width: 100%; margin: 4px 0 8px; padding: 6px 11px 7px; border-radius: 12px; background: var(--offer-wash); box-shadow: inset 0 0 0 1px var(--offer-line); color: var(--offer-ink); font-size: 12px; line-height: 1.35; text-align: start; }
.tlc-offer-catalogue strong { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 650; }
.tlc-offer-catalogue strong::before { content: ""; flex: none; width: 13px; height: 13px; background: var(--offer-success); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 12.2V4.5a1 1 0 0 1 1-1h7.7l8.3 8.3a1 1 0 0 1 0 1.4l-7.3 7.3a1 1 0 0 1-1.4 0z'/%3E%3Ccircle cx='8' cy='8' r='1.2'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 12.2V4.5a1 1 0 0 1 1-1h7.7l8.3 8.3a1 1 0 0 1 0 1.4l-7.3 7.3a1 1 0 0 1-1.4 0z'/%3E%3Ccircle cx='8' cy='8' r='1.2'/%3E%3C/svg%3E") center / contain no-repeat; }
.tlc-offer-catalogue small { padding-inline-start: 19px; color: var(--offer-muted); font-size: 11px; }
.tlc-offer-catalogue__chip { display: inline-flex; align-items: center; padding: 2px 7px; border-radius: 999px; background: var(--offer-ink); color: var(--offer-brand); font-size: 11px; font-weight: 700; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.tlc-offer-catalogue strong:has(.tlc-offer-catalogue__chip)::before { display: none; }
.tlc-offer-catalogue:has(.tlc-offer-catalogue__chip) small { padding-inline-start: 0; }
.tlc-offer-catalogue[hidden] { display: none; }
/* Theme product cards: the mention sits just above the price, in every card layout. */
.woocommerce ul.products li.product .tlc-offer-catalogue { align-self: flex-start; margin: auto 0 0; }
.woocommerce ul.products li.product .tlc-offer-catalogue + .price { margin-top: 6px; }
@media (min-width: 1001px) {
  .woocommerce .tlc-catalog-results.is-view-list ul.products li.tlc-product-card .tlc-offer-catalogue { margin: 4px 0 0; grid-column: 2; grid-row: 4; }
}
@media (max-width: 560px) {
  .woocommerce .tlc-catalog-results ul.products li.tlc-product-card .tlc-offer-catalogue { margin: 8px 0 0; grid-column: 2; grid-row: 5; }
}

/* Cart, mini-cart and checkout lines: the price before the offer, then the saving. */
:is(.woocommerce-cart-form, .tlc-cart-drawer, .woocommerce-mini-cart) :is(.product-price, .quantity) del { margin-inline-end: 4px; color: var(--tlc-color-muted, #707070); font-size: .88em; font-weight: 500; }
:is(.woocommerce-cart-form, .tlc-cart-drawer, .woocommerce-mini-cart) :is(.product-price, .quantity) ins { text-decoration: none; }
.variation .tlc-offer-saving { color: var(--tlc-color-success, #207c3c); font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.variation .tlc-offer-note { color: var(--tlc-color-muted, #707070); }
.tlc-pack-cart-child .variation dd { color: var(--tlc-color-ink, #202020); font-weight: 600; }

/* Cart: the next exact quantity, as a quiet pill action. */
.tlc-offer-adjust { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; margin: 8px 0; padding: 6px 16px 6px 8px; border: 0; border-radius: 999px; background: var(--offer-paper); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--offer-ink) 18%, transparent); color: var(--offer-ink); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; transition: background-color .4s var(--offer-ease), color .4s var(--offer-ease), transform .4s var(--offer-ease); }
.tlc-offer-adjust::before { content: "+"; display: grid; flex: none; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--offer-saving-wash); color: var(--offer-success); font-size: 16px; font-weight: 500; line-height: 1; transition: transform .5s var(--offer-ease); }
.tlc-offer-adjust:hover { background: var(--offer-ink); color: var(--offer-paper); }
.tlc-offer-adjust:hover::before { transform: rotate(90deg); }
.tlc-offer-adjust:active { transform: scale(.98); }

/* Complementary pack: an outer tray, an inner surface, a composition joined by "+". */
.tlc-pack { margin: 20px 0; padding: 5px; border-radius: 26px; background: var(--offer-surface); box-shadow: inset 0 0 0 1px var(--offer-line); color: var(--offer-ink); font-family: var(--tlc-font-sans, inherit); text-align: start; -webkit-font-smoothing: antialiased; }
.tlc-pack *, .tlc-pack *::before, .tlc-pack *::after { box-sizing: border-box; }
.tlc-pack .woocommerce-Price-amount, .tlc-pack .woocommerce-Price-currencySymbol { font-size: inherit; font-weight: inherit; color: inherit; }
.tlc-pack__surface { padding: 22px 22px 18px; border-radius: 21px; background: var(--offer-paper); box-shadow: inset 0 0 0 1px var(--offer-line), 0 1px 2px rgb(32 32 32 / .04); }
.tlc-pack__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px 16px; margin-bottom: 14px; }
.tlc-pack .tlc-pack__eyebrow { display: inline-flex; align-items: center; gap: 7px; margin: 0 0 10px; padding: 4px 10px 4px 8px; border-radius: 999px; background: var(--offer-wash); box-shadow: inset 0 0 0 1px var(--offer-line); color: var(--offer-muted); font-size: 10px; font-weight: 600; line-height: 1.4; letter-spacing: .14em; text-transform: uppercase; }
.tlc-pack .tlc-pack__eyebrow::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--offer-brand); }
.tlc-pack h3 { margin: 0; color: var(--offer-ink); font-size: 1.25rem; font-weight: 650; line-height: 1.25; letter-spacing: -.025em; text-wrap: balance; }
.tlc-pack__chip { display: inline-flex; flex: none; align-items: center; padding: 6px 12px; border-radius: 999px; background: var(--offer-ink); color: var(--offer-brand); box-shadow: 0 8px 16px -10px rgb(32 32 32 / .55); font-size: 15px; font-weight: 700; line-height: 1.1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tlc-pack .tlc-pack__items { margin: 0; padding: 0; list-style: none; }
.tlc-pack .tlc-pack__item { position: relative; display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; gap: 14px; margin: 0; padding: 9px 0; }
.tlc-pack__item + .tlc-pack__item::before { content: "+"; position: absolute; top: -11px; left: 17px; z-index: 1; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--offer-paper); box-shadow: inset 0 0 0 1px var(--offer-line), 0 2px 6px -2px rgb(32 32 32 / .2); color: var(--offer-muted); font-size: 14px; font-weight: 500; line-height: 1; }
.tlc-pack__thumb { display: grid; place-items: center; width: 56px; height: 56px; overflow: hidden; border-radius: 16px; background: var(--offer-wash); box-shadow: inset 0 0 0 1px var(--offer-line); }
.tlc-pack .tlc-pack__thumb img { display: block; width: 100%; height: 100%; margin: 0; padding: 6px; border-radius: 0; object-fit: contain; mix-blend-mode: multiply; }
.tlc-pack__name { display: grid; gap: 2px; min-width: 0; }
.tlc-pack__name a { color: inherit; font-size: 14px; font-weight: 500; line-height: 1.35; text-decoration: none; overflow-wrap: anywhere; }
.tlc-pack__name a:hover { text-decoration: underline; text-underline-offset: 3px; }
.tlc-pack__name small { color: var(--offer-muted); font-size: 12px; line-height: 1.4; }
.tlc-pack__line { display: grid; justify-items: end; gap: 1px; text-align: end; }
.tlc-pack__line strong { color: var(--offer-price); font-size: 14px; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tlc-pack__line del { color: var(--offer-muted); font-size: 11.5px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tlc-pack__item.is-unavailable :is(.tlc-pack__thumb, .tlc-pack__name a, .tlc-pack__line) { opacity: .55; }
.tlc-pack__total { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 10px 16px; margin: 10px 0 14px; padding: 14px 16px; border-radius: 16px; background: var(--offer-wash); box-shadow: inset 0 0 0 1px var(--offer-line); }
.tlc-pack__sum { display: grid; gap: 1px; }
.tlc-pack__sum > span { color: var(--offer-muted); font-size: 12.5px; font-weight: 500; }
.tlc-pack__sum strong { color: var(--offer-price); font-size: 1.75rem; font-weight: 700; line-height: 1.1; letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
.tlc-pack__sum del { color: var(--offer-muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.tlc-pack__saving { padding: 5px 11px; border-radius: 999px; background: var(--offer-saving-wash); color: var(--offer-success); font-size: 13px; font-weight: 650; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tlc-pack__timer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 12px; margin: 0 0 14px; padding: 11px 14px; border-radius: 14px; box-shadow: inset 0 0 0 1px var(--offer-line); font-size: 12.5px; }
.tlc-pack__timer-label { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; }
.tlc-pack__live { position: relative; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--offer-urgent); }
.tlc-pack__live::after { content: ""; position: absolute; inset: 0; border-radius: inherit; background: inherit; animation: tlc-pack-ping 2.4s var(--offer-ease) infinite; }
.tlc-pack__timer strong { font-size: 14px; font-weight: 650; white-space: nowrap; font-variant-numeric: tabular-nums; }
.tlc-pack form.tlc-pack__form { display: block; margin: 0; }
.tlc-pack__form button { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 52px; padding: 6px 6px 6px 24px; border: 0; border-radius: 999px; background: var(--offer-brand); color: var(--offer-ink); box-shadow: inset 0 1px 0 rgb(255 255 255 / .45), 0 12px 24px -16px color-mix(in srgb, var(--offer-urgent) 70%, transparent); font: inherit; font-size: .9rem; font-weight: 760; cursor: pointer; transition: transform .5s var(--offer-ease); }
.tlc-pack__form button > span:first-child { flex: 1; text-align: center; }
.tlc-pack__button-icon { display: grid; flex: none; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: rgb(32 32 32 / .09); transition: transform .6s var(--offer-ease), background-color .45s var(--offer-ease), color .45s var(--offer-ease); }
.tlc-pack__button-icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.tlc-pack__form button:not(:disabled):hover .tlc-pack__button-icon { background: var(--offer-ink); color: var(--offer-brand); transform: rotate(90deg) scale(1.05); }
.tlc-pack__form button:not(:disabled):active { transform: scale(.98); }
.tlc-pack__form button:disabled { padding-inline-end: 24px; background: var(--offer-surface); box-shadow: inset 0 0 0 1px var(--offer-line); color: var(--offer-muted); cursor: not-allowed; }
.tlc-pack .tlc-pack__note { margin: 12px 4px 0; color: var(--offer-muted); font-size: 12px; line-height: 1.55; }
.tlc-pack a:focus-visible, .tlc-pack button:focus-visible, .tlc-offer-adjust:focus-visible { outline: 2px solid var(--offer-focus); outline-offset: 3px; }
@media (max-width: 480px) {
  .tlc-pack { border-radius: 22px; }
  .tlc-pack__surface { padding: 18px 16px 16px; border-radius: 17px; }
  .tlc-pack h3 { font-size: 1.125rem; }
  .tlc-pack .tlc-pack__item { grid-template-columns: 48px minmax(0, 1fr); gap: 4px 12px; }
  .tlc-pack__item + .tlc-pack__item::before { left: 13px; }
  .tlc-pack__thumb { grid-row: span 2; width: 48px; height: 48px; border-radius: 14px; }
  .tlc-pack__line { grid-column: 2; display: flex; align-items: baseline; gap: 8px; justify-items: start; }
  .tlc-pack__sum strong { font-size: 1.5rem; }
}
@keyframes tlc-pack-ping { 0% { opacity: .5; transform: scale(1); } 70%, 100% { opacity: 0; transform: scale(2.6); } }
@media (prefers-reduced-motion: reduce) {
  .tlc-pack *, .tlc-offer-adjust, .tlc-offer-adjust::before { transition: none !important; animation: none !important; }
}
@media (forced-colors: active) {
  .tlc-pack__surface, .tlc-pack__total, .tlc-offer-catalogue, .tlc-offer-adjust { outline: 1px solid CanvasText; outline-offset: -1px; }
}

/* Operation bar: shown by the browser between the operation's start and end, cached pages included. */
.tlc-event-bar { --offer-ink: var(--tlc-color-ink, #202020); --offer-brand: var(--tlc-color-brand, #ffb91f); position: relative; z-index: 2; background: var(--offer-ink); color: #fff; font-family: var(--tlc-font-sans, inherit); }
.tlc-event-bar[hidden] { display: none; }
.tlc-event-bar__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 6px 16px; max-width: 1280px; min-height: 44px; margin: 0 auto; padding: 8px 52px; font-size: 13.5px; line-height: 1.4; text-align: center; }
.tlc-event-bar__label { padding: 3px 10px; border-radius: 999px; background: var(--offer-brand); color: var(--offer-ink); font-size: 11.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.tlc-event-bar__message { font-weight: 500; }
.tlc-event-bar__clock { color: rgb(255 255 255 / .75); font-size: 12.5px; }
.tlc-event-bar__clock [data-event-clock] { color: #fff; font-weight: 700; font-variant-numeric: tabular-nums; }
.tlc-event-bar a.tlc-event-bar__link { color: var(--offer-brand); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.tlc-event-bar__close { position: absolute; top: 50%; right: 10px; display: grid; place-items: center; width: 32px; height: 32px; margin-top: -16px; padding: 0; border: 0; border-radius: 50%; background: rgb(255 255 255 / .1); color: #fff; font: inherit; font-size: 18px; line-height: 1; cursor: pointer; transition: background-color .4s var(--offer-ease, ease); }
.tlc-event-bar__close:hover { background: rgb(255 255 255 / .2); }
.tlc-event-bar :is(a, button):focus-visible { outline: 2px solid var(--offer-brand); outline-offset: 3px; }
@media (max-width: 600px) { .tlc-event-bar__inner { justify-content: flex-start; padding: 8px 48px 8px 14px; text-align: start; font-size: 12.5px; } .tlc-event-bar__message { flex-basis: 100%; } }

/* Catalogue: one chip to show only the products with a current offer. */
.tlc-offer-filter { --offer-ink: var(--tlc-color-ink, #202020); display: inline-flex; align-items: center; gap: 8px; min-height: 38px; margin: 0 8px 12px 0; padding: 6px 16px 6px 12px; border-radius: 999px; background: var(--tlc-color-paper, #fff); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--offer-ink) 18%, transparent); color: var(--offer-ink); font-size: 13px; font-weight: 600; text-decoration: none; }
.tlc-offer-filter::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--tlc-color-success, #207c3c); }
.tlc-offer-filter:hover, .tlc-offer-filter.is-active { background: var(--offer-ink); color: #fff; }
.tlc-offer-filter.is-active::before { background: var(--tlc-color-brand, #ffb91f); }
.tlc-offer-filter:focus-visible { outline: 2px solid var(--tlc-color-info, #006799); outline-offset: 3px; }

/* Operation page shortcode. */
.tlc-operation-showcase { margin: 24px 0; }
.tlc-operation-note { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 20px; padding: 8px 14px; border-radius: 999px; background: var(--tlc-color-surface, #f3f3f3); color: var(--tlc-color-ink, #202020); font-size: 13.5px; font-weight: 500; }
.tlc-operation-note::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--tlc-color-brand-strong, #d43811); }
