/* ============================================================
   NINA FAIT DU YOGA — Styles boutique
   Style "édito wellness" : crème, bleu nuit, capitales espacées.
   Ajuste les variables ci-dessous, toute la déclinaison suit.
   Sections : VARIABLES / COMMUN / PLP / PDP / SWATCHES / CHECKOUT
   ============================================================ */

:root {
    --nfy-ink: #14183C;        /* bleu nuit (aligner sur le logo) */
    --nfy-bg: #FAF8F4;         /* crème très léger */
    --nfy-muted: #8A8FA3;      /* gris-bleu doux */
    --nfy-line: #E8E4DC;       /* filets et bordures */
    --nfy-radius: 14px;
}

/* ============================================================
   COMMUN PLP + PDP
   ============================================================ */

/* Fond doux sur les pages boutique */
.woocommerce,
.archive.woocommerce-page {
    background-color: var(--nfy-bg);
}

/* Boutons : pilule bleu nuit */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce .button.alt,
.woocommerce button.single_add_to_cart_button {
    background: var(--nfy-ink) !important;
    color: #fff !important;
    border-radius: 999px !important;
    padding: 14px 32px !important;
    font-size: 0.85rem !important;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: 600;
    transition: opacity 0.25s ease, transform 0.2s ease;
}
.woocommerce a.button:hover,
.woocommerce button.single_add_to_cart_button:hover {
    opacity: 0.85;
    transform: translateY(-1px);
}

/* Bouton panier desactive (aucune variation choisie) : version fantome */
.woocommerce div.product form.cart .single_add_to_cart_button.disabled,
.woocommerce div.product form.cart .single_add_to_cart_button:disabled {
    background: transparent !important;
    color: var(--nfy-muted) !important;
    border: 1px solid var(--nfy-line) !important;
    opacity: 1 !important;
    cursor: not-allowed;
}

/* Fil d'Ariane : style unifie liens + page courante, avec respiration */
.woocommerce-breadcrumb,
.woocommerce-breadcrumb a {
    font-size: 0.78rem !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    color: var(--nfy-muted) !important;
    text-decoration: none !important;
}
.woocommerce-breadcrumb {
    color: var(--nfy-ink) !important; /* page courante (texte nu) plus foncee */
    margin-top: 40px !important;
    margin-bottom: 24px !important;
}

/* ============================================================
   PLP — grille produits / pages categories
   ============================================================ */

/* Titre categorie : grand, espace, souligne d'un filet court */
.woocommerce-products-header .page-title {
    text-align: center;
    font-size: 2.4rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--nfy-ink);
    margin: 0.6em 0 0.4em;
}
.woocommerce-products-header::after {
    content: "";
    display: block;
    width: 48px;
    height: 2px;
    background: var(--nfy-ink);
    margin: 0 auto 2.5em;
}

/* ---- Ajustements mobile ---- */
@media (max-width: 768px) {
    /* Titre categorie : taille reduite */
    .woocommerce-products-header .page-title {
        font-size: 1.6rem;
    }

    /* Filet sous le titre : moins de vide apres */
    .woocommerce-products-header::after {
        margin-bottom: 1.6em;
    }

    /* Grille plus compacte */
    ul.products {
        gap: 24px 14px;
    }

    /* Titres produits : plus petits, evite les retours a la ligne */
    ul.products li.product .woocommerce-loop-product__title {
        font-size: 0.7rem;
        letter-spacing: 0.06em;
        margin-top: 10px;
    }
    ul.products li.product .price {
        font-size: 0.82rem;
    }

    /* Breadcrumb : marges reduites */
    .woocommerce-breadcrumb {
        margin-top: 24px !important;
        margin-bottom: 16px !important;
    }
}

/* Epurer : compteur de resultats + bouton des cartes produits masques */
.woocommerce-result-count,
ul.products li.product a.button,
ul.products li.product .product_type_variable {
    display: none !important;
}

/* Tri : minimal, sans cadre */
.woocommerce-ordering select {
    border: none;
    border-bottom: 1px solid var(--nfy-line);
    background: transparent;
    padding: 8px 4px;
    font-size: 0.85rem;
    color: var(--nfy-ink);
}

/* Grille aeree */
ul.products {
    gap: 40px 28px;
}

