/* ================================================
   BiblioBooks — Style onglets Mon Compte
   Fichier : bibliobooks-account.css
   Emplacement : wp-content/themes/TON-THEME-ENFANT/
   ================================================ */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700;9..40,800&display=swap');

/* ── Police globale sur toutes les pages Mon Compte ── */
body.woocommerce-account,
body.woocommerce-account * {
    font-family: 'DM Sans', sans-serif !important;
}

/* ════════════════════════════════════════════════════
   ONGLETS HORIZONTAUX
════════════════════════════════════════════════════ */

body.woocommerce-account .woocommerce-MyAccount-navigation {
    width: 100% !important;
    float: none !important;
    margin: 0 0 28px 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    display: block !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 6px !important;
    background: #f4f3ff !important;
    border-radius: 16px !important;
    border: none !important;
    box-shadow: none !important;
    width: auto !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li {
    display: block !important;
    float: none !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    border-bottom: none !important;
    background: transparent !important;
    flex-shrink: 0 !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li::before,
body.woocommerce-account .woocommerce-MyAccount-navigation ul li::after {
    display: none !important;
    content: none !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    display: block !important;
    padding: 9px 18px !important;
    border-radius: 11px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #7c3aed !important;
    text-decoration: none !important;
    background: transparent !important;
    border: none !important;
    border-bottom: none !important;
    white-space: nowrap !important;
    line-height: 1.4 !important;
    transition: background .15s, color .15s !important;
    font-family: 'DM Sans', sans-serif !important;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
    background: #ede9fe !important;
    color: #5b21b6 !important;
    border: none !important;
}

/* Onglet actif */
body.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a,
body.woocommerce-account .woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--active a,
body.woocommerce-account .woocommerce-MyAccount-navigation ul li.current a {
    background: #7c3aed !important;
    color: #fff !important;
    border: none !important;
}

/* Contenu en pleine largeur sous les onglets */
body.woocommerce-account .woocommerce-MyAccount-content {
    width: 100% !important;
    float: none !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    clear: both !important;
}

/* ════════════════════════════════════════════════════
   TABLEAUX (Commandes, Téléchargements...)
════════════════════════════════════════════════════ */

body.woocommerce-account .woocommerce-orders-table,
body.woocommerce-account .woocommerce-table,
body.woocommerce-account table.shop_table {
    border-radius: 14px !important;
    overflow: hidden !important;
    border: 1px solid #f0f0f0 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    width: 100% !important;
    background: #fff !important;
}

body.woocommerce-account .woocommerce-orders-table thead th,
body.woocommerce-account .woocommerce-table thead th,
body.woocommerce-account table.shop_table thead th {
    background: #f4f3ff !important;
    color: #7c3aed !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .4px !important;
    padding: 12px 16px !important;
    border-bottom: 1px solid #e9d5ff !important;
    border-top: none !important;
}

body.woocommerce-account .woocommerce-orders-table td,
body.woocommerce-account .woocommerce-table td,
body.woocommerce-account table.shop_table td {
    padding: 13px 16px !important;
    font-size: 13px !important;
    color: #1a1a2e !important;
    border-bottom: 1px solid #f5f5f5 !important;
    vertical-align: middle !important;
}

body.woocommerce-account .woocommerce-orders-table tbody tr:last-child td,
body.woocommerce-account .woocommerce-table tbody tr:last-child td,
body.woocommerce-account table.shop_table tbody tr:last-child td {
    border-bottom: none !important;
}

body.woocommerce-account .woocommerce-orders-table tbody tr:hover td,
body.woocommerce-account .woocommerce-table tbody tr:hover td {
    background: #faf9ff !important;
}

/* Statuts de commande */
body.woocommerce-account mark.order-status {
    border-radius: 999px !important;
    padding: 3px 12px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    background: #f4f3ff !important;
    color: #7c3aed !important;
}

body.woocommerce-account mark.order-status.status-completed  { background: #f0fdf4 !important; color: #15803d !important; }
body.woocommerce-account mark.order-status.status-processing { background: #eff6ff !important; color: #1d4ed8 !important; }
body.woocommerce-account mark.order-status.status-on-hold    { background: #fef9c3 !important; color: #854d0e !important; }
body.woocommerce-account mark.order-status.status-cancelled  { background: #fff5f5 !important; color: #dc2626 !important; }
body.woocommerce-account mark.order-status.status-pending    { background: #fff7ed !important; color: #c2410c !important; }

/* ════════════════════════════════════════════════════
   BOUTONS
════════════════════════════════════════════════════ */

body.woocommerce-account .woocommerce .button,
body.woocommerce-account .woocommerce a.button,
body.woocommerce-account .woocommerce button.button,
body.woocommerce-account .woocommerce input.button,
body.woocommerce-account .woocommerce button[type="submit"],
body.woocommerce-account .woocommerce #respond input#submit {
    background: #7c3aed !important;
    color: #fff !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 9px 20px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    font-family: 'DM Sans', sans-serif !important;
    cursor: pointer !important;
    transition: background .15s !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

body.woocommerce-account .woocommerce .button:hover,
body.woocommerce-account .woocommerce a.button:hover,
body.woocommerce-account .woocommerce button.button:hover,
body.woocommerce-account .woocommerce button[type="submit"]:hover {
    background: #6d28d9 !important;
    color: #fff !important;
}

/* ════════════════════════════════════════════════════
   FORMULAIRES (Détails du compte, Adresses)
════════════════════════════════════════════════════ */

body.woocommerce-account .woocommerce input[type="text"],
body.woocommerce-account .woocommerce input[type="email"],
body.woocommerce-account .woocommerce input[type="password"],
body.woocommerce-account .woocommerce input[type="tel"],
body.woocommerce-account .woocommerce select,
body.woocommerce-account .woocommerce textarea {
    border: 1.5px solid #e5e7eb !important;
    border-radius: 10px !important;
    padding: 10px 13px !important;
    font-size: 14px !important;
    font-family: 'DM Sans', sans-serif !important;
    color: #1a1a2e !important;
    width: 100% !important;
    transition: border-color .15s !important;
    box-shadow: none !important;
}

body.woocommerce-account .woocommerce input[type="text"]:focus,
body.woocommerce-account .woocommerce input[type="email"]:focus,
body.woocommerce-account .woocommerce input[type="password"]:focus,
body.woocommerce-account .woocommerce select:focus,
body.woocommerce-account .woocommerce textarea:focus {
    outline: none !important;
    border-color: #7c3aed !important;
    box-shadow: 0 0 0 3px rgba(124,58,237,.1) !important;
}

body.woocommerce-account .woocommerce label {
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #888 !important;
    text-transform: uppercase !important;
    letter-spacing: .4px !important;
    margin-bottom: 6px !important;
    display: block !important;
    font-family: 'DM Sans', sans-serif !important;
}

/* ════════════════════════════════════════════════════
   NOTICES / ALERTES
════════════════════════════════════════════════════ */

body.woocommerce-account .woocommerce-message,
body.woocommerce-account .woocommerce-error,
body.woocommerce-account .woocommerce-info {
    border-radius: 12px !important;
    padding: 13px 18px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    border-top: none !important;
    border-right: none !important;
    border-bottom: none !important;
    border-left: 4px solid !important;
    list-style: none !important;
    font-family: 'DM Sans', sans-serif !important;
}

body.woocommerce-account .woocommerce-message {
    background: #f0fdf4 !important;
    border-color: #16a34a !important;
    color: #15803d !important;
}

body.woocommerce-account .woocommerce-error {
    background: #fff5f5 !important;
    border-color: #dc2626 !important;
    color: #991b1b !important;
}

body.woocommerce-account .woocommerce-info {
    background: #eff6ff !important;
    border-color: #3b82f6 !important;
    color: #1d4ed8 !important;
}

/* ════════════════════════════════════════════════════
   RESPONSIVE
════════════════════════════════════════════════════ */

@media (max-width: 640px) {
    body.woocommerce-account .woocommerce-MyAccount-navigation ul {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
    }

    body.woocommerce-account .woocommerce-MyAccount-navigation ul::-webkit-scrollbar {
        display: none !important;
    }

    body.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
        font-size: 12px !important;
        padding: 8px 13px !important;
    }

    body.woocommerce-account .woocommerce-orders-table,
    body.woocommerce-account table.shop_table {
        display: block !important;
        overflow-x: auto !important;
    }
}