/*  Theme Name: Biellissimo Child Astra
Theme URI: https://lesclesdelabagnole.fr
Description: Thème enfant LCDLB
Author: Quentin PETREQUIN 
Template: astra
*/

/* === Fonts === */
@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');

/* === Design system === */
:root{
  --bg:#121212;
  --surface:#1A1A1A;
  --card:#242424;
  --line:#2F2F2F;
  --txt:#EDEDED;
  --txt-2:#B5B5B5;
  --acc:#FFD966;    /* jaune */
  --acc-2:#fce59f;  /* chaud (hover) */
  --radius:12px;
  --shadow-md:0 6px 18px rgba(0,0,0,.30);
  --shadow-lg:0 8px 24px rgba(0,0,0,.35);
}

/* === Base === */
body{ background:var(--bg); color:var(--txt); line-height:1.6; }
p{ color:var(--txt-2); }

/* Liens sobres par défaut */
a{ color:#D6D6D6; text-decoration:none; transition:color .15s ease; }
a:hover{ color:var(--acc); }

/* === Header sticky === */
.main-header-bar{
  position:fixed; top:0; left:0; width:100%; z-index:9999;
  background:rgba(18,18,18,.85); backdrop-filter:blur(10px);
  box-shadow:0 4px 6px rgba(0,0,0,.8);
}
@media (min-width:921px){ .main-header-bar{ background:rgba(18,18,18,.85)!important; }}

/* Décaler le contenu sous le header (sauf accueil si tu veux) */
body:not(.home) .site-content{ margin-top:80px; }

/* Sous-menu */
.sub-menu li{ background-color:#180F2A; }

/* Sidebar base */
.widget-area .widget{ font-size:14px; }
.widget-area .widget-title{ font-size:16px; }

/* Résultats de recherche: respirer sous le header */
body.search-results .ast-row{ margin-top:50px; padding:0 20px; }

/* Barre de recherche widget */
#secondary .wp-block-search__input{
  background:#333; border-radius:5px; border:1px solid #505050; color:var(--acc);
}

/* === Navigation: états des liens === */
@media (min-width:923px){
  .ast-theme-transparent-header .main-header-menu .current-menu-item > .menu-link,
  .ast-theme-transparent-header .main-header-menu .current-menu-ancestor > .menu-link{ color:var(--acc)!important; }
  .ast-theme-transparent-header .main-header-menu .menu-item:hover > .menu-link{ color:#FFC000!important; }
}

/* Supprimer halo de focus sur le menu et les liens */
.main-header-menu .menu-link:focus,
.main-header-menu .menu-link:focus-visible,
a:focus{ outline:none!important; box-shadow:none!important; }

/* Garder un focus discret uniquement sur inputs/boutons (accessibilité) */
input:focus, textarea:focus, select:focus, button:focus{
  outline:none; box-shadow:0 0 0 2px rgba(255,217,102,.35); border-radius:6px;
}

/* === Woo: zones compte/connexion === */
.woocommerce-MyAccount-navigation{ margin-bottom:50px; }
.ast-woocommerce-container{ margin:20px; }
body .woocommerce form.login,
body .woocommerce form.checkout_coupon,
body .woocommerce form.register{
  background:var(--surface); box-shadow:var(--shadow-lg);
  border:1px solid var(--acc); display:flex; flex-direction:column; justify-content:center;
}
body.woocommerce-account h2{
  margin-top:60px; font-family:'Lobster', cursive;
  color:var(--acc); text-shadow:2px 2px 0 var(--acc-2);
}
@media (min-width:1200px){
  body .woocommerce form.login,
  body .woocommerce form.checkout_coupon,
  body .woocommerce form.register{ min-height:500px; margin-bottom:80px; }
}
@media (min-width:920px) and (max-width:1199px){
  body .woocommerce form.login,
  body .woocommerce form.checkout_coupon,
  body .woocommerce form.register{ min-height:550px; margin-bottom:80px; }
}

/* Sidebar largeur (desktop) */
@media (min-width:922px){ #secondary{ width:30%; max-width:400px; }}

/* Aligner produits au centre sur tablette/mobile */
@media (max-width:921px){
  .woocommerce ul.products li.product.tablet-align-left,
  .woocommerce-page ul.products li.product.tablet-align-left{ text-align:center; }
}

/* === BLOG : cartes article === */
.archive .ast-article-post,
.blog .ast-article-post,
.ast-blog-layout-5-grid .ast-article-post{
  margin-top:30px; padding:24px;
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius); box-shadow:var(--shadow-lg);
  transition:background-color .2s ease-in-out, box-shadow .2s ease;
}
/* pas de “saut” au hover */
.archive .ast-article-post:hover,
.blog .ast-article-post:hover,
.ast-blog-layout-5-grid .ast-article-post:hover{
  background:#1f1f1f; box-shadow:0 10px 28px rgba(0,0,0,.38);
}

/* Titres de cartes en blanc, jaune seulement au hover */
.blog .ast-article-post h2 a,
.archive .ast-article-post h2 a{ color:#FFFFFF; }
.blog .ast-article-post h2 a:hover,
.archive .ast-article-post h2 a:hover{ color:var(--acc); }

/* Images d’articles */
.blog .ast-article-post .post-thumb img,
.archive .ast-article-post .post-thumb img{
  border-radius:10px; box-shadow:var(--shadow-md); margin-bottom:12px;
}

/* Liens de cartes (lire la suite) sobres */
.ast-blog-featured-section a, .ast-blog-featured-section a:visited,
.ast-blog-pagination a, .entry-content a{ color:#D6D6D6; }
.ast-blog-featured-section a:hover,
.ast-blog-pagination a:hover, .entry-content a:hover{ color:var(--acc); }

/* === BOUTIQUE : cartes produit + boutons === */
.woocommerce ul.products li.product{
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius); padding:16px; box-shadow:var(--shadow-md);
}
.woocommerce ul.products li.product a img{
  border-radius:10px; margin-bottom:12px; box-shadow:var(--shadow-md);
}

/* Boutons unifiés (sans déplacement) */
button, .button, .wp-element-button,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit{
  background:var(--acc); color:#222; border:none!important;
  border-radius:10px; font-weight:700; padding:12px 18px;
  box-shadow:0 4px 14px rgba(0,0,0,.25);
  transition:box-shadow .2s ease, background .2s ease, color .2s ease;
}
button:hover, .button:hover, .wp-element-button:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce #respond input#submit:hover{
  background:var(--acc-2); 
  box-shadow:0 8px 24px rgba(0,0,0,.35);
  color:#222;
}

/* Bouton secondaire Woo (alt) */
.button.alt, .woocommerce a.button.alt, .woocommerce button.button.alt{
  background:var(--surface); color:var(--txt); border:1px solid var(--line);
}

/* Badges promo */
.woocommerce span.onsale{ background:var(--acc-2); color:#fff; box-shadow:0 4px 12px rgba(0,0,0,.25); }

/* Respiration globale */
.wp-block-image{ margin-bottom:12px; }
section, .wp-block-group{ margin-bottom:48px; }

/* === SINGLE POST (page d’article) === */
.single-post .site-content{ margin-top:90px; }
.single-post .content-area{
  background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius); box-shadow:var(--shadow-lg); padding:28px;
}
/* largeur de lecture (≈70–80ch) */
.single-post .entry-content{ max-width:75ch; margin:0 auto; }

/* Titre + métas */
.single-post .entry-title{ color:#fff; margin-bottom:10px; }
/* liens meta/auteur sobres (pas orange) */
.single-post .entry-meta a,
.single-post .posted-on a,
.single-post .byline a{ color:#B5B5B5; }
.single-post .entry-meta a:hover,
.single-post .posted-on a:hover,
.single-post .byline a:hover{ color:var(--acc); }

/* Image mise en avant */
.single-post .post-thumb img,
.single-post .featured-image img{ border-radius:12px; box-shadow:var(--shadow-md); margin:10px 0 20px; }

/* Corps de l’article */
.single-post .entry-content p{ font-size:18px; line-height:1.75; margin:0 0 18px; color:var(--txt-2); }
.single-post .entry-content h2, .single-post .entry-content h3{ margin-top:28px; margin-bottom:12px; }
.single-post .entry-content ul, .single-post .entry-content ol{ margin:0 0 18px 20px; }

/* Blockquote */
.single-post blockquote{
  background:#1c1c1c; border-left:4px solid var(--acc-2);
  padding:14px 16px; border-radius:8px; color:#fff;
}

/* Images/tables */
.single-post .entry-content img{ border-radius:10px; box-shadow:var(--shadow-md); }
.single-post figure{ margin:0 0 18px; }
.single-post .entry-content table{
  width:100%; border-collapse:collapse; background:#1b1b1b;
  border:1px solid var(--line); border-radius:10px; overflow:hidden;
}
.single-post .entry-content table th,
.single-post .entry-content table td{ padding:12px 14px; border-bottom:1px solid var(--line); }
.single-post .entry-content table th{ color:#fff; }

/* Nav article */
.single-post .post-navigation a{
  display:block; background:var(--surface); border:1px solid var(--line);
  border-radius:10px; padding:14px; color:#D6D6D6;
}
.single-post .post-navigation a:hover{ background:#1f1f1f; color:var(--acc); }

/* Zone auteur */
.single-post .ast-author-box{
  background:var(--surface); border:1px solid var(--line);
  border-radius:12px; padding:18px; box-shadow:var(--shadow-md);
}

/* Articles liés – plus compacts */
.single-post .related-posts{ margin-top:22px; }
.single-post .related-posts .ast-related-post{
  background:var(--surface); border:1px solid var(--line);
  border-radius:12px; padding:12px; margin-bottom:12px;
  box-shadow:var(--shadow-md);
}
@media (max-width:768px){
  .single-post .related-posts .ast-related-post{ padding:10px; margin-bottom:10px; }
}

/* === SIDEBAR : cartes + liens sobres + sticky === */
#secondary .widget{
  background:var(--surface); border:1px solid var(--line);
  border-radius:12px; padding:18px; margin-bottom:18px; box-shadow:var(--shadow-md);
}
#secondary .widget-title{ color:#fff; margin-bottom:10px; }
#secondary .widget a{ color:#B5B5B5; text-decoration:none; }
#secondary .widget a:hover{ color:var(--acc); }

/* Barre de recherche sidebar */
#secondary .wp-block-search__input{
  background:#2a2a2a; border:1px solid var(--line); color:var(--txt);
}
#secondary .wp-block-search__button, #secondary .search-submit{
  background:var(--acc); color:#222; border:none; border-radius:8px; padding:10px 14px;
}
#secondary .wp-block-search__button:hover, #secondary .search-submit:hover{
  background:var(--acc-2);
}

/* Sidebar sticky */
@media (min-width:1024px){ #secondary{ position:sticky; top:110px; } }

/* Slot pub/promo */
.widget .ad-slot, .widget .promo-card{
  background:#1b1b1b; border:1px dashed var(--line);
  border-radius:12px; padding:16px; text-align:center; color:var(--txt-2);
}
.widget .ad-slot .button{ margin-top:10px; }

/* === Nettoyage bordures parasites === */
.ast-separate-container, .ast-plain-container,
.ast-single-post .ast-container, .single-post .site-content .ast-container{
  border:none!important; box-shadow:none!important;
}

/* === Boutons Elementor / boutons “Hero” Accueil (pas de bordure orange) === */
.elementor-button, .elementor a.elementor-button, .wp-block-button__link{
  border:none!important;
}

/* ——— adoucir l'intensité globale ——— */
:root{
  --radius:10px;
  --shadow-md:0 3px 10px rgba(0,0,0,.22);
  --shadow-lg:0 6px 16px rgba(0,0,0,.28);
}

/* ——— widgets sidebar ——— */
#secondary .widget{
  border-radius:var(--radius);
  box-shadow:var(--shadow-md);        /* plus doux */
  border:1px solid #222;              /* bord fin pour le relief */
  overflow:hidden;                    /* évite le halo aux coins */
}

/* enlever toute ombre résiduelle des éléments internes du bloc recherche */
#secondary .wp-block-search .wp-block-search__inside-wrapper,
#secondary .wp-block-search__input{
  box-shadow:none !important;
  border:1px solid #2a2a2a;           /* sobre et net */
}

/* ——— cartes Blog / Boutique / Article ——— */
.archive .ast-article-post,
.blog .ast-article-post,
.ast-blog-layout-5-grid .ast-article-post,
.woocommerce ul.products li.product,
.single-post .content-area,
.single-post .related-posts .ast-related-post{
  border-radius:var(--radius);
  box-shadow:var(--shadow-md);
  overflow:hidden;                    /* évite les débordements d’ombre aux coins */
}

/* hover discret (plus de “boom” lumineux) */
.archive .ast-article-post:hover,
.blog .ast-article-post:hover,
.ast-blog-layout-5-grid .ast-article-post:hover,
.woocommerce ul.products li.product:hover,
.single-post .related-posts .ast-related-post:hover{
  box-shadow:var(--shadow-lg);
}

/* ——— images dans les cartes : ombre plus légère ——— */
.blog .ast-article-post .post-thumb img,
.archive .ast-article-post .post-thumb img,
.woocommerce ul.products li.product a img,
.single-post .entry-content img{
  box-shadow:0 2px 8px rgba(0,0,0,.20);
  border-radius:8px;
}

/* Cacher totalement le fil d'Ariane (breadcrumbs) */
.woocommerce-breadcrumb {
  display: none !important;
}

/* En-têtes du tableau Commandes */
.woocommerce-orders-table th.woocommerce-orders-table__header-order-number,
.woocommerce-orders-table th.woocommerce-orders-table__header-order-date,
.woocommerce-orders-table th.woocommerce-orders-table__header-order-status,
.woocommerce-orders-table th.woocommerce-orders-table__header-order-total,
.woocommerce-orders-table th.woocommerce-orders-table__header-order-actions {
  background-color: var(--surface);   /* fond sombre comme le reste */
  color: var(--acc);                  /* texte jaune accent */
  text-align: left;
  padding: 12px;
}

/* Titre H2 des encarts adresses */
.woocommerce-Addresses .woocommerce-Address-title h2 {
  background-color: var(--surface);  /* fond sombre */
  font-size: 30px;                   /* ↓ taille du H2 (ajuste à 16px si tu veux encore plus petit) */
  padding: 8px 12px;                 /* espace intérieur */
  margin: 0;                         /* on enlève le gros margin par défaut */
}

/* Mon compte > Adresses : écraser le fond blanc par défaut d'Astra/Woo */
.woocommerce .woocommerce-Addresses .woocommerce-Address-title,
.woocommerce .woocommerce-Addresses .woocommerce-column__title,
.woocommerce .woocommerce-MyAccount-content .woocommerce-Address-title,
.woocommerce .woocommerce-MyAccount-content .woocommerce-column__title,
.woocommerce .woocommerce-customer-details .woocommerce-Address-title,
.woocommerce .woocommerce-customer-details .woocommerce-column__title,
.woocommerce-account .woocommerce-Addresses .woocommerce-Address-title,
.woocommerce-account .woocommerce-Addresses .woocommerce-column__title,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address-title,
.woocommerce-account .woocommerce-MyAccount-content .woocommerce-column__title,
.woocommerce-account .woocommerce-customer-details .woocommerce-Address-title,
.woocommerce-account .woocommerce-customer-details .woocommerce-column__title {
  background: var(--surface) !important;   /* fond sombre */
  border-color: var(--line) !important;
  padding: 8px 12px !important;            /* un peu d'air */
  margin-bottom: 0 !important;
}

/* Réduire la taille du H2 et éviter un double fond */
.woocommerce .woocommerce-Addresses .woocommerce-Address-title h2,
.woocommerce-account .woocommerce-Addresses .woocommerce-Address-title h2 {
  font-size: 30px !important;              /* ajuste à 16px si tu veux plus petit */
  margin: 0 !important;
  background: transparent !important;
}

/* ——— Adresses : une seule “carte” propre, mêmes bords gauche/droite ——— */
.woocommerce-Addresses .woocommerce-Address {
  background: var(--surface);
  border: 1px solid var(--line) !important;     /* même bordure pour les deux colonnes */
  border-radius: var(--radius) !important;
  overflow: hidden;
  padding: 0;
}

/* Supprime les bordures internes parasites appliquées par Astra/Woo */
.woocommerce-Addresses address,
.woocommerce-Addresses .woocommerce-Address:before,
.woocommerce-Addresses .woocommerce-Address:after {
  border: none !important;
  box-shadow: none !important;
}

/* En-tête du bloc adresse (supprime le fond blanc par défaut) */
.woocommerce .woocommerce-Addresses .woocommerce-Address-title,
.woocommerce-account .woocommerce-Addresses .woocommerce-Address-title {
  background: var(--surface) !important;
  border-color: var(--line) !important;
  padding: 8px 12px !important;
  margin: 0 !important;
}

/* Titre H2 (taille + espace + pas de fond doublon) */
.woocommerce-Addresses .woocommerce-Address-title h2 {
  font-size: 18px !important;       /* ajuste la taille ici */
  margin: 0 !important;
  padding: 8px 12px !important;
  background: transparent !important;
}

/* Contenu de l’adresse */
.woocommerce-Addresses address {
  margin: 0;
  padding: 12px 14px;
  background: transparent;
  color: var(--txt-2);
  font-size: 14px;
}

.woocommerce .woocommerce-Addresses .woocommerce-Address-title, .woocommerce .woocommerce-Addresses .woocommerce-column__title, .woocommerce .woocommerce-MyAccount-content .woocommerce-Address-title, .woocommerce .woocommerce-MyAccount-content .woocommerce-column__title, .woocommerce .woocommerce-customer-details .woocommerce-Address-title, .woocommerce .woocommerce-customer-details .woocommerce-column__title, .woocommerce-account .woocommerce-Addresses .woocommerce-Address-title, .woocommerce-account .woocommerce-Addresses .woocommerce-column__title, .woocommerce-account .woocommerce-MyAccount-content .woocommerce-Address-title, .woocommerce-account .woocommerce-MyAccount-content .woocommerce-column__title, .woocommerce-account .woocommerce-customer-details .woocommerce-Address-title, .woocommerce-account .woocommerce-customer-details .woocommerce-column__title {
    border-style: none;
}

/* Forcer les colonnes (facturation/livraison) à passer en 100% largeur sur mobile */
@media only screen and (max-width: 921px) {
.woocommerce .col2-set .col-1,
.woocommerce .col2-set .col-2,
.woocommerce-page .col2-set .col-1,
.woocommerce-page .col2-set .col-2 {
margin-bottom: 30px !important;
}
}

/* 1) Conserver un SEUL cadre : celui du widget externe */
#secondary .widget.widget-woof {
  background: var(--surface) !important;
  border: 1px solid #222 !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow-md) !important;
  overflow: hidden !important;
  padding: 0 !important;
}

