/* ==========================================================================
   Pipattes · styles de la boutique (WooCommerce)

   Chargée uniquement sur la boutique, les fiches, le panier, la commande et le compte.
   Les styles par défaut de WooCommerce sont désactivés (inc/assets.php) : tout est ici.

   Sommaire
   1. Messages
   2. Page boutique (barre d'outils, grille)
   3. Fiche d'une affiche (galerie, résumé, formats, quantité)
   4. Histoire, détails, affiches similaires
   5. Panier
   6. Commande et compte
   ========================================================================== */

/* 1. Messages (ajout au panier, erreurs, informations)
   -------------------------------------------------------------------------- */
.woocommerce-notices-wrapper:empty {
    display: none;
}

.woocommerce-notices-wrapper {
    width: min(100% - 2 * var(--gutter), var(--container));
    margin: 0 auto 1.5rem;
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.wc-block-components-notice-banner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem 1.5rem;
    margin: 0 0 1rem;
    padding: 1rem 1.5rem;
    border: 3px solid var(--c-charbon);
    border-radius: var(--radius);
    background: var(--c-menthe);
    font-weight: 700;
    list-style: none;
}

.woocommerce-info {
    background: var(--c-bleu);
}

.woocommerce-error {
    background: var(--c-rose);
}

.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button {
    order: 2;
    min-height: 2.75rem;
    padding: 0.375rem 1.25rem;
    background: var(--c-charbon);
    color: var(--c-white);
    font-size: 1rem;
}

/* 2. Page boutique
   -------------------------------------------------------------------------- */

/* Interrupteur « Afficher les prix en : La petite · A4 / La grande · A3 ». */
.format-toggle {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1rem;
    margin-left: auto;
}

.format-toggle__label {
    color: var(--c-gris);
    font-weight: 700;
}

.format-toggle__options {
    display: inline-flex;
    gap: 0.25rem;
    padding: 0.3125rem;
    border: 3px solid var(--c-charbon);
    border-radius: 999px;
    background: var(--c-white);
    box-shadow: var(--shadow-hard);
}

.format-toggle__option {
    position: relative;
    margin: 0;
}

.format-toggle__option input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.format-toggle__option span {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
    padding: 0 1.375rem;
    border-radius: 999px;
    font-family: var(--f-display);
    font-size: 1.0625rem;
    font-weight: 600;
    white-space: nowrap;
}

.format-toggle__option input:checked + span {
    background: var(--c-charbon);
    color: var(--c-white);
}

.format-toggle__option input:focus-visible + span {
    outline: 3px solid var(--c-charbon);
    outline-offset: 3px;
}
.shop-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem 2rem;
    margin-bottom: clamp(2rem, 4vw, 3rem);
}

.shop-toolbar .woocommerce-notices-wrapper {
    flex-basis: 100%;
    width: 100%;
    margin: 0;
}

.woocommerce-result-count {
    margin: 0;
    font-family: var(--f-display);
    font-size: 1.375rem;
    font-weight: 600;
}

.woocommerce-ordering {
    margin: 0;
}

.woocommerce-ordering select {
    width: auto;
    min-height: 3.375rem;
    padding-right: 3rem;
    font-family: var(--f-display);
    font-weight: 500;
    appearance: none;
    /* Chevron dessiné en SVG, à droite du champ. */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233A404B' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-position: right 1.125rem center;
    background-repeat: no-repeat;
    background-size: 1rem;
    cursor: pointer;
}

.woocommerce-pagination {
    margin-top: clamp(2.5rem, 5vw, 4rem);
}

/* 3. Fiche d'une affiche
   -------------------------------------------------------------------------- */
.product-top {
    padding-top: clamp(0.5rem, 2vw, 1rem);
    padding-bottom: clamp(3rem, 7vw, 6rem);
}

.product-layout {
    display: grid;
    gap: clamp(2rem, 5vw, 4.5rem);
}

