/* =========================================================
   DYB – A11Y Patch (global)
   Goal: improve contrast + basic a11y without redesign.
   File: dyb-zoli-child/assets/css/a11y-contrast.css
   ========================================================= */

/* ---------------------------------------------------------
   0) Baseline readable text
   --------------------------------------------------------- */
body{
  color:#1f1f1f;
}

/* Paragraphs and small text that often end up #777/#999 */
p, li, small, .small, .text-muted,
.elementor-widget-text-editor,
.elementor-widget-text-editor p{
  color:#1f1f1f;
}

/* ---------------------------------------------------------
   1) Links
   --------------------------------------------------------- */
a{
  color:#0b57d0;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}
a:hover, a:focus{
  color:#063b8f;
}

/* ---------------------------------------------------------
   2) Header brand tagline (was too light)
   --------------------------------------------------------- */
.ac-brand-tagline,
.site-branding .site-description,
.site-branding p,
.header .site-description{
  color:#1f1f1f !important;
  opacity:1 !important;
}

/* ---------------------------------------------------------
   3) Footer readability
   --------------------------------------------------------- */
.site-footer,
.site-footer p,
.site-footer li,
.site-footer a,
.dyb-footer,
.dyb-footer p,
.dyb-footer a{
  color:#1f1f1f;
}

.dyb-footer-title{
  color:#111 !important;
}

.site-footer a:hover,
.dyb-footer a:hover{
  color:#063b8f;
}

/* ---------------------------------------------------------
   4) Elementor headings baseline
   --------------------------------------------------------- */
.elementor-heading-title{
  color:#111;
}

/* ---------------------------------------------------------
   5) Home image cards: use ONE system (title pill)
   NOTE: Removed conflicting overlay gradients. We keep overlay NONE
         and make title always readable via dark pill.
   --------------------------------------------------------- */
.dyb-home-cards__overlay{
  background: none !important;
}

.dyb-home-cards__title{
  background: rgba(0,0,0,.68) !important;
  color:#fff !important;
  padding: 10px 14px !important;
  border-radius: 10px !important;
  display: inline-block !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.65);
}

/* ---------------------------------------------------------
   6) Focus visibility
   --------------------------------------------------------- */
:focus-visible{
  outline: 2px solid #0b57d0;
  outline-offset: 2px;
}

/* ---------------------------------------------------------
   7) Header nav: force readable link color (parent adds grey)
   --------------------------------------------------------- */
.navbar .nav-link,
.navbar-nav .nav-link,
.navbar a.nav-link,
header .navbar a,
header .navbar-nav a{
  color:#111 !important;
  opacity:1 !important;
}

.dropdown-menu .dropdown-item{
  color:#111 !important;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus{
  color:#000 !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ---------------------------------------------------------
   8) Testimonials: star rating + titles
   --------------------------------------------------------- */
.elementor-star-rating__title,
.elementor-screen-only,
.elementor-star-rating-wrapper,
.elementor-star-rating{
  color:#111 !important;
  opacity:1 !important;
}

/* Stars: darker gold */
.elementor-star-rating i{
  color:#8a4f00 !important;
  opacity:1 !important;
}

/* Woo star rating pseudo-elements too */
.star-rating span:before,
.star-rating:before{
  color:#b07800;
}

/* ---------------------------------------------------------
   9) Kill leftover forced light grey inline styles
   --------------------------------------------------------- */
[style*="color: rgb(119, 119, 119)"],
[style*="color: rgb(153, 153, 153)"],
[style*="color:#777"],
[style*="color: #777"],
[style*="color:#999"],
[style*="color: #999"]{
  color:#111 !important;
  opacity:1 !important;
}

/* ---------------------------------------------------------
   10) Slider / product card text contrast (titles + prices)
   --------------------------------------------------------- */
.woocommerce-loop-product__title a,
h3.woocommerce-loop-product__title a,
.woocommerce-loop-product__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product a,
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .price span{
  color:#111 !important;
  opacity:1 !important;
}

.swiper .woocommerce-loop-product__title a,
.swiper .price,
.elementor-swiper .woocommerce-loop-product__title a,
.elementor-swiper .price{
  color:#111 !important;
  opacity:1 !important;
}

/* ---------------------------------------------------------
   11) A11Y utility: visually hidden but accessible
   --------------------------------------------------------- */
.dyb-sr-only{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* =========================================================
   12) WAVE: "Very small text" (<=10px)
   IMPORTANT: This is often caused by pseudo-elements and controls.
   We fix BOTH normal nodes and ::before/::after cases.
   ========================================================= */

/* Woo product cards: star rating is tiny in Zoli */
body ul.products li.product .star-rating,
body .woocommerce ul.products li.product .star-rating{
  font-size: 12px !important;
  line-height: 1.2 !important;
}

/* Star rating pseudo content (common culprit for WAVE) */
body .star-rating::before,
body .star-rating span::before{
  font-size: 12px !important;
  line-height: 1.2 !important;
}

/* Sale badge (.onsale) */
body .woocommerce span.onsale,
body span.onsale{
  font-size: 12px !important;
  line-height: 1.2 !important;
}

