/* ================================================================
   OFFERSCART — responsive.css  (was empty — fully written now)
   Breakpoints:
     xl  : max-width 1199px
     lg  : max-width  991px
     md  : max-width  767px
     sm  : max-width  480px
     xs  : max-width  389px
================================================================ */

/* ── XL: Large tablets / small desktops ── */
@media (max-width: 1199px) {
  .oc-hero-content h1 { font-size: 2.4rem !important; }
  .oc-hero-content { max-width: 400px; }
  .woocommerce ul.products { grid-template-columns: repeat(3,1fr) !important; }
  ul.wc-block-grid__products { grid-template-columns: repeat(3,1fr) !important; }
  .newshoppage ul.products { grid-template-columns: repeat(3,1fr) !important; }
}

/* ── LG: Tablets ── */
@media (max-width: 991px) {
  /* Header wraps search below logo+actions */
  .container.oc-navbar {
    flex-wrap: wrap;
    gap: 10px;
    padding: 12px 16px;
  }
  .oc-brand  { order: 1; }
  .oc-actions { order: 2; }
  .oc-search  { order: 3; flex: 1 1 100%; max-width: 100%; }

  /* Hero */
  .oc-hero-slide { height: 340px; }
  .oc-hero-content { max-width: 380px; left: 5%; }
  .oc-hero-content h1 { font-size: 2rem !important; }
  .oc-hero-content p  { font-size: 14px; }

  /* Product grids */
  .woocommerce ul.products { grid-template-columns: repeat(2,1fr) !important; }
  ul.wc-block-grid__products { grid-template-columns: repeat(2,1fr) !important; }
  .newshoppage ul.products { grid-template-columns: repeat(2,1fr) !important; }

  /* Why-shop cards stack vertically */
  .oc-feature { flex-direction: column; align-items: center; text-align: center; }
  .oc-feature .oc-text p { max-width: 320px; margin: 0 auto; }
}