@media (min-width: 900px) {
    .product-layout {
        grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
        align-items: start;
    }

    /* La galerie reste visible pendant qu'on lit le résumé. */
    .product-layout__media {
        position: sticky;
        top: 1.5rem;
    }
}

/* Galerie. */
.product-gallery__stage {
    position: relative;
    display: grid;
    place-items: center;
    aspect-ratio: 620 / 660;
    padding: 8% 14%;
}

.product-gallery__image {
    position: relative;
    width: 100%;
    max-height: 100%;
    border-radius: 0.375rem;
    background: var(--c-white);
    box-shadow: 0 18px 40px -12px rgb(58 64 75 / 0.35);
    object-fit: contain;
    rotate: -3deg;
    transition: rotate 0.4s var(--ease);
}

.product-gallery__stage:hover .product-gallery__image {
    rotate: 0deg;
}

.product-gallery__thumbs {
    display: flex;
    gap: clamp(0.5rem, 2vw, 1.25rem);
    margin: 1.25rem 0 0;
    padding: 0.25rem;
    overflow-x: auto;
    list-style: none;
}

.product-gallery__thumb {
    display: grid;
    place-items: center;
    width: clamp(4.5rem, 16vw, 8.75rem);
    aspect-ratio: 1;
    padding: 12%;
    border: 3px solid transparent;
    border-radius: 1.625rem;
    background: var(--c-jaune);
}

.product-gallery__thumb img {
    max-height: 100%;
    width: auto;
    border-radius: 0.1875rem;
}

.thumb--bleu { background: var(--c-bleu); }
.thumb--rose { background: var(--c-rose); }
.thumb--menthe { background: var(--c-menthe); }

/* Vignette affichée en grand : repérée par un contour, pas seulement par la couleur. */
.product-gallery__thumb[aria-current="true"] {
    border-color: var(--c-charbon);
}

/* Résumé : nom, prix, description, achat. */
.product-summary {
    display: grid;
    gap: 1.25rem;
    align-content: start;
}

.product-summary__title {
    margin-top: -0.75rem;
    font-family: var(--f-display);
    font-size: clamp(3rem, 7vw, 5.75rem);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.02em;
}

.product-summary .price {
    margin: 0;
    color: var(--c-tomato-ink);
    font-family: var(--f-display);
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 700;
    line-height: 1;
}

.product-summary .price del {
    color: var(--c-gris);
    font-size: 0.6em;
    font-weight: 500;
}

.product-summary .price ins {
    text-decoration: none;
}

.woocommerce-product-details__short-description {
    font-size: var(--fs-lead);
}

.woocommerce-product-details__short-description > * + * {
    margin-top: 1em;
}

/* Formulaire d'achat. */
form.cart {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem 1.125rem;
}

.variations_form.cart {
    display: grid;
    gap: 1.25rem;
}

.woocommerce-variation-add-to-cart {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1rem 1.125rem;
}

.single_add_to_cart_button {
    --shadow: var(--c-tomato-shadow);

    flex: 1 1 14rem;
    min-height: 4rem;
    background: var(--c-tomato);
    color: var(--c-white);
    font-size: 1.3125rem;
    font-weight: 700;
}

/* Bouton inactif tant qu'aucun format n'est choisi : gris, sans ombre, mais toujours lisible (pas de transparence). */
.single_add_to_cart_button.disabled,
.single_add_to_cart_button:disabled {
    --shadow: transparent;

    background: #e7ddd0;
    color: var(--c-charbon);
    cursor: not-allowed;
}

/* Quantité : moins, nombre, plus. */
.quantity {
    display: inline-flex;
    align-items: center;
    min-height: 4rem;
    padding: 0 0.375rem;
    border: 3px solid var(--c-charbon);
    border-radius: 999px;
    background: var(--c-white);
}

.quantity .qty {
    width: 3.25rem;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    font-family: var(--f-display);
    font-size: 1.375rem;
    font-weight: 600;
    text-align: center;
    appearance: textfield;
    -moz-appearance: textfield;
}

