/* Shop Mattey v1.7.2 — mobile-first stabilization */
@media (max-width: 767px) {
  html, body { max-width: 100%; overflow-x: hidden; }
  body.shopmattey-site { padding-bottom: 74px; }
  .sm-container { width: calc(100% - 28px) !important; max-width: none !important; margin-inline: auto !important; }

  /* Header */
  .sm-announcement-inner { min-height: 34px !important; padding: 6px 0 !important; }
  .sm-announcement-benefits { width: 100%; text-align: center; }
  .sm-announcement-benefits span:first-child { display: block; white-space: normal; font-size: 12px; line-height: 1.25; }
  .sm-header-main { display: grid !important; grid-template-columns: 46px minmax(0,1fr) auto !important; align-items: center !important; min-height: 76px !important; gap: 8px !important; padding-block: 8px !important; }
  .sm-menu-toggle { justify-self: start; width: 44px !important; height: 44px !important; }
  .sm-brand { width: 116px !important; height: 58px !important; justify-self: center; }
  .sm-brand img.custom-logo, .sm-brand img.sm-default-logo, .sm-brand .custom-logo-link img { width: auto !important; height: auto !important; max-width: 108px !important; max-height: 56px !important; object-fit: contain !important; }
  .sm-header-actions { justify-self: end; display: flex !important; align-items: center !important; gap: 10px !important; min-width: 0; }
  .sm-header-actions .sm-action-link { min-width: 30px; width: 30px; height: 40px; padding: 0 !important; }
  .sm-header-actions svg { width: 24px !important; height: 24px !important; }
  .sm-header-mobile-search { width: calc(100% - 28px) !important; padding: 0 0 12px !important; }
  .sm-product-search { width: 100%; }
  .sm-product-search input[type=search] { width: 100% !important; height: 48px !important; font-size: 15px !important; }
  .sm-product-search button { width: 42px !important; height: 42px !important; top: 3px !important; right: 3px !important; }

  /* Drawer */
  .sm-mobile-drawer-panel { width: min(90vw, 360px) !important; padding: 20px !important; }
  .sm-mobile-menu, .sm-mobile-menu.sm-menu { display: block !important; width: 100% !important; overflow: visible !important; white-space: normal !important; }
  .sm-mobile-menu > li, .sm-mobile-menu.sm-menu > li { display: block !important; width: 100% !important; float: none !important; }
  .sm-mobile-menu a { display: flex !important; width: 100% !important; padding: 14px 2px !important; white-space: normal !important; border-bottom: 1px solid var(--sm-border) !important; }
  .sm-mobile-drawer-actions { margin-top: 8px; }

  /* Hero */
  .sm-hero-shell, .sm-hero, .sm-hero-grid, .sm-hero-copy, .sm-hero-visual { width: 100% !important; max-width: 100% !important; }
  .sm-hero-copy { padding: 30px 18px 24px !important; text-align: left !important; }
  .sm-hero-copy h1 { font-size: clamp(42px, 12vw, 58px) !important; line-height: .98 !important; max-width: 100% !important; overflow-wrap: normal !important; word-break: normal !important; }
  .sm-hero-copy p { font-size: 16px !important; line-height: 1.55 !important; max-width: 100% !important; }
  .sm-hero-actions { justify-content: flex-start !important; align-items: stretch; flex-wrap: wrap; }
  .sm-hero-actions .sm-button { min-height: 48px; }
  .sm-hero-visual { min-height: 280px !important; }

  /* Trust strip */
  .sm-service-grid { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; overflow: visible !important; }
  .sm-service-item { min-width: 0 !important; width: 100% !important; display: grid !important; grid-template-columns: 32px minmax(0,1fr) !important; gap: 10px !important; padding: 15px 10px !important; }
  .sm-service-item strong, .sm-service-item small { white-space: normal !important; word-break: normal !important; overflow-wrap: normal !important; hyphens: none !important; }
  .sm-service-item strong { font-size: 12px !important; line-height: 1.25 !important; }
  .sm-service-item small { font-size: 11px !important; line-height: 1.35 !important; }

  /* Homepage sections */
  .sm-section-heading-inline { gap: 12px; }
  .sm-section-heading-inline h2 { font-size: 32px !important; line-height: 1.05; }
  .sm-category-grid { display: flex !important; grid-template-columns: none !important; overflow-x: auto !important; gap: 14px !important; padding-bottom: 12px !important; }
  .sm-category-card { flex: 0 0 88px !important; width: 88px !important; min-width: 88px !important; }
  .sm-category-card-image, .sm-category-all-icon { width: 78px !important; height: 78px !important; }
  .sm-category-card strong { width: 100%; font-size: 12px !important; line-height: 1.25 !important; text-align: center; white-space: normal !important; word-break: normal !important; }
  .sm-occasion-grid { display: flex !important; grid-template-columns: none !important; overflow-x: auto !important; gap: 14px !important; }
  .sm-occasion-tile { flex: 0 0 78vw !important; min-width: 260px !important; max-width: 320px !important; min-height: 300px !important; }
  .sm-occasion-content { width: 66% !important; padding: 22px !important; }
  .sm-occasion-content strong { font-size: 28px !important; line-height: 1 !important; word-break: normal !important; }
  .sm-occasion-content small { font-size: 15px !important; line-height: 1.45 !important; }

  /* Homepage box process */
  .sm-box-how { display: grid !important; grid-template-columns: 1fr 1fr !important; overflow: hidden !important; }
  .sm-box-how > div { min-width: 0 !important; padding: 18px 12px !important; }
  .sm-box-how strong, .sm-box-how small { word-break: normal !important; overflow-wrap: normal !important; }

  /* Shop archive */
  body.post-type-archive-product #primary, body.tax-product_cat #primary,
  body.post-type-archive-product .site-main, body.tax-product_cat .site-main,
  .shopmattey-shop-main, .shopmattey-shop-main > .sm-container { width: 100% !important; max-width: 100% !important; min-width: 0 !important; }
  .sm-shop-hero { display: block !important; padding: 38px 22px !important; margin: 0 0 24px !important; }
  .sm-shop-hero h1 { font-size: 56px !important; line-height: 1 !important; }
  .sm-shop-description { max-width: 100% !important; font-size: 16px !important; line-height: 1.55 !important; word-break: normal !important; }
  .sm-category-filters { display: flex !important; overflow-x: auto !important; width: 100% !important; }
  .woocommerce ul.products { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; width: 100% !important; gap: 12px !important; margin: 0 !important; }
  .woocommerce ul.products::before, .woocommerce ul.products::after { display: none !important; }
  .woocommerce ul.products li.product { float: none !important; clear: none !important; width: auto !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; padding: 10px !important; }
  .woocommerce ul.products li.product img { width: 100% !important; height: auto !important; aspect-ratio: 1/1; object-fit: cover; }
  .woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 14px !important; line-height: 1.3 !important; word-break: normal !important; }
  .woocommerce ul.products li.product .price { font-size: 13px !important; line-height: 1.35 !important; }
  .woocommerce ul.products li.product .button, .sm-add-to-box-button, .sm-quick-view-button { width: 100% !important; min-width: 0 !important; white-space: normal !important; font-size: 12px !important; line-height: 1.2 !important; padding: 11px 8px !important; }

  /* Build your box application */
  .sm-box-builder-hero { padding: 38px 0 30px !important; }
  .sm-box-builder-layout { display: block !important; width: 100% !important; padding-top: 18px !important; }
  .sm-box-builder-main, .sm-box-summary { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 0 16px !important; padding: 16px !important; }
  .sm-box-summary { position: static !important; order: 0 !important; }
  .sm-box-steps { display: grid !important; grid-template-columns: repeat(4,minmax(0,1fr)) !important; gap: 4px !important; overflow: hidden !important; }
  .sm-box-steps li { min-width: 0 !important; width: auto !important; font-size: 10px !important; line-height: 1.15 !important; align-items: center !important; text-align: center !important; padding: 0 2px 10px !important; }
  .sm-box-steps li span { flex: 0 0 auto; }
  .sm-box-panel-heading { display: block !important; }
  .sm-box-panel-heading h2 { font-size: 38px !important; line-height: 1.05 !important; }
  .sm-box-product-grid { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 10px !important; }
  .sm-box-builder-controls { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 10px !important; position: sticky !important; bottom: 72px !important; padding: 12px !important; margin: 12px -4px -4px !important; background: rgba(255,255,255,.97) !important; box-shadow: 0 -8px 24px rgba(0,0,0,.08); z-index: 20 !important; }
  .sm-box-builder-controls .sm-button, .sm-box-builder-controls button { width: 100% !important; min-width: 0 !important; min-height: 48px !important; padding: 10px 8px !important; font-size: 12px !important; line-height: 1.2 !important; white-space: normal !important; }
  .sm-box-live-preview { min-height: 190px !important; }

  /* Account */
  .woocommerce-account .woocommerce { display: block !important; width: 100% !important; }
  .woocommerce-account .woocommerce-MyAccount-navigation { width: 100% !important; float: none !important; overflow-x: auto !important; margin-bottom: 20px !important; }
  .woocommerce-account .woocommerce-MyAccount-navigation ul { display: flex !important; width: max-content !important; min-width: 100%; gap: 8px; }
  .woocommerce-account .woocommerce-MyAccount-navigation li { flex: 0 0 auto; }
  .woocommerce-account .woocommerce-MyAccount-content { width: 100% !important; float: none !important; min-width: 0 !important; }
  .woocommerce-account h1, .woocommerce-account .entry-title { font-size: 46px !important; line-height: 1 !important; }
  .woocommerce-form-login, .woocommerce-form-register { width: 100% !important; max-width: 100% !important; padding: 22px !important; }
  .woocommerce-form-login .form-row, .woocommerce-form-register .form-row { width: 100% !important; }
  .woocommerce-form-login input, .woocommerce-form-register input { width: 100% !important; }

  /* Cart, footer, floating actions */
  .sm-whatsapp-fab { width: 54px !important; height: 54px !important; right: 14px !important; bottom: 86px !important; font-size: 18px !important; }
  .sm-mobile-bottom-nav { z-index: 999 !important; }
  .site-footer, .sm-footer { padding-bottom: 100px !important; }
}

