/**
 * AIRDancia — Style override WooCommerce My Account
 * Emplacement cible : blocksy-child/assets/css/aird-woocommerce.css
 *
 * Re-skinne les pages /my-account/* (Tableau de bord, Commandes, Adresses,
 * Détails du compte, etc.) au design AIRDancia (glass dorée + Cinzel).
 * 100% CSS, zéro touche PHP/JS — la logique sécu de WC reste intacte.
 *
 * Chargé uniquement sur les pages WC my-account via is_account_page()
 * dans functions.php.
 */

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700&display=swap');

/* ════════════════════════════════════════════════════════════════════════════
   Layout principal — 2 colonnes (nav latérale + contenu)
   ════════════════════════════════════════════════════════════════════════════ */
.woocommerce-account .woocommerce {
    display: flex;
    gap: 28px;
    max-width: 1200px;
    margin: 40px auto;
    color: #fff;
    font-family: 'Manrope', "Plus Jakarta Sans", sans-serif;
}

/* ════════════════════════════════════════════════════════════════════════════
   Navigation latérale gauche (Tableau de bord, Commandes, Compte, etc.)
   ════════════════════════════════════════════════════════════════════════════ */
.woocommerce-MyAccount-navigation {
    width: 260px;
    flex-shrink: 0;
}
.woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 8px !important;
    background: linear-gradient(180deg, rgba(22, 16, 32, .96) 0%, rgba(15, 10, 22, .99) 100%);
    border: 1px solid rgba(229, 169, 61, .30);
    border-radius: 14px;
    box-shadow:
        0 12px 32px -8px rgba(0, 0, 0, .55),
        0 0 24px rgba(229, 169, 61, .08);
    position: relative;
}
.woocommerce-MyAccount-navigation ul::before {
    /* Hairline doré en haut */
    content: "";
    position: absolute;
    top: 0; left: 18%; right: 18%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(245, 199, 110, .85), transparent);
    pointer-events: none;
}
.woocommerce-MyAccount-navigation li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
}
.woocommerce-MyAccount-navigation li::before,
.woocommerce-MyAccount-navigation li::marker {
    content: none !important;
    display: none !important;
}
.woocommerce-MyAccount-navigation a {
    display: block;
    padding: 12px 16px;
    color: rgba(255, 255, 255, .75) !important;
    text-decoration: none !important;
    border-radius: 10px;
    font-family: 'Manrope', sans-serif;
    font-weight: 600;
    font-size: 11.5px;
    letter-spacing: 0.04em;
    transition: background .2s ease, color .2s ease;
    position: relative;
}
.woocommerce-MyAccount-navigation a:hover {
    background: rgba(229, 169, 61, .10);
    color: #f5d98a !important;
}
.woocommerce-MyAccount-navigation .is-active > a,
.woocommerce-MyAccount-navigation li.is-active > a,
.woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--dashboard.is-active > a {
    background: linear-gradient(135deg, rgba(229, 169, 61, .22) 0%, rgba(229, 169, 61, .08) 100%);
    color: #fff !important;
    box-shadow:
        inset 0 0 0 1px rgba(229, 169, 61, .5),
        0 0 14px rgba(229, 169, 61, .12);
}

/* ════════════════════════════════════════════════════════════════════════════
   Contenu principal droit (formulaires, tableaux, etc.)
   ════════════════════════════════════════════════════════════════════════════ */
.woocommerce-MyAccount-content {
    flex: 1;
    min-width: 0;
    background: linear-gradient(180deg, rgba(22, 16, 32, .96) 0%, rgba(15, 10, 22, .99) 100%);
    border: 1px solid rgba(229, 169, 61, .30);
    border-radius: 14px;
    padding: 32px 36px;
    color: #fff;
    box-shadow:
        0 12px 32px -8px rgba(0, 0, 0, .55),
        0 0 24px rgba(229, 169, 61, .08);
    position: relative;
}
.woocommerce-MyAccount-content::before {
    content: "";
    position: absolute;
    top: 0; left: 18%; right: 18%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(245, 199, 110, .85), transparent);
    pointer-events: none;
}

/* Titres dans le contenu (h2 / h3 / legend / address title)
   Style sobre, blanc pur, sans-serif → max lisibilité contexte formel */
.woocommerce-MyAccount-content h1,
.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3,
.woocommerce-MyAccount-content h4,
.woocommerce-EditAccountForm legend,
.woocommerce-Address h3,
.woocommerce-Address-title h3,
.woocommerce-column__title {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    letter-spacing: 0.02em !important;
    text-transform: none !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    background: none !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
    border: 0 !important;
    line-height: 1.3 !important;
}

