/*
Theme Name: Hello Biz Child
Theme URI: https://github.com/elementor/hello-biz-child/
Description: Hello Biz Child is a child theme of Hello Biz, created by Elementor team
Author: Elementor Team
Template: hello-biz
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Version: 1.0.3
Stable tag: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: hello-biz-child
Tags: flexible-header, custom-colors, custom-menu, custom-logo, featured-images, rtl-language-support, threaded-comments, translation-ready, style-variations
*/

/* Add your custom styles here */

.woocommerce button.button.alt,
.woocommerce a.button, 
.woocommerce button.button {
    background-color: #000000; /* Replace with your desired color hex code */
}

.woocommerce button.button.alt,
.woocommerce a.button:hover,
.woocommerce button.button:hover {
    background-color: #cc0000; /* Optional: Hover background color */
}

.alignwide {
    margin-inline: 0 !important;
}

/* -------------------------
   Variation circle swatches
   ------------------------- */

.variations .value { position: relative; } /* keep layout */

.variation-swatches {
  display: flex;
  gap: 10px;
  margin: 8px 0 0 0;
  flex-wrap: wrap;
  align-items: center;
  position: relative;
  z-index: 50; /* ensure swatches sit above other elements */
}

.variation-swatch {
  min-width: 35px;
  height: 35px;
  border-radius: 50%;
  border: 1px solid #000;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  background: #fff;
  color: #000;
  cursor: pointer;
  font-weight: 400;
  font-size: 12px;
  line-height: 1;
  user-select: none;
  transition: background .12s ease, color .12s ease, transform .06s ease;
  z-index: 51;
}

.variation-swatch:hover {
  background: #000;
  color: #fff;
  transform: translateY(-2px);
}

.variation-swatch.selected {
  background: #000;
  color: #fff;
}

.variation-swatch.disabled {
  opacity: 0.45;
  cursor: not-allowed;
  transform: none;
  pointer-events: none;
}

/* small screens fallback */
@media (max-width:420px){
  .variation-swatch { min-width: 36px; height: 36px; font-size: 13px; }
}

/* Hide native select but keep it in DOM for form submission - and prevent it from stealing pointer events */
.variations .value select {
  position: absolute !important;
  left: -9999px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important; /* prevents the select from blocking mouse events */
}
/* --- Variation row layout: label at row start, swatches vertically centered --- */
.woocommerce div.product form.cart .variations th,
.woocommerce div.product form.cart .variations td {
  border: 0;
  line-height: normal !important;   /* remove earlier tiny line-height */
  vertical-align: middle;
  padding: 10px 8px;               /* adjust spacing as needed */
  text-align: left;
}

/* Make the label column shrink to its content so swatches are closer */
.woocommerce div.product form.cart .variations th.label {
  white-space: nowrap;
  width: 1%;         /* lets column size to label content */
  padding-right: 12px;
}

/* Value cell: keep content aligned center vertically, small left padding */
.woocommerce div.product form.cart .variations td.value {
  padding-left: 8px;
  vertical-align: middle;
}

/* Ensure swatches are inline, centered vertically and not too far from label */
.variations td.value > .variation-swatches {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0;
}

/* Reset link sits right after swatches */
.variations td.value .reset_variations {
  margin-left: 14px;
  vertical-align: middle;
  display: inline-block;
}

/* Optional: smaller swatches / tighter gap on small screens */
@media (max-width: 600px) {
  .woocommerce div.product form.cart .variations th.label,
  .woocommerce div.product form.cart .variations td.value {
    display: block;
    width: 100%;
  }
  .variations td.value { margin-top: 6px; }
  .variations td.value > .variation-swatches { gap: 8px; }
}

/* Remove background for every row in the variations table */
.woocommerce div.product form.cart .variations td,
.woocommerce div.product form.cart .variations th {
  background: transparent !important;
}

.woocommerce-message, .woocommerce-info
 {  border-top-color: #000000 !important;}
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button
{color: #ffffff !important;}

.woocommerce-message::before, .woocommerce-info::before {color: #000000 !important;}
.woocommerce a.button:hover, .woocommerce button.button {
    background-color:#000000 !important;
    color: #ffffff !important;
}

a.wc-block-components-product-name, .woocommerce-info a, .woocommerce-terms-and-conditions-wrapper a {color:#000000 !important;}

#add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment {
    background: rgba(175, 122, 42, .20) !important;
    border-radius: 5px;
}

#add_payment_method #payment div.payment_box, .woocommerce-cart #payment div.payment_box, .woocommerce-checkout #payment div.payment_box  {
    background-color: #f3db75 !important;
}

.woocommerce-checkout #payment div.payment_box::before {
    content: "";
    display: block;
    border: 1em solid #f3db75;
    border-right-color: transparent;
    border-left-color: transparent;
    border-top-color: transparent;
    position: absolute;
    top: -.75em;
    left: 0;
    margin: -1em 0 0 2em;
}

a {
    background-color: transparent;
    color: #000;
}