@media (max-width: 380px) {
  .sm-brand { width: 98px !important; }
  .sm-brand img.custom-logo, .sm-brand img.sm-default-logo, .sm-brand .custom-logo-link img { max-width: 92px !important; }
  .sm-header-actions { gap: 6px !important; }
  .sm-service-grid { grid-template-columns: 1fr !important; }
  .sm-service-item { border-right: 0 !important; }
  .woocommerce ul.products { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 8px !important; }
  .woocommerce ul.products li.product { padding: 8px !important; }
  .sm-box-builder-controls { grid-template-columns: 1fr 1fr !important; }
}

/* v1.9.0 registration and checkout mobile priority */
@media(max-width:767px){
  .sm-register-page,.sm-register-intro,.sm-register-card{max-width:100%!important;min-width:0!important}
  .sm-register-page{display:block!important;width:calc(100% - 24px)!important}
  .sm-register-intro{margin-bottom:16px!important}
  .woocommerce-checkout form.checkout{display:block!important;width:100%!important}
  .woocommerce-checkout #customer_details,.woocommerce-checkout #order_review_heading,.woocommerce-checkout #order_review{width:100%!important;max-width:100%!important;min-width:0!important}
  .woocommerce-checkout form.checkout .form-row,.woocommerce-checkout form.checkout .form-row-first,.woocommerce-checkout form.checkout .form-row-last{width:100%!important;float:none!important;clear:both!important}
  .woocommerce-checkout form.checkout input.input-text,.woocommerce-checkout form.checkout textarea,.woocommerce-checkout form.checkout .select2-container{width:100%!important;max-width:100%!important}
}
