/** Shopify CDN: Minification failed

Line 860:0 Expected "}" to go with "{"

**/
/* ============================================
   RUBBERMATTINGCO - PRODUCT PAGE MOBILE FIX v2
   Order: Gallery > Sizes > Price > Buy > Description
   ============================================ */

/* ============================================
   MOBILE REORDERING (< 768px)
   ============================================ */

@media screen and (max-width: 767px) {
  /* Main wrapper - flex column for ordering */
  .product-block-list__wrapper {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
  }
  
  /* Gallery first */
  .product-block-list__item--gallery {
    order: 1 !important;
    width: 100% !important;
    margin-bottom: 15px !important;
  }
  
  /* Info section (contains meta, variants, buttons) */
  .product-block-list__item--info {
    order: 2 !important;
    width: 100% !important;
  }
  
  /* Description block - push to bottom */
  .product-block-list__item--description {
    order: 10 !important;
    width: 100% !important;
    margin-top: 20px !important;
  }
  
  /* Content blocks */
  .product-block-list__item--content {
    order: 11 !important;
    width: 100% !important;
  }
  
  /* Recommendations at very bottom */
  .product-block-list__item--complementary {
    order: 20 !important;
    width: 100% !important;
  }
  
  /* Inside the info card - reorder blocks */
  .product-block-list__item--info .card__section {
    display: flex !important;
    flex-direction: column !important;
  }
  
  .product-block-list__item--info .product-form {
    display: flex !important;
    flex-direction: column !important;
  }
  
  /* Product meta (title, price) - order 1 */
  .product-info__block-item--product-meta {
    order: 1 !important;
  }
  
  /* Variant selector (sizes) - order 2 */
  .product-info__block-item--variant-selector {
    order: 2 !important;
    margin-top: 15px !important;
  }
  
  /* Buy buttons - order 3 */
  .product-info__block-item--buy-buttons {
    order: 3 !important;
    margin-top: 15px !important;
  }
  
  /* Description inside info - push to bottom */
  .product-info__block-item--description {
    order: 100 !important;
    margin-top: 20px !important;
    display: none !important; /* Hide if inside info, show main description block */
  }
}

/* ============================================
   PRODUCT GALLERY - MOBILE
   ============================================ */

@media screen and (max-width: 767px) {
  .product-gallery {
    margin: 0 !important;
  }
  
  .product-gallery__carousel-wrapper {
    width: 100% !important;
  }
  
  .product-gallery__carousel {
    width: 100% !important;
  }
  
  .product-gallery__carousel-item {
    width: 100% !important;
  }
  
  .product-gallery__image {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }
  
  /* Thumbnails - horizontal scroll on mobile */
  .product-gallery__thumbnail-list {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    gap: 8px !important;
    padding: 10px 0 !important;
    -webkit-overflow-scrolling: touch;
  }
  
  .product-gallery__thumbnail {
    flex-shrink: 0 !important;
    width: 60px !important;
    height: 60px !important;
  }
  
  .product-gallery__thumbnail img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
  
  /* Hide zoom notice on mobile */
  .product-gallery__zoom-notice {
    display: none !important;
  }
  
  /* Hide our clients section on mobile */
  .section.desktop {
    display: none !important;
  }
}

/* ============================================
   PRODUCT INFO CARD - MOBILE
   ============================================ */

@media screen and (max-width: 767px) {
  .product-block-list__item--info .card {
    padding: 0 !important;
    box-shadow: none !important;
    border: none !important;
  }
  
  .card--sticky {
    position: static !important;
    top: auto !important;
  }
  
  .card__section {
    padding: 15px 0 !important;
  }
  
  .card--collapsed {
    border: none !important;
  }
}

/* ============================================
   PRODUCT META (Title, Price, Stock)
   ============================================ */

@media screen and (max-width: 767px) {
  .pm-meta {
    padding: 0 !important;
  }
  
  /* Category badge */
  .pm-category {
    font-size: 10px !important;
    letter-spacing: 1px !important;
  }
  
  /* Product title */
  .pm-title {
    font-size: 20px !important;
    line-height: 1.3 !important;
    margin: 8px 0 !important;
  }
  
  /* SKU and ratings */
  .pm-sku,
  .pm-reviews {
    font-size: 12px !important;
  }
  
  /* Price */
  .pm-price {
    margin: 12px 0 !important;
  }
  
  .pm-price__current {
    font-size: 28px !important;
    font-weight: 700 !important;
  }
  
  .pm-price__compare {
    font-size: 16px !important;
  }
  
  .pm-price__save {
    font-size: 12px !important;
    padding: 4px 10px !important;
  }
  
  .pm-price__tax {
    font-size: 11px !important;
  }
  
  /* Stock status */
  .pm-stock {
    font-size: 13px !important;
    padding: 8px 12px !important;
  }
  
  /* Delivery promise */
  .pm-delivery {
    padding: 10px 12px !important;
    margin: 10px 0 !important;
    font-size: 13px !important;
  }
}

