/* Remove background highlight from category product count */
.woocommerce .count,
.product-category .count {
    background: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: inherit !important;
}

/* Ensure forced Register button is visible */
.woocommerce-form-register__submit {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* ✅ Single Product Image: Fixed 300x300 box */
.single-product .woocommerce-product-gallery {
  width: 400px;
  max-width: 100%;
}

.single-product .woocommerce-product-gallery__wrapper {
  width: 400px;
  height: 400px;
}

.single-product .woocommerce-product-gallery__image {
  width: 400px;
  height: 400px;
  overflow: hidden;
}

/* Image fits inside 300x300 without distortion */
.single-product .woocommerce-product-gallery__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;   /* use cover if you want crop */
  display: block;
  margin: 0 auto;
}

/* Ensure tabs always stay below */
.single-product .woocommerce-tabs {
  clear: both;
  margin-top: 24px;
}

/* ✅ Mobile: make it centered */
@media (max-width: 768px) {
  .single-product .woocommerce-product-gallery,
  .single-product .woocommerce-product-gallery__wrapper,
  .single-product .woocommerce-product-gallery__image {
    margin: 0 auto;
  }
}

/* ================================
   Back Link Styling – Category Pages
   Purpose:
   - Styles the "Back" link shown on WooCommerce product category pages
   - Helps users navigate back to the main Menu / Shop page
   - Made prominent for better visibility (larger font + arrow)
   Used by:
   - PHP hook added via functions.php / Code Snippets
   Class:
   - .back-to-menu
   ================================ */

.back-to-menu {
    margin: 16px 0 22px; /* Space above & below the Back link */
}

.back-to-menu a {
    font-size: 16px;        /* Slightly larger than body text for visibility */
    font-weight: 700;       /* Bold to make it noticeable */
    color: #d71920;         /* D'ITALIA brand red */
    text-decoration: none;
    display: inline-flex;   /* Align arrow + text neatly */
    align-items: center;
    gap: 6px;
}

/* Adds a left arrow before the word "Back" */
.back-to-menu a::before {
    content: "←";
    font-size: 18px;        /* Arrow slightly bigger than text */
}

/* Hover effect for better UX feedback */
.back-to-menu a:hover {
    text-decoration: underline;
}

/* MOBILE ONLY – Move hamburger to right, keep center content intact */
@media (max-width: 768px) {

  /* Make header relative so absolute works */
  header,
  .site-header,
  .header,
  .main-header {
    position: relative;
  }

  /* Move hamburger menu to the right */
  .menu-toggle,
  button.menu-toggle,
  .mobile-menu-toggle,
  button[aria-controls],
  button[aria-expanded] {
    position: absolute !important;
    right: 14px;
    left: auto !important;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9999;
  }

}

@media (max-width: 768px) {
  .menu-toggle {
    font-size: 26px;
  }
}

/* MOBILE ONLY: add space between tagline and Order Now button */
@media (max-width: 768px) {

  /* Add gap below the tagline line */
  h1 + p,
  .site-title + .site-description,
  .site-description,
  .header-tagline,
  .entry-content p {
    margin-bottom: 14px !important;
  }

  /* Add a little top margin to Order Now button */
  a.button,
  .wp-block-button__link,
  .woocommerce a.button,
  .elementor-button,
  .order-now,
  a[href*="order"] {
    margin-top: 10px !important;
  }
}

/* Hide SKU, Category, and Tags on product page */
.single-product .product_meta {
    display: none !important;
}

@media print {
  html, body {
    width: 80mm !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 12px !important;
  }
  .invoice {
    width: 80mm !important;
    margin: 0 auto !important;
  }
  .invoice header,
  .invoice footer {
    display: block;
  }
  .invoice table {
    width: 100% !important;
    border-collapse: collapse !important;
  }
}

/* ================================
   FIX ORDER TYPE RADIO (INLINE)
   Field ID: _order_type
   ================================ */

/* Wrapper */
#_order_type_field .woocommerce-input-wrapper {
  display: flex !important;
  flex-wrap: wrap !important;     /* wraps only on very small screens */
  gap: 16px !important;
  align-items: center !important;
}

/* Each radio label */
#_order_type_field .woocommerce-input-wrapper label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 0 !important;
  white-space: nowrap !important; /* PREVENT line break */
  font-weight: 600;
}

/* Remove forced line breaks added by theme/plugin */
#_order_type_field .woocommerce-input-wrapper br {
  display: none !important;
}

/* Radio input spacing */
#_order_type_field input[type="radio"] {
  margin: 0 !important;
}

/* ===============================
   D'ITALIA Bottom Navigation Bar
   Mobile + Tablet only
   =============================== */

#ditalia-bottom-nav{ display:none; }

@media (max-width: 1024px){

  /* Show bottom nav */
  #ditalia-bottom-nav{
    display:flex;
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    height:64px;
    background:#fff;
    border-top:1px solid rgba(0,0,0,.1);
    z-index:999999;
    padding-bottom: env(safe-area-inset-bottom);
  }

  /* Each nav item */
  .ditalia-bnav-item{
    flex:1;
    text-decoration:none;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    position:relative;
    color:#111;
    font-size:12px;
  }

  .ditalia-bnav-item .dashicons{
    font-size:22px;
    width:22px;
    height:22px;
  }

  .ditalia-bnav-text{
    font-size:11px;
    line-height:1;
  }

  /* Cart count badge */
  .ditalia-bottom-cart-count{
    position:absolute;
    top:8px;
    right:28%;
    background:#e60000;
    color:#fff;
    font-size:10px;
    padding:2px 6px;
    border-radius:999px;
    line-height:1;
    min-width:18px;
    text-align:center;
    font-weight:700;
  }

  /* IMPORTANT: avoid bottom nav covering page content */
  body{
    padding-bottom: 74px; /* nav height + buffer */
  }
}

/* ✅ Fix variable product dropdown overlapping on mobile */
@media (max-width: 767px){

  /* Keep everything inside each product card */
  .woocommerce ul.products li.product{
    overflow: hidden !important;
  }

  /* Make variations form elements fit the card */
  .woocommerce ul.products li.product form.variations_form,
  .woocommerce ul.products li.product table.variations,
  .woocommerce ul.products li.product table.variations td,
  .woocommerce ul.products li.product table.variations th{
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    box-sizing: border-box !important;
  }

  /* Label + dropdown should stack (no side-by-side "Size Large") */
  .woocommerce ul.products li.product table.variations tr{
    display: block !important;
  }

  .woocommerce ul.products li.product table.variations td.label,
  .woocommerce ul.products li.product table.variations td.value{
    display: block !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 0 6px 0 !important;
  }

  /* Dropdown should never exceed card width */
  .woocommerce ul.products li.product select,
  .woocommerce ul.products li.product .variations select{
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* Hide our hidden field wrapper */
.ditalia-hidden { display:none !important; }

/* If NOT delivery, hide address fields (PHP also makes them non-required) */
body.ditalia-not-delivery #billing_country_field,
body.ditalia-not-delivery #billing_address_1_field,
body.ditalia-not-delivery #billing_address_2_field,
body.ditalia-not-delivery #billing_city_field,
body.ditalia-not-delivery #billing_state_field,
body.ditalia-not-delivery #billing_postcode_field {
  display:none !important;
}
