/*
 * Boutique GoProf : charte graphique appliquée au thème Orchid Store et aux blocs WooCommerce.
 * Source : goprof.be/charte_graphique/shop.goprof.be/ (Corail Passion, Encre, Sora / Manrope).
 */

@font-face {
    font-family: "Sora";
    src: url("../fonts/sora-latin-wght-normal.woff2") format("woff2-variations"),
         url("../fonts/sora-latin-wght-normal.woff2") format("woff2");
    font-weight: 100 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Manrope";
    src: url("../fonts/manrope-latin-wght-normal.woff2") format("woff2-variations"),
         url("../fonts/manrope-latin-wght-normal.woff2") format("woff2");
    font-weight: 200 800;
    font-style: normal;
    font-display: swap;
}

:root {
    --gp-corail: #F43F5E;
    --gp-corail-fonce: #E11D48;
    --gp-corail-doux: #FFE4E6;
    --gp-encre: #1E1B2E;
    --gp-gris: #5E5A6B;
    --gp-fond: #F8FAFC;
    --gp-surface: #FFFFFF;
    --gp-bordure: #E6E1EA;
    --gp-succes: #1F8A5B;
    --gp-succes-fond: #E3F4EC;
    --gp-erreur: #C62E3A;
    --gp-erreur-fond: #FBE6E8;
    --gp-alerte: #B26A00;
    --gp-alerte-fond: #FDF1DC;
    --gp-info: #2563A8;
    --gp-info-fond: #E3EDF8;
    --gp-rayon: 10px;
    --gp-titres: "Sora", system-ui, sans-serif;
    --gp-texte: "Manrope", system-ui, sans-serif;
}

/* ---- Typographie et fond ---- */

body,
button,
input,
select,
textarea,
.wc-block-components-text-input input,
.wc-block-components-form {
    font-family: var(--gp-texte);
}

body {
    color: var(--gp-encre);
    background-color: var(--gp-fond);
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.page-title,
.woocommerce-loop-product__title,
.product_title,
.wc-block-components-title,
.wc-block-cart__totals-title,
.widget-title {
    font-family: var(--gp-titres);
    color: var(--gp-encre);
}

.price,
.woocommerce-Price-amount,
.wc-block-components-product-price,
.wc-block-formatted-money-amount {
    color: var(--gp-encre);
    font-weight: 600;
}

.woocommerce-price-suffix {
    color: var(--gp-gris);
    font-size: 0.8em;
    font-weight: 500;
}

/* Liens dans le texte : soulignés (charte) */
.editor-entry a,
.entry-content a:not(.button):not(.wp-block-button__link),
.woocommerce-privacy-policy-text a,
.wc-block-checkout__terms a {
    color: var(--gp-corail-fonce);
    text-decoration: underline;
}

/* ---- Logo de l'en-tête ---- */

.gp-logo {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    color: var(--gp-encre);
}

.gp-logo:hover,
.gp-logo:focus {
    text-decoration: none;
    color: var(--gp-encre);
}

.gp-logo__picto {
    width: 48px;
    height: 48px;
    flex: none;
}

.gp-logo__texte {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.gp-logo__nom {
    font-family: var(--gp-titres);
    font-weight: 700;
    font-size: 1.35rem;
    letter-spacing: -0.01em;
}

.gp-logo__slogan {
    font-family: var(--gp-texte);
    font-size: 0.85rem;
    color: var(--gp-gris);
}

@media (max-width: 767px) {
    .gp-logo__picto {
        width: 36px;
        height: 36px;
    }
    .gp-logo__nom {
        font-size: 1.1rem;
    }
    .gp-logo__slogan {
        display: none;
    }
}

/* ---- Boutons : Corail Passion, coins 10 px, 44 px minimum ---- */

.button,
button.button,
a.button,
input[type="submit"],
.wp-element-button,
.wp-block-button__link,
.wc-block-components-button:not(.is-link),
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
    background-color: var(--gp-corail);
    color: #FFFFFF;
    border: none;
    border-radius: var(--gp-rayon);
    min-height: 44px;
    font-family: var(--gp-texte);
    font-weight: 600;
    transition: background-color 0.2s ease;
}

.button:hover,
button.button:hover,
a.button:hover,
input[type="submit"]:hover,
.wp-element-button:hover,
.wp-block-button__link:hover,
.wc-block-components-button:not(.is-link):hover,
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover {
    background-color: var(--gp-corail-fonce);
    color: #FFFFFF;
}

/* Remplace l'ancien CSS additionnel (vert / orange) du bouton « Commander » du panier */
div.wp-block-woocommerce-proceed-to-checkout-block,
div.wp-block-woocommerce-proceed-to-checkout-block:hover {
    background-color: transparent;
}

/* Focus clavier : contour décalé Corail Passion */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.button:focus-visible,
.wc-block-components-button:focus-visible {
    outline: 2px solid var(--gp-corail);
    outline-offset: 3px;
}

/* Champs */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="search"],
select,
textarea {
    border-color: var(--gp-bordure);
    border-radius: var(--gp-rayon);
}

/* ---- Messages (identiques à GoProf) ---- */

.woocommerce-message,
.wc-block-components-notice-banner.is-success {
    background-color: var(--gp-succes-fond);
    border-color: var(--gp-succes);
    color: var(--gp-encre);
}

.woocommerce-error,
.wc-block-components-notice-banner.is-error {
    background-color: var(--gp-erreur-fond);
    border-color: var(--gp-erreur);
    color: var(--gp-encre);
}

.wc-block-components-notice-banner.is-warning {
    background-color: var(--gp-alerte-fond);
    border-color: var(--gp-alerte);
    color: var(--gp-encre);
}

.woocommerce-info,
.wc-block-components-notice-banner.is-info {
    background-color: var(--gp-info-fond);
    border-color: var(--gp-info);
    color: var(--gp-encre);
}

/* ---- Connexion GoProf ---- */

.gp-sso {
    margin: 0 0 24px;
    padding: 16px 20px;
    background-color: var(--gp-corail-doux);
    border-radius: var(--gp-rayon);
}

.gp-sso__intro {
    margin: 0 0 12px;
}

.gp-sso__bouton {
    display: inline-flex;
    align-items: center;
    padding: 12px 24px;
    text-decoration: none;
}

.gp-sso__aide {
    display: block;
    margin-top: 8px;
    font-size: 0.875rem;
    color: var(--gp-gris);
}

/* ---- Barre supérieure et pied de page ---- */

.top-header {
    background-color: var(--gp-encre);
}

.footer {
    background-color: var(--gp-encre);
}