/* 2) Supprimer TOUT cadre du widget imbriqué (quelle que soit la classe) */
#secondary .widget.widget-woof > .widget,
#secondary .widget_block > .widget,
#secondary .widget .widget {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* 3) Neutraliser les cadres internes de WOOF */
#secondary .widget.widget-woof .woof,
#secondary .widget.widget-woof .woof_container,
#secondary .widget.widget-woof .woof_container_inner {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
#secondary .widget.widget-woof::before,
#secondary .widget.widget-woof::after,
#secondary .widget.widget-woof .woof_container::before,
#secondary .widget.widget-woof .woof_container::after {
  content: none !important;
  display: none !important;
}

/* 4) Padding interne propre (contenu du filtre) */
#secondary .widget.widget-woof .woof_container_inner {
  padding: 14px 16px !important;
}

/* Harmoniser les titres de widgets avec Roboto */
#secondary h2.widget-title {
    font-family: 'Roboto', sans-serif !important;
    font-size: 1rem;   /* comme tu avais prévu */
    font-weight: 500;  /* optionnel pour garder une belle hiérarchie */
    color: var(--txt); /* reste dans ta palette */
}

.wp-block-search__label {
    font-size: 1rem;
		margin-bottom: 2px;
}

#secondary .wp-block-search .wp-block-search__inside-wrapper, #secondary .wp-block-search__input {
    border: 0px solid #2a2a2a;
}

