/*

Theme Name: Hello Elementor Child
Description: Child theme for Hello Elementor
Template: hello-elementor
Version: 1.0.0

*/
.woocommerce-page,
.archive.woocommerce-page,
.woocommerce {
  background-color: #ffffff !important;
}

h1, h2, h3, h4, h5, h6,
p,
a,
span,
div,
li {
  font-family: 'Inter', sans-serif;
}

.woocommerce span.onsale {
  background-color: #0337dc !important;
}

h2.woocommerce-loop-product__title {
  color: black !important;
}

.woocommerce ul.products li.product a img {
  border-radius: 10px !important;
}

span.woocommerce-Price-amount.amount {
  color: #0337dc !important;
}
/* =========================
   RESET WOOCOMMERCE DEFAULTS
========================= */
.woocommerce ul.products li.product {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  list-style: none;
  clear: unset !important; /* Fix .first class issue */
}

/* =========================
   GRID LAYOUT
========================= */
.woocommerce ul.products {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  padding: 0;
}

/* =========================
   PRODUCT CARD
========================= */
.woocommerce ul.products li.product {
  background: #ffffff;
  border-radius: 16px;
  padding: 16px;
  transition: all 0.3s ease;
  box-shadow: 0 6px 18px rgba(0,0,0,0.05);
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Hover effect */
.woocommerce ul.products li.product:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 28px rgba(0,0,0,0.1);
}

/* =========================
   FIX EMPTY CARD ISSUE
========================= */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  text-decoration: none;
  color: inherit;
}

/* =========================
   IMAGE
========================= */
.woocommerce ul.products li.product a img {
  display: block;
  width: 100%;
  height: auto;
  background: #f5f5f5;
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 12px;
  transition: transform 0.3s ease;
}

/* Image zoom */
.woocommerce ul.products li.product:hover img {
  transform: scale(1.05);
}

/* =========================
   TITLE
========================= */
.woocommerce-loop-product__title {
  font-size: 15px !important;
  font-weight: 500;
  color: #111;
  margin: 8px 0 6px;
}

/* =========================
   PRICE
========================= */
.woocommerce ul.products li.product .price {
  font-size: 14px;
  font-weight: 500;
  color: #111;
  margin-bottom: 12px;
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
}

.woocommerce ul.products li.product .price del {
  color: #9ca3af;
  font-size: 20px;
}

.woocommerce ul.products li.product .price ins {
  text-decoration: none;
  font-weight: 600;
  color: #111;
}

/* =========================
   BUTTON
========================= */
.woocommerce ul.products li.product .button {
  width: 100%;
  text-align: center;
  padding: 10px;
  border-radius: 10px;
  background: #111;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  transition: all 0.25s ease;
  border: none;
  margin-top: auto; /* Keeps button at bottom */
}

/* Hover */
.woocommerce ul.products li.product .button:hover {
  background: #2563eb;
}

/* =========================
   SALE BADGE
========================= */
.woocommerce ul.products li.product .onsale {
  position: absolute;
  top: 12px;
  right: 12px;
  left: auto;
  background: #2563eb;
  color: #fff;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 11px;
  font-weight: 500;
  min-height: auto;
  line-height: normal;
}

/* =========================
   RESPONSIVE (UPDATED)
========================= */

/* Tablet (3 cards) */
@media (max-width: 1024px) {
  .woocommerce ul.products {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Mobile (1 card) */
@media (max-width: 600px) {
  .woocommerce ul.products {
    grid-template-columns: 1fr;
  }
}

/* =========================
   FONT
========================= */
body {
  font-family: 'Inter', sans-serif;
}

/* Remove WooCommerce pseudo elements */
.woocommerce ul.products::before,
.woocommerce ul.products::after {
  content: none !important;
  display: none !important;
}

/* Wrapper */
.woocommerce-ordering {
  position: relative;
  display: inline-block;
}

/* Select Dropdown */
.woocommerce-ordering select.orderby {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding: 10px 40px 10px 14px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(0, 0, 0, 0.08);
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: #111;
  cursor: pointer;
  transition: all 0.25s ease;
  box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}

/* Hover */
.woocommerce-ordering select.orderby:hover {
  border-color: #0337dc;
  box-shadow: 0 6px 18px rgba(3, 55, 220, 0.15);
}

/* Focus */
.woocommerce-ordering select.orderby:focus {
  outline: none;
  border-color: #0337dc;
  box-shadow: 0 0 0 3px rgba(3, 55, 220, 0.15);
}

/* Custom arrow */
.woocommerce-ordering {
  position: relative;
}

.woocommerce-ordering::after {
  content: "▾";
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  font-size: 12px;
  color: #666;
}

/* Optional: darker text on hover */
.woocommerce-ordering select.orderby:hover {
  color: #000;
}

/* =========================
   PAGINATION WRAPPER
========================= */
.woocommerce nav.woocommerce-pagination {
  margin-top: 40px;
  text-align: center;
}

/* Container */
.woocommerce nav.woocommerce-pagination ul {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.05);
}

/* Remove default list + borders */
.woocommerce nav.woocommerce-pagination ul li {
  list-style: none;
  border: none !important;
  margin: 0;
  padding: 0;
}

/* =========================
   PAGE BUTTONS
========================= */
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 38px;
  height: 38px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  font-family: 'Inter', sans-serif;
  color: #111;
  text-decoration: none;
  transition: all 0.25s ease;
}