/* Cartes produit : image cadree, hover elegant */
ul.products li.product {
    text-align: center;
}
ul.products li.product img {
    aspect-ratio: 3 / 4;          /* ratio uniforme : aligne mockups et photos lifestyle */
    object-fit: cover;
    width: 100%;
    border-radius: var(--nfy-radius);
    transition: transform 0.35s ease, box-shadow 0.35s ease;
}

/* Description de categorie : contenue et discrete */
.woocommerce-products-header .term-description {
    max-width: 560px;
    margin: 0 auto;
    text-align: center;
    font-size: 0.9rem;
    line-height: 1.7;
    color: var(--nfy-muted);
}
ul.products li.product:hover img {
    transform: translateY(-4px);
    box-shadow: 0 16px 32px rgba(20, 24, 60, 0.12);
}

/* Titre produit : petites capitales espacees */
ul.products li.product .woocommerce-loop-product__title {
    font-size: 0.82rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--nfy-ink);
    margin-top: 16px;
}

/* Prix : discret, sous le titre */
ul.products li.product .price {
    font-size: 0.9rem;
    color: var(--nfy-muted);
    font-weight: 400;
}
ul.products li.product .price ins {
    text-decoration: none;
    color: var(--nfy-ink);
}

/* Badge promo : pastille bleu nuit */
.woocommerce span.onsale {
    background: var(--nfy-ink) !important;
    color: #fff !important;
    border-radius: 999px;
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 6px 14px;
    min-height: 0;
    min-width: 0;
    line-height: 1.4;
}

/* ============================================================
   PDP — fiche produit
   ============================================================ */

/* Galerie : meme rayon que la grille */
.woocommerce div.product .woocommerce-product-gallery img {
    border-radius: var(--nfy-radius);
}

/* Titre produit : declinaison du titre categorie */
.woocommerce div.product .product_title {
    font-size: 1.7rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--nfy-ink);
}

/* Prix PDP : visible mais elegant */
.woocommerce div.product p.price {
    font-size: 1.25rem;
    color: var(--nfy-ink);
    margin: 0.6em 0 1.2em;
}

/* Description courte : interligne genereux */
.woocommerce div.product .woocommerce-product-details__short-description {
    color: #3A3F58;
    line-height: 1.8;
    font-size: 0.95rem;
}

/* Etiquettes de variations (Taille, Couleur) */
.woocommerce div.product form.cart .variations label {
    font-size: 0.78rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--nfy-muted);
    font-weight: 600;
}

/* Tableau des variations : fond transparent, fondu dans la page */
.woocommerce div.product form.cart table.variations,
.woocommerce div.product form.cart table.variations tr,
.woocommerce div.product form.cart table.variations th,
.woocommerce div.product form.cart table.variations td {
    background: transparent !important;
    border: none !important;
}

/* Respiration entre variations et bouton panier */
.woocommerce div.product form.cart .single_variation_wrap,
.woocommerce div.product form.cart .cfvsw-swatches-container {
    margin-bottom: 18px;
}

/* Onglets : style souligne minimal, sans les cadres Woo */
.woocommerce div.product .woocommerce-tabs ul.tabs {
    padding: 0 !important;
    margin-bottom: 0 !important;
    border-bottom: 1px solid var(--nfy-line);
}
.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
    display: none !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    margin: 0 24px 0 0 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    font-size: 0.82rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--nfy-muted) !important;
    padding: 12px 0 !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: var(--nfy-ink) !important;
    box-shadow: inset 0 -2px 0 var(--nfy-ink);
}
.woocommerce-Tabs-panel {
    padding-top: 1.5em;
    line-height: 1.8;
}

/* Produits associes : titre de section assorti */
.woocommerce .related.products > h2,
.woocommerce .upsells.products > h2 {
    text-align: center;
    font-size: 1.1rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--nfy-ink);
    margin: 2em 0 1.5em;
}

/* ============================================================
   SWATCHES — Variation Swatches (CartFlows, prefixe cfvsw)
   ============================================================ */

/* Pastilles taille : pilules assorties aux boutons */
.cfvsw-swatches-container .cfvsw-swatches-option {
    min-width: 44px;
    height: 40px;
    padding: 0 14px;
    border: 1px solid var(--nfy-line) !important;
    border-radius: 999px !important;
    background: #fff;
    color: var(--nfy-ink);
    font-size: 0.8rem;
    letter-spacing: 0.06em;
    font-weight: 600;
    box-shadow: none !important;
    transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}
