/* ============================================================
   Crinex Dental — habillage Panier & Commande (blocs WooCommerce)
   Couleurs/police via tokens.css (chargé par style.css).
   ============================================================ */

/* ---- Liens produits : encre + hover cyan (au lieu du rose WooCommerce) ---- */
.wc-block-components-product-name,
.woocommerce a.wc-block-components-product-name{
  color:var(--ink)!important; text-decoration:none; font-weight:700;
}
.wc-block-components-product-name:hover{ color:var(--accent-d)!important; }

/* ---- Boutons principaux (Valider la commande / Passer commande) en cyan ---- */
.wc-block-cart__submit-button,
.wc-block-components-button.contained,
.wc-block-components-checkout-place-order-button,
.wp-block-woocommerce-cart .wc-block-cart__submit-container .wc-block-components-button{
  background:var(--accent)!important; color:#fff!important;
  border:1px solid var(--accent)!important; border-radius:10px!important;
  font-weight:700!important; text-decoration:none!important; box-shadow:none!important;
  transition:background .15s, border-color .15s;
}
.wc-block-cart__submit-button:hover,
.wc-block-components-button.contained:hover,
.wc-block-components-checkout-place-order-button:hover{
  background:var(--accent-d)!important; border-color:var(--accent-d)!important;
}
.wc-block-components-button > .wc-block-components-button__text{ text-decoration:none!important; }

/* ---- UNE seule carte autour du récap (panier + commande), avec padding interne
        (sinon les textes étaient collés au bord et chaque ligne avait sa propre boîte). ---- */
.wp-block-woocommerce-cart-order-summary-block,
.wc-block-checkout__sidebar .wc-block-components-sidebar{
  background:var(--surface)!important; border:1px solid var(--line)!important; border-radius:var(--radius)!important;
  padding:8px 22px!important;
}
/* On annule toute boîte/​bordure/​radius sur les sous-blocs internes des totaux. */
.wc-block-cart__sidebar .wc-block-components-totals-wrapper{ background:transparent!important; border:0!important; border-radius:0!important; padding-left:0!important; padding-right:0!important; }

/* ---- Total mis en avant en accent ---- */
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-components-totals-item.wc-block-components-totals-footer-item .wc-block-components-totals-item__value{
  color:var(--accent-d)!important; font-weight:800;
}

/* ---- Stepper quantité + champs : bordure ligne, focus cyan ---- */
.wc-block-components-quantity-selector{ border-color:var(--line)!important; border-radius:8px; }
.wc-block-components-text-input input,
.wc-block-components-text-input input[type=text],
.wc-block-components-text-input input[type=email],
.wc-block-components-text-input input[type=tel],
.wc-block-components-select .wc-block-components-select__container,
.wc-block-components-textarea{
  border-color:var(--line)!important; border-radius:10px!important;
}
.wc-block-components-text-input input:focus,
.wc-block-components-textarea:focus{
  border-color:var(--accent)!important; box-shadow:0 0 0 3px var(--accent-t2)!important; outline:none!important;
}
.wc-block-components-text-input.is-active label,
.wc-block-components-checkout-step.is-active .wc-block-components-checkout-step__title-content{ color:var(--accent-d)!important; }

/* ---- Méthode de paiement / livraison sélectionnée : accent cyan ---- */
.wc-block-components-radio-control__input:checked,
.wc-block-components-checkbox input:checked{ accent-color:var(--accent); }
.wc-block-components-radio-control-accordion-option--checked-option,
.wc-block-components-radio-control__option--checked-option{ border-color:var(--accent)!important; }

/* ---- Numéro d'étape (checkout) en cyan ---- */
.wc-block-components-checkout-step__title::before,
.wc-block-components-checkout-step--with-step-number .wc-block-components-checkout-step__title-content::before{
  background:var(--accent)!important; color:#fff!important;
}

/* ---- Bandeaux d'info (ex. « identifiez-vous », franco) : lien cyan, pas rose ---- */
.woocommerce-info, .wc-block-components-notice-banner,
.woocommerce-error, .woocommerce-message{ border-radius:10px; }
.woocommerce-info a, .wc-block-components-notice-banner a,
.woocommerce a.showlogin, .woocommerce a.showcoupon{ color:var(--accent-d)!important; font-weight:700; }
.woocommerce-info::before, .wc-block-components-notice-banner.is-info{ color:var(--accent)!important; }