#ast-scroll-top {
    bottom: 70px !important;
    right: 16px;
	border-radius: 15px;
	    color: #000000;
}

.woocommerce-ordering select.orderby {
  padding: .5em 2.4em .5em .9em !important;
  line-height: 1.2;
  background-color: transparent;
  border: 1px solid var(--line, #2f2f2f);
  border-radius: 8px;
}

/* ≥ 922px : un fin séparateur à droite de la colonne latérale */
@media (min-width: 922px) {
  /* Page avec sidebar à gauche */
  .ast-left-sidebar #secondary {
    border: none !important;                 /* on supprime toute bordure */
    box-shadow: 1px 0 0 0 var(--line, #2a2a2a);
  }
  .ast-left-sidebar #primary {
    border-left: none !important;            /* on supprime la bordure du contenu */
  }

  /* (si un jour tu utilises la sidebar à droite) */
  .ast-right-sidebar #secondary {
    border: none !important;
    box-shadow: -1px 0 0 0 var(--line, #2a2a2a); /* trait à gauche du sidebar */
  }
  .ast-right-sidebar #primary {
    border-right: none !important;
  }
}


  .woocommerce-products-header {
    margin-top: 65px !important;
  }


/* --- Quantité pleine largeur + alignement propre --- */
.woocommerce div.product form.cart .quantity {
  display: flex;
  align-items: center;
  justify-content: space-between;   /* espace régulier */
  gap: 10px;                        /* petit espace visuel */
  width: 100%;
  height: 44px;                     /* même hauteur que le bouton, ajuste si besoin */
  padding: 0 10px;
  border: 1px solid var(--line, #2f2f2f);
  border-radius: 10px;
  background: #111;
  overflow: hidden;
}

.woocommerce div.product form.cart .quantity .minus,
.woocommerce div.product form.cart .quantity .plus {
  flex: 0 0 44px;                   /* zones +/- carrées */
  height: 100%;
  display: grid;
  place-items: center;
  background: none;
  color: var(--acc, #FFD966);
  border: none;
  font-size: 18px;
  cursor: pointer;
  transition: opacity .2s ease;
}
.woocommerce div.product form.cart .quantity .minus:hover,
.woocommerce div.product form.cart .quantity .plus:hover {
  opacity: .7;
}

.woocommerce div.product form.cart .quantity .qty {
  flex: 0 0 60px;                   /* largeur fixe du nombre */
  height: 100%;
  text-align: center;
  border: none !important;
  background: #111;
  color: var(--txt, #ededed);
  font-weight: 600;
  font-size: 15px;
}

/* Bouton Ajouter au panier pleine largeur + hover */
.single-product .single_add_to_cart_button,
.woocommerce div.product form.cart .button.single_add_to_cart_button{
  width: 100%;
  background: var(--acc, #FFD966);
  color: #222;
  border: none;
  border-radius: 10px;
  padding: 14px 22px;
  font-weight: 700;
  line-height: 1;
  transition: background-color .25s ease, opacity .25s ease;
}
.single-product .single_add_to_cart_button:hover{
  background: #fce59f;
  /*color: #fce59f;*/
  /*opacity: .9;*/
}

body.woocommerce-account h2 {
    text-shadow: 2px 2px 0 #E46C0A;
}

.woocommerce-MyAccount-navigation-link.is-active a {
    color: #E46C0A;
}

/* Cacher le bouton "Filtres" en desktop */
@media (min-width: 922px) {
  .filter-fab {
    display: none !important;
  }
}

/* Fin */