.quantity .qty::-webkit-inner-spin-button,
.quantity .qty::-webkit-outer-spin-button {
    appearance: none;
    margin: 0;
}

.quantity__button {
    display: grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    border: 0;
    border-radius: 999px;
    background: none;
    cursor: pointer;
    transition: background-color 0.2s;
}

.quantity__button:hover {
    background: var(--c-cream);
}

/* Produit vendu à l'unité (champ masqué par WooCommerce) : pas de cadre vide. */
.quantity:has(input[type="hidden"]) {
    display: none;
}

/* Choix du format. WooCommerce écrit un tableau avec une liste déroulante par attribut. */
table.variations {
    width: 100%;
    border-collapse: collapse;
}

table.variations th,
table.variations td {
    display: block;
    padding: 0;
    text-align: left;
}

table.variations label {
    font-family: var(--f-display);
    font-size: 1.25rem;
    font-weight: 600;
}

.reset_variations {
    display: inline-block;
    margin-top: 0.5rem;
    font-size: 0.9375rem;
    font-weight: 700;
}

/* main.js transforme chaque liste déroulante en boutons radio : plus rapide à lire et à toucher.
   La liste d'origine reste dans la page (masquée) et continue de piloter WooCommerce. */
.variation-choices {
    display: grid;
    gap: 0.875rem;
    margin: 0;
    padding: 0;
    border: 0;
}

.variation-choice {
    position: relative;
    display: block;
    margin: 0;
}

.variation-choice input {
    position: absolute;
    opacity: 0;
}

.variation-choice__label {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.5rem 1rem 1.25rem;
    border: 3px solid var(--c-charbon);
    border-radius: 1.625rem;
    background: var(--c-white);
    box-shadow: var(--shadow-hard);
    font-family: var(--f-display);
    font-size: 1.375rem;
    font-weight: 700;
    cursor: pointer;
    transition: transform 0.15s var(--ease), box-shadow 0.15s var(--ease);
}

/* Pastille de sélection, à gauche. */
.variation-choice__label::before {
    content: "";
    flex: none;
    width: 1.875rem;
    height: 1.875rem;
    border: 3px solid var(--c-charbon);
    border-radius: 999px;
    background: var(--c-white);
}

/* Nom de l'option sur une ligne, dimensions en dessous. */
.variation-choice__text {
    display: grid;
    gap: 0.125rem;
}

.variation-choice__name {
    font-size: 1.375rem;
    line-height: 1.15;
}

.variation-choice__detail {
    color: var(--c-gris);
    font-family: var(--f-text);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.3;
}

/* Prix de l'option, à droite. */
.variation-choice__price {
    margin-left: auto;
    font-size: 1.625rem;
}

.variation-choice input:checked + .variation-choice__label .variation-choice__price {
    color: var(--c-tomato-ink);
}

.variation-choice input:checked + .variation-choice__label {
    border-color: var(--c-tomato-ink);
    box-shadow: 0 5px 0 var(--c-tomato-shadow);
}

