/* ==========================================================
   Simphonie — Charte graphique 2026
   Couche finale chargée après les réglages de la console.
========================================================== */

@import url("01-tokens.css?v=20260728-1");
@import url("02-base.css?v=20260728-1");

:root {
  --sctc-button-background: #6a4b3b;
  --sctc-button-hover-background: #51382d;
  --sctc-button-hover-text: #fdfcf9;
  --sctc-training-accent: #b28f76;
  --sctc-quick-order-accent: #b28f76;
  --sctc-rgb-quick-order-accent: 178 143 118;
  --sctc-category-header-background: #e7d8cb;
  --sctc-facets-background: #f4ede7;
}

html {
  background: var(--sc-color-background);
}

body,
body #wrapper {
  color: #000000;
  background-color: var(--sc-color-background);
}

body,
button,
input,
select,
textarea {
  font-family: var(--sc-font-family-body);
}

body#category #main,
body#product .sc-product-page {
  font-family: var(--sc-font-family-body);
}

body :is(h1, h2, .h1, .h2) {
  font-family: var(--sc-font-family-heading);
}

body#category #main :is(h1, h2, .subcategory-name, .sc-product-card__title, .product-title),
body#product .sc-product-page :is(h1, h2) {
  font-family: var(--sc-font-family-heading);
}

body#category #main :is(h3, h4, h5, h6),
body#product .sc-product-page :is(h3, h4, h5, h6) {
  font-family: var(--sc-font-family-body);
}

body#product .sc-product-buybox__title {
  color: var(--sc-color-primary-deep);
  font-family: var(--sc-font-family-heading);
  font-size: clamp(48px, 3.8vw, 72px);
  font-weight: var(--sc-font-weight-medium);
  line-height: var(--sc-line-height-heading);
}

body :is(
  .page-header h1,
  .page-title,
  .sc-category-hero h1,
  .sc-category-studio__title,
  .sc-product-buybox__title,
  .sc-cart-heading h1,
  .sc-cart-empty h1,
  .sc-checkout-header h1,
  .sc-content-hero h1,
  .sc-form-hero h1
) {
  color: var(--sc-color-primary-deep);
  font-family: var(--sc-font-family-heading);
  font-size: var(--sc-font-size-heading-lg);
  font-weight: var(--sc-font-weight-medium);
  line-height: var(--sc-line-height-heading);
}

body :is(
  .sc-home-universes__intro h2,
  .sc-home-editorial__content h2,
  .sc-home-reviews__heading h2,
  .sc-home-community__heading h2,
  .sc-category-additional h2,
  .sc-product-details h2,
  .sc-product-page__details h2,
  .sc-cart-summary h2,
  .sc-footer__newsletter h2
) {
  color: var(--sc-color-primary-deep);
  font-family: var(--sc-font-family-heading);
  font-size: var(--sc-font-size-heading-sm);
  font-weight: var(--sc-font-weight-medium);
  line-height: 1.02;
}

body :is(
  .sc-section-subtitle,
  .sc-product-details h3,
  .sc-product-page__details h3,
  .sc-content-card h3,
  .sc-account-card h3
) {
  color: var(--sc-color-primary-deep);
  font-family: var(--sc-font-family-body);
  font-size: var(--sc-font-size-subtitle);
  font-weight: var(--sc-font-weight-semibold);
  line-height: 1.25;
}

body :is(
  [class*="__eyebrow"],
  [class*="__kicker"],
  .product-reference,
  .product-flag,
  .badge,
  .caption,
  figcaption
) {
  font-family: var(--sc-font-family-body);
  font-size: var(--sc-font-size-caption);
}

body :is(a, button, .btn) {
  text-underline-offset: 0.2em;
}

body a {
  color: var(--sc-color-primary-deep);
}

body a:is(:hover, :focus-visible) {
  color: var(--sc-color-primary);
}

body :is(
  .btn-primary,
  .button-primary,
  .form-control-submit,
  button[data-button-action="add-to-cart"],
  a[data-button-action="add-to-cart"],
  .product-add-to-cart .add-to-cart,
  .sc-product-buybox .add-to-cart,
  .sc-product-sticky-cart__button,
  .sc-cart-empty__action,
  .sc-newsletter__submit,
  .sc-training-session__button:not(.is-disabled)
) {
  color: var(--sc-color-background);
  background-color: var(--sc-color-commerce-action);
  border-color: var(--sc-color-commerce-action);
  font-family: var(--sc-font-family-body);
  font-weight: var(--sc-font-weight-semibold);
}

body :is(
  .btn-primary,
  .button-primary,
  .form-control-submit,
  button[data-button-action="add-to-cart"],
  a[data-button-action="add-to-cart"],
  .product-add-to-cart .add-to-cart,
  .sc-product-buybox .add-to-cart,
  .sc-product-sticky-cart__button,
  .sc-cart-empty__action,
  .sc-newsletter__submit,
  .sc-training-session__button:not(.is-disabled)
):not(:disabled):is(:hover, :focus-visible) {
  color: var(--sc-color-background);
  background-color: var(--sc-color-commerce-action-hover);
  border-color: var(--sc-color-commerce-action-hover);
}

.sc-header,
.sc-sticky-header {
  background: var(--sc-color-background);
}

.sc-mega,
.sc-mobile-menu,
#footer .sc-footer__newsletter {
  background: var(--sc-color-secondary);
}

#footer,
#footer .sc-footer,
#footer .sc-footer__main {
  background: var(--sc-color-background);
}

body :is(
  .card,
  .sc-account-card,
  .sc-content-card,
  .sc-cart-products .cart-item,
  .sc-cart-summary,
  .sc-product-card,
  .product-miniature
) {
  background-color: var(--sc-color-surface);
}

body :is(
  .sc-category-hero,
  .sc-product-buybox__selection,
  .sc-product-accordion,
  .sc-checkout-summary,
  .sc-form-aside
) {
  border-color: var(--sc-color-border);
}

body :is(
  .sc-category-hero,
  .sc-product-buybox__selection,
  .sc-checkout-summary,
  .sc-form-aside
) {
  background-color: var(--sc-color-secondary);
}

::selection {
  color: #000000;
  background: var(--sc-color-secondary);
}

@media (max-width: 767px) {
  body#product .sc-product-buybox__title {
    overflow: visible;
    font-size: clamp(36px, 9.5vw, 44px);
    line-height: 1;
    text-wrap: balance;
    white-space: normal;
  }

  body :is(
    .page-header h1,
    .page-title,
    .sc-category-hero h1,
    .sc-category-studio__title,
    .sc-product-buybox__title,
    .sc-cart-heading h1,
    .sc-cart-empty h1,
    .sc-checkout-header h1,
    .sc-content-hero h1,
    .sc-form-hero h1
  ) {
    font-size: clamp(48px, 14vw, 64px);
  }

  body :is(
    .sc-home-universes__intro h2,
    .sc-home-editorial__content h2,
    .sc-home-reviews__heading h2,
    .sc-home-community__heading h2,
    .sc-category-additional h2,
    .sc-product-details h2,
    .sc-product-page__details h2,
    .sc-cart-summary h2,
    .sc-footer__newsletter h2
  ) {
    font-size: clamp(40px, 10vw, 48px);
  }
}