/* ── MD: Mobile ── */
@media (max-width: 767px) {
  /* Typography scale-down */
  h1 { font-size: 1.8rem !important; }
  h2 { font-size: 1.5rem !important; }
  h3 { font-size: 1.25rem !important; }

  /* Announcement bar */
  .oc-announce { font-size: 11.5px; padding: 7px 12px; }

  /* Header */
  .container.oc-navbar { padding: 10px 14px; gap: 8px; }
  .oc-logo img { height: 36px; }
  .oc-btn { padding: 7px 11px; font-size: 12.5px; gap: 4px; }
  /* Hide "Shop" text button on mobile to save space */
  .oc-btn.oc-login.hide-sm { display: none; }

  /* Hero */
  .oc-hero-slide { height: 230px; }
  .bx-viewport  { height: 230px !important; }
  .oc-hero-content { left: 5%; max-width: 58%; }
  .oc-hero-content h1 { font-size: 1.3rem !important; line-height: 1.25 !important; margin-bottom: 8px; }
  .oc-hero-content p  { font-size: 12px; margin-bottom: 12px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .oc-hero-content .oc-cart-btn { padding: 8px 16px; font-size: 12.5px; }

  /* Category section: horizontal scroll on mobile */
  .oc-category-section { margin: 24px auto 8px; }
  .oc-category-grid {
    flex-wrap: nowrap;
    overflow-x: auto;
    justify-content: flex-start;
    gap: 10px;
    padding-bottom: 6px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .oc-category-grid::-webkit-scrollbar { display: none; }
  .oc-category-card { min-width: 82px; flex-shrink: 0; padding: 14px 10px 10px; }
  .oc-category-icon { width: 50px; height: 50px; }
  .oc-category-card span { font-size: 11.5px; }

  /* Product grid */
  .oc-product-grid { padding: 8px 0 18px; }
  .oc-product-grid > .container-fluid > h3 { font-size: 1.1rem !important; margin-bottom: 14px; }
  .oc-product-grid h3.oc-pcard-title { font-size: 12.5px !important; border: none !important; padding: 0 !important; margin: 0 0 5px !important; }
  .oc-product-grid .col-lg-3,
  .oc-product-grid .col-md-4,
  .oc-product-grid .col-sm-6,
  .oc-product-grid .col-6 { padding: 5px !important; }

  /* Product card mobile */
  .oc-img { height: 155px !important; aspect-ratio: unset; }
  .oc-badge { font-size: 10px; padding: 3px 8px; top: 7px; left: 7px; }
  .oc-title,
  .woocommerce-loop-product__title { font-size: 12.5px !important; padding: 8px 8px 3px !important; }
  .oc-price, .price { padding: 2px 8px 5px !important; }
  .oc-price ins, .price ins,
  .price ins .woocommerce-Price-amount { font-size: 14px !important; }
  .oc-price del, .price del { font-size: 11px !important; }
  .oc-card .oc-cart-btn,
  .oc-card a.button,
  .oc-card .add_to_cart_button {
    font-size: 12px !important;
    padding: 7px 8px !important;
    margin: 4px 8px 8px !important;
    width: calc(100% - 16px) !important;
    border-radius: 8px !important;
  }
  .oc-view-btn { font-size: 13px; padding: 9px 22px; }

  /* Why-shop */
  .oc-why-shop { padding: 36px 0; margin-top: 28px; }
  .oc-heading { font-size: 1.5rem !important; }
  .oc-feature { padding: 18px 16px; gap: 14px; }
  .oc-icon  { width: 48px; height: 48px; }
  .oc-text h6 { font-size: .95rem !important; }

  /* Footer centering on mobile */
  .footer-site-logo { text-align: center; }
  .office-col { text-align: center; }
  .quik_links_box { padding-left: 0 !important; }
  ul#menu-quick-link { text-align: center; }
  .footer-section h4 { text-align: center; }
  .footer-col h4::after { left: 50%; transform: translateX(-50%); }
  .social_icon { justify-content: center; }

  /* WhatsApp button */
  .oc-whatsapp { bottom: 16px; right: 16px; width: 50px; height: 50px; }
  .oc-whatsapp svg { width: 24px; height: 24px; }

  /* WooCommerce shop page */
  .woocommerce ul.products { grid-template-columns: repeat(2,1fr) !important; gap: 10px !important; }
  ul.wc-block-grid__products { grid-template-columns: repeat(2,1fr) !important; gap: 10px !important; }
  .newshoppage ul.products { grid-template-columns: repeat(2,1fr) !important; }
  .woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 12.5px !important; }
  .woocommerce ul.products li.product a.button { font-size: 12px !important; padding: 8px 10px !important; }
  .woocommerce .woocommerce-ordering select { padding: 7px; font-size: 13px; }
  .woocommerce .woocommerce-result-count { font-size: 13px; }

  /* Single product */
  .single-product span.onsale { left: 40px; top: 15px; }
  .single-product .product_title { font-size: 1.4rem !important; }
}

/* ── SM: Small mobile (≤ 480px) ── */
@media (max-width: 480px) {
  /* Search */
  .oc-search input[type="search"] { font-size: 13px; }
  .search-btn { padding: 10px 14px; }

  /* Hero */
  .oc-hero-slide { height: 195px; }
  .bx-viewport  { height: 195px !important; }
  .oc-hero-content { max-width: 62%; }
  .oc-hero-content h1 { font-size: 1.15rem !important; }
  .oc-hero-content p  { display: none; }
  .oc-hero-content .oc-cart-btn { padding: 7px 14px; font-size: 12px; }

  /* Product card tighter */
  .oc-product-grid .col-6 { padding: 4px !important; }
  .oc-img { height: 142px !important; }
  .oc-title { -webkit-line-clamp: 1 !important; }
  .oc-card .oc-cart-btn,
  .oc-card a.button,
  .oc-card .add_to_cart_button { font-size: 11.5px !important; padding: 6px 6px !important; }

  /* Category scroll pill sizes */
  .oc-category-card { min-width: 72px; padding: 12px 8px 8px; }
  .oc-category-icon { width: 44px; height: 44px; }
  .oc-category-card span { font-size: 11px; }

  /* WC blocks cart — prevent thumbnail upscale blur on mobile */
  td.wc-block-cart-item__image,
  .wc-block-cart-item__image {
    width: auto !important;
    max-width: 120px !important;
  }
  td.wc-block-cart-item__image img,
  .wc-block-cart-item__image img,
  .wc-block-components-order-summary .wc-block-components-order-summary-item__image > img {
    width: 120px !important;
    height: 120px !important;
    max-width: 120px !important;
    object-fit: cover !important;
    object-position: center !important;
    transform: none !important;
    image-rendering: auto !important;
  }
  .wc-block-components-order-summary .wc-block-components-order-summary-item__image { width: 100%; display: block; margin-bottom: 10px; }
  .wc-block-components-order-summary .wc-block-components-order-summary-item { display: block; }
  .wc-block-components-order-summary .wc-block-components-order-summary-item__description { padding-left: 0; padding-top: 12px; }
  td.wc-block-cart-item__image { display: block; margin-bottom: 10px !important; padding-right: 0 !important; }
  td.wc-block-cart-item__total { justify-content: left; }
  .wc-block-cart-item__total-price-and-sale-badge-wrapper { align-items: flex-start; }
  .is-medium table.wc-block-cart-items .wc-block-cart-items__row,
  .is-mobile table.wc-block-cart-items .wc-block-cart-items__row,
  .is-small  table.wc-block-cart-items .wc-block-cart-items__row { display: block; }
  .wc-block-components-order-summary .wc-block-components-order-summary-item__quantity { border: 1px solid #c9a96e; left: 0; right: unset; }
  .wp-block-woocommerce-checkout-order-summary-block .checkout-order-summary-block-fill .wc-block-components-totals-coupon,
  .wp-block-woocommerce-checkout-order-summary-block .checkout-order-summary-block-fill .wc-block-components-totals-item { padding-left: 0; padding-right: 0; }
  .wp-block-woocommerce-checkout-order-summary-block { border: 0 !important; }
  .wc-block-components-formatted-money-amount { color: #1a1a2e !important; }

  /* Force single column on very small shop pages */
  .products li.product { width: 100% !important; }
  .woocommerce ul.products[class*=columns-] li.product:nth-child(2n) { float: left; }
}

/* ── XS: Extra small (≤ 389px) ── */
@media (max-width: 389px) {
  /* Header: full-width stack */
  .oc-brand { width: 100%; justify-content: center; display: flex; }
  .oc-brand a { text-align: center; }
  .oc-logo img { height: 32px; width: auto; }
  .oc-actions { width: 100%; justify-content: center; }
  .oc-search { width: 100% !important; }
  .oc-btn { padding: 6px 10px; font-size: 12px; }

  /* Hero */
  .oc-hero-slide { height: 170px; }
  .bx-viewport  { height: 170px !important; }
  .oc-hero-content h1 { font-size: 1rem !important; }
  .oc-hero-content .oc-cart-btn { padding: 6px 12px; font-size: 11.5px; }

  /* Product card */
  .oc-img { height: 130px !important; }
  .oc-product-grid .col-6 { padding: 3px !important; }

  /* Pages */
  article#post-40, article#post-3 { padding: 11px; }
}

/* ── FIX 9: Footer mobile — center all columns ── */
@media (max-width: 575px) {
  footer.footer-section .row > div {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  footer.footer-section ul.quick-link-menu {
    width: 100%;
    padding: 0;
    text-align: center;
  }
  footer.footer-section ul.quick-link-menu a {
    justify-content: center;
  }
  footer.footer-section .footer-col h4::after {
    left: 50%;
    transform: translateX(-50%);
  }
  footer.footer-section .social_icon {
    justify-content: center;
  }
}

/* ── FIX 2: Search no-results mobile ── */
@media (max-width: 480px) {
  .oc-no-results-btns { flex-direction: column; align-items: center; }
  .oc-no-results-btn-outline,
  .oc-no-results-btn-fill { width: 100%; justify-content: center; }
  .oc-search-inline { max-width: 100%; }
}

/* ── v4: Product card responsive overrides ── */
@media (max-width: 991px) {
  .oc-pcard-grid,
  .oc-cart-new-grid { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 767px) {
  .oc-pcard-grid,
  .oc-cart-new-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }
  /* Mobile: always show ATC (no hover available on touch) */
  .oc-pcard-atc-overlay { opacity: 1 !important; transform: none !important; }
  .wc-block-cart .oc-cart-new-grid .oc-pcard-atc-overlay {
    opacity: 1 !important;
    transform: translateY(0) !important;
  }
}

@media (max-width: 991px) {
  .related.products ul.products,
  .upsells.products ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 14px !important;
  }
}

@media (max-width: 480px) {
  .related.products ul.products,
  .upsells.products ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
}

/* ================================================================
   OFFERSCART v5 — Mobile ATC + Related Products Responsive
================================================================ */

/* ── Mobile: Show ATC button below price, hide hover overlay ── */
@media (max-width: 767px) {

  /* Hide desktop hover overlay on touch screens */
  .oc-pcard-atc-overlay {
    display: none !important;
  }

  /* Show mobile ATC button below price (override WooCommerce .button rules) */
  .oc-pcard-mobile-atc,
  .woocommerce .oc-pcard-mobile-atc,
  .woocommerce ul.products li.product .oc-pcard-body .oc-pcard-mobile-atc,
  .woocommerce-page .oc-pcard-mobile-atc,
  .oc-pcard-grid .oc-pcard-mobile-atc,
  .wc-block-cart .oc-cart-new-grid .oc-pcard-mobile-atc {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    overflow: visible !important;
    pointer-events: auto !important;
    width: 70% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
    background: var(--gold-grad) !important;
    color: #000 !important;
    font-family: var(--font-body) !important;
    font-weight: 600 !important;
    font-size: 12px !important;
    padding: 9px 10px !important;
    border-radius: var(--radius-xl) !important;
    border: none !important;
    cursor: pointer !important;
    text-decoration: none !important;
    transition: background 0.22s ease, color 0.22s ease !important;
    margin-top: 8px !important;
    letter-spacing: 0.02em !important;
  }
  .oc-pcard-mobile-atc:hover,
  .oc-pcard-mobile-atc:active {
    background: var(--gold-grad) !important;
    color: #000 !important;
    opacity: 0.92;
  }
  .oc-pcard-mobile-atc i {
    margin-right: 5px;
    font-size: 11px;
  }
  .oc-pcard-mobile-atc.added {
    background: var(--success) !important;
    color: var(--white) !important;
  }
  .oc-pcard-mobile-atc.oc-pcard-atc-outofstock {
    background: var(--cream2) !important;
    color: var(--text-muted) !important;
  }

  /* Related + upsell products: 2 columns on mobile */
  .related.products ul.products,
  .upsells.products ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }

  /* Slightly smaller font for mobile card title */
  .oc-pcard-title {
    font-size: 12.5px !important;
  }
  .oc-pcard-price .price ins,
  .oc-pcard-price ins .woocommerce-Price-amount,
  .oc-pcard-price .price > .woocommerce-Price-amount {
    font-size: 13px !important;
    font-weight: 700 !important;
  }
  .oc-pcard-price .price del,
  .oc-pcard-price .price del .woocommerce-Price-amount {
    font-size: 12px !important;
    color: #c0392b !important;
    text-decoration: line-through !important;
  }
  .oc-pcard-price .price {
    gap: 3px 8px !important;
  }

  /* Cart line item images — prevent upscale blur */
  td.wc-block-cart-item__image,
  .wc-block-cart-item__image {
    width: auto !important;
    max-width: 120px !important;
  }
  td.wc-block-cart-item__image img,
  .wc-block-cart-item__image img {
    width: 120px !important;
    height: 120px !important;
    max-width: 120px !important;
    object-fit: cover !important;
    object-position: center !important;
    transform: none !important;
    image-rendering: auto !important;
  }
}

/* ── Tablet: 3 columns for related products ── */
@media (max-width: 991px) and (min-width: 768px) {
  .related.products ul.products,
  .upsells.products ul.products {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 14px !important;
  }

  /* Show mobile ATC on tablets too (no hover) */
  .oc-pcard-atc-overlay {
    display: none !important;
  }
  .oc-pcard-mobile-atc,
  .woocommerce .oc-pcard-mobile-atc,
  .woocommerce ul.products li.product .oc-pcard-body .oc-pcard-mobile-atc,
  .woocommerce-page .oc-pcard-mobile-atc,
  .oc-pcard-grid .oc-pcard-mobile-atc {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    overflow: visible !important;
    pointer-events: auto !important;
  }
}

/* ── Small mobile ≤480px ── */
@media (max-width: 480px) {
  .related.products ul.products,
  .upsells.products ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
  .oc-pcard-mobile-atc {
    font-size: 11px !important;
    padding: 8px 6px !important;
    margin-top: 6px !important;
  }
  .oc-pcard-title {
    font-size: 11.5px !important;
    -webkit-line-clamp: 2 !important;
  }
}

/* ================================================================
   OFFERSCART v5 — Single Product Responsive
================================================================ */

/* ── Tablet (≤991px): Stack gallery + summary ── */
@media (max-width: 991px) {
  .oc-product-grid-container {
    grid-template-columns: 1fr !important;
    padding: 24px !important;
    gap: 24px !important;
    max-width: 100% !important;
    margin: 12px !important;
  }
  .oc-product-gallery-col,
  .oc-product-summary-col {
    grid-column: 1 !important;
    width: 100% !important;
  }
  .oc-product-gallery-col .woocommerce-product-gallery__image img,
  .oc-product-gallery-col .woocommerce-product-gallery figure img,
  .woocommerce div.product .woocommerce-product-gallery__image img {
    height: 460px !important;
    object-position: center top !important;
  }
  .oc-product-below {
    padding: 0 24px 36px !important;
    max-width: 100% !important;
  }
  .related.products ul.products,
  .upsells.products ul.products {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 14px !important;
  }
  /* Tablets: show mobile ATC on cards (no hover) */
  .oc-pcard-atc-overlay { display: none !important; }
  .oc-pcard-mobile-atc,
  .woocommerce .oc-pcard-mobile-atc,
  .woocommerce ul.products li.product .oc-pcard-body .oc-pcard-mobile-atc,
  .woocommerce-page .oc-pcard-mobile-atc,
  .oc-pcard-grid .oc-pcard-mobile-atc {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    overflow: visible !important;
    pointer-events: auto !important;
  }
}

/* ── Mobile (≤767px) ── */
@media (max-width: 767px) {
  .oc-product-grid-container {
    padding: 14px !important;
    margin: 8px !important;
    border-radius: var(--radius-md) !important;
  }
  .oc-product-gallery-col .woocommerce-product-gallery__image img,
  .oc-product-gallery-col .woocommerce-product-gallery figure img,
  .woocommerce div.product .woocommerce-product-gallery__image img {
    height: 360px !important;
  }
  .oc-product-below { padding: 0 14px 28px !important; }
  .oc-single-title  { font-size: 1.35rem !important; }
  .oc-single-price .price,
  .oc-single-price .price ins { font-size: 1.3rem !important; }
  .oc-single-atc-row {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
  }
  .oc-single-atc-btn { font-size: 13.5px !important; padding: 12px 16px !important; }
  .related.products ul.products,
  .upsells.products ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }
  /* Mobile: hide desktop hover overlay, show ATC button below price */
  .oc-pcard-atc-overlay { display: none !important; }
  .oc-pcard-mobile-atc,
  .woocommerce .oc-pcard-mobile-atc,
  .woocommerce ul.products li.product .oc-pcard-body .oc-pcard-mobile-atc,
  .woocommerce-page .oc-pcard-mobile-atc,
  .oc-pcard-grid .oc-pcard-mobile-atc {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    overflow: visible !important;
    pointer-events: auto !important;
  }
}

/* ── Small mobile (≤480px) ── */
@media (max-width: 480px) {
  .oc-product-gallery-col .woocommerce-product-gallery__image img,
  .oc-product-gallery-col .woocommerce-product-gallery figure img,
  .woocommerce div.product .woocommerce-product-gallery__image img {
    height: 280px !important;
  }
  .oc-single-title { font-size: 1.15rem !important; }
  .oc-single-atc-row { flex-wrap: nowrap !important; }
  .oc-qty-btn { width: 36px !important; }
  .oc-qty-input { width: 42px !important; }
  .oc-single-atc-btn { font-size: 13px !important; padding: 11px 14px !important; }
  .related.products ul.products,
  .upsells.products ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
  .oc-pcard-mobile-atc {
    font-size: 11px !important;
    padding: 8px 6px !important;
  }
}

/* ── Product tabs responsive ── */
@media (max-width: 767px) {
  .woocommerce div.product .woocommerce-tabs ul.tabs {
    padding: 0 !important;
    gap: 4px !important;
    flex-wrap: wrap !important;
  }
  .woocommerce div.product .woocommerce-tabs ul.tabs li a {
    padding: 10px 16px !important;
    font-size: 13px !important;
  }
  .woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel {
    padding: 16px !important;
  }
}