/* ---- Titres de page panier/commande alignés au reste (Hanken) ---- */
.woocommerce-cart .entry-title, .woocommerce-checkout .entry-title{ letter-spacing:-.02em; }

/* ---- Accordéon « codes promo » : flèche/texte discrets ---- */
.wc-block-components-panel__button{ color:var(--ink-2)!important; font-weight:600; }

/* ---- Responsive : récap sous le contenu sur mobile (par défaut WooCommerce, on aère) ---- */
@media (max-width:780px){
  .wc-block-cart__submit-button,
  .wc-block-components-checkout-place-order-button{ width:100%!important; }
}

/* ============================================================
   Mon compte / Connexion / Inscription (WooCommerce classique)
   ============================================================ */
/* Boutons (Se connecter, S'inscrire, Enregistrer…) en cyan. */
.woocommerce-account .woocommerce button.button,
.woocommerce form.woocommerce-form-login button.button,
.woocommerce form.woocommerce-form-register button.button,
.woocommerce-MyAccount-content button.button,
.woocommerce-MyAccount-content a.button,
.woocommerce-EditAccountForm button.button{
  background:var(--accent)!important; color:#fff!important; border:1px solid var(--accent)!important;
  border-radius:10px!important; font-weight:700!important; padding:12px 22px!important; box-shadow:none!important;
  transition:background .15s, border-color .15s;
}
.woocommerce-account .woocommerce button.button:hover,
.woocommerce-MyAccount-content a.button:hover,
.woocommerce-EditAccountForm button.button:hover{ background:var(--accent-d)!important; border-color:var(--accent-d)!important; }

/* Liens en cyan (au lieu du rose WooCommerce). */
.woocommerce-account a,
.woocommerce form .woocommerce-privacy-policy-text a,
.woocommerce .lost_password a{ color:var(--accent-d); text-decoration:none; }
.woocommerce-account a:hover,
.woocommerce .lost_password a:hover{ color:var(--accent); }

/* Champs : bordure ligne, focus cyan. */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce-account input[type=text],
.woocommerce-account input[type=email],
.woocommerce-account input[type=password]{
  border:1px solid var(--line)!important; border-radius:10px!important; padding:12px 14px!important; box-sizing:border-box;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce-account input:focus,
.woocommerce form .form-row textarea:focus{
  border-color:var(--accent)!important; box-shadow:0 0 0 3px var(--accent-t2)!important; outline:none!important;
}

/* Cartes login / register : coins arrondis + bordure douce. */
.woocommerce-account .col-1 > .woocommerce,
.woocommerce form.login, .woocommerce form.register,
.woocommerce-account .u-column1, .woocommerce-account .u-column2{ border-radius:var(--radius); }
.woocommerce form.login, .woocommerce form.register{ border:1px solid var(--line)!important; border-radius:var(--radius); }

/* Titres (Se connecter / S'inscrire) en Hanken + encre. */
.woocommerce-account h2, .woocommerce-account .entry-title{ color:var(--ink); letter-spacing:-.01em; }

/* Tableau de bord connecté : menu de navigation. */
.woocommerce-MyAccount-navigation ul{ list-style:none; margin:0; padding:0; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--surface); }
.woocommerce-MyAccount-navigation ul li{ border-bottom:1px solid var(--line-2); }
.woocommerce-MyAccount-navigation ul li:last-child{ border-bottom:0; }
.woocommerce-MyAccount-navigation ul li a{ display:block; padding:12px 16px; color:var(--ink-2)!important; font-weight:600; text-decoration:none; }
.woocommerce-MyAccount-navigation ul li a:hover{ background:var(--surface-2); color:var(--accent-d)!important; }
.woocommerce-MyAccount-navigation ul li.is-active a{ background:var(--accent-t); color:var(--accent-d)!important; box-shadow:inset 3px 0 0 var(--accent); }

/* Cases à cocher / focus accent. */
.woocommerce-account input[type=checkbox]{ accent-color:var(--accent); }

/* ============================================================
   Panier / Commande — finitions (quantité, prix lisibles, espacements)
   ============================================================ */