/* Hover (NO layout shift) */
.woocommerce nav.woocommerce-pagination ul li a:hover {
  background: #0337dc;
  color: #fff;
  transform: scale(1.05);
  box-shadow: 0 6px 14px rgba(3, 55, 220, 0.2);
}

/* Active page */
.woocommerce nav.woocommerce-pagination ul li span.current {
  background: #0337dc;
  color: #fff;
  box-shadow: 0 6px 14px rgba(3, 55, 220, 0.25);
}

/* Next button (arrow) */
.woocommerce nav.woocommerce-pagination ul li a.next {
  font-size: 16px;
  font-weight: 600;
}

/* =========================
   FIX EXTRA SPACING BUGS
========================= */
.woocommerce nav.woocommerce-pagination ul::before,
.woocommerce nav.woocommerce-pagination ul::after {
  content: none !important;
  display: none !important;
}


/* =========================
   SUMMARY WRAPPER
========================= */
.summary.entry-summary {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 420px;
}

/* =========================
   TITLE
========================= */
.product_title.entry-title {
  font-size: 34px;
  font-weight: 600;
  color: #111;
  line-height: 1.2;
}

/* =========================
   PRICE
========================= */
.summary .price {
  font-size: 24px !important;
  font-weight: 600;
  color: #0337dc !important;
}

/* =========================
   DESCRIPTION
========================= */
.woocommerce-product-details__short-description p {
  font-size: 14px;
  color: #666;
  line-height: 1.6;
  margin: 4px 0 10px;
}

/* =========================
   CART ROW
========================= */
form.cart {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
}

/* Quantity */
.quantity input.qty {
  height: 42px;
  width: 7rem !important;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,0.1);
  background: #f9fafb;
  font-size: 16px;
  text-align: center;
  transition: all 0.2s ease;
}

/* Quantity focus */
.quantity input.qty:focus {
  outline: none;
  border-color: #0337dc;
  box-shadow: 0 0 0 2px rgba(3,55,220,0.15);
}

/* =========================
   ADD TO CART BUTTON
========================= */
.single_add_to_cart_button.button.alt {
  height: 60px;
  padding: 24px 85px;
  border-radius: 10px;
  background: #0337dc !important;
  color: #fff !important;
  font-size: 18px;
  font-weight: 500;
  border: none;
  cursor: pointer;
  transition: all 0.25s ease;
}

/* Hover */
.single_add_to_cart_button.button.alt:hover {
  background: #022bb5 !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(3,55,220,0.25);
}

/* =========================
   META INFO
========================= */
.product_meta {
  margin-top: 14px;
  font-size: 13px;
  color: #777;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* Links */
.product_meta a {
  color: #0337dc;
  text-decoration: none;
  font-weight: 500;
}

.product_meta a:hover {
  text-decoration: underline;
}
/* =========================
   NOTICE WRAPPER
========================= */
.woocommerce-notices-wrapper {
  margin-bottom: 20px;
}

/* =========================
   SUCCESS MESSAGE
========================= */
.woocommerce-message {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 18px 14px 44px;
  border-radius: 14px;
  background: rgba(3, 55, 220, 0.08);
  border: 1px solid rgba(3, 55, 220, 0.15);
  font-size: 14px;
  color: #111;
  line-height: 1.4;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.05);
  animation: slideIn 0.4s ease;
}

/* =========================
   ICON (FIXED POSITION)
========================= */
.woocommerce-message::before {
  content: "✔";
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0337dc;
  color: #fff;
  border-radius: 50%;
  font-size: 12px;
}

/* =========================
   TEXT (PREVENT OVERFLOW)
========================= */
.woocommerce-message {
  flex-wrap: wrap;
}

