/* SILVGLO Clean Final v4.1.2 — mobile and tablet layout.
 * Keep existing desktop visuals and Design Studio choices. Structural mobile
 * changes only, with no modifications to WooCommerce checkout scripts.
 */
:root { --sv-mobile-grid-cols: 2; --sv-mobile-payment-cols: 4; }

/* Do not let media, tables, and embedded content expand the viewport. */
.sv4-shell, .sv-container, .sv-page-content, .sv-woocommerce-shell,
.sv4-woocommerce-content, .sv4-commerce-content,
.sv4-shop-categories, .sv4-story-band, .sv4-about-row,
.sv4-arrivals, .sv4-category-grid, .sv-product-grid {
  min-width:0;
}
.sv-page-content :is(img,video,iframe,svg),
.sv4-commerce-content :is(img,video,iframe),
.woocommerce :is(img,video) {max-width:100%;height:auto;}
.woocommerce table.shop_table {max-width:100%;}

@media (max-width: 1024px) {
  /* Tablet: preserve the desktop header styling while making the menu usable. */
  .sv-header-inner {min-width:0;}
  .sv-header-actions {flex:0 0 auto;}
  .sv4-home-hero-copy, .sv4-editorial-hero-inner > div {min-width:0;}
  .sv4-woocommerce .woocommerce ul.products li.product,
  .woocommerce ul.products li.product {min-width:0;}
}

