/*
 Theme Name:   Shoptimizer Child
 Theme URI:    https://www.commercegurus.com/
 Description:  Shoptimizer Child Theme
 Author:       CommerceGurus
 Author URI:   https://www.commercegurus.com
 Template:     shoptimizer
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  shoptimizer-child
*/

/* --- WooCommerce Product Search Field --- */
.woocommerce-product-search .search-field {
  background-color: #FFFFFF;
  color: #6C757D;
  border: 1px solid #DEE2E6; /* ✅ Aligned with brand palette border color */
  border-radius: 4px;
  box-shadow: rgba(17, 17, 26, 0.1) 0px 0px 16px;
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.woocommerce-product-search .search-field:focus {
  color: #1A1A1A;
  border-color: #5BC5F2; /* ✅ Aligned with brand palette secondary/link color */
  box-shadow: 0 0 8px 1px rgba(91, 197, 242, 0.6);
  outline: none;
}

/* --- Shared Payment Logos --- */
.payment-logos {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: center; /* ✅ Unified to center alignment */
  margin: 8px 0 0;
}

.payment-logos .pay-logo {
  height: clamp(22px, 2.2vw, 28px); /* ✅ Fluid height with a max of 28px */
  width: auto;
  object-fit: contain;
  transition: transform 0.25s ease, filter 0.25s ease;
}

.payment-logos .pay-logo:hover {
  transform: scale(1.06);
  filter: brightness(1.05);
}

/* --- Footer Contact Info --- */
.footer-contact-info {
  font-size: 0.94em; /* ✅ Aligned with typescale (16px) */
  color: #FFFFFF;
}

.footer-contact-info .contact-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-contact-info .contact-list-item {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 10px 0;
}

.footer-contact-info svg {
  flex-shrink: 0;
}

.footer-contact-info a {
  color: inherit; /* ✅ Inherits color from parent for easier maintenance */
  text-decoration: none;
}

.contact-separator {
  border: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.3);
  margin: 8px 0;
}

/* --- Product Categories Link on Archives --- */
p.product__categories {
  font-size: 14px; /* ✅ Aligned with typescale "Meta Info" */
  color: #1A1A1A; /* ✅ Corrected syntax */
}


/* ==========================================================================
   2. Comprehensive WooCommerce Styles (Aligned with Design System)
   ========================================================================== */


/* --- Sale Badges --- */
.woocommerce span.onsale {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 0.7em; /* ✅ Aligned with typescale (12px) */
  text-transform: uppercase;
  background-color: #FFB703;
  color: #1A1A1A;
  border-radius: 20px;
  min-height: 0;
  line-height: 2.5;
  padding: 0 1em;
}

/* --- Archive Description Box --- */
.term-description,
.woocommerce-products-header__description p {
  font-family: 'Open Sans', sans-serif;
  font-size: 17px;
  line-height: 1.65;
  color: #1A1A1A;
  background-color: #F1FAFE;
  padding: 1.5em;
  border-radius: 4px;
  border: 1px solid #DEE2E6; /* Added subtle border for definition */
}

/* --- Product Loop Title --- */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: 'Montserrat', sans-serif;
  font-size: 1.25em; /* Correct per typescale H5 */
  font-weight: 700;
  color: #2C3E50;
  line-height: 1.3;
}

.woocommerce ul.products li.product a:hover .woocommerce-loop-product__title {
  color: #5BC5F2;
}

/* --- Product Prices (Archive & Single) --- */
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700;
  font-size: 1.3em;
  color: #E63946; /* ✅ Aligned with typescale for CTA color */
}

.woocommerce ul.products li.product .price del,
.woocommerce div.product p.price del {
  color: #6C757D;
  font-size: 0.8em;
  opacity: 0.8;
}

/* --- Single Product Title (H1) --- */
.single-product div.product .product_title {
  font-family: 'Montserrat', sans-serif;
  font-size: 3.05em; /* Correct per typescale H1 */
  font-weight: 400;
  color: #004070;
}

/* --- Short Description --- */
.single-product div.product .woocommerce-product-details__short-description {
  font-family: 'Open Sans', sans-serif;
  font-size: 17px;
  line-height: 1.65;
  color: #1A1A1A;
}

/* --- Product Tabs --- */
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.94em; /* ✅ Aligned with typescale (16px) */
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: #6C757D;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  font-weight: 700;
  color: #2C3E50;
}

/* --- Related Products Title (H2) --- */
.related.products > h2 {
  font-family: 'Montserrat', sans-serif;
  font-size: 2.44em; /* Correct per typescale H2 */
  font-weight: 700;
  color: #2C3E50;
}

/* --- Checkout Progress Bar --- */
.checkout-progress-bar .step-active {
  background-color: #5BC5F2;
  color: #FFFFFF;
}

.checkout-progress-bar .step-inactive {
  background-color: #e9ecef;
  color: #6C757D;
}


/* ==========================================================================
   3. Custom Components (e.g., Assurance Box)
   ========================================================================== */

.c24-assurance {
  --c24-primary: #004070;
  --c24-info: #F1FAFE;
  --c24-border: #DEE2E6; /* ✅ Variable for brand border color */
  
  margin-top: 14px;
  padding: 14px 16px;
  border: 1px solid var(--c24-border);
  border-radius: 12px;
  background: var(--c24-info);
  font-size: 14px;
  line-height: 1.5;
}

.c24-usp {
  margin: 0 0 6px;
  color: var(--c24-primary);
  font-weight: 600;
}

.c24-list {
  margin: 0 0 12px 18px;
  padding: 0;
}

.c24-list li {
  margin: 4px 0;
}

.c24-pay {
  margin: 10px 0 0;
  border: 1px dashed var(--c24-border);
  border-radius: 10px;
  /* 👇 CHANGE IS HERE 👇 */
  padding: 8px 10px 14px; /* Was 8px 10px 10px */
  text-align: center;
  background: #fff;
}

.c24-pay > legend {
  font-weight: 600;
  color: var(--c24-primary);
  padding: 0 6px;
}

/* Media query for the assurance box */
@media (max-width: 576px) {
  .c24-assurance { padding: 12px 14px; }
  .payment-logos { gap: 8px; }
}
input.search-field.commercekit-ajax-search {
  background-color: #ffffff;
  border: solid 1px;
  border-color: #777777;
}

/* --- Styles for WooCommerce Order Page on Desktop --- */

tfoot li {

display: flex;

align-items: flex-end;

justify-content: space-between;

}

#order_review .easypack-parcel-machine-select {

padding-left: 0px;

}