.cfvsw-swatches-container .cfvsw-swatches-option:hover {
    border-color: var(--nfy-ink) !important;
}

/* Pastille selectionnee : inversee, bleu nuit plein */
.cfvsw-swatches-container .cfvsw-selected-swatch {
    background: var(--nfy-ink) !important;
    border-color: var(--nfy-ink) !important;
    color: #fff !important;
}

/* Rupture de stock : grisee, barree */
.cfvsw-swatches-container .cfvsw-swatches-option[disabled],
.cfvsw-swatches-container .cfvsw-blur-swatch {
    opacity: 0.35;
    text-decoration: line-through;
    cursor: not-allowed;
}

/* Espacement entre pastilles */
.cfvsw-swatches-container {
    gap: 10px;
}

/* Pastilles couleur : cercles nets avec anneau de selection */
.cfvsw-swatches-container .cfvsw-color-option {
    border-radius: 50% !important;
    width: 32px;
    min-width: 32px;
    height: 32px;
    padding: 0;
}
.cfvsw-swatches-container .cfvsw-color-option.cfvsw-selected-swatch {
    outline: 2px solid var(--nfy-ink);
    outline-offset: 3px;
}

/* ============================================================
   CHECKOUT — blocs WooCommerce
   ============================================================ */

/* Fond creme comme PLP/PDP */
body.woocommerce-checkout {
    background-color: var(--nfy-bg) !important;
}

/* Titre de page : meme traitement que les titres categorie */
body.woocommerce-checkout h1 {
    text-align: center;
    font-size: 1.9rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--nfy-ink);
}
body.woocommerce-checkout h1::after {
    content: "";
    display: block;
    width: 48px;
    height: 2px;
    background: var(--nfy-ink);
    margin: 0.5em auto 0;
}

/* Titres de sections (Coordonnees, Livraison, Paiement...) */
.wp-block-woocommerce-checkout h2,
.wc-block-components-checkout-step__heading,
.wc-block-components-checkout-step__heading .wc-block-components-title,
.wc-block-components-sidebar .wc-block-components-title {
    font-size: 0.85rem !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    color: var(--nfy-ink) !important;
    font-weight: 600 !important;
}

/* Champs de saisie : arrondis doux, focus bleu nuit */
.wc-block-components-text-input input,
.wc-block-components-combobox .components-combobox-control__suggestions-container input,
.wc-block-components-textarea {
    border-radius: 10px !important;
    border-color: var(--nfy-line) !important;
}
.wc-block-components-text-input input:focus,
.wc-block-components-textarea:focus {
    border-color: var(--nfy-ink) !important;
    box-shadow: 0 0 0 1px var(--nfy-ink) !important;
}

/* Cartes d'options (livraison, paiement) : arrondies, bordure douce */
.wc-block-components-radio-control-accordion-option,
.wc-block-components-radio-control__option,
.wc-block-components-address-card {
    border-color: var(--nfy-line) !important;
    border-radius: 12px !important;
}
.wc-block-components-radio-control__input:checked {
    border-color: var(--nfy-ink) !important;
    background: var(--nfy-ink) !important;
}

/* Resume de commande : carte blanche detachee du fond creme */
.wc-block-components-sidebar {
    background: #fff !important;
    border: 1px solid var(--nfy-line);
    border-radius: var(--nfy-radius);
    padding: 24px !important;
}

/* Nom du produit dans le resume : petites capitales comme la grille */
.wc-block-components-order-summary-item__description .wc-block-components-product-name {
    font-size: 0.8rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--nfy-ink);
}

/* Total : bien marque */
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
    color: var(--nfy-ink);
    font-weight: 700;
}

/* Bouton Commander : pilule bleu nuit pleine largeur */
.wc-block-components-checkout-place-order-button {
    background: var(--nfy-ink) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 999px !important;
    padding: 16px 32px !important;
    font-size: 0.9rem !important;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: 600;
    transition: opacity 0.25s ease;
}
.wc-block-components-checkout-place-order-button:hover {
    opacity: 0.85;
}

/* Liens CGV / confidentialite */
.wc-block-components-checkout-terms a {
    color: var(--nfy-ink);
}