.variation-choice input:checked + .variation-choice__label::before {
    border-color: var(--c-tomato-ink);
    background: var(--c-tomato-ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 62% no-repeat;
}

.variation-choice input:focus-visible + .variation-choice__label {
    outline: 3px solid var(--c-charbon);
    outline-offset: 3px;
}

.variation-choice input:disabled + .variation-choice__label {
    opacity: 0.5;
    cursor: not-allowed;
}

.woocommerce-variation-price .price {
    font-size: 1.75rem;
}

.woocommerce-variation-availability,
.stock {
    font-weight: 700;
}

.out-of-stock {
    color: var(--c-tomato-ink);
}

/* 4. Histoire, détails, affiches similaires
   -------------------------------------------------------------------------- */
.story {
    display: grid;
    gap: 1.25rem;
    justify-items: start;
    max-width: 52rem;
    padding-block: clamp(1rem, 3vw, 2rem);
}

.story__text.entry-content {
    width: 100%;
    margin: 0;
    font-weight: 600;
}

.story__text.entry-content > p:first-child {
    font-size: 1em;
    font-weight: 600;
}

.story__mix {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.25rem 0.75rem;
    font-family: var(--f-display);
    font-size: clamp(1.375rem, 2.6vw, 1.75rem);
    font-weight: 600;
}

.details {
    padding-block: var(--section) clamp(1rem, 3vw, 2.5rem);
}

.details__list {
    display: grid;
    gap: clamp(1.25rem, 3vw, 2.25rem);
}

@media (min-width: 800px) {
    .details__list {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.detail {
    position: relative;
    display: grid;
    align-content: start;
    gap: 0.75rem;
    min-height: 15rem;
    padding: clamp(2rem, 4vw, 3rem) clamp(1.75rem, 4vw, 2.875rem);
    font-weight: 600;
}

.detail:nth-child(odd) { rotate: -1.5deg; }
.detail:nth-child(even) { rotate: 1deg; }

.detail > :not(.shape) {
    position: relative;
}

.detail__title {
    font-family: var(--f-display);
    font-size: 1.625rem;
    font-weight: 700;
    line-height: 1.15;
}


.product-after {
    padding-block: clamp(3rem, 6vw, 5.5rem) var(--section);
}

/* Titre des affiches similaires, avec le bouton vers toute la collection à droite. */
.related__head {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    justify-content: space-between;
    gap: 1.25rem 2rem;
    margin-bottom: clamp(2rem, 4vw, 3rem);
}

.related > h2,
.related__head > h2,
.upsells > h2,
.cross-sells > h2 {
    margin-bottom: clamp(2rem, 4vw, 3rem);
    font-family: var(--f-display);
    font-size: clamp(2rem, 4.6vw, 4rem);
    font-weight: 700;
    line-height: 1.02;
    letter-spacing: -0.015em;
}

.upsells {
    margin-bottom: var(--section);
}

/* 5. Panier (version classique et version en blocs)
   -------------------------------------------------------------------------- */
.woocommerce-cart .woocommerce {
    display: grid;
    /* minmax(0, 1fr) : la colonne ne peut pas s'élargir au-delà de l'écran, même si une ligne est longue. */
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(2rem, 4vw, 3.5rem);
    align-items: start;
}

@media (min-width: 1000px) {
    .woocommerce-cart .woocommerce {
        grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr);
    }

    .woocommerce-cart .woocommerce > .woocommerce-notices-wrapper {
        grid-column: 1 / -1;
    }
}

/* Chaque ligne du panier devient une carte. */
.shop_table.cart,
.shop_table.cart tbody {
    display: block;
    width: 100%;
}

.shop_table.cart thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
}

.shop_table.cart tr.cart_item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.5rem 1.25rem;
    margin-bottom: 1.375rem;
    padding: 1.25rem 1.5rem;
    border: 3px solid var(--c-charbon);
    border-radius: 2rem;
    background: var(--c-white);
    box-shadow: var(--shadow-hard);
}

.shop_table.cart td {
    display: block;
    padding: 0;
    border: 0;
}

.shop_table.cart .product-thumbnail {
    grid-row: span 2;
    width: clamp(4.5rem, 14vw, 8rem);
}

.shop_table.cart .product-thumbnail img {
    border-radius: 0.25rem;
    box-shadow: var(--shadow-paper);
    rotate: -3deg;
}

.shop_table.cart .product-name {
    font-family: var(--f-display);
    font-size: clamp(1.25rem, 2.4vw, 1.75rem);
    font-weight: 700;
    line-height: 1.15;
}

.shop_table.cart .product-name a {
    color: inherit;
    text-decoration: none;
}

/* Format choisi, sous le nom de l'affiche : « Format : A4 · 21 × 29,7 cm ». */
.shop_table.cart .product-name dl.variation {
    display: flex;
    flex-wrap: wrap;
    gap: 0 0.375rem;
}