@media screen and (max-width: 480px) {
  .pm-title {
    font-size: 18px !important;
  }
  
  .pm-price__current {
    font-size: 26px !important;
  }
}

/* ============================================
   VARIANT SELECTOR (Sizes) - MOBILE
   ============================================ */

@media screen and (max-width: 767px) {
  .vs-option {
    margin-bottom: 12px !important;
  }
  
  .vs-label {
    font-size: 13px !important;
    font-weight: 600 !important;
    margin-bottom: 8px !important;
  }
  
  .vs-select {
    padding: 12px 40px 12px 14px !important;
    font-size: 15px !important;
    border-radius: 4px !important;
  }
  
  .vs-pills {
    gap: 8px !important;
  }
  
  .vs-pill__label {
    padding: 10px 16px !important;
    font-size: 13px !important;
  }
}

/* ============================================
   BUY BUTTONS - MOBILE
   ============================================ */

@media screen and (max-width: 767px) {
  /* Quantity selector */
  .bb-qty {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin-bottom: 15px !important;
  }
  
  .bb-qty__label {
    font-size: 13px !important;
    font-weight: 600 !important;
  }
  
  .bb-qty__control {
    display: flex !important;
  }
  
  .bb-qty__btn {
    width: 44px !important;
    height: 44px !important;
    font-size: 18px !important;
  }
  
  .bb-qty__input {
    width: 60px !important;
    height: 44px !important;
    font-size: 16px !important;
  }
  
  /* Button container */
  .bb-all-buttons {
    gap: 10px !important;
  }
  
  /* Stack buttons on mobile */
  .bb-top-row {
    flex-direction: column !important;
    gap: 10px !important;
  }
  
  .bb-top-row > * {
    width: 100% !important;
  }
  
  /* Add to cart button */
  .bb-add {
    width: 100% !important;
    height: 54px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    border-radius: 4px !important;
  }
  
  /* Buy now button */
  .bb-buy-now {
    width: 100% !important;
    height: 54px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    border-radius: 4px !important;
  }
  
  /* Shop Pay button */
  .bb-top-row .shopify-payment-button,
  .bb-top-row .shopify-payment-button__button,
  .bb-top-row [data-shopify-buttoncontainer] {
    width: 100% !important;
    height: 54px !important;
    min-height: 54px !important;
  }
  
  /* Trust badges - smaller on mobile */
  .bb-trust {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 15px !important;
    padding: 15px 0 !important;
    margin-top: 10px !important;
  }
  
  .bb-trust__item {
    font-size: 11px !important;
  }
}

/* ============================================
   PRODUCT DESCRIPTION - MOBILE
   ============================================ */