/* Sélecteur de quantité : propre, lisible. */
.wc-block-components-quantity-selector{ border:1px solid var(--line)!important; border-radius:10px!important; overflow:hidden; }
.wc-block-components-quantity-selector__button{ color:var(--ink-2)!important; font-weight:700; }
.wc-block-components-quantity-selector__button:hover{ color:var(--accent-d)!important; background:var(--surface-2)!important; }
.wc-block-components-quantity-selector__input{ color:var(--ink)!important; font-weight:700; }
/* Prix produits + totaux en encre lisible. */
.wc-block-components-product-price__value,
.wc-block-cart-item__total .wc-block-components-formatted-money-amount,
.wc-block-components-order-summary-item__total-price .wc-block-components-formatted-money-amount{ color:var(--ink)!important; font-weight:700; }
.wc-block-components-product-metadata,
.wc-block-components-product-name + *{ color:var(--muted); }
/* Lignes de totaux : un peu d'air. */
.wc-block-components-totals-item{ padding-top:6px!important; padding-bottom:6px!important; }
/* Badges quantité du résumé commande : cyan (au lieu du noir). */
.wc-block-components-order-summary-item__quantity{ background:var(--accent)!important; color:#fff!important; border-color:var(--accent)!important; }
/* Champ « codes promo » : titre discret, chevron aligné. */
.wc-block-components-totals-coupon__button,
.wc-block-components-panel__button{ color:var(--ink-2)!important; font-weight:600; }

/* ============================================================
   Page Panier — chaque produit dans une carte blanche (comme le tiroir latéral)
   La liste est une <table> : on espace les lignes (border-spacing) et on met fond +
   bordure + arrondis sur les cellules, première/dernière cellule pour les coins.
   ============================================================ */
.wc-block-cart-items{ border-collapse:separate!important; border-spacing:0 10px!important; }
.wc-block-cart-items__row{ border:0!important; background:transparent!important; }
body .wc-block-cart-items tr.wc-block-cart-items__row > td{
  background-color:#fff!important; background-image:none!important;
  border-top:1px solid var(--line)!important; border-bottom:1px solid var(--line)!important;
  padding-top:14px!important; padding-bottom:14px!important; vertical-align:middle;
}
body .wc-block-cart-items tr.wc-block-cart-items__row > td:first-child{
  border-left:1px solid var(--line)!important; border-top-left-radius:12px!important; border-bottom-left-radius:12px!important;
  padding-left:14px!important;
}
body .wc-block-cart-items tr.wc-block-cart-items__row > td:last-child{
  border-right:1px solid var(--line)!important; border-top-right-radius:12px!important; border-bottom-right-radius:12px!important;
  padding-right:14px!important;
}
/* La cellule TOTAL est mise en display:flex par WooCommerce (hauteur ~48px) -> elle ne
   remplit pas la carte. On la remet en table-cell pour toute la hauteur (prix aligné en haut). */
body .wc-block-cart-items tr.wc-block-cart-items__row > td.wc-block-cart-item__total{
  display:table-cell!important; vertical-align:top!important; text-align:right;
}
/* Vignette produit cadrée (cohérent avec le catalogue/tiroir). */
.wc-block-cart-item__image img{
  border:1px solid var(--line); border-radius:8px; background:#fff; padding:4px; box-sizing:border-box; mix-blend-mode:multiply;
}
/* En-tête « PRODUIT / TOTAL » : pas de carte, discret. */
.wc-block-cart-items__header > th{ background:transparent!important; border:0!important; }

/* ============================================================
   Finitions : champ quantité (3 chiffres) + page panier vide
   ============================================================ */
/* Quantité : assez large pour 3 chiffres (ex. 100). */
.wc-block-components-quantity-selector__input{ min-width:46px!important; padding-left:4px!important; padding-right:4px!important; }

/* Panier vide : on retire les produits « mis en avant » (moches, sans images) + séparateur +
   titre « Nouveau dans la boutique ». On garde le message + un bouton vers le catalogue (injecté en JS). */
.wp-block-woocommerce-empty-cart-block .wp-block-product-new,
.wp-block-woocommerce-empty-cart-block .wc-block-grid,
.wp-block-woocommerce-empty-cart-block .wp-block-separator,
.wp-block-woocommerce-empty-cart-block .wp-block-heading.has-text-align-center:not(.with-empty-cart-icon){ display:none!important; }
.wp-block-woocommerce-empty-cart-block{ text-align:center; padding:30px 16px 50px; }
.crinex-empty-cta{ display:inline-flex; align-items:center; gap:9px; margin:20px auto 0; padding:13px 28px;
  background:var(--accent); color:#fff!important; border-radius:10px; font-weight:700; text-decoration:none!important;
  white-space:nowrap; transition:background .15s; }
.crinex-empty-cta:hover{ background:var(--accent-d); color:#fff!important; }
.crinex-empty-cta svg{ width:18px; height:18px; flex:none; stroke:#fff; }

/* ============================================================
   Écran de connexion plein écran (praticiens NON connectés)
   Fond branding Crinex + carte centrée. Aucun contenu sensible exposé.
   ============================================================ */
/* Fond doux du site (légèrement bleuté), commun aux deux écrans */
body.crinex-login-screen, body.crinex-pending-screen{ min-height:100vh; background:var(--bg)!important; }
/* masque le chrome + le titre de page */
body.crinex-login-screen .elementor-location-header, body.crinex-login-screen .elementor-location-footer,
body.crinex-login-screen .crinex-hd, body.crinex-login-screen .crinex-ft, body.crinex-login-screen .entry-title,
body.crinex-pending-screen .elementor-location-header, body.crinex-pending-screen .elementor-location-footer,
body.crinex-pending-screen .crinex-hd, body.crinex-pending-screen .crinex-ft, body.crinex-pending-screen .entry-title,
body.crinex-pending-screen .woocommerce-MyAccount-navigation{ display:none!important; }
/* notices WooCommerce masquées sur l'écran « en attente » (la carte suffit) */
body.crinex-pending-screen .woocommerce-notices-wrapper, body.crinex-pending-screen .woocommerce-message,
body.crinex-pending-screen .woocommerce-info, body.crinex-pending-screen .woocommerce-error{ display:none!important; }
/* le contenu MyAccount est floaté à ~68% à droite par défaut -> pleine largeur pour centrer la carte */
body.crinex-pending-screen .woocommerce-MyAccount-content{ width:100%!important; float:none!important; margin:0!important; }
/* centre la carte plein écran */
body.crinex-login-screen main.site-main, body.crinex-pending-screen main.site-main{ display:flex; align-items:center; justify-content:center; min-height:100vh; padding:40px 16px; }
body.crinex-login-screen .page-content, body.crinex-pending-screen .page-content{ max-width:none!important; width:auto!important; margin:0!important; padding:0!important; }
/* la carte (ombre douce sur fond clair) */
body.crinex-login-screen .woocommerce{ width:min(560px,96vw); background:var(--surface); border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow-l); padding:36px 38px; margin:0; }
body.crinex-pending-screen .woocommerce{ width:min(460px,94vw); background:var(--surface); border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow-l); padding:48px 42px; margin:0; }
/* en-tête branding dans la carte */
.crinex-login-head{ text-align:center; margin-bottom:4px; }
.crinex-login-head .crinex-logo-svg{ height:30px; width:auto; display:block; margin:0 auto; }
.crinex-login-tag{ color:var(--ink-2); font-size:14.5px; margin:14px 0 6px; }
/* onglets Se connecter / S'inscrire */
.crinex-auth-tabs{ display:flex; gap:5px; background:var(--surface-2); border:1px solid var(--line); border-radius:12px; padding:5px; margin:20px auto 6px; max-width:340px; }
.crinex-auth-tabs .crinex-auth-tab{ flex:1; border:0!important; background:transparent!important; padding:10px 14px; border-radius:8px; font:inherit; font-weight:700; font-size:14px; color:var(--muted)!important; box-shadow:none!important; cursor:pointer; transition:background .15s,color .15s,box-shadow .15s; }
.crinex-auth-tabs .crinex-auth-tab:hover{ background:rgba(2,80,157,.10)!important; color:var(--accent-d)!important; }
.crinex-auth-tabs .crinex-auth-tab.is-active,
.crinex-auth-tabs .crinex-auth-tab.is-active:hover{ background:var(--surface)!important; color:var(--accent-d)!important; box-shadow:var(--shadow-s)!important; }
/* un seul formulaire visible à la fois */
body.crinex-login-screen #customer_login.u-columns{ display:block!important; margin-top:14px; }
body.crinex-login-screen #customer_login.u-columns > div{ width:auto!important; max-width:none!important; float:none!important; margin:0!important; }
body.crinex-login-screen #customer_login .u-column2{ display:none; }
body.crinex-login-screen #customer_login.show-register .u-column1{ display:none; }
body.crinex-login-screen #customer_login.show-register .u-column2{ display:block; }
body.crinex-login-screen #customer_login h2{ display:none; }       /* l'onglet sert de titre */
/* formulaire sans cadre interne (la carte suffit) */
body.crinex-login-screen .woocommerce form.login, body.crinex-login-screen .woocommerce form.register{ border:0!important; padding:0!important; margin:0!important; }
/* Prénom + Nom côte à côte */
.crinex-name-row{ display:flex; gap:14px; }
.crinex-name-row .form-row{ flex:1; min-width:0; }
@media (max-width:520px){ .crinex-name-row{ flex-wrap:wrap; gap:0; } .crinex-name-row .form-row{ flex:1 1 100%; } }
@media (max-width:760px){ body.crinex-login-screen .woocommerce{ padding:26px 22px; } }

/* Ligne « Se connecter » + « Se souvenir de moi » : bouton aligné à gauche sous les
   champs, case centrée verticalement à sa droite. Les inputs cachés (nonce/referer) sont
   sortis du flux flex (sinon le gap créait ~32px de décalage avant le bouton). */
body.crinex-login-screen form.login p.form-row:has(> button[name="login"]){
  display:flex; align-items:center; gap:0; flex-wrap:wrap; margin-top:6px;
}
body.crinex-login-screen form.login p.form-row > input[type="hidden"]{ display:none!important; }
body.crinex-login-screen form.login p.form-row > button[name="login"]{ order:1; margin:0; }
body.crinex-login-screen form.login .woocommerce-form-login__rememberme{
  order:2; display:inline-flex; align-items:center; gap:8px; margin:0 0 0 16px; line-height:1; color:var(--ink-2);
}
body.crinex-login-screen form.login .woocommerce-form-login__rememberme input{ margin:0; }

/* ============================================================
   Pages Mon compte / Panier / Validation de la commande
   Respiration verticale (header ↔ footer) + en-tête de page soigné.
   ============================================================ */
body.woocommerce-account:not(.crinex-login-screen):not(.crinex-pending-screen) main.site-main,
body.woocommerce-cart main.site-main,
body.woocommerce-checkout main.site-main{
  padding-top:40px!important; padding-bottom:76px!important;
}
/* En-tête : titre + filet de séparation, de l'air sous le titre. */
body.woocommerce-account:not(.crinex-login-screen):not(.crinex-pending-screen) .page-header,
body.woocommerce-cart .page-header,
body.woocommerce-checkout .page-header{
  margin:0 0 30px!important; padding:0 0 16px!important; border-bottom:1px solid var(--line);
}
body.woocommerce-account:not(.crinex-login-screen):not(.crinex-pending-screen) .page-header .entry-title,
body.woocommerce-cart .page-header .entry-title,
body.woocommerce-checkout .page-header .entry-title{
  font-size:30px!important; font-weight:800; color:var(--ink); letter-spacing:-.02em; line-height:1.12; margin:0!important;
}
/* Le bloc Panier/Commande est en .alignwide avec un décalage fixe de -80px (quirk : même
   largeur, juste poussé à gauche -> hors de la colonne, et débordant à gauche sur mobile).
   On le recadre dans la colonne de contenu : aligné avec le titre + le filet, symétrique. */
body.woocommerce-cart main .alignwide,
body.woocommerce-checkout main .alignwide{ margin-left:0!important; margin-right:0!important; }
@media (max-width:760px){
  body.woocommerce-account:not(.crinex-login-screen):not(.crinex-pending-screen) main.site-main,
  body.woocommerce-cart main.site-main,
  body.woocommerce-checkout main.site-main{ padding-top:26px!important; padding-bottom:52px!important; }
  body.woocommerce-account:not(.crinex-login-screen):not(.crinex-pending-screen) .page-header .entry-title,
  body.woocommerce-cart .page-header .entry-title,
  body.woocommerce-checkout .page-header .entry-title{ font-size:25px!important; }
}

/* ===== Écran « en attente de validation » (carte) ===== */
.crinex-pending-card{ text-align:center; }
.crinex-pending-card .crinex-logo-svg{ height:34px; width:auto; display:block; margin:0 auto 30px; }
.crinex-pending-card h2{ font-size:24px; color:var(--ink); margin:0 0 16px; letter-spacing:-.015em; line-height:1.25; }
.crinex-pending-card .crinex-pending-lead{ color:var(--ink-2); font-size:15px; line-height:1.6; margin:0 0 16px; }
.crinex-pending-card .crinex-pending-sub{ color:var(--muted); font-size:13.5px; line-height:1.55; margin:0; }
.crinex-pending-logout{ display:inline-block; margin-top:28px; color:var(--accent-d); font-weight:700; font-size:14px; text-decoration:none; }
.crinex-pending-logout:hover{ color:var(--accent); }