.shop_table.cart .variation dt,
.shop_table.cart .variation dd,
.shop_table.cart .variation dd p {
    display: inline;
    margin: 0;
}

.shop_table.cart .product-name .variation,
.shop_table.cart .product-name dl {
    margin: 0.25rem 0 0;
    color: var(--c-gris);
    font-family: var(--f-text);
    font-size: 1rem;
    font-weight: 600;
}

.shop_table.cart .product-price {
    display: none;
}

.shop_table.cart .product-subtotal {
    grid-column: 3;
    grid-row: 1;
    color: var(--c-tomato-ink);
    font-family: var(--f-display);
    font-size: clamp(1.375rem, 2.6vw, 1.875rem);
    font-weight: 700;
    text-align: right;
}

.shop_table.cart .product-quantity {
    grid-column: 2;
}

.shop_table.cart .product-quantity .quantity {
    min-height: 3.25rem;
}

.shop_table.cart .product-remove {
    grid-column: 3;
    grid-row: 2;
    text-align: right;
}

.shop_table.cart .product-remove a {
    display: inline-grid;
    place-items: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 999px;
    color: var(--c-tomato-ink);
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
}

.shop_table.cart .product-remove a:hover {
    background: var(--c-rose);
}

.shop_table.cart td.actions {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: space-between;
}

.shop_table.cart .coupon {
    display: flex;
    flex: 1 1 18rem;
    gap: 0.75rem;
}

.shop_table.cart .coupon label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
}

.shop_table.cart td.actions .button {
    min-height: 3.25rem;
    padding: 0.5rem 1.5rem;
    background: var(--c-charbon);
    color: var(--c-white);
    font-size: 1.0625rem;
}

/* Récapitulatif : sur une forme jaune. */
.cart-collaterals .cart_totals,
.wc-block-cart__sidebar .wc-block-components-sidebar,
.wc-block-cart__sidebar {
    padding: clamp(1.75rem, 4vw, 2.75rem);
    border-radius: 3rem 2.25rem 3.25rem 2.5rem;
    background: var(--c-jaune);
}

.cart_totals h2 {
    margin-bottom: 1rem;
    font-family: var(--f-display);
    font-size: 1.875rem;
    font-weight: 700;
}

.cart_totals table {
    width: 100%;
    border-collapse: collapse;
}

.cart_totals th,
.cart_totals td {
    padding: 0.625rem 0;
    font-weight: 700;
    text-align: left;
    vertical-align: top;
}

.cart_totals td {
    font-family: var(--f-display);
    text-align: right;
}

.cart_totals .order-total th,
.cart_totals .order-total td {
    padding-top: 1rem;
    border-top: 3px solid var(--c-charbon);
    font-family: var(--f-display);
    font-size: 1.75rem;
}

.wc-proceed-to-checkout {
    margin-top: 1.25rem;
}

.checkout-button,
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
    --shadow: var(--c-tomato-shadow);

    width: 100%;
    min-height: 4rem;
    border: 0;
    border-radius: 999px;
    background: var(--c-tomato);
    box-shadow: 0 5px 0 var(--shadow);
    color: var(--c-white);
    font-family: var(--f-display);
    font-size: 1.3125rem;
    font-weight: 700;
}

.cart-empty {
    grid-column: 1 / -1;
}

.return-to-shop {
    grid-column: 1 / -1;
}

.return-to-shop .button {
    background: var(--c-charbon);
    color: var(--c-white);
}

.cross-sells {
    grid-column: 1 / -1;
    margin-top: clamp(2rem, 5vw, 4rem);
}

/* Panier et commande en blocs : on aligne la typographie et les arrondis sur le thème. */
.wc-block-cart,
.wc-block-checkout {
    font-family: var(--f-text);
}

.wc-block-components-title,
.wc-block-cart-items__header,
.wc-block-components-product-name,
.wc-block-components-totals-item__label,
.wc-block-components-totals-item__value {
    font-family: var(--f-display);
}

