/*
 Theme Name: Twenty Twenty-Five Child
 Template: twentytwentyfive
 Author: Alex
 Version: 1.1
*/

/* Parent theme styles are loaded by the parent theme itself (no @import) */
/* #region VARIABLES: colors... */
:root {
  /* Rounded borders */
  --my-border-radius: 10px;
  /* Colors */
  --my-orange: #ff9002;
  --my-dark-blue: #1b2d3d;
  --my-blue: #3c6487;
  --my-black: #111111;
  --my-dark-grey: #777777;
  --my-light-grey: #f2efea;
  --my-greenish-grey: #c6ceb4;
  --my-dark-cyan: #5c9f9e;
  --my-cyan: #16b7cc;
  --my-light-cyan: #7fd3cc;
  --my-yellow: #ffd400;
}
/* #endregion */

/* #region ADAPTATIVE DESIGN */

/* Override default WordPress Twenty Twenty-Five breakpoints for mobile burger navigation menu (theme default is 600px).
Always use this threshold in custom CSS (sometimes needs to be min-width: 768px).
Should also be overridden in Smart Slider settings */
/* Mobile */
@media screen and (max-width: 767px) {
  /* show burger button */
  .wp-block-navigation__responsive-container-open {
    display: block !important;
  }
  /* hide full desktop menu */
  .wp-block-navigation__responsive-container:not(.is-menu-open.has-modal-open) {
    display: none !important;
  }
}

/* Custom classes to hide elements on mobile or desktop.
Juste use the classes on some elements to hide them responsively. */
/* Mobile */
@media screen and (max-width: 767px) {
  .my-hide-on-mobile {
    display: none !important;
  }
}
/* Desktop */
@media screen and (min-width: 768px) {
  .my-hide-on-desktop {
    display: none !important;
  }
}
/* #endregion */

/* #region MESSAGE d'ABSENCE MULTILINGUE (pour "Nous sommes en vacances"...) */
/* Message d'absence à écrire et activer/désactiver globalement dans https://le-chouka.com/customize.php => Personnalisation => WooCommerce => Notification de la boutique.
L'affichage par langue est géré par du CSS mais avec functions.php (et les classes my-fr-language, my-en-language...) */
p.woocommerce-store-notice {
  position: fixed !important; /* pour la fixer en bas */
  top: auto !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  margin: 0 !important;
  z-index: 9999; /* Pour passer par-dessus les autres éléments */
  width: 100%;
  box-sizing: border-box;
  padding: 0.8rem 1rem !important;
  background-color: var(--my-cyan);
  color: white;
  font-size: 1.3rem;
  font-weight: bold;
  line-height: 1.3;
  text-align: center;
}
@media screen and (max-width: 767px) {
  p.woocommerce-store-notice {
    font-size: 1.1rem;
  }
}
a.woocommerce-store-notice__dismiss-link {
  color: var(--my-dark-blue) !important;
  font-weight: bold;
}
/* The bottom of the page is kept clear of the notice by a padding of its height (functions.php) */
/* #endregion */

/* #region GLOBAL DEFAULTS: p, titles, tables, images, buttons, etc. */

/* Caveat is installed in the Font Library (Appearance > Editor > Typography, files in uploads/fonts):
only weight 700 exists (Caveat goes up to 700), so 900 below renders as 700 */

/* Headings & paragraph spacing adjustments */
p {
  margin-top: 0 !important;
  margin-bottom: 0.5rem !important;
}