/* Texte général + liens — contrastes max */
.woocommerce-MyAccount-content,
.woocommerce-MyAccount-content p,
.woocommerce-MyAccount-content li,
.woocommerce-MyAccount-content address,
.woocommerce-MyAccount-content span,
.woocommerce-MyAccount-content div {
    color: #fff;
}
.woocommerce-MyAccount-content p {
    color: rgba(255, 255, 255, .92);
    line-height: 1.6;
    margin-bottom: 14px;
}
.woocommerce-MyAccount-content a {
    color: #f5d98a !important;
    text-decoration: none !important;
    transition: color .2s ease;
}
.woocommerce-MyAccount-content a:hover {
    color: #fff !important;
    text-decoration: underline !important;
}
.woocommerce-MyAccount-content strong,
.woocommerce-MyAccount-content b {
    color: #fff;
    font-weight: 700;
}
.woocommerce-MyAccount-content mark {
    background: rgba(229, 169, 61, .20);
    color: #fff;
    padding: 2px 6px;
    border-radius: 4px;
}

/* ════════════════════════════════════════════════════════════════════════════
   Form rows (champs Prénom, Nom, Email, etc.)
   ════════════════════════════════════════════════════════════════════════════ */
.woocommerce-form-row,
.woocommerce form .form-row {
    margin-bottom: 16px !important;
    padding: 0 !important;
}
.woocommerce-form-row label,
.woocommerce form .form-row label {
    display: block;
    margin-bottom: 6px;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.01em !important;
    text-transform: none !important;
    color: #fff !important;
}
.woocommerce-form-row .required,
.required {
    color: #f5d98a;
    text-decoration: none !important;
    border: 0 !important;
}
.woocommerce-form-row em,
.woocommerce form .form-row em,
.woocommerce-form-row span em {
    color: rgba(255, 255, 255, .50);
    font-size: 11px;
    font-style: italic;
    display: block;
    margin-top: 4px;
}

/* Inputs & textarea — dark glass identique aux popups dashboard */
.woocommerce-Input,
.woocommerce form .input-text,
.woocommerce-MyAccount-content input[type="text"],
.woocommerce-MyAccount-content input[type="email"],
.woocommerce-MyAccount-content input[type="password"],
.woocommerce-MyAccount-content input[type="tel"],
.woocommerce-MyAccount-content input[type="url"],
.woocommerce-MyAccount-content input[type="number"],
.woocommerce-MyAccount-content textarea,
.woocommerce-MyAccount-content select {
    width: 100% !important;
    background: rgba(255, 255, 255, .04) !important;
    border: 1px solid rgba(229, 169, 61, .25) !important;
    color: #fff !important;
    border-radius: 10px !important;
    padding: 12px 14px !important;
    font-family: 'Inter', 'Manrope', sans-serif !important;
    font-size: 12px !important;
    -webkit-text-fill-color: #fff;
    caret-color: #f5d98a;
    transition: border-color .2s ease, background .2s ease;
    box-shadow: none !important;
}
.woocommerce-Input:focus,
.woocommerce form .input-text:focus,
.woocommerce-MyAccount-content input:focus,
.woocommerce-MyAccount-content textarea:focus,
.woocommerce-MyAccount-content select:focus {
    outline: none !important;
    border-color: rgba(229, 169, 61, .70) !important;
    background: rgba(255, 255, 255, .07) !important;
    color: #fff !important;
}
.woocommerce-MyAccount-content input::placeholder,
.woocommerce-MyAccount-content textarea::placeholder {
    color: rgba(255, 255, 255, .35) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, .35);
}
/* Override autofill jaune Chrome */
.woocommerce-MyAccount-content input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px rgba(20, 14, 28, .98) inset !important;
    -webkit-text-fill-color: #fff !important;
    transition: background-color 5000s ease-in-out 0s;
}

/* ════════════════════════════════════════════════════════════════════════════
   Fieldset (groupe Password change) — encadré doré subtil
   ════════════════════════════════════════════════════════════════════════════ */
.woocommerce-EditAccountForm fieldset,
.woocommerce-MyAccount-content fieldset {
    border: 1px solid rgba(229, 169, 61, .15) !important;
    border-radius: 12px !important;
    padding: 18px 20px 14px !important;
    margin: 24px 0 !important;
    background: rgba(255, 255, 255, .015);
}
.woocommerce-EditAccountForm fieldset legend,
.woocommerce-MyAccount-content fieldset legend {
    /* Section title sobre — blanc, sans-serif, lisibilité prioritaire */
    padding: 0 10px !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    letter-spacing: 0.02em !important;
    text-transform: none !important;
    background: none !important;
    margin: 0 !important;
}

/* ════════════════════════════════════════════════════════════════════════════
   Boutons (submit "Enregistrer", "Voir", "Télécharger", etc.)
   ════════════════════════════════════════════════════════════════════════════ */
.woocommerce-Button,
.woocommerce-MyAccount-content button[type="submit"],
.woocommerce form .button,
.woocommerce-MyAccount-content .button,
.woocommerce-MyAccount-content a.button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: linear-gradient(135deg, #f5d98a 0%, #e5a93d 50%, #b8821f 100%) !important;
    color: #110a1b !important;
    border: 1px solid rgba(229, 169, 61, .80) !important;
    border-radius: 12px !important;
    padding: 13px 28px !important;
    font-family: 'Manrope', sans-serif !important;
    font-weight: 800 !important;
    font-size: 11px !important;
    letter-spacing: 0.06em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    cursor: pointer;
    box-shadow: 0 8px 18px -6px rgba(229, 169, 61, .50) !important;
    transition: transform .2s ease, box-shadow .2s ease !important;
}
.woocommerce-Button:hover,
.woocommerce-MyAccount-content button[type="submit"]:hover,
.woocommerce form .button:hover,
.woocommerce-MyAccount-content .button:hover,
.woocommerce-MyAccount-content a.button:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 24px -6px rgba(245, 199, 110, .65) !important;
    color: #110a1b !important;
}

