/* Variables communes */
    :root {
        --main-gradient: linear-gradient(135deg, #FF6B6B, #FFB700);
        --main-color-start: #FF6B6B;
        --main-color-end: #FFB700;
    }

    /* Variables pour le thème sombre - NE PAS MODIFIER */
    .theme-dark, body:not(.theme-light) {
        --main-text: #ffffff;
        --secondary-text: #cccccc;
        --dark-bg: #222222;
        --darker-bg: #1a1a1a;
        --form-bg: #333333;
        --input-bg: #444444;
        --input-border: #555555;
        --button-text: #ffffff;
        --surface-gradient: linear-gradient(145deg, #2a2a2a, #383838);
        --card-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    }

    /* Variables pour le thème clair */
    .theme-light {
        --main-text: #333333;
        --secondary-text: #666666;
        --dark-bg: #e6e9ef;
        --darker-bg: #f8f9fa;
        --form-bg: #ffffff;
        --input-bg: #f7f7f7;
        --input-border: #dddddd;
        --button-text: #ffffff;
        --surface-gradient-light: linear-gradient(145deg, #ffffff, #f5f7fa);
        --card-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    }

    /* Styles de base */
    .woocommerce-ResetPassword {
        max-width: 480px;
        margin: 0 auto;
        padding: 30px;
        background-color: var(--form-bg);
        border-radius: 10px;
        box-shadow: var(--card-shadow);
        color: var(--main-text);
    }

    /* Thème sombre spécifique */
    body:not(.theme-light) .woocommerce-ResetPassword,
    .theme-dark .woocommerce-ResetPassword {
        background-color: var(--form-bg);
        color: var(--main-text);
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    }

    /* Thème clair spécifique */
    .theme-light .woocommerce-ResetPassword {
        background: var(--surface-gradient-light);
        border: 1px solid rgba(0, 0, 0, 0.1);
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    }

    .reset-password-title {
        text-align: center;
        font-size: 1.5rem;
        margin-bottom: 20px;
        background: var(--main-gradient);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-weight: bold;
    }

    .reset-password-message {
        text-align: center;
        font-size: 1rem;
        margin-bottom: 30px;
        color: var(--secondary-text);
    }

    .woocommerce-form-row {
        margin-bottom: 25px;
    }

    .woocommerce-form-row label {
        font-weight: bold;
        color: var(--main-text);
    }

    .password-field {
        position: relative;
    }

    .password-field input {
        width: 100%;
        padding: 12px;
        font-size: 16px;
        border-radius: 5px;
        border: 1px solid var(--input-border);
        background-color: var(--input-bg);
        color: var(--main-text);
        box-sizing: border-box;
    }

    /* Ajustements pour le thème clair */
    .theme-light .password-field input {
        border: 1px solid rgba(0, 0, 0, 0.1);
    }

    .password-field input::placeholder {
        color: #888888;
    }

    .theme-light .password-field input::placeholder {
        color: #aaaaaa;
    }

    .password-field input:focus {
        outline: none;
        border-color: var(--main-color-start);
        box-shadow: 0 0 0 2px rgba(255, 107, 107, 0.25);
    }

    .show-password-toggle {
        position: absolute;
        right: -15px;
        top: 50%;
        transform: translateY(-50%);
        background-color: transparent;
        border: none; /* Cette propriété est déjà présente mais je la confirme */
        cursor: pointer;
        outline: none; /* Ajout pour supprimer également le contour lors du focus */
    }

    /* Ajout d'une règle spécifique pour s'assurer que la bordure ne soit jamais affichée */
    .show-password-toggle:focus {
        border: none !important;
        outline: none !important;
        box-shadow: none !important;
    }

    .show-password-toggle i {
        font-size: 18px;
        color: var(--main-color-start);
    }

    .show-password-toggle:hover i {
        color: var(--main-color-end);
    }

    .form-actions {
        text-align: center;
    }

    .woocommerce-Button.button {
        background: var(--main-gradient);
        color: var(--button-text);
        font-size: 16px;
        padding: 12px 24px;
        border-radius: 5px;
        border: none;
        cursor: pointer;
        width: 100%;
        font-weight: bold;
        transition: all 0.3s ease;
    }

    .woocommerce-Button.button:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(255, 107, 107, 0.4);
    }

    .woocommerce-Button.button:active {
        transform: translateY(0);
    }

    .reset-password-footer {
        text-align: center;
        margin-top: 20px;
    }

    .description {
        font-size: 0.875rem;
        color: var(--secondary-text);
    }

    /* Style personnalisé pour le message de la force du mot de passe */
    #password_strength {
        margin-top: 15px;
        padding: 10px;
        font-size: 14px;
        border-radius: 5px;
        text-align: center;
        border: none; /* Suppression de toute bordure indésirable */
        box-shadow: none; /* Suppression de l'ombre */
    }

    /* Thème sombre - indicateurs de force de mot de passe */
    body:not(.theme-light) .woocommerce-password-strength.bad,
    .theme-dark .woocommerce-password-strength.bad {
        background-color: rgba(216, 0, 12, 0.2);
        color: #ff6b6b;
        border: 1px solid #d8000c;
    }

    body:not(.theme-light) .woocommerce-password-strength.short,
    body:not(.theme-light) .woocommerce-password-strength.medium,
    .theme-dark .woocommerce-password-strength.short,
    .theme-dark .woocommerce-password-strength.medium {
        background-color: rgba(133, 100, 4, 0.2);
        color: #FFB700;
        border: 1px solid #856404;
    }

    body:not(.theme-light) .woocommerce-password-strength.good,
    body:not(.theme-light) .woocommerce-password-strength.strong,
    .theme-dark .woocommerce-password-strength.good,
    .theme-dark .woocommerce-password-strength.strong {
        background-color: rgba(21, 87, 36, 0.2);
        color: #4caf50;
        border: 1px solid #155724;
    }

    /* Thème clair - indicateurs de force de mot de passe */
    .theme-light .woocommerce-password-strength.bad {
        background-color: #ffeeee;
        color: #d8000c;
        border: 1px solid #ffcccc;
    }

    .theme-light .woocommerce-password-strength.short,
    .theme-light .woocommerce-password-strength.medium {
        background-color: #fff8e6;
        color: #856404;
        border: 1px solid #fff3cd;
    }

    .theme-light .woocommerce-password-strength.good,
    .theme-light .woocommerce-password-strength.strong {
        background-color: #e8f5e9;
        color: #155724;
        border: 1px solid #d4edda;
    }

    /* Support spécifique pour thème sombre */
    .woocommerce form .show-password-input, 
    .woocommerce-page form .show-password-input {
        display: none;
    }

    button:hover {
        background-color: transparent;
    }

    /* Suppression des variables couleurs par défaut */
    :root[data-theme="dark"] {
        --ast-global-color-0: transparent;
        --ast-global-color-1: transparent;
    }

    body:not(.theme-light) .woocommerce-password-strength,
    .theme-dark .woocommerce-password-strength {
        box-shadow: 0 4px 6px rgba(255, 255, 255, 0.05) !important;
    }

    /* Ajout d'effet sur focus pour meilleure accessibilité */
    input:focus, button:focus {
        outline: 2px solid var(--main-color-start);
        outline-offset: 2px;
    }

    /* Support pour écrans plus petits */
    @media (max-width: 480px) {
        .woocommerce-ResetPassword {
            padding: 20px;
            width: 90%;
        }
    }

    /* Animation du bouton */
    @keyframes pulse {
        0% { box-shadow: 0 0 0 0 rgba(255, 107, 107, 0.4); }
        70% { box-shadow: 0 0 0 10px rgba(255, 107, 107, 0); }
        100% { box-shadow: 0 0 0 0 rgba(255, 107, 107, 0); }
    }

    .woocommerce-Button.button:hover {
        animation: pulse 1.5s infinite;
    }

    body:not(.theme-light) .woocommerce-password-strength {
        box-shadow: 0 4px 6px rgb(255 255 255 / 0%) !important;
    }

    .woocommerce-password-strength {
        box-shadow: 0 4px 6px rgb(255 255 255 / 0%) !important;
    }

    /* Styles personnalisés pour le formulaire de réinitialisation WooCommerce */
.woocommerce-ResetPassword.lost_reset_password {
    background: linear-gradient(135deg, #232526 0%, #414345 100%) !important;
    border-radius: 18px !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.18) !important;
    padding: 2.5rem 2rem 2rem 2rem !important;
    margin: 2rem auto !important;
    color: #fff !important;
    max-width: 420px !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
}
.woocommerce-ResetPassword.lost_reset_password label {
    color: #FFD700 !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
}
.woocommerce-ResetPassword.lost_reset_password input[type="password"],
.woocommerce-ResetPassword.lost_reset_password input[type="text"] {
    width: 100% !important;
    padding: 0.85rem 1rem !important;
    border-radius: 8px !important;
    border: 1px solid #FFD700 !important;
    background: #232526 !important;
    color: #fff !important;
    margin-bottom: 0.5rem !important;
    font-size: 1rem !important;
    transition: border-color 0.2s !important;
}
.woocommerce-ResetPassword.lost_reset_password input[type="password"]:focus,
.woocommerce-ResetPassword.lost_reset_password input[type="text"]:focus {
    border-color: #FFB700 !important;
    outline: none !important;
}
.woocommerce-ResetPassword.lost_reset_password .woocommerce-Button.button {
    background: linear-gradient(135deg, #FF6B6B, #FFB700) !important;
    color: #fff !important;
    border-radius: 8px !important;
    font-weight: bold !important;
    padding: 0.85rem 2rem !important;
    border: none !important;
    font-size: 1rem !important;
    margin-top: 0.5rem !important;
    transition: background 0.2s, transform 0.2s !important;
    box-shadow: 0 2px 8px rgba(255,183,0,0.08) !important;
    width: 100% !important;
}
.woocommerce-ResetPassword.lost_reset_password .woocommerce-Button.button:hover {
    background: linear-gradient(135deg, #FFD700, #FF6B6B) !important;
    transform: translateY(-2px) !important;
}
.woocommerce-ResetPassword.lost_reset_password .description {
    color: #FFD700 !important;
    font-size: 0.95rem !important;
    margin-top: 1rem !important;
    text-align: center !important;
}
@media (max-width: 600px) {
    .woocommerce-ResetPassword.lost_reset_password {
        padding: 1.2rem 0.5rem !important;
        max-width: 98vw !important;
    }
}

/* Toujours empiler les champs du formulaire WooCommerce reset password */
.woocommerce-ResetPassword.lost_reset_password,
.woocommerce-ResetPassword {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    max-width: 420px !important;
}

.woocommerce-ResetPassword.lost_reset_password .woocommerce-form-row,
.woocommerce-ResetPassword .woocommerce-form-row {
    width: 100% !important;
    display: block !important;
    margin-right: 0 !important;
}

/* Désactive toute grille ou flex horizontal éventuel */
.woocommerce-ResetPassword.lost_reset_password .form-row,
.woocommerce-ResetPassword .form-row {
    width: 100% !important;
    display: block !important;
    margin-right: 0 !important;
}