/* All titles */
html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6,
html body .entry-title,
html body .product_title,
html body .woocommerce-loop-product__title {
  font-family: 'Caveat', cursive, sans-serif !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

/* Titles (override because sometimes what is configured in appearance UI is overriden by some plugins/themes */

/* H1 : 3.2rem - Extra gras (900) */
html body h1,
html body h1.wp-block-heading,
html body .entry-title,
html body .product_title {
  font-size: 3.2rem !important;
  font-weight: 900 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* H2 : 3rem - Extra gras (900) */
html body h2,
html body h2.wp-block-heading {
  font-size: 3rem !important;
  font-weight: 900 !important;
  margin-top: 0.8rem !important;
  margin-bottom: 0.5rem !important;
}

/* H3 : 2.2rem - Extra gras (900) */
html body h3,
html body h3.wp-block-heading {
  font-size: 2.2rem !important;
  font-weight: 900 !important;
  margin-top: 0.7rem !important;
  margin-bottom: 0.4rem !important;
}

/* H4 : 2rem - Extra gras (900) */
html body h4,
html body h4.wp-block-heading {
  font-size: 2rem !important;
  font-weight: 900 !important;
  margin-top: 0.4rem !important;
  margin-bottom: 0.2rem !important;
}

/* H5 : 1.8rem - Gras (700) */
html body h5,
html body h5.wp-block-heading {
  font-size: 1.8rem !important;
  font-weight: 700 !important;
}

/* H6 : 1.7rem - Gras (700) */
html body h6,
html body h6.wp-block-heading {
  font-size: 1.7rem !important;
  font-weight: 700 !important;
}

/* Use this class on some titles to remove top margin */
.my-title-with-no-top-margin {
  margin-top: 0 !important;
}

/* Default bullet points lists */
ul,
ol {
  margin-top: 0 !important;
  margin-bottom: 0.5rem !important;
}

/* Custom Chouka icon bullet points */
ul.my-chouka-bullet {
  list-style: none; /* Remove default bullets */
  padding-left: 1.7rem; /* Create space for the icon */
  margin: 0;
}
ul.my-chouka-bullet li {
  position: relative;
  margin-bottom: 0.4rem; /* Space between list items */
}
ul.my-chouka-bullet li::before {
  content: '';
  position: absolute;
  left: -1.7rem;
  top: 0;
  width: 20px; /* Display size of your bullet */
  height: 20px;
  background-image: url('/wp-content/uploads/logo-chouka-seul-noir.svg');
  background-size: contain; /* Keep the aspect ratio */
  background-repeat: no-repeat;
  background-position: center;
}

/* Tables: borders */
.entry-content table {
  border-collapse: collapse;
  border: 1px solid #cccccc; /* bordure légère grise */
  margin-bottom: 0.75rem;
}
.entry-content th,
.entry-content td {
  border: 1px solid #cccccc; /* même style à l’intérieur */
  padding: 0.3rem;
}
.entry-content th {
  filter: brightness(0.95); /* darkens 5% from current bg */
}

/* Subtle click effect on links except for images */
a:active:not(:has(img)) {
  filter: brightness(0.8);
}

/* Remove outline on links click (but keep outline when using keyboard TAB key */
a:focus:not(:focus-visible) {
  outline: none !important;
}

/* Default buttons */
.my-button,
.wp-element-button,
.wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background-color: var(--my-orange);
  color: var(--my-light-grey);
  border-radius: var(--my-border-radius) !important;
  padding-left: 1rem !important;
  padding-right: 1rem !important;
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
  min-height: 44px !important;
}

/* Default images */
img {
  border-radius: var(--my-border-radius);
  object-fit: contain !important; /* Do not crop or stretch images */
}
/* #endregion */

/* #region SMART SLIDER */
/* Buttons rounded */
.n2-ss-button-container a {
  border-radius: var(--my-border-radius) !important;
}

/* Overlay layers rounded */
div.n2-ss-layer-with-background {
  border-radius: var(--my-border-radius) !important;
}
/* #endregion */

/* #region HEADER - LAYOUT */
/* Flex (grow/shrink) spacers in header should not have too much size by default */
@media (max-width: 1000px) {
  header .wp-block-spacer {
    flex-basis: 10px !important;
  }
}

/* Rotate Made in France logo */
header .header-logo-mif img {
  transform: rotate(-25deg);
}
/* #endregion */

/* #region HEADER - NAV MENU */
/* Center nav menu */
ul.wp-block-navigation__container {
  margin: 0 !important;
}

/* Menu links */
li.wp-block-navigation-link a {
  text-decoration: none;
  transition: color 0.2s ease; /* smooth transition */
}

/* Change color on menu link hover */
li.wp-block-navigation-link a:hover {
  color: var(--my-orange) !important;
}

/* Highlight current menu item */
li.current-menu-item a {
  color: var(--my-orange) !important;
}

/* On desktop: align center and for word break when too long */
@media (min-width: 768px) {
  .wp-block-navigation-item__label {
    text-align: center;
  }
}
/* #endregion */

/* #region HEADER - NAV MENU BURGER */
/* Remove white outline on burger menu open/close button and links when clicked */
.wp-block-navigation__responsive-container-open:focus,
.wp-block-navigation__responsive-container-close:focus,
.wp-block-navigation a:focus,
.wp-block-navigation__container a:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* Change burger menu panel background and size */
.wp-block-navigation__responsive-container.is-menu-open {
  background-color: var(--my-blue) !important; /* background color */
  color: var(--my-light-grey) !important; /* text color */
  width: auto !important; /* panel width */
  max-width: 400px !important; /* optional max width */
  height: auto !important; /* let height adjust to content */
  top: 50px !important; /* margin from top */
  right: auto !important; /* disable full-width */
  bottom: auto !important; /* disable full-height */
  border-radius: var(--my-border-radius) !important; /* rounded corners */
  overflow: visible !important; /* adjust overflow if needed */
  transform: none !important; /* remove full-screen slide transform */
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
  margin: 10px !important;
}
/* Burger menu links font size */
.wp-block-navigation__responsive-container.is-menu-open a {
  font-size: 1.5rem !important;
}
/* Align menu items to the left */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content ul {
  align-items: flex-start !important;
  justify-content: flex-start !important;
}
.wp-block-navigation__responsive-container.is-menu-open button svg {
  height: 38px !important;
  width: 38px !important;
}

/* Additional items in mobile menu are not in evidence (we want to highlight links to shops) */
.wp-block-navigation__responsive-container.is-menu-open li:not(.my-menu-link-only-on-mobile) {
  font-weight: bold !important;
}
/* #endregion */


/* #region HEADER - LANGUAGE & CURRENCY SELECTOR */

/* Language flags rounded corners */
img.wpml-ls-flag {
  border-radius: var(--my-border-radius) !important;
}

/* Mobile language selector */
@media (max-width: 767px) {
  .wpml-language-switcher-block {
    max-width: 70px !important; /* otherwise it expands as much as it can */
  }

  /* Hide label only for the currently selected language but keep label in dropdown */
  .wpml-language-switcher-block .wp-block-navigation-item__label {
    display: none !important;
  }
  
  /* Remove background color aggressively */
  .wpml-language-switcher-block ul.wp-block-navigation__submenu-container.isHorizontal li[data-wpml="language-item"] {
    background-color: transparent !important;
    background: transparent !important;
    border: none !important;
  }
  .wpml-language-switcher-block ul.wp-block-navigation__submenu-container.isHorizontal li[data-wpml="language-item"] > div {
    background-color: transparent !important;
    background: transparent !important;
  }
}

/* Currency selector styling */
.wcml_currency_switcher,
.wcml_currency_switcher li.wcml-cs-active-currency {
  background-color: transparent !important  ;
  display: inline-block; /* shrink to content width */
  width: auto !important;
  border: none !important;
}
.wcml_currency_switcher li a {
  color: var(--my-light-grey) !important;
  white-space: nowrap; /* prevent line break */
}

/* Language & currency dropdown items */
.wpml-ls-dropdown .wp-block-navigation__submenu-container > li,
.wcml_currency_switcher li:not(.wcml-cs-active-currency) {
  background-color: var(--my-blue) !important  ;
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding-top: 2px !important;
  padding-bottom: 2px !important;
  min-height: 40px !important;
  border: 1px solid var(--my-light-grey);
}
/* Padding around language dropdown items (on desktop only) */
@media (min-width: 768px) {
    .wpml-ls-dropdown .wp-block-navigation__submenu-container > li {
      padding-left: 6px !important;
      padding-right: 6px !important;
    }
}
/* Remove top border from all but first language dropdown item */
.wpml-ls-dropdown .wp-block-navigation__submenu-container > li:not(:first-child) {
  border-top: none;
}

/* Align language and currency selectors the same way + use the same arrows v */
.current-language-item,
.wcml_currency_switcher a.wcml-cs-item-toggle {
  display: inline-flex !important;
  align-items: center !important;
  vertical-align: middle !important;
  text-decoration: none !important;
  position: relative !important;
  /* Same padding on the right for the arrow v */
  padding-right: 14px !important; 
}
/* Remove all default arrows v */
.wpml-language-switcher-block .wp-block-navigation__submenu-icon,
.wpml-language-switcher-block svg {
  display: none !important;
}
/* Same arrow v for both language and currency selectors */
.current-language-item::after,
.wcml_currency_switcher a.wcml-cs-item-toggle::after {
  content: '' !important;
  position: absolute !important;
  right: 0 !important; /* Fixe la flèche sur le bord droit */
  top: 45% !important; /* Centre verticalement par rapport au texte */
  transform: translateY(-50%) rotate(45deg) !important;
  width: 5px !important;
  height: 5px !important;
  border: solid currentColor !important;
  border-width: 0 1.5px 1.5px 0 !important; /* Épaisseur du trait */
  opacity: 0.8 !important;
}
/* Adjust padding on mobile because lable is hidden */
@media (max-width: 767px) {
  .wpml-language-switcher-block .current-language-item {
    padding-right: 12px !important;
  }
}
/* #endregion */



/* #region FOOTER */
footer p.wp-block-site-tagline {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
/* #endregion */

/* #region PRODUCTS LISTS - LAYOUT */
/* Align all items (product img, title, price, add to cart) */
ul.wp-block-woocommerce-products {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  align-items: stretch; /* This makes all items in each row stretch to match the tallest item in that row */
}
li.wc-block-product {
  display: flex;
  flex-direction: column;
  height: 100%; /* fills its own grid cell */
}

/* Push add-to-cart button to bottom of each product card */
li.wc-block-product .wp-block-woocommerce-product-button {
  margin-top: auto;
}
/* Spacing around product image */
.wp-block-woocommerce-product-image {
  margin-bottom: 6px;
}
/* Spacing around product title */
li.wc-block-product .wp-block-post-title {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
/* Spacing around product price */
li.wc-block-product .wp-block-woocommerce-product-price {
  margin-top: auto !important; /* push price to bottom, just above button */
  margin-bottom: 0 !important;
  padding-top: 0.1rem;
  display: flex;
  align-items: flex-end; /* align price text at bottom of its container */
  justify-content: center; /* center price horizontally */
}
li.wc-block-product .wc-block-components-product-price {
  margin: 0 !important;
  margin-bottom: 0.1rem !important;
}
/* #endregion */

/* #region PRODUCTS LISTS - PRODUCT TITLE */
/* Product titles in lists default styling for all */
li.wc-block-product h2.wp-block-post-title a,   /* On products lists manually added in pages content */
li.wc-block-product h3.wp-block-post-title a,   /* Just in case... */
li.wc-block-product h4.wp-block-post-title a,   /* On products lists such as related products, up-sells, cross-sells */ 
.wc-block-grid__product-title,                  /* On cart page (when cart is empty) */
.my-grid-product-title-small,                   /* custom class */
.my-grid-product-title-big                      /* custom class */ {
  color: black !important;
  font-family: 'InterVariable', 'Inter', sans-serif !important;
  font-weight: bold !important;
  text-decoration: none !important;
  transition: color 0.2s ease; /* smooth transition */
}

/* Font sizes for product titles in lists */
.my-grid-product-title-big a {
  font-size: 1.3rem !important;
}

.my-grid-product-title-small a {
  font-size: 1rem !important;
}

/* Product title: change color on hover */
li.wc-block-product .wp-block-post-title a:hover,
.my-grid-product-title-big a,
.my-grid-product-title-small a {
  color: var(--my-orange) !important;
}

/* Product title: also change title color when hovering over product image */
li.wc-block-product .wc-block-components-product-image:hover ~ .wp-block-post-title a {
  color: var(--my-orange) !important;
}
/* #endregion */

/* #region PRODUCTS LISTS - PRODUCT PRICE, IMG, rating */

/* Product price (including From... text) */
li.wc-block-product .wc-block-components-product-price {
  font-size: 1rem !important;
  color: var(--my-dark-grey);
}

/* Product price amount + currency */
li.wc-block-product .wc-block-components-product-price .woocommerce-Price-amount {
  color: var(--my-orange) !important;
  font-weight: bold;
}

/* Product rating stars */
li.wc-block-product .wp-block-woocommerce-product-rating {
  margin: 0 !important;
}

span.rating {
  color: var(--my-blue) !important;
}

/* Product price small */
.my-grid-product-price-small .woocommerce-Price-amount {
  font-size: 1rem !important;
}
/* Product price big */
.my-grid-product-price-big .woocommerce-Price-amount {
  font-size: 1.5rem !important;
}

/* Product image (in products lists) */
.wp-block-woocommerce-product-image img {
  border-radius: var(--my-border-radius) !important;
}
/* #endregion */

/* #region PRODUCT PAGE - LAYOUT */

/* Réduit l'espace sous la galerie d'images produit WooCommerce */
div.product .wp-block-columns.is-layout-flex {
  row-gap: 0 !important; /* supprime l'espacement entre les colonnes */
}
div.wp-block-woocommerce-product-image-gallery div.woocommerce-product-gallery {
  margin-bottom: 0 !important;
}

/* Hide "vous aimerez peut-petre aussi" section (up-sell products) */
section.up-sells.upsells.products {
  display: none !important;
}

/* Hide related product prices on variable product pages (because it shows wrongly due to some unfixable bug...) */
.single-product.product-type-variable 
.wp-block-woocommerce-product-collection[data-collection="woocommerce/product-collection/related"]
.wp-block-woocommerce-product-price {
    display: none !important;
}
/* #endregion */

/* #region PRODUCT PAGE - GALLERY & TABS */
/* No zoom on product images (zoom is also disabled in functions.php) */
.woocommerce-product-gallery__image img {
  cursor: default !important;
}
.woocommerce-product-gallery__image:hover img {
  transform: none !important;
}
.zoomImg {
  display: none !important;
}

/* Always show all tab panels one below the other (tab links scroll to them, see functions.php) */
.woocommerce div.product .woocommerce-tabs .panel {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  height: auto !important;
}
.woocommerce div.product .woocommerce-tabs .panel + .panel {
  margin-top: 2em;
}
/* #endregion */

/* #region PRODUCT PAGE - PRICE, VARIATION & QUANTITY SELECTORS */

/* Product price */
/* note: price_on_product_page is a custom class added on the price block of the product page */
.price_on_product_page bdi {
  font-weight: bold !important;
  color: var(--my-orange);
  font-size: 1.4rem !important;
}

/* Hide variation description */
div.woocommerce-variation.single_variation {
  display: none !important;
}

/* Variation selector */
table.variations tr {
  display: flex;
  flex-direction: column; /* place le label au-dessus du select */
  align-items: flex-start;
  margin-bottom: 0.75rem; /* espace entre chaque groupe */
}
table.variations th.label {
  width: 100%; /* prend toute la largeur */
  margin-bottom: 0 !important;
  padding: 0 !important;
  font-weight: bold;
  background: transparent;
}
table.variations td.value {
  margin-top: 0 !important;
  padding: 0 !important;
  width: 100%;
  border: none !important;
}
table.variations td.value select {
  max-width: 400px;
  min-width: 200px !important;
  padding-right: 30px !important;
  background-color: hsl(0, 0%, 105%) !important;
  border: none !important;
  font-size: 1rem !important;
  font-weight: bold;
  padding: 8px !important;
  height: auto !important;
  border-radius: var(--my-border-radius);
  box-sizing: border-box;
}

table.variations td.value select:focus {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Quantity input */
.woocommerce div.product .quantity input.qty {
  border: none !important;
  font-size: 20px;
  font-weight: bold;
  padding: 6px 6px;
  background-color: hsl(0, 0%, 105%) !important;
  border-radius: var(--my-border-radius);
}

/* Tabs links */
ul.tabs.wc-tabs li {
  font-size: 1.5rem !important;
  font-family: 'caveat', sans-serif !important;
  padding: 0px !important;
}
ul.tabs.wc-tabs li:hover {
  color: var(--my-orange) !important;
}
/* #endregion */

/* #region PRODUCT PAGE - REVIEWS */
#reviews .cr-ajax-search {
  display: none !important;
}
#reviews .cr-count-row {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
#reviews .commentlist {
  padding-bottom: 0 !important;
}
#reviews .cr-ajax-reviews-wpml-switch a {
  color: var(--my-orange) !important;
}
#reviews * {
  background-color: transparent !important  ;
}
/* #endregion */