/* ════════════════════════════════════════════════════════════════════════════
   Notices (messages succès / erreur / info)
   ════════════════════════════════════════════════════════════════════════════ */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info,
.woocommerce-notices-wrapper > ul {
    background: linear-gradient(180deg, rgba(15, 10, 22, .98), rgba(20, 14, 28, .96)) !important;
    border: 1px solid rgba(229, 169, 61, .35) !important;
    border-left: 4px solid #f5d98a !important;
    color: rgba(255, 255, 255, .85) !important;
    border-radius: 10px !important;
    padding: 14px 18px 14px 22px !important;
    margin-bottom: 24px !important;
    font-family: 'Manrope', sans-serif;
    font-size: 11.5px;
    list-style: none !important;
}
.woocommerce-message::before,
.woocommerce-info::before {
    color: #f5d98a !important;
}
.woocommerce-error {
    border-left-color: #ff5b5b !important;
}
.woocommerce-error::before {
    color: #ff5b5b !important;
}
.woocommerce-message a,
.woocommerce-error a,
.woocommerce-info a {
    color: #f5d98a !important;
}

/* ════════════════════════════════════════════════════════════════════════════
   Tableaux (Commandes, Téléchargements, Adresses)
   ════════════════════════════════════════════════════════════════════════════ */
.woocommerce-orders-table,
.woocommerce-table,
.shop_table {
    width: 100% !important;
    border-collapse: collapse !important;
    color: #fff !important;
    background: transparent !important;
}
.woocommerce-orders-table th,
.woocommerce-table th,
.shop_table th {
    background: rgba(255, 255, 255, .06) !important;
    color: #fff !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 700 !important;
    font-size: 11px !important;
    letter-spacing: 0.01em !important;
    text-transform: none !important;
    padding: 12px 14px !important;
    text-align: left !important;
    border: none !important;
    border-bottom: 1px solid rgba(229, 169, 61, .25) !important;
}
.woocommerce-orders-table td,
.woocommerce-table td,
.shop_table td {
    padding: 14px !important;
    border: none !important;
    border-bottom: 1px solid rgba(229, 169, 61, .10) !important;
    font-size: 12px !important;
    color: rgba(255, 255, 255, .85) !important;
    background: transparent !important;
}
.woocommerce-orders-table tr:hover td,
.shop_table tr:hover td {
    background: rgba(229, 169, 61, .04) !important;
}

/* Status badges (Commandes) */
.woocommerce-orders-table .status,
.woocommerce-orders-table__cell-order-status mark {
    display: inline-block;
    padding: 4px 10px;
    background: rgba(57, 255, 138, .15);
    color: #39ff8a;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

/* ════════════════════════════════════════════════════════════════════════════
   Adresses (cards facturation / livraison)
   ════════════════════════════════════════════════════════════════════════════ */
.woocommerce-Addresses {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 20px !important;
}
.woocommerce-Address {
    background: rgba(255, 255, 255, .03);
    border: 1px solid rgba(229, 169, 61, .15);
    border-radius: 12px;
    padding: 20px;
}
.woocommerce-Address address {
    color: rgba(255, 255, 255, .80);
    font-style: normal;
    line-height: 1.7;
}

/* ════════════════════════════════════════════════════════════════════════════
   Responsive
   ════════════════════════════════════════════════════════════════════════════ */
@media (max-width: 991px) {
    .woocommerce-account .woocommerce {
        flex-direction: column;
        gap: 20px;
        padding: 0 16px;
        margin: 24px auto;
    }
    .woocommerce-MyAccount-navigation {
        width: 100%;
    }
    .woocommerce-MyAccount-content {
        padding: 24px 22px;
    }
    .woocommerce-Addresses {
        grid-template-columns: 1fr !important;
    }
}
@media (max-width: 480px) {
    .woocommerce-MyAccount-content {
        padding: 20px 16px;
    }
    .woocommerce-MyAccount-content h2,
    .woocommerce-MyAccount-content h3 {
        font-size: 12px !important;
        letter-spacing: 0.14em !important;
    }
}

/* ─── Fix contraste 2026-06-01 — page Lost Password ───────────
   Le <p> 'Mot de passe perdu ?' héritait color blanche sur fond
   clair = illisible. Cible ciblée sur le form de reset uniquement,
   zéro impact sur les autres pages MyAccount.
   Cf. CLAUDE.md §18 + (futur §41/account-lifecycle). */
form.woocommerce-ResetPassword > p,
form.lost_reset_password > p,
form.woocommerce-ResetPassword label,
form.lost_reset_password label {
    color: #1a1a2e !important;
}