.wc-block-components-product-name {
    font-size: 1.375rem;
    font-weight: 700;
    text-decoration: none;
}

.wc-block-cart-item__image img {
    border-radius: 0.25rem;
    box-shadow: var(--shadow-paper);
}

.wc-block-components-text-input input,
.wc-block-components-select select,
.wc-blocks-components-select__select,
.wc-block-components-textarea {
    border: 3px solid var(--c-charbon) !important;
    border-radius: 1.25rem !important;
}

.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
    font-size: 1.75rem;
    font-weight: 700;
}

/* 6. Commande et compte
   La page de commande utilise les blocs de WooCommerce : on garde leur fonctionnement,
   et on aligne la typographie, les champs et le récapitulatif sur le reste du site.
   -------------------------------------------------------------------------- */
.wc-block-checkout {
    font-size: 1.0625rem;
}

.wc-block-components-checkout-step__title,
.wc-block-components-title.wc-block-components-title {
    font-family: var(--f-display);
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    line-height: 1.15;
}

.wc-block-components-checkout-step {
    margin-bottom: clamp(1.5rem, 4vw, 2.5rem);
}

/* Fiche produit : Apple Pay et Google Pay côte à côte.
   Chaque bouton impose 260 px de large minimum ; avec l'écart de 10 px, la colonne de 525 px est juste trop étroite
   et le second bouton passe dessous. Sur téléphone, les boutons restent l'un sous l'autre. */
@media (min-width: 40em) {
    #wc-stripe-express-checkout-element .StripeElement {
        min-width: 0 !important;
    }
}

/* « Validation de commande express » (Apple Pay, Google Pay) : un petit libellé posé sur le cadre.
   Sans cette règle, le style des titres du contenu l'agrandit et il passe sous les boutons. */
.page-content .entry-content h2.wc-block-components-express-payment__title {
    margin: 0;
    font-family: var(--f-text);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.3;
    text-transform: none;
}

/* Récapitulatif de la commande : sur fond jaune, comme dans le panier. */
.wc-block-checkout__sidebar .wc-block-components-order-summary,
.wc-block-checkout__sidebar .wc-block-components-totals-wrapper,
.wc-block-checkout__sidebar .wc-block-components-panel {
    border-color: rgb(58 64 75 / 0.25) !important;
}

.wc-block-components-sidebar-layout .wc-block-components-sidebar {
    padding: clamp(1.25rem, 3vw, 2rem);
    border: 0;
    border-radius: 3rem 2.25rem 3.25rem 2.5rem;
    background: var(--c-jaune);
}

.wc-block-components-sidebar .wc-block-components-order-summary__button-text,
.wc-block-components-sidebar .wc-block-components-checkout-order-summary__title-text {
    font-family: var(--f-display);
    font-size: 1.5rem;
    font-weight: 700;
}

.wc-block-components-order-summary-item__image img {
    border-radius: 0.1875rem;
    box-shadow: var(--shadow-paper);
}

.wc-block-components-order-summary-item__quantity {
    border: 0 !important;
    background: var(--c-charbon) !important;
    color: var(--c-white) !important;
    font-weight: 700;
}

/* Moyens de paiement : chaque option dans un cadre, l'option choisie est entourée. */
.wc-block-components-radio-control-accordion-option,
.wc-block-components-radio-control__option {
    border-radius: 1.25rem;
}

.wc-block-components-radio-control--highlight-checked,
.wc-block-components-radio-control--highlight-checked-first-selected,
.wc-block-components-radio-control--highlight-checked-last-selected {
    border-radius: 1.25rem;
    background: var(--c-white);
}

.wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"] {
    border: 3px solid var(--c-charbon);
    border-radius: 0.375rem;
}

.wc-block-components-checkout-place-order-button,
.wc-block-cart__submit-button {
    transition: transform 0.15s var(--ease), box-shadow 0.15s var(--ease);
}

.wc-block-components-checkout-place-order-button:hover,
.wc-block-cart__submit-button:hover {
    transform: translateY(2px);
    box-shadow: 0 3px 0 var(--c-tomato-shadow);
}

