/*
 * Barbie Collectible Premium Store Suite
 * Desktop designs remain unchanged. These rules only normalise tablet/mobile behaviour.
 */

/* Shared compact gutters on smaller screens. */
@media (max-width: 767px) {
  body.bcpsuite20260720-active {
    overflow-x: hidden;
  }

  body.bcpsuite-page-shop .bcss-shell,
  body.bcpsuite-page-category .bcss-shell,
  body.bcpsuite-page-product #bcsp-premium-product .bcsp-shell {
    width: calc(100% - 20px) !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* SHOP MOBILE: preserve the approved Shop banner as a clean full image card. */
@media (max-width: 767px) {
  body.bcpsuite-page-shop .bcss-hero {
    min-height: 0 !important;
    margin: 6px 0 24px !important;
    padding: 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body.bcpsuite-page-shop .bcss-hero-banner-card {
    width: 100% !important;
    overflow: hidden !important;
    border: 1px solid rgba(222, 183, 197, .60) !important;
    border-radius: 18px !important;
    background: #fdf5f8 !important;
    box-shadow: 0 14px 34px rgba(74, 39, 56, .10) !important;
  }

  body.bcpsuite-page-shop .bcss-hero-banner-card img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    object-position: center !important;
  }
}

/* CATEGORY MOBILE: keep the category-specific image, title and CTA in a premium overlay card. */
@media (max-width: 767px) {
  body.bcpsuite-page-category #bcpc-premium-category .bcpc-unified-hero {
    min-height: 520px !important;
    display: flex !important;
    align-items: flex-end !important;
    margin: 6px 0 26px !important;
    overflow: hidden !important;
    border-radius: 20px !important;
    background-size: cover !important;
    background-position: 70% top !important;
    box-shadow: 0 16px 38px rgba(89, 47, 64, .12) !important;
  }

  body.bcpsuite-page-category #bcpc-premium-category .bcpc-unified-hero__veil {
    background: linear-gradient(
      180deg,
      rgba(255, 250, 252, .02) 0%,
      rgba(255, 249, 251, .14) 31%,
      rgba(255, 248, 251, .78) 53%,
      rgba(255, 248, 251, .97) 70%,
      #fff8fb 100%
    ) !important;
  }

  body.bcpsuite-page-category #bcpc-premium-category .bcpc-unified-hero__content {
    width: 100% !important;
    max-width: none !important;
    padding: 238px 18px 22px !important;
  }

  body.bcpsuite-page-category #bcpc-premium-category .bcpc-unified-hero__eyebrow {
    margin-bottom: 8px !important;
    font-size: 8px !important;
    letter-spacing: .13em !important;
  }

  body.bcpsuite-page-category #bcpc-premium-category .bcpc-unified-hero__title {
    margin: 0 0 10px !important;
  }

  body.bcpsuite-page-category #bcpc-premium-category .bcpc-unified-hero__title span,
  body.bcpsuite-page-category #bcpc-premium-category .bcpc-unified-hero--long-title .bcpc-unified-hero__title span {
    font-size: clamp(30px, 9vw, 39px) !important;
    line-height: .98 !important;
  }

  body.bcpsuite-page-category #bcpc-premium-category .bcpc-unified-hero__title em,
  body.bcpsuite-page-category #bcpc-premium-category .bcpc-unified-hero--long-title .bcpc-unified-hero__title em {
    margin-top: 5px !important;
    font-size: clamp(27px, 8vw, 35px) !important;
    line-height: 1 !important;
  }

  body.bcpsuite-page-category #bcpc-premium-category .bcpc-unified-hero__description {
    display: -webkit-box !important;
    max-width: 100% !important;
    margin: 0 0 14px !important;
    overflow: hidden !important;
    color: #584950 !important;
    font-size: 12.5px !important;
    line-height: 1.55 !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
  }

  body.bcpsuite-page-category #bcpc-premium-category .bcpc-unified-hero__button {
    min-height: 45px !important;
    padding: 0 19px !important;
    border-radius: 9px !important;
    font-size: 9.5px !important;
  }

  body.bcpsuite-page-category #bcpc-premium-category .bcpc-unified-hero__trust {
    display: none !important;
  }
}

