).
Sinon on affichait une cle meme sur Downloads / Coupons / Payment. */
.woocommerce-account .e-my-account-tab__downloads .woocommerce-info::before{
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23004C6D' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12m-5-5 5 5 5-5M5 21h14'/%3E%3C/svg%3E");
}
.woocommerce-account .e-my-account-tab__wc-smart-coupons .woocommerce-info::before{
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23004C6D' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2 2 2 0 0 0 0 4 2 2 0 0 1-2 2H5a2 2 0 0 1-2-2 2 2 0 0 0 0-4z'/%3E%3Cpath d='M9 7v10'/%3E%3C/svg%3E");
}
.woocommerce-account .e-my-account-tab__payment-methods .woocommerce-info::before{
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23004C6D' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='5' width='20' height='14' rx='2.5'/%3E%3Cpath d='M2 10h20'/%3E%3C/svg%3E");
}
.woocommerce-account .e-my-account-tab__game-keys .woocommerce-info::before{
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23004C6D' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='6' y1='12' x2='10' y2='12'/%3E%3Cline x1='8' y1='10' x2='8' y2='14'/%3E%3Cline x1='15' y1='13' x2='15.01' y2='13'/%3E%3Cline x1='18' y1='11' x2='18.01' y2='11'/%3E%3Crect x='2' y='6' width='20' height='12' rx='6'/%3E%3C/svg%3E");
}
.woocommerce-account .e-my-account-tab__orders .woocommerce-info::before{
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23004C6D' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z'/%3E%3Cpath d='M3 6h18M16 10a4 4 0 0 1-8 0'/%3E%3C/svg%3E");
}
/* -------------------------------------------------------------------------
Bandeaux de confirmation et d'erreur.
Ex : "Account details changed successfully." apres un Save changes.
.woocommerce-info sert deja aux etats vides (grosse boite centree), donc
ces deux-la sont traites a part : un bandeau fin, aligne a gauche, avec
une pastille d'icone. Vert pour la reussite, rouge pour l'erreur.
------------------------------------------------------------------------- */
/* L'icone est un background-image sur le bandeau lui-meme, PAS un ::before.
Verifie sur staging : le ::before ne se genere pas (son content est ecrase
ailleurs dans la cascade), alors que ses width/height apparaissaient bien
en style calcule — donc invisible sans erreur visible. Un background ne
depend d'aucune generation de pseudo-element. */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-error{
display:block !important;
margin:0 0 22px !important;
padding:15px 18px 15px 56px !important;
border:1px solid transparent !important;
border-radius:12px !important;
background-repeat:no-repeat !important;
background-position:18px center !important;
background-size:26px 26px !important;
list-style:none !important;
font-family:'Inter',sans-serif !important;
font-size:14.5px !important;
font-weight:500 !important;
line-height:1.5 !important;
text-align:left !important;
}
/* WooCommerce met tabindex="-1" et donne le focus au bandeau par JS pour le
faire annoncer. Chrome dessine alors son contour bleu, qui jure avec le
vert. On le retire : ce n'est pas un element interactif, et role="alert"
suffit aux lecteurs d'ecran. */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message:focus,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-error:focus{
outline:none !important;
box-shadow:none !important;
}
/* le ::before d'origine (icone de police WooCommerce) n'a plus rien a faire */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message::before,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-error::before{
display:none !important;
content:none !important;
}
/* reussite */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message{
background-color:#EAF9F1 !important;
border-color:#BBE9CF !important;
color:#186B42 !important;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Ccircle cx='13' cy='13' r='13' fill='%232ECC71'/%3E%3Cpath d='M7 13.5l4 4 8-8' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}
/* erreur */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-error{
background-color:#FDECEF !important;
border-color:#F7C3CD !important;
color:#A31026 !important;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Ccircle cx='13' cy='13' r='13' fill='%23F20028'/%3E%3Cpath d='M9 9l8 8M17 9l-8 8' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-error li{
margin:0 !important;
padding:0 !important;
list-style:none !important;
}
/* le bouton "View" que WooCommerce colle parfois dans le bandeau */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-message .button{
margin-left:auto !important;
}
/* =========================================================================
5) TABLEAUX (Orders, Downloads, Payment methods)
========================================================================= */
/* Volontairement generique (table, pas table.shop_table) : les onglets
Product keys / Game keys viennent de plugins dont on n'a jamais vu le
rendu rempli. S'ils sortent un tableau avec leurs propres classes, il
heritera quand meme du style au lieu de sortir brut. */
.woocommerce-account .woocommerce-MyAccount-content table,
.woocommerce-account .woocommerce-MyAccount-content table.shop_table,
.woocommerce-account .woocommerce-MyAccount-content table.woocommerce-orders-table,
.woocommerce-account .woocommerce-MyAccount-content table.woocommerce-MyAccount-downloads,
.woocommerce-account .woocommerce-MyAccount-content table.woocommerce-MyAccount-paymentMethods{
width:100%;
border-collapse:collapse !important;
border:0 !important;
border-radius:0 !important;
background:transparent !important; /* le theme posait un gris sale */
font-size:14px;
margin:0;
}
/* aucun fond sur la table ni sur les lignes (theme + WooCommerce en mettent) */
.woocommerce-account .woocommerce-MyAccount-content table thead,
.woocommerce-account .woocommerce-MyAccount-content table tbody,
.woocommerce-account .woocommerce-MyAccount-content table tfoot,
.woocommerce-account .woocommerce-MyAccount-content table tr,
.woocommerce-account .woocommerce-MyAccount-content table tr:nth-child(even),
.woocommerce-account .woocommerce-MyAccount-content table tr:hover{
background:transparent !important;
background-color:transparent !important;
}
.woocommerce-account .woocommerce-MyAccount-content table thead th{
text-align:left;
font-family:'Montserrat',sans-serif;
font-weight:600;
font-size:11.5px;
letter-spacing:.4px;
text-transform:uppercase;
color:#5B6B78;
padding:0 14px 12px !important;
border-bottom:1px solid var(--mc-line) !important;
background:none !important;
}
.woocommerce-account .woocommerce-MyAccount-content table tbody td{
padding:15px 14px !important;
border-bottom:1px solid #eef2f4 !important;
border-top:0 !important;
color:#3a4a54;
vertical-align:middle;
background:none !important;
}
.woocommerce-account .woocommerce-MyAccount-content table tbody tr:last-child td{border-bottom:none !important}
/* commande : numero + total mis en avant.
!important : le bleu vif venait de la couleur de lien globale du theme. */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-number a{
font-family:'Montserrat',sans-serif !important;
font-weight:700 !important;
color:var(--mc-ink) !important;
text-decoration:none !important;
}
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-number a:hover{
color:var(--mc-navy) !important;
}
.woocommerce-account .woocommerce-orders-table__cell-order-total{
font-family:'Montserrat',sans-serif;
font-weight:700;
color:var(--mc-ink);
}
/* statut colore : WooCommerce pose la classe sur la LIGNE, on ne touche donc
jamais au texte (aucun risque de casser la traduction) */
.woocommerce-account .woocommerce-orders-table__cell-order-status{
font-family:'Montserrat',sans-serif;
font-weight:700;
font-size:13px;
}
/* selecteurs par attribut : robustes quel que soit le nom exact de la classe
de statut pose par WooCommerce / le plugin (le "Failed" restait gris). */
.woocommerce-account .woocommerce-MyAccount-content tr[class*="status-completed"] .woocommerce-orders-table__cell-order-status{color:#149a55 !important}
.woocommerce-account .woocommerce-MyAccount-content tr[class*="status-processing"] .woocommerce-orders-table__cell-order-status{color:#0a6088 !important}
.woocommerce-account .woocommerce-MyAccount-content tr[class*="status-on-hold"] .woocommerce-orders-table__cell-order-status{color:#b47500 !important}
.woocommerce-account .woocommerce-MyAccount-content tr[class*="status-cancelled"] .woocommerce-orders-table__cell-order-status,
.woocommerce-account .woocommerce-MyAccount-content tr[class*="status-refunded"] .woocommerce-orders-table__cell-order-status{color:#5B6B78 !important}
.woocommerce-account .woocommerce-MyAccount-content tr[class*="status-failed"] .woocommerce-orders-table__cell-order-status{color:var(--mc-red) !important}
/* bouton secondaire (View / Delete / Make default) */
.woocommerce-account .woocommerce-MyAccount-content .button,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-button{
display:inline-flex !important;
align-items:center;
justify-content:center;
font-family:'Montserrat',sans-serif !important;
font-weight:600 !important;
font-size:13px !important;
color:var(--mc-navy) !important;
background:#fff !important;
border:1px solid var(--mc-field) !important;
border-radius:9px !important;
padding:9px 16px !important;
text-decoration:none !important;
text-transform:none !important;
cursor:pointer;
transition:border-color .16s ease,background .16s ease,color .16s ease;
}
.woocommerce-account .woocommerce-MyAccount-content .button:hover,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-button:hover{
border-color:var(--mc-navy) !important;
background:var(--mc-navy) !important;
color:#fff !important;
}
/* Telechargement = action principale de sa ligne.
.woocommerce-MyAccount-content est OBLIGATOIRE ici : sans lui la regle ne
compte que 2 classes contre 3 pour le bouton secondaire au-dessus, et comme
les deux portent !important, c'est la specificite qui tranche — le bouton
repassait en blanc. Constate sur le live le 30 juillet. */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-MyAccount-downloads-file{
display:inline-flex !important;
align-items:center;
gap:8px;
background:var(--mc-navy) !important;
color:#fff !important;
border:none !important;
font-family:'Montserrat',sans-serif !important;
font-weight:600 !important;
font-size:13px !important;
border-radius:9px !important;
padding:10px 16px !important;
text-decoration:none !important;
}
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-MyAccount-downloads-file::before{
content:"";
width:15px;height:15px;
background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12m-5-5 5 5 5-5M5 21h14'/%3E%3C/svg%3E") no-repeat center/contain;
}
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-MyAccount-downloads-file:hover{background:var(--mc-navy2) !important}
/* =========================================================================
6) ADRESSES
========================================================================= */
/* WooCommerce dispose les 2 adresses avec des FLOAT + width:47% (classes
.u-columns / .col2-set). Sans !important le grid ne prend pas et les
cartes s'affichent en escalier. */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses,
.woocommerce-account .woocommerce-MyAccount-content .u-columns.woocommerce-Addresses{
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
gap:16px !important;
/* respiration entre la phrase d'intro et les cartes */
margin:20px 0 0 !important;
float:none !important;
}
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses::before,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Addresses::after{
content:none !important; /* clearfix WooCommerce : cree une 3e cellule vide */
}
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address{
width:auto !important;
max-width:none !important;
float:none !important;
margin:0 !important;
border:1px solid var(--mc-line);
border-radius:14px;
padding:20px 22px;
box-shadow:var(--mc-sh-sm);
}
/* titre + lien Edit sur la meme ligne. white-space:nowrap + letter/word-spacing
normaux : le theme ecrasait le titre ("Billingaddress" colle). */
/* titre a GAUCHE + lien Edit a droite, sur la meme ligne.
text-align:left force : le theme centrait le titre dans la carte. */
.woocommerce-account .woocommerce-Address-title{
display:flex !important;
flex-wrap:nowrap;
align-items:center !important;
justify-content:space-between !important;
gap:12px;
text-align:left !important;
margin:0 0 14px !important;
padding:0 0 12px !important;
border-bottom:1px solid var(--mc-line);
}
.woocommerce-account .woocommerce-Address-title h2,
.woocommerce-account .woocommerce-Address-title h3,
.woocommerce-account .woocommerce-Address-title .title{
flex:1 1 auto;
font-family:'Montserrat',sans-serif !important;
font-weight:700 !important;
font-size:16px !important;
line-height:1.3 !important;
letter-spacing:normal !important;
word-spacing:normal !important;
font-stretch:normal !important;
text-align:left !important;
color:var(--mc-ink) !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
text-transform:none !important;
}
.woocommerce-account .woocommerce-Address-title .edit{
flex:none;
font-family:'Montserrat',sans-serif;
font-weight:600;
font-size:13px;
color:#0a6088;
white-space:nowrap;
text-align:right;
}
/* l'adresse elle-meme : plus de gros trou sous le titre */
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address address{
margin:0 !important;
padding:0 !important;
}
.woocommerce-account .woocommerce-Address address{
font-style:normal;
font-size:14.5px;
line-height:1.7;
color:#3a4a54;
}
/* =========================================================================
7) FORMULAIRES DU COMPTE (Account details / Addresses)
Scope volontairement limite a .woocommerce-MyAccount-content pour ne PAS
toucher au formulaire "Track my order" (gere dans l'autre fichier).
========================================================================= */
/* MEME CHAMP QUE LE CHECKOUT (label a l'interieur, en haut de la boite).
La boite visible = le , PAS l'input — exactement le
principe de .cfw-input-wrap sur le checkout. Le DOM WooCommerce sort le