@media (max-width: 767px) {
  /* Type size and tap targets are comfortable on both Safari and Chrome. */
  body { -webkit-text-size-adjust:100%; text-size-adjust:100%; }
  .sv4-shell {width:calc(100% - 32px);max-width:100%;}
  .sv-container {width:calc(100% - 32px);max-width:100%;}
  .sv-header-inner {min-height:64px;height:auto;padding-block:9px;gap:9px;}
  .sv-brand {min-width:0;}
  .sv-brand a {font-size:clamp(23px,6.7vw,31px);}
  .sv-brand img, .sv-brand .custom-logo {max-width:clamp(110px,33vw,170px);max-height:54px;height:auto;}
  .sv-header-actions {gap:3px;}
  .sv-header-actions .sv-icon-button {min-width:40px;min-height:44px;padding:9px;}
  .sv-header-actions .sv-icon-button svg {width:21px;height:21px;}
  /* Keep the account icon visible on mobile as it is on desktop. */
  .sv-header-actions .sv-account {display:inline-flex;}
  .sv-primary-nav {z-index:30;}
  .sv-primary-nav.is-open {max-height:calc(100dvh - 70px);overflow-y:auto;-webkit-overflow-scrolling:touch;}
  .sv-nav-list a {font-size:15px;min-height:46px;line-height:1.4;display:flex;align-items:center;}
  .sv-search-panel {z-index:32;}
  .sv-search-panel form {flex-wrap:wrap;}
  .sv-search-panel input {font-size:16px;min-width:0;flex:1 1 150px;}
  .sv-search-panel button {min-height:44px;}
  .sv-announcement-inner {padding-block:8px;line-height:1.4;letter-spacing:.02em;}
  .sv-announcement-inner > span {font-size:10px;}

  /* Same hero photography, typography and call-to-action as desktop.
     On phones the copy moves beneath the visible part of the photo. */
  .sv4-home-hero, .sv4-home-hero-inner {min-height:var(--sv4-mobile-hero-height);}
  .sv4-home-hero:before {inset:0;background-position:64% 15%;}
  .sv4-home-hero:after {background:linear-gradient(to top,rgba(248,245,237,1) 0%,rgba(248,245,237,.94) 30%,rgba(248,245,237,.2) 70%,transparent 100%);}
  .sv4-home-hero-inner {display:flex;align-items:flex-end;}
  .sv4-home-hero-copy {width:100%;max-width:530px;padding:38px 0 26px;}
  .sv4-home-hero h1 {font-size:clamp(36px,9vw,52px);line-height:1.08;margin-bottom:12px;}
  .sv4-home-hero p {font-size:16px;line-height:1.55;margin-bottom:16px;max-width:480px;}
  .sv4-cta {min-height:48px;font-size:12px;padding:11px 21px;}
  .sv4-section-title h2,.sv4-about h2 {line-height:1.2;}

  /* Keep the same product cards, with square photographs and two columns. */
  .sv4-category-grid,.sv4-arrivals .sv-product-grid,
  .sv4-woocommerce .woocommerce ul.products,
  body.woocommerce-shop .woocommerce ul.products,
  body.woocommerce.archive .woocommerce ul.products,
  body.single-product .related.products ul.products {
    display:grid!important;
    grid-template-columns:repeat(var(--sv-mobile-grid-cols),minmax(0,1fr))!important;
    gap:22px 12px!important;
  }
  .sv4-category {min-height:0;aspect-ratio:1 / 1;}
  .sv4-category-copy {padding:12px;}
  .sv4-category strong {font-size:clamp(18px,5vw,23px);}
  .sv4-category small {font-size:10px;letter-spacing:.08em;}
  .sv4-arrivals .sv-product-card {min-width:0;}
  .sv4-arrivals .sv-product-title,
  .sv4-woocommerce ul.products li.product .woocommerce-loop-product__title,
  body.woocommerce.archive ul.products li.product .woocommerce-loop-product__title {
    font-size:var(--sv412-mobile-shop-title,17px)!important;line-height:1.45!important;overflow-wrap:anywhere;
  }
  .sv4-arrivals .sv-product-price,
  .sv4-woocommerce ul.products li.product .price,
  body.woocommerce.archive ul.products li.product .price {font-size:var(--sv412-mobile-shop-price,17px)!important;font-weight:700!important;}
  .sv4-woocommerce ul.products li.product a.button,
  body.single-product .related.products ul.products li.product a.button {
    max-width:100%!important;
    line-height:1.35!important;
    white-space:normal!important;
    padding:10px 8px!important;
    overflow-wrap:anywhere;
  }
  .sv4-woocommerce ul.products li.product img,
  .woocommerce.archive ul.products li.product img,
  body.single-product .related.products ul.products li.product img {
    width:100%!important;height:auto!important;aspect-ratio:1/1!important;object-fit:contain!important;
  }
  .sv4-woocommerce .woocommerce-result-count,
  .sv4-woocommerce .woocommerce-ordering {float:none;max-width:100%;font-size:14px;}
  .sv4-woocommerce select.orderby {max-width:100%;font-size:16px;}

  /* Editorial home/About blocks stack without hiding any content. */
  .sv4-story-band,.sv4-newsletter-inner {display:flex;flex-direction:column;}
  .sv4-story-band > * {width:100%;min-width:0;}
  .sv4-story-text {padding:30px 18px;}
  .sv4-story-text p,.sv4-about-body p {font-size:16px;line-height:1.7;}
  .sv4-story-photo {min-height:240px;}
  .sv4-story-perks {display:grid;grid-template-columns:1fr;gap:15px;padding:10px 20px 28px;}
  .sv4-newsletter-inner {align-items:stretch;gap:18px;}
  .sv4-newsletter-form, .sv4-newsletter .sv-newsletter-form {width:100%;max-width:100%;min-width:0;}
  .sv4-newsletter .sv-newsletter-form input[type=email] {font-size:16px;}
  .sv-consent {font-size:12px;}
  .sv4-about-row .sv4-about-image img {height:auto;aspect-ratio:4/3;object-fit:cover;}

  /* Product detail images and variation choices. Preserve original forms. */
  body.single-product div.product,
  body.single-product .woocommerce div.product {display:block!important;max-width:100%;}
  body.single-product div.product > div.images,
  body.single-product div.product > div.woocommerce-product-gallery,
  body.single-product div.product > div.summary,
  body.single-product .woocommerce div.product > div.summary {width:100%!important;max-width:100%!important;float:none!important;}
  body.single-product .woocommerce-product-gallery__image img {width:100%;height:auto;object-fit:contain;}
  body.single-product form.cart table.variations,
  body.single-product form.cart table.variations tbody,
  body.single-product form.cart table.variations tr {width:100%;min-width:0;}
  body.single-product form.cart table.variations select {width:100%;max-width:100%;font-size:16px!important;}
  body.single-product form.cart .quantity .qty {font-size:16px!important;}
  body.single-product .woocommerce-tabs {max-width:100%;}
  body.single-product .woocommerce-tabs ul.tabs {overflow-x:auto;max-width:100%;}

  /* Cart & checkout: same brand colors, blocks stack naturally on phones. */
  .sv4-commerce-content,.sv-woocommerce-shell {min-width:0;}
  .sv4-commerce-content .wc-block-cart__main,
  .sv4-commerce-content .wc-block-cart__sidebar,
  .sv4-commerce-content .wc-block-checkout__main,
  .sv4-commerce-content .wc-block-checkout__sidebar {width:100%!important;max-width:100%!important;float:none!important;}
  .sv4-commerce-content .wc-block-components-sidebar,
  .sv4-commerce-content .wc-block-checkout__sidebar {padding:16px!important;}
  .sv4-commerce-content .wp-block-woocommerce-cart,
  .sv4-commerce-content .wp-block-woocommerce-checkout {max-width:100%;min-width:0;}
  .sv4-commerce-content .wc-block-components-checkout-place-order-button,
  .sv4-commerce-content .wc-block-cart__submit-button {width:100%!important;white-space:normal;}
  .sv4-commerce-content .wc-block-components-address-form input,
  .sv4-commerce-content .wc-block-components-address-form select,
  .sv4-commerce-content .wc-block-components-text-input input {font-size:16px!important;}
  .wc-block-components-express-payment__event-buttons {flex-wrap:wrap;}
  .woocommerce-account .woocommerce-MyAccount-navigation,
  .woocommerce-account .woocommerce-MyAccount-content {float:none;width:100%;max-width:100%;}
  .woocommerce-account .woocommerce-MyAccount-navigation ul {margin:0 0 20px;padding:0;list-style:none;}
  .woocommerce-account .woocommerce-MyAccount-navigation li {padding:9px 0;border-bottom:1px solid #e6e8e2;}
  .sv-page-content form :is(input,textarea,select),.sv-contact-form :is(input,textarea) {max-width:100%;font-size:16px;}
  .sv-contact-form {max-width:100%;}

  /* Footer: identical content/order as desktop, stacked for narrow screens. */
  .sv-footer .sv-footer-topbar,
  .sv-footer .sv-footer-bottom {width:calc(100% - 32px);max-width:100%;}
  .sv-footer .sv-footer-topbar .sv-footer-menu {justify-content:center;gap:12px 16px;}
  .sv-footer .sv-footer-topbar .sv-footer-menu a {font-size:clamp(12px,3.2vw,14px)!important;}
  .sv-footer .sv-footer-topbar .sv-footer-social {flex-wrap:wrap;min-width:0;gap:16px;}
  .sv-footer .sv-footer-topbar .sv-footer-social a {min-width:34px;min-height:44px;}
  .sv-footer .sv-footer-topbar .sv-footer-payments-top {width:100%;max-width:100%;min-width:0;}
  .sv-footer .sv-footer-topbar .sv-footer-payment-badges {
    display:grid!important;
    grid-template-columns:repeat(var(--sv-mobile-payment-cols),minmax(0,1fr));
    justify-content:center;
    align-items:center;
    width:100%!important;
    max-width:370px;
    margin-inline:auto;
    gap:var(--sv406-pay-gap-m,8px);
  }
  .sv-footer .sv-footer-topbar .sv-footer-payment-badge {
    display:block;
    width:100%!important;
    min-width:0;
    max-width:var(--sv406-pay-width-m,75px)!important;
    height:var(--sv406-pay-height-m,53px)!important;
    margin-inline:auto;
    object-fit:contain;
  }
  .sv-footer .sv-footer-bottom .sv-footer-brand {max-width:100%;}
  .sv-footer .sv-footer-bottom .sv-footer-brand a {white-space:normal;}
  .sv-footer .sv-footer-bottom .sv-footer-brand span {font-size:clamp(12px,3.5vw,14px)!important;}
  .sv-footer .sv-footer-bottom .sv-footer-signature {font-size:12px!important;line-height:1.65;}
  .sv-footer .sv-footer-bottom .sv-footer-signature span {font-size:12px!important;}
}

@media (max-width: 359px) {
  .sv4-shell,.sv-container {width:calc(100% - 24px);}
  .sv-header-actions .sv-icon-button {min-width:34px;min-height:44px;padding:7px;}
  .sv-header-actions {gap:0;}
  .sv-brand a {font-size:22px;}
  .sv4-category-grid,.sv4-arrivals .sv-product-grid,
  .sv4-woocommerce .woocommerce ul.products,
  body.woocommerce-shop .woocommerce ul.products,
  body.woocommerce.archive .woocommerce ul.products,
  body.single-product .related.products ul.products {gap:18px 8px!important;}
  .sv-footer .sv-footer-topbar .sv-footer-payment-badges {gap:5px;}
}