/* Opal/Elementor nav menu badges/descriptions */
body .opalelementor-nav-menu .menu-badge,
body .elementor-nav-menu .menu-badge,
body .elementor-nav-menu .menu-desc{
  font-size: 12px !important;
  line-height: 1.2 !important;
}

/* Submenu arrow indicator (often via pseudo-elements) */
body .opalelementor-nav-menu .sub-arrow,
body .opalelementor-nav-menu .sub-arrow::before{
  font-size: 12px !important;
  line-height: 1.2 !important;
}

/* Header cart count bubble / label */
body .elementor-widget-opal-cart .header-button .count,
body .elementor-widget-opal-cart .header-button .count-text{
  font-size: 12px !important;
  line-height: 1.2 !important;
}

/* Navigation micro-text (rare) */
body .post-navigation .meta-nav{
  font-size: 12px !important;
  line-height: 1.2 !important;
}

/* Tooltips (if present) */
body .tooltipster-sidetip div.opal-image-hotspots-tooltips-text .star-rating{
  font-size: 12px !important;
  line-height: 1.2 !important;
}

/* Icon next chevron */
body .zoli-read-more-link .lexus-icon-Icon_Next{
  font-size: 12px !important;
  line-height: 1.2 !important;
}

/* Slider pagination dots/bullets (VERY common WAVE culprit) */
body .slick-dots li button,
body .slick-dots li button::before,
body .slick-dots li button::after,
body .swiper-pagination-bullet,
body .swiper-pagination-bullet::before,
body .swiper-pagination-bullet::after{
  font-size: 12px !important;
}

/* Make dots physically readable/clickable too */
body .slick-dots li button,
body .swiper-pagination-bullet{
  width: 12px !important;
  height: 12px !important;
}
/* ---------------------------------------------------------
   13) WAVE: "Very small text" — wishlist/favorite helper text
   The theme renders "Ajouter aux favoris" at ~10px.
   Make it readable without changing behavior.
   --------------------------------------------------------- */
.wpopal-button-actions a span,
.wpopal-button-actions .hint--top > span{
  font-size: 12px !important;
  line-height: 1.2 !important;
}












/* A11Y — YITH Wishlist: hide the tiny "Ajouter aux favoris" text, keep screen-reader access */
.yith-wcwl-add-to-wishlist .add_to_wishlist span{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}



/* A11Y — keep label for screen readers, hide visually */
.yith-wcwl-add-to-wishlist a.add_to_wishlist > span{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}



/* =========================================================
   A11Y — Woo archive controls contrast (Shop/category)
   Target: /fr/les-patrons-de-couture/ and Woo archives
   Fixes: WAVE very low contrast on select/toolbar/pagination
   ========================================================= */

/* 1) Sorting select */
.woocommerce-ordering select.orderby{
  color: #111 !important;
  border-color: #111 !important;
}

/* 2) “Show 9/12/18/24” + view mode toolbar links */
.woo-display-mode a,
.woo-display-mode a span,
.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering,
.woocommerce .woocommerce-ordering *{
  color: #111 !important;
}

/* 3) Pagination links */
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{
  color: #111 !important;
}

/* 4) Clear focus visibility (keyboard) */
.woocommerce-ordering select.orderby:focus,
.woo-display-mode a:focus,
.woocommerce nav.woocommerce-pagination a:focus{
  outline: 2px solid #111 !important;
  outline-offset: 2px;
}






/* =========================================================
   A11Y — Readability: disable long justified paragraphs
   Fixes WAVE "Justified text" alerts on archive intro text
   ========================================================= */

/* Most robust: cancel justify on Woo archives and common content areas */
.woocommerce.archive p[style*="text-align: justify"],
.woocommerce-page.archive p[style*="text-align: justify"],
.woocommerce.archive .page-content p,
.woocommerce-page.archive .page-content p{
  text-align: left !important;
  text-align-last: auto !important;
  hyphens: auto;
}






/* WP a11y utility */
.screen-reader-text{
  position:absolute !important;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0);
  white-space:nowrap; border:0;
}


.screen-reader-text{
  position:absolute !important;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0);
  white-space:nowrap; border:0;
}



.dyb-gc-fieldset{
  border: 0;
  padding: 0;
  margin: 0;
  min-width: 0;
}
.dyb-gc-legend{
  padding: 0;
  margin: 0 0 6px;
  font-weight: 600;
}









/* =========================================================
   A11Y — Blog cards: category tag contrast (WAVE "very low contrast")
   Target: category/archive grids (.meta-post-categories a[rel="category tag"])
   ========================================================= */

.meta-post-categories a[rel="category tag"],
.entry-block .meta-post-categories a,
.post-grid .meta-post-categories a{
  color: #1f1f1f !important;          /* dark text */
  opacity: 1 !important;             /* neutralize theme opacity */
  text-decoration: none;
}

.meta-post-categories a[rel="category tag"]:hover,
.meta-post-categories a[rel="category tag"]:focus{
  text-decoration: underline;
}



/* DYB: do NOT break Woo layouts */
body.woocommerce-account .woocommerce-MyAccount-navigation a{
  white-space: nowrap !important;
  word-break: normal !important;
  writing-mode: horizontal-tb !important;
  transform: none !important;
}