/*
Theme Name: Khronos Theme
Theme URI: https://khronos-editions.fr/
Description: Khronos Hello Elementor Child Theme
Author: Néotopia
Author URL: https://neotopia.bzh/
Template: hello-elementor
Version: 1.0.0
License: GNU General Public License v2 or later
License URL: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hello-elementorchild
*/
/* Placer votre CSS ci-dessous */

/* Se connecter - S'inscrire (colonne gauche - droite) */

.um-center { 
    text-align: center; 
    text-transform: uppercase !important;
}

/* Mon compte — CTA activation Historicarte */
.khronos-myaccount-cta {
    margin-bottom: 2rem;
    padding: 1.25rem 1rem;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    background: #fafafa;
}
.khronos-myaccount-cta__lead {
    margin: 0 0 1rem;
    text-align: center;
    font-size: 1rem;
    line-height: 1.5;
}
.khronos-myaccount-cta__buttons {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    align-items: stretch;
}
.khronos-myaccount-cta__primary,
.khronos-myaccount-cta__secondary {
    text-align: center;
    min-height: 48px;
    line-height: 1.3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.65rem 1rem;
    box-sizing: border-box;
}
.khronos-myaccount-cta__hint {
    margin: 1rem 0 0;
    font-size: 0.9rem;
    color: #555;
    text-align: center;
}
@media (min-width: 600px) {
    .khronos-myaccount-cta__buttons {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }
    .khronos-myaccount-cta__primary,
    .khronos-myaccount-cta__secondary {
        min-width: 220px;
    }
}

/* Page Mon compte (Elementor + WooCommerce) : titre centré, marge sous le H1, moins d’espace avec le bloc suivant (petit écran) */
@media (max-width: 767px) {
    body.woocommerce-account .elementor .elementor-top-section.elementor-section-height-min-height {
        min-height: 0 !important;
    }
    body.woocommerce-account .elementor .elementor-top-section:first-child {
        padding-bottom: 0 !important;
    }
    body.woocommerce-account .elementor .elementor-top-section:first-child + .elementor-top-section {
        padding-top: 0 !important;
        margin-top: 0 !important;
    }
    body.woocommerce-account
        .elementor
        .elementor-top-section:first-child
        .elementor-widget-heading
        .elementor-widget-container {
        margin-bottom: 0 !important;
        text-align: center !important;
    }
    body.woocommerce-account
        .elementor
        .elementor-top-section:first-child
        .elementor-heading-title {
        margin-bottom: 2rem !important;
        text-align: center !important;
    }
}

/* Bouton flottant accueil → activation Historicarte (fixed / au-dessus du contenu Elementor) */
body .khronos-home-activation-strip {
    position: fixed;
    top: 4rem;
    right: 4rem;
    left: auto;
    width: auto;
    max-width: min(100vw - 2rem, 28rem);
    z-index: 99999;
    margin: 0;
    padding: 0;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    text-align: right;
    pointer-events: none;
}
body .khronos-home-activation-strip .khronos-home-activation-btn {
    pointer-events: auto;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.65rem 1.1rem;
    font-size: 0.9rem;
    font-weight: 600;
    line-height: 1.3;
    color: #fff !important;
    text-decoration: none !important;
    background: #1a1a1a !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 6px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    transition: background 0.2s ease, transform 0.15s ease;
}
body .khronos-home-activation-strip .khronos-home-activation-btn__icon {
    flex-shrink: 0;
}
body .khronos-home-activation-strip .khronos-home-activation-btn:hover,
body .khronos-home-activation-strip .khronos-home-activation-btn:focus {
    background: #2a2a2a !important;
    color: #fff !important;
    outline: 2px solid rgba(255, 255, 255, 0.4);
    outline-offset: 2px;
}
body .khronos-home-activation-strip .khronos-home-activation-btn:active {
    transform: translateY(1px);
}

/* Smartphone : centré sous le logo (+2.5rem + 1.5rem de descente), largeur = icône + texte (ajuster --khronos-ha-strip-mobile-top si besoin) */
@media (max-width: 600px) {
    body .khronos-home-activation-strip {
        top: calc(
            env(safe-area-inset-top, 0px) + var(--khronos-ha-strip-mobile-top, 5rem) + 4rem
        );
        left: 50%;
        right: auto;
        transform: translateX(-50%);
        width: max-content;
        max-width: calc(100vw - 1.5rem);
        text-align: center;
    }
    body .khronos-home-activation-strip .khronos-home-activation-btn {
        width: auto;
        max-width: 100%;
        box-sizing: border-box;
        justify-content: center;
    }
}