/* SINGLE PRODUCT MOBILE: one polished column without oversized text or media. */
@media (max-width: 767px) {
  body.bcpsuite-page-product #bcsp-premium-product .bcsp-shell {
    padding-top: 13px !important;
    padding-bottom: 46px !important;
  }

  body.bcpsuite-page-product .bcsp-breadcrumb {
    margin-bottom: 13px !important;
    font-size: 9px !important;
  }

  body.bcpsuite-page-product .bcsp-product-hero {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
  }

  body.bcpsuite-page-product .bcsp-gallery,
  body.bcpsuite-page-product .bcsp-summary,
  body.bcpsuite-page-product .bcsp-tabs,
  body.bcpsuite-page-product .bcsp-sidebar {
    border-radius: 18px !important;
  }

  body.bcpsuite-page-product .bcsp-gallery {
    padding: 9px !important;
  }

  body.bcpsuite-page-product .bcsp-gallery__stage {
    min-height: 0 !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 14px !important;
  }

  body.bcpsuite-page-product .bcsp-gallery__main {
    width: 100% !important;
    height: 100% !important;
    padding: 7px !important;
    object-fit: contain !important;
  }

  body.bcpsuite-page-product .bcsp-gallery__arrow {
    width: 38px !important;
    height: 38px !important;
  }

  body.bcpsuite-page-product .bcsp-gallery__thumb {
    flex-basis: 66px !important;
    width: 66px !important;
    height: 66px !important;
  }

  body.bcpsuite-page-product .bcsp-summary {
    padding: 21px 17px 19px !important;
  }

  body.bcpsuite-page-product .bcsp-summary__category {
    min-height: 25px !important;
    margin-bottom: 10px !important;
    padding: 5px 9px !important;
    font-size: 8px !important;
  }

  body.bcpsuite-page-product .bcsp-summary__title {
    font-size: clamp(27px, 8.4vw, 35px) !important;
    line-height: 1.03 !important;
  }

  body.bcpsuite-page-product .bcsp-summary__ornament {
    margin: 13px 0 12px !important;
  }

  body.bcpsuite-page-product .bcsp-summary__short {
    font-size: 12.5px !important;
    line-height: 1.62 !important;
  }

  body.bcpsuite-page-product .bcsp-summary-list {
    gap: 7px !important;
  }

  body.bcpsuite-page-product .bcsp-amazon-button,
  body.bcpsuite-page-product .bcsp-summary__purchase .button,
  body.bcpsuite-page-product .bcsp-summary__purchase a.button,
  body.bcpsuite-page-product .bcsp-summary__purchase button.button,
  body.bcpsuite-page-product .bcsp-summary__purchase .single_add_to_cart_button {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 50px !important;
    padding: 0 16px !important;
    font-size: 10.5px !important;
  }

  body.bcpsuite-page-product .bcsp-summary__assurance {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    margin-top: 18px !important;
    padding-top: 14px !important;
  }

  body.bcpsuite-page-product .bcsp-benefits {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    margin-top: 14px !important;
  }

  body.bcpsuite-page-product .bcsp-benefit {
    min-height: 92px !important;
    padding: 13px 12px !important;
  }

  body.bcpsuite-page-product .bcsp-benefit:nth-child(2n) {
    border-right: 0 !important;
  }

  body.bcpsuite-page-product .bcsp-benefit:nth-child(-n+2) {
    border-bottom: 1px solid rgba(227, 197, 208, .70) !important;
  }

  body.bcpsuite-page-product .bcsp-content-layout {
    gap: 14px !important;
    margin-top: 14px !important;
  }

  body.bcpsuite-page-product .bcsp-tabs__panel {
    padding: 20px 16px 22px !important;
    font-size: 12.5px !important;
  }

  body.bcpsuite-page-product .bcsp-sidebar {
    padding: 21px 18px 23px !important;
  }

  body.bcpsuite-page-product .bcsp-sidebar h2 {
    font-size: 23px !important;
  }

  body.bcpsuite-page-product .bcsp-related {
    margin-top: 34px !important;
  }

  body.bcpsuite-page-product .bcsp-section-heading h2 {
    font-size: 30px !important;
  }

  body.bcpsuite-page-product .bcsp-related-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body.bcpsuite-page-product .bcsp-related-card__image {
    height: 190px !important;
    padding: 10px !important;
  }

  body.bcpsuite-page-product .bcsp-related-card__body {
    min-height: 150px !important;
    padding: 12px !important;
  }

  body.bcpsuite-page-product .bcsp-related-card h3 {
    font-size: 11px !important;
  }
}

@media (max-width: 420px) {
  body.bcpsuite-page-product .bcsp-related-grid {
    grid-template-columns: 1fr !important;
  }

  body.bcpsuite-page-product .bcsp-related-card__image {
    height: 260px !important;
  }
}

/* V1.1 MOBILE PRODUCT GRID CONSISTENCY
 * Category archives now match the Shop mobile layout: one product card per row.
 */
@media (max-width: 767px) {
  body.bcpsuite-page-category #bcpc-premium-category .bcss-product-grid,
  body.bcpsuite-page-category #bcpc-premium-category .bcss-product-grid[data-view="grid"],
  body.bcpsuite-page-category #bcpc-premium-category .bcss-product-grid[data-view="list"] {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 14px !important;
  }

  body.bcpsuite-page-category #bcpc-premium-category .bcss-card,
  body.bcpsuite-page-category #bcpc-premium-category .bcss-product-grid[data-view="list"] .bcss-card {
    width: 100% !important;
    max-width: none !important;
    display: flex !important;
    flex-direction: column !important;
    grid-template-columns: none !important;
  }

  body.bcpsuite-page-category #bcpc-premium-category .bcss-card__media,
  body.bcpsuite-page-category #bcpc-premium-category .bcss-product-grid[data-view="list"] .bcss-card__media {
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    min-height: 0 !important;
  }

  body.bcpsuite-page-category #bcpc-premium-category .bcss-card__image,
  body.bcpsuite-page-category #bcpc-premium-category .bcss-product-grid[data-view="list"] .bcss-card__image {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
  }

  body.bcpsuite-page-category #bcpc-premium-category .bcss-card__content,
  body.bcpsuite-page-category #bcpc-premium-category .bcss-product-grid[data-view="list"] .bcss-card__content {
    width: 100% !important;
    padding: 16px 14px 14px !important;
    text-align: center !important;
  }

  body.bcpsuite-page-category #bcpc-premium-category .bcss-card__title,
  body.bcpsuite-page-category #bcpc-premium-category .bcss-card h3 {
    font-size: 14px !important;
    line-height: 1.45 !important;
  }
}