/* Commande en version classique (code court [woocommerce_checkout]), si elle est préférée aux blocs. */
.woocommerce-checkout h3,
.woocommerce-account h2,
.woocommerce-account h3 {
    margin-bottom: 1rem;
    font-family: var(--f-display);
    font-size: 1.75rem;
    font-weight: 700;
}

.form-row {
    margin: 0 0 1.125rem;
}

.form-row .required {
    color: var(--c-tomato-ink);
    text-decoration: none;
}

#order_review,
.woocommerce-checkout-review-order {
    padding: clamp(1.5rem, 4vw, 2.5rem);
    border-radius: 2.5rem;
    background: var(--c-white);
}

#place_order {
    --shadow: var(--c-tomato-shadow);

    width: 100%;
    min-height: 4rem;
    background: var(--c-tomato);
    color: var(--c-white);
    font-size: 1.3125rem;
    font-weight: 700;
}

/* Compte client : connexion, inscription, tableau de bord. */
.woocommerce-account .woocommerce {
    max-width: 62rem;
}

.woocommerce-form-login,
.woocommerce-form-register,
.woocommerce-ResetPassword {
    display: grid;
    gap: 0.25rem;
    max-width: 30rem;
    padding: clamp(1.5rem, 4vw, 2.5rem);
    border: 3px solid var(--c-charbon);
    border-radius: 2rem;
    background: var(--c-white);
    box-shadow: var(--shadow-hard);
}

.woocommerce-form-login .form-row:has(.woocommerce-form-login__submit) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 0.5rem;
}

.woocommerce-form__label-for-checkbox {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    margin: 0;
    font-weight: 600;
}

.woocommerce-form__input-checkbox {
    width: 1.375rem;
    height: 1.375rem;
    accent-color: var(--c-tomato-ink);
}

/* Bouton « afficher le mot de passe », posé dans le champ. */
.password-input {
    position: relative;
    display: block;
}

.show-password-input {
    position: absolute;
    top: 50%;
    right: 0.75rem;
    width: 2.25rem;
    height: 2.25rem;
    border: 0;
    border-radius: 999px;
    background: var(--c-cream) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233A404B' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3.6-7 10-7 10 7 10 7-3.6 7-10 7S2 12 2 12Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center / 1.25rem no-repeat;
    transform: translateY(-50%);
    cursor: pointer;
}

.woocommerce-LostPassword a,
.lost_password a {
    color: var(--c-tomato-ink);
    font-weight: 700;
}

.woocommerce-MyAccount-navigation ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin: 0 0 2rem;
    padding: 0;
    list-style: none;
}

.woocommerce-MyAccount-navigation a {
    display: inline-flex;
    align-items: center;
    min-height: 3rem;
    padding: 0.5rem 1.5rem;
    border: 3px solid var(--c-charbon);
    border-radius: 999px;
    background: var(--c-white);
    color: var(--c-charbon);
    font-family: var(--f-display);
    font-weight: 600;
    text-decoration: none;
}

.woocommerce-MyAccount-navigation .is-active a {
    background: var(--c-charbon);
    color: var(--c-white);
}

.woocommerce-MyAccount-content {
    font-size: var(--fs-lead);
}

.woocommerce-orders-table {
    width: 100%;
    border-collapse: collapse;
}


/* Collections par thème, au-dessus de la grille. */
.collections ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 0.75rem;
    margin: 0 0 1.5rem;
    padding: 0;
    list-style: none;
}

.collections a {
    display: block;
    padding: 0.5rem 1rem;
    border: 2px solid var(--c-charbon);
    border-radius: 999px;
    font-family: var(--f-display);
    font-weight: 600;
    text-decoration: none;
}

.collections a:hover,
.collections .current-cat a {
    background: var(--c-charbon);
    color: var(--c-white);
}

/* Texte de la page boutique, sous les affiches. */
.shop-text {
    margin-block: var(--section);
}