@media screen and (max-width: 767px) {
  .product-block-list__item--description {
    margin-top: 25px !important;
    padding-top: 20px !important;
    border-top: 1px solid #e5e5e5 !important;
  }
  
  .product-block-list__item--description .card {
    box-shadow: none !important;
    border: none !important;
  }
  
  .product-block-list__item--description .card__header {
    padding: 0 0 10px 0 !important;
  }
  
  .product-block-list__item--description .card__title {
    font-size: 18px !important;
    font-weight: 700 !important;
  }
  
  .product-block-list__item--description .card__section {
    padding: 0 !important;
  }
  
  .product-block-list__item--description .rte {
    font-size: 14px !important;
    line-height: 1.7 !important;
  }
  
  .product-block-list__item--description .rte h2,
  .product-block-list__item--description .rte h3 {
    font-size: 16px !important;
    margin-top: 20px !important;
    margin-bottom: 10px !important;
  }
  
  .product-block-list__item--description .rte ul,
  .product-block-list__item--description .rte ol {
    padding-left: 20px !important;
    margin: 10px 0 !important;
  }
  
  .product-block-list__item--description .rte li {
    margin-bottom: 6px !important;
  }
  
  .product-block-list__item--description .rte table {
    font-size: 12px !important;
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  
  /* Collapsible description */
  .card__collapsible-button {
    padding: 15px 0 !important;
    font-size: 16px !important;
  }
  
  .card__collapsible-content {
    padding: 0 !important;
  }
}

/* ============================================
   BREADCRUMBS - MOBILE
   ============================================ */

@media screen and (max-width: 767px) {
  .page__sub-header {
    margin-bottom: 10px !important;
  }
  
  .breadcrumb__list {
    padding: 8px 12px !important;
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    -webkit-overflow-scrolling: touch;
  }
  
  .breadcrumb__item {
    flex-shrink: 0 !important;
    font-size: 11px !important;
    max-width: 100px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
  
  .breadcrumb__list svg {
    width: 10px !important;
    height: 16px !important;
    margin: 0 4px !important;
  }
}

/* ============================================
   PRODUCT RECOMMENDATIONS - MOBILE  
   ============================================ */

@media screen and (max-width: 767px) {
  .product-block-list__item--complementary {
    margin-top: 30px !important;
    padding-top: 20px !important;
    border-top: 1px solid #e5e5e5 !important;
  }
  
  .product-block-list__item--complementary .card__header {
    padding: 0 0 15px 0 !important;
  }
  
  .product-block-list__item--complementary .scroller {
    padding: 0 !important;
  }
  
  .product-block-list__item--complementary .product-item {
    min-width: 140px !important;
  }
  
  .product-block-list__item--complementary .product-item__title {
    font-size: 12px !important;
  }
  
  .product-block-list__item--complementary .product-item__price {
    font-size: 14px !important;
    font-weight: 600 !important;
  }
}

/* ============================================
   GENERAL MOBILE FIXES
   ============================================ */

@media screen and (max-width: 767px) {
  /* Container padding */
  .container--flush {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
  
  /* Prevent horizontal scroll */
  .product-block-list,
  .product-block-list__wrapper,
  section[data-section-type="product"] {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }
  
  /* Fix any fixed width elements */
  img, video, iframe:not(#looxReviews iframe) {
    max-width: 100% !important;
    height: auto !important;
  }
  
  /* Hide zoom wrapper on mobile */
  .product__zoom-wrapper {
    display: none !important;
  }
}

/* ============================================
   EXTRA SMALL SCREENS (< 375px)
   ============================================ */

@media screen and (max-width: 374px) {
  .pm-title {
    font-size: 16px !important;
  }
  
  .pm-price__current {
    font-size: 24px !important;
  }
  
  .bb-add,
  .bb-buy-now {
    height: 50px !important;
    font-size: 15px !important;
  }
  
  .vs-pill__label {
    padding: 8px 12px !important;
    font-size: 12px !important;
  }
}

/* ============================================
   TABLET (768px - 999px)
   ============================================ */

@media screen and (min-width: 768px) and (max-width: 999px) {
  .product-block-list__wrapper {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: 20px !important;
  }
  
  .product-block-list__item--gallery {
    width: calc(50% - 10px) !important;
    flex: 0 0 calc(50% - 10px) !important;
  }
  
  .product-block-list__item--info {
    width: calc(50% - 10px) !important;
    flex: 0 0 calc(50% - 10px) !important;
  }
  
  .product-block-list__item--description,
  .product-block-list__item--content,
  .product-block-list__item--complementary {
    width: 100% !important;
    flex: 0 0 100% !important;
  }
}

/* ============================================
   BUY BUTTONS PADDING FIX
   ============================================ */

@media (max-width: 768px) {
  .product-form__buy-buttons {
    padding-bottom: 0px !important;
  }
/* ============================================
   LOOX REVIEWS - STACK ALL ON MOBILE
   Show all reviews vertically, no carousel
   ============================================ */

/*@media screen and (max-width: 767px) {
   Main containers - visible 
  .loox-widget,
  .loox-reviews-default,
  #looxReviews,
  .shopify-app-block {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    overflow: visible !important;
  }
  
  /* CAROUSEL CONTAINER - make it a vertical stack */
  /*[class*="loox"][class*="carousel"],
  [class*="loox"][class*="slider"],
  [class*="loox"][class*="swiper"],
  [class*="loox"][class*="track"],
  [class*="loox"][class*="slides"],
  .loox-reviews-carousel,
  .loox-carousel {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    overflow: visible !important;
    height: auto !important;
    transform: none !important;
    transition: none !important;
    width: 100% !important;
  }
  
  /* ALL SLIDES/ITEMS - show them all stacked */
  /*[class*="loox"][class*="carousel"] > *,
  [class*="loox"][class*="slider"] > *,
  [class*="loox"][class*="track"] > *,
  [class*="loox"][class*="slides"] > *,
  [class*="loox"] [class*="slide"],
  [class*="loox"] [class*="item"],
  .loox-carousel-slide,
  .loox-slide {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    transform: none !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex-shrink: 0 !important;
    margin-bottom: 20px !important;
  }
  
  /* Review cards themselves */
  /*.loox-review,
  .loox-review-box,
  .loox-review-card,
  [class*="loox-review"],
  [data-review-id] {
    display: block !important;
    visibility: visible !important;
    width: 100% !important;
    opacity: 1 !important;
    position: relative !important;
    transform: none !important;
  }
  
  /* Hide carousel navigation - not needed when stacked */
  /*[class*="loox"][class*="arrow"],
  [class*="loox"][class*="nav"]:not([class*="review"]),
  [class*="loox"][class*="dot"],
  [class*="loox"][class*="pagination"],
  .loox-carousel-arrow,
  .loox-carousel-dots {
    display: none !important;
  }
  
  /* Ensure wrapper doesn't clip */
  /*[class*="loox"][class*="wrapper"],
  [class*="loox"][class*="container"],
  [class*="loox"][class*="inner"] {
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
  }
  
  /* Override any width restrictions on track */
  /*[class*="loox"] [style*="width"],
  [class*="loox"] [style*="transform"] {
    width: 100% !important;
    transform: none !important;
  }
}

@media screen and (max-width: 999px) {
  [class*="loox"][class*="carousel"],
  [class*="loox"][class*="slider"] {
    overflow: visible !important;
  }
}*/

/* ==========================================================================
   PRODUCT PAGE - ENSURE PRICE & BUY BUTTON VISIBLE
   Fix for mobile - 8 Feb 2026
   ========================================================================== */

@media screen and (max-width: 767px) {
  /* Ensure price section is visible */
  .product-info__block-item--buy-buttons,
  .product-form__buy-buttons,
  .bb-price-section,
  .price-list {
    display: block !important;
    visibility: visible !important;
  }

  /* Price styling */
  .bb-price {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
  }

  /* Add to Basket button */
  .bb-add,
  .product-form__add-button,
  button[name="add"] {
    display: flex !important;
    visibility: visible !important;
    width: 100% !important;
    min-height: 52px !important;
    padding: 14px 24px !important;
    background: #2f3640 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 0 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    justify-content: center !important;
    align-items: center !important;
    margin-bottom: 10px !important;
  }

  /* Buy Now button */
  .bb-buy-now {
    display: block !important;
    visibility: visible !important;
    width: 100% !important;
  }

  /* WhatsApp CTA */
  .bb-whatsapp-cta {
    display: flex !important;
    visibility: visible !important;
    margin-top: 10px !important;
  }

  /* Quantity selector */
  .bb-qty {
    display: flex !important;
    visibility: visible !important;
    margin-bottom: 12px !important;
  }
}

/* ==========================================================================
   CRITICAL FIX - PRODUCT INFO CARD COLLAPSED STATE
   Ensure product info (title, price, buy) is ALWAYS visible on mobile
   Updated: 8 Feb 2026
   ========================================================================== */

@media screen and (max-width: 767px) {
  /* Override card--collapsed behavior on mobile - SHOW EVERYTHING */
  .product-block-list__item--info .card,
  .product-block-list__item--info .card.card--collapsed,
  .product-block-list__item--info .card.card--sticky {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    position: static !important;
    opacity: 1 !important;
  }

  .product-block-list__item--info .card__section {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 16px !important;
  }

  /* Ensure product form is visible */
  .product-block-list__item--info product-form,
  .product-block-list__item--info .product-form {
    display: block !important;
    visibility: visible !important;
  }

  /* Product meta block - title, price */
  .product-info__block-item--product-meta {
    display: block !important;
    visibility: visible !important;
    margin-bottom: 16px !important;
  }

  /* Variant selector block */
  .product-info__block-item--variant-selector {
    display: block !important;
    visibility: visible !important;
    margin-bottom: 16px !important;
  }

  /* Buy buttons block */
  .product-info__block-item--buy-buttons {
    display: block !important;
    visibility: visible !important;
  }

  /* Force info section to appear BEFORE description in flex order */
  .product-block-list__wrapper {
    display: flex !important;
    flex-direction: column !important;
  }

  .product-block-list__item--gallery {
    order: 1 !important;
  }

  .product-block-list__item--info {
    order: 2 !important;
    margin-top: 0 !important;
  }

  .product-block-list__item--description {
    order: 10 !important;
  }

  .product-block-list__item--content {
    order: 11 !important;
  }

  .product-block-list__item--complementary {
    order: 20 !important;
  }

  /* Remove any transforms or animations that might hide content */
  .product-block-list__item--info * {
    transform: none !important;
    animation: none !important;
  }
}