/* =========================
   BUTTON (VIEW CART)
========================= */
.woocommerce-message .button.wc-forward {
  background: #0337dc;
  color: #fff;
  border-radius: 10px;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
  transition: all 0.25s ease;
}

/* Hover */
.woocommerce-message .button.wc-forward:hover {
  background: #022bb5;
  color: white;
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(3,55,220,0.25);
}

/* =========================
   MOBILE FIX
========================= */
@media (max-width: 600px) {
  .woocommerce-message {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .woocommerce-message .button.wc-forward {
    width: 100%;
    text-align: center;
  }
}

/* =========================
   ANIMATION
========================= */
@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.site-main.woocommerce-page .page-title {
  font-size: 3rem;
}

.product .woocommerce-loop-product__title {
  font-size: 1.5rem !important;
  font-weight: 400;
}

.product .woocommerce-Price-amount.amount {
  font-size: 18px !important;
}

.woocommerce table.shop_attributes td {
  padding: 5px;
}

.wc-block-cart-items__row .wc-block-components-product-name {
  color: #0073ff;
}

.wc-block-checkout__actions_row .wc-block-components-checkout-place-order-button {
  background-color: #0073ff !important;
}

.site-main .entry-title {
  font-size: 3rem !important;
}

.woocommerce-order-details .woocommerce-order-details__title {
  font-size: 1.8rem !important;
}

.woocommerce .woocommerce-customer-details .woocommerce-column__title {
  font-size: 1.5rem !important;
}

.shopengine_add_to_list_action {
  display: none !important;
}

.shopengine_comparison_add_to_list_action {
  display: none !important;
}



.site-main.woocommerce-page {
  max-width: 1200px;
  margin: auto;
  padding: 40px 20px;
}

.single-product div.product {
  display: block;
}

.single-product div.product > .woocommerce-product-gallery,
.single-product div.product > .summary {
  float: left;
  width: 48%;
}

.single-product div.product > .summary {
  margin-left: 4%;
}

.single-product div.product::after {
  content: "";
  display: block;
  clear: both;
}

.woocommerce-product-gallery img {
  border-radius: 12px;
}

.product_title {
  font-size: 40px !important;
  font-weight: 900;
}

.summary.entry-summary span.woocommerce-Price-amount.amount {
  font-size: 25px !important;
  margin: 10px 0;
}

.cart {
  display: flex;
  gap: 15px;
  align-items: center;
  margin-top: 20px;
}

.shopengine-wishlist,
.shopengine-comparison {
  display: none !important;
}

.quantity input {
  padding: 23px !important;
  border-radius: 6px;
  border: 1px solid #ddd;
}

.single_add_to_cart_button {
  background: #0073ff;
  color: #fff;
  padding: 10px 22px;
  border-radius: 6px;
  border: none;
}

.woocommerce-tabs {
  clear: both;
  margin-top: 50px;
}

.woocommerce-tabs ul.tabs {
  display: flex;
  gap: 20px;
  border-bottom: 1px solid #eee;
}

.woocommerce-product-details__short-description p {
  font-size: 17px;
}

.woocommerce-Tabs-panel h2 {
  font-size: 30px;
}

.related h2 {
  font-size: 40px !important;
}

.related.products h2.woocommerce-loop-product__title {
  font-size: 22px !important;
}

.related.products .price {
  display: flex;
  align-items: center;
  gap: 8px;
}

.related.products .price del,
.related.products .price del span,
.related.products .price del bdi {
  color: #999 !important;
  text-decoration: line-through !important;
  opacity: 1 !important;
}

.related.products .price ins,
.related.products .price ins span,
.related.products .price ins bdi {
  text-decoration: none !important;
  color: #0073ff !important;
  font-weight: 600;
  font-size: 18px !important;
}

.related.products .price ins {
  background: none;
}



@media (max-width: 768px) {
  .single-product div.product > .woocommerce-product-gallery,
  .single-product div.product > .summary {
    float: none;
    width: 100%;
    margin: 0;
  }

  .cart {
    flex-wrap: wrap;
  }
}

.woocommerce-cart .entry-title {
  font-size: 40px !important;
  margin-bottom: 65px !important;
}

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

button.wc-block-cart-item__remove-link {
  background-color: #d94957 !important;
  color: #fff !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  border-radius: 6px !important;
}

@media (max-width: 768px) {
  button.wc-block-cart-item__remove-link {
    width: 32px !important;
    height: 32px !important;
  }
}