/* Mon compte : contenu repositionné sous l’onglet actif en ≤767px (script khronos-myaccount-tabs-mobile.js) */
@media (max-width: 767px) {
    body.woocommerce-account .woocommerce-MyAccount-navigation li .woocommerce-MyAccount-content {
        float: none !important;
        width: 100% !important;
        max-width: 100%;
        clear: both;
        box-sizing: border-box;
        padding-left: 0 !important;
        padding-top: 0.75rem;
    }

    /*
     * Le contenu est dans le même <li> que le lien d’onglet : les règles Elementor
     * « .woocommerce-MyAccount-navigation ul li a » s’appliquaient aux liens/boutons du contenu.
     * Sélecteurs plus spécifiques pour rétablir l’apparence contenu (liens, boutons WC, tableaux).
     */
    body.woocommerce-account
        .woocommerce-MyAccount-navigation
        ul
        li
        .woocommerce-MyAccount-content
        a:not(.button) {
        background: transparent !important;
        background-color: transparent !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        color: var(--links-normal-color, #5bc0de) !important;
        display: inline !important;
        font-size: 14px !important;
        font-style: normal !important;
        font-weight: 400 !important;
        line-height: inherit !important;
        padding: 0 !important;
        text-align: inherit !important;
        text-decoration: none !important;
    }

    body.woocommerce-account
        .woocommerce-MyAccount-navigation
        ul
        li
        .woocommerce-MyAccount-content
        a:not(.button):hover {
        background: transparent !important;
        background-color: transparent !important;
        color: var(--links-hover-color, #5bc0de) !important;
    }

    body.woocommerce-account
        .woocommerce-MyAccount-navigation
        ul
        li
        .woocommerce-MyAccount-content
        .button,
    body.woocommerce-account
        .woocommerce-MyAccount-navigation
        ul
        li
        .woocommerce-MyAccount-content
        button.button,
    body.woocommerce-account
        .woocommerce-MyAccount-navigation
        ul
        li
        .woocommerce-MyAccount-content
        input.button,
    body.woocommerce-account
        .woocommerce-MyAccount-navigation
        ul
        li
        .woocommerce-MyAccount-content
        button[type="submit"]:not(.show-password-input) {
        background: var(--forms-buttons-normal-background-color, #5bc0de) !important;
        background-color: var(--forms-buttons-normal-background-color, #5bc0de) !important;
        border: none !important;
        border-radius: var(--forms-buttons-border-radius, 3px) !important;
        color: var(--forms-buttons-normal-text-color, #fff) !important;
        display: inline-block !important;
        font-size: 14px !important;
        font-weight: 400 !important;
        line-height: normal !important;
        padding: var(--forms-buttons-padding, 12px 32px) !important;
        text-align: center !important;
        text-decoration: none !important;
        width: auto !important;
    }

    body.woocommerce-account
        .woocommerce-MyAccount-navigation
        ul
        li
        .woocommerce-MyAccount-content
        .button:hover,
    body.woocommerce-account
        .woocommerce-MyAccount-navigation
        ul
        li
        .woocommerce-MyAccount-content
        button.button:hover,
    body.woocommerce-account
        .woocommerce-MyAccount-navigation
        ul
        li
        .woocommerce-MyAccount-content
        input.button:hover,
    body.woocommerce-account
        .woocommerce-MyAccount-navigation
        ul
        li
        .woocommerce-MyAccount-content
        button[type="submit"]:not(.show-password-input):hover {
        background: var(--forms-buttons-hover-background-color, #5bc0de) !important;
        background-color: var(--forms-buttons-hover-background-color, #5bc0de) !important;
        color: var(--forms-buttons-hover-text-color, #fff) !important;
    }

    body.woocommerce-account
        .woocommerce-MyAccount-navigation
        ul
        li
        .woocommerce-MyAccount-content
        .button.alt,
    body.woocommerce-account
        .woocommerce-MyAccount-navigation
        ul
        li
        .woocommerce-MyAccount-content
        a.button.alt {
        background: transparent !important;
        background-color: transparent !important;
        border-color: var(--tables-buttons-border-color, #5bc0de) !important;
        border-radius: var(--tables-button-border-radius, 3px) !important;
        border-style: solid !important;
        border-width: 2px !important;
        color: var(--tables-button-normal-text-color, #69727d) !important;
        padding: var(--tables-button-padding, 12px 32px) !important;
    }

    body.woocommerce-account
        .woocommerce-MyAccount-navigation
        ul
        li
        .woocommerce-MyAccount-content
        .shop_table
        .button {
        background: transparent !important;
        background-color: transparent !important;
        border-color: var(--tables-buttons-border-color, #5bc0de) !important;
        border-radius: var(--tables-button-border-radius, 3px) !important;
        border-style: solid !important;
        border-width: 2px !important;
        color: var(--tables-button-normal-text-color, #69727d) !important;
        padding: var(--tables-button-padding, 5px 10px) !important;
    }

    body.woocommerce-account
        .woocommerce-MyAccount-navigation
        ul
        li
        .woocommerce-MyAccount-content
        button.show-password-input {
        background: transparent !important;
        background-color: transparent !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        color: inherit !important;
        display: inline-flex !important;
        font-size: inherit !important;
        font-weight: 400 !important;
        min-height: 0 !important;
        padding: 0.5em !important;
        width: auto !important;
    }
}

/* Page activation Historicarte : pas de titre (widget Heading en tête de page, si présent) */
body.khronos-historicarte-activation-page
    .elementor
    .elementor-top-section:first-child
    .elementor-column
    .elementor-widget-wrap
    > .elementor-widget-heading:first-child {
    display: none !important;
}