/* #region HOMEPAGE */
/* Desktop overlaying header over content (over homepage slideshow) */
@media (min-width: 768px) {
  /* on desktop only */
  .my-overlaying-group {
    position: relative;
  }

  .my-overlaying-group .my-overlaying-content {
    position: relative;
    z-index: 1;
  }

  .my-overlaying-group .my-overlaying-header {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    opacity: 0.7;
    width: 100%;
  }
}

/* No gap between the header (free shipping banner) and the slideshow: on mobile the header is not overlaying,
so the bottom margin of the banner paragraph (global "p" rule) showed as a white strip above the slideshow */
.my-overlaying-group .my-overlaying-header p.has-background {
  margin-bottom: 0 !important;
}
.my-overlaying-group > .my-overlaying-content {
  margin-block-start: 0 !important;
}

/* Shop links... */
/* Adjust grid display */
.my-homepage-shop-links-container {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); /* each column max 1fr (“fraction of available space”), min 250px */
  justify-content: center; /* center items if row not full */
  gap: 20px;
  padding-left: var(--wp--preset--spacing--20);
  padding-right: var(--wp--preset--spacing--20);
}

/* button full width & special border */
.my-homepage-shop-links-container .wp-block-buttons {
  width: 100% !important;
  border-radius: var(--my-border-radius) var(--my-border-radius) 0 0 !important;
}
.my-homepage-shop-links-container .wp-block-button {
  width: 100% !important;
  border-radius: var(--my-border-radius) var(--my-border-radius) 0 0 !important;
}
.my-homepage-shop-links-container .wp-block-button a {
  width: 100% !important;
  padding: 2px !important;
  border-radius: var(--my-border-radius) var(--my-border-radius) 0 0 !important;
}
.my-homepage-shop-links-container > .wp-block-group:empty {
  display: none !important;
}
.my-homepage-shop-links-container > .wp-block-group {
  max-width: 400px !important;
  width: 100% !important;
  margin-left: auto;
  margin-right: auto;
}
/* images */
.my-homepage-shop-links-miniature-image {
  margin-top: 0 !important;
}
.my-homepage-shop-links-miniature-image img {
  border-radius: 0 0 var(--my-border-radius) var(--my-border-radius) !important;
}
/* text below */
.my-homepage-shop-links-container p {
  width: 100% !important;
}

.my-button-on-top {
  z-index: 9 !important;
}
/* #endregion */

/* #region CART */
/* Miniature image in cart */
td.wc-block-cart-item__image img {
  border-radius: var(--my-border-radius) !important;
}
/* #endregion */

/* #region CHECKOUT PAGE */
p#wc-guest-checkout-notice {
  display: none !important;
}

/* #endregion */

/* #region ORDER CONFIRMATION PAGE */
/* Change style of bank owner name otherwise it is displayed as an h3 title */
.wc-bacs-bank-details-account-name {
  font-family: 'InterVariable', 'Inter', sans-serif !important;
  font-size: medium !important;
  color: var(--my-black) !important;
}

/* Add background color, padding and rounded corners to bank details box */
.woocommerce-bacs-bank-details {
  background-color: var(--my-light-cyan) !important;
  border-radius: var(--my-border-radius) !important;
  padding: 0 20px 10px 20px !important;
}
/* #endregion */