/* All new storefront styles are gated by the mobile shell (or the two new URL destinations). */
.mobile-shop { --mobile-muted:#586774; --mobile-border:#e4ebeb; background:#f7faf9; min-height:100dvh; color:#172d36; padding-bottom:calc(82px + env(safe-area-inset-bottom)); }
.mobile-shop.has-basket { padding-bottom:calc(146px + env(safe-area-inset-bottom)); }
.mobile-shop.mobile-checkout { padding-bottom:24px; }
.mobile-shop *, .mobile-catalog-fallback * { box-sizing:border-box; }
.mobile-shop a { text-decoration:none; }
.mobile-shop button, .mobile-shop input, .mobile-shop select, .mobile-shop .button { min-height:44px; font:inherit; }
.mobile-shop button, .mobile-catalog-fallback button { cursor:pointer; }
.mobile-shop button:disabled { opacity:.55; cursor:not-allowed; }
.mobile-shop :focus-visible, .mobile-catalog-fallback :focus-visible { outline:3px solid var(--primary); outline-offset:3px; }
.mobile-header { display:flex; align-items:center; gap:8px; padding:12px max(14px, env(safe-area-inset-right)) 12px max(14px, env(safe-area-inset-left)); background:#fff; border-bottom:1px solid var(--mobile-border); position:sticky; top:0; z-index:30; }
.mobile-brand { display:flex; gap:8px; align-items:center; flex:1; min-width:0; color:#172d36; font-size:14px; }
.mobile-brand img { width:36px; height:36px; object-fit:contain; }
.mobile-brand > i { color:var(--primary); font-size:24px; }
.mobile-brand strong { overflow-wrap:anywhere; }
.mobile-icon { border:0; background:transparent; color:inherit; position:relative; min-width:44px; min-height:44px; display:inline-flex; align-items:center; justify-content:center; font-size:22px; }
.mobile-badge { position:absolute; right:0; top:0; border-radius:20px; background:var(--primary); color:#fff; padding:2px 5px; font-size:11px; }
.mobile-content { max-width:760px; margin:auto; padding:16px; }
.mobile-shop h1, .mobile-catalog-fallback h1 { font-size:24px; line-height:1.2; margin:4px 0 18px; letter-spacing:-.5px; }
.mobile-shop h2, .mobile-catalog-fallback h2 { font-size:17px; line-height:1.35; margin:0; }
.mobile-shop p { line-height:1.5; }
.mobile-home-title { font-size:18px!important; }
.mobile-tabs { position:fixed; inset:auto 0 0; z-index:40; display:grid; grid-template-columns:repeat(5,1fr); padding:7px 8px calc(7px + env(safe-area-inset-bottom)); background:#fff; border-top:1px solid var(--mobile-border); box-shadow:0 -4px 24px #102f3810; }
.mobile-tabs a { min-height:52px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; border-radius:14px; color:#586774; font-size:11px; }
.mobile-tabs i { font-size:19px; }
.mobile-tabs .selected { background:color-mix(in srgb,var(--primary) 12%,white); color:var(--primary-dark); font-weight:700; }
.mobile-basket { position:fixed; left:12px; right:12px; bottom:calc(78px + env(safe-area-inset-bottom)); z-index:39; min-height:52px; padding:12px 16px; border-radius:14px; background:var(--primary); color:#fff; display:flex; align-items:center; justify-content:space-between; gap:10px; box-shadow:0 4px 16px #0002; font-size:14px; }
.mobile-delivery { display:flex; align-items:center; gap:12px; width:100%; text-align:left; padding:12px; background:#fff; border:1px solid var(--mobile-border); border-radius:14px; margin-bottom:14px; }
.mobile-delivery > span:nth-child(2) { flex:1; }
.mobile-delivery strong, .mobile-delivery small { display:block; }
.mobile-delivery small { font-size:12px; color:var(--mobile-muted); margin-top:4px; }
.mobile-delivery i { color:var(--primary); }
.mobile-search-entry,.mobile-search { display:flex; align-items:center; gap:12px; background:#fff; border:1px solid #cedbd9; padding:6px 12px; border-radius:12px; min-height:48px; color:var(--mobile-muted); margin:14px 0; }
.mobile-search input { flex:1; min-width:0; border:0; background:transparent; }
.mobile-campaigns { display:flex; overflow:auto; scroll-snap-type:x mandatory; gap:12px; margin:18px 0; }
.mobile-campaigns a { flex:0 0 100%; scroll-snap-align:start; }
.mobile-campaigns img { display:block; width:100%; max-height:190px; object-fit:contain; border-radius:16px; background:#fff; }
.mobile-section-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:22px 0 12px; }
.mobile-section-heading a { color:var(--primary-dark); font-size:13px; white-space:nowrap; padding:10px 0; }
.mobile-chips { display:flex; overflow:auto; gap:8px; padding:3px 0 10px; }
.mobile-chips a,.mobile-chips button { display:flex; align-items:center; flex-shrink:0; border:1px solid var(--mobile-border,#dde6e4); border-radius:24px; padding:10px 16px; background:#fff; color:#283e46; white-space:nowrap; min-height:44px; }
.mobile-chips .selected { background:var(--primary); color:white; }
.mobile-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.mobile-product { min-width:0; background:white; border:1px solid var(--mobile-border,#dde6e4); border-radius:16px; padding:10px; display:flex; flex-direction:column; }
.mobile-product-link { color:inherit; flex:1; text-decoration:none; }
.mobile-product-image { position:relative; aspect-ratio:1.12; margin-bottom:10px; }
.mobile-product-image img { width:100%; height:100%; object-fit:contain; }
.mobile-product h3 { font-size:13px; line-height:1.4; font-weight:650; margin:0 0 5px; overflow-wrap:anywhere; }
.mobile-product p,.mobile-product small { font-size:11px; color:#586774; margin:2px 0 5px; }
.mobile-product-buy { display:flex; align-items:end; justify-content:space-between; gap:5px; margin-top:12px; }
.mobile-product-buy strong { display:block; font-size:15px; color:var(--primary-dark); }
.mobile-product-buy del { font-size:11px; color:#687680; }
.mobile-add { border:0; border-radius:50%; width:44px; min-width:44px; height:44px; background:var(--primary); color:#fff; display:inline-flex; align-items:center; justify-content:center; }
.mobile-discount { position:absolute; top:0; right:0; border-radius:20px; background:var(--primary-dark); color:#fff; padding:4px 7px; font-size:11px; }
.mobile-category-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.mobile-category-grid a { display:flex; flex-direction:column; align-items:flex-start; gap:12px; padding:20px 16px; background:color-mix(in srgb,var(--primary) 9%,white); color:#172d36; border-radius:16px; overflow-wrap:anywhere; }
.mobile-category-grid i { color:var(--primary); font-size:23px; }
.mobile-category-grid small { color:#586774; font-size:12px; }
.mobile-suggestions { padding:5px 10px; background:white; border:1px solid #dce6e3; border-radius:12px; }
.mobile-suggestions button { width:100%; display:flex; justify-content:space-between; gap:10px; padding:10px 0; text-align:left; background:none; border:0; border-bottom:1px solid #edf1ef; }
.mobile-sheet { margin:auto 0 0; width:100%; max-width:none; max-height:85dvh; border:0; border-radius:24px 24px 0 0; padding:20px 20px calc(20px + env(safe-area-inset-bottom)); overflow:auto; color:#172d36; }
.mobile-sheet::backdrop { background:#112d3c80; }
.mobile-sheet label { display:flex; flex-direction:column; gap:8px; margin:14px 0; }
.mobile-sheet input,.mobile-sheet select { min-width:0; width:100%; min-height:48px; border:1px solid #ccd9d6; border-radius:10px; padding:10px; background:#fff; font-size:16px; }
.mobile-price-fields { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.mobile-sheet-actions { display:flex; gap:12px; position:sticky; bottom:0; padding-top:16px; background:#fff; }
.mobile-sheet-actions > * { flex:1; }
.mobile-active-filters { font-size:13px; }
.mobile-active-filters button { background:none; color:var(--primary-dark); border:0; text-decoration:underline; }
.mobile-pagination { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:24px 0; }
.mobile-empty { padding:24px 10px; text-align:center; }
.mobile-welcome,.mobile-install { background:color-mix(in srgb,var(--primary) 10%,white); border-radius:16px; padding:24px 18px; margin-bottom:20px; text-align:center; }
.mobile-welcome > i { font-size:28px; color:var(--primary); margin-bottom:15px; }
.mobile-welcome p,.mobile-install p { font-size:14px; color:#586774; }
.mobile-account-links { background:white; border:1px solid #e1e9e6; border-radius:16px; margin-bottom:20px; }
.mobile-account-links > a,.mobile-account-links > button { display:flex; align-items:center; gap:12px; width:100%; text-align:left; padding:16px; background:none; color:#172d36; border:0; border-bottom:1px solid #edf1ef; }
.mobile-account-links > a > span:nth-child(2),.mobile-account-links > button > span:nth-child(2) { flex:1; }
.mobile-account-links small { display:block; font-size:12px; color:#586774; margin-top:5px; }
.mobile-support { padding:16px; }
.mobile-support a { display:block; padding:12px 0; }
.mobile-support .store-chat { position:static; }
.mobile-support .store-chat-fab { position:static; width:100%; border-radius:12px; }
.mobile-support .store-chat-panel { position:fixed; inset:80px 12px calc(148px + env(safe-area-inset-bottom)); width:auto; height:auto; max-height:none; z-index:55; }
.mobile-neighborhoods button { display:flex; justify-content:space-between; gap:12px; width:100%; padding:12px 0; background:none; border:0; border-bottom:1px solid #e2ebe7; }
.mobile-notice { padding:12px; background:#fff3d8; border-radius:12px; font-size:13px; white-space:pre-line; }
/* Reused purchase/account pages keep their logic, with mobile-only spacing and stacking. */
.mobile-shop .main-content { padding:0; }
.mobile-shop .split-grid,.mobile-shop .checkout-layout,.mobile-shop .product-detail { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; }
.mobile-shop .page-header { flex-wrap:wrap; gap:12px; }
.mobile-shop .form-grid { grid-template-columns:minmax(0,1fr); }
.mobile-shop input,.mobile-shop select,.mobile-shop textarea { max-width:100%; font-size:16px; }
.mobile-shop .detail-image img { max-height:300px; object-fit:contain; }
.mobile-shop .cart-summary-mobile,.mobile-shop .mobile-cart-bar { display:none; }
.mobile-shop .product-detail .back-link { display:none; }
.mobile-catalog-fallback .mobile-grid { grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); }
@media (prefers-reduced-motion:reduce) { .mobile-shop * { scroll-behavior:auto!important; animation:none!important; transition:none!important; } }
.mobile-experience-shell .toast-host { top:86px; bottom:auto; }
.mobile-shop .two-column,.mobile-shop .checkout-experience-grid { grid-template-columns:minmax(0,1fr); }
.mobile-store-links { font-size:12px; text-align:center; padding:22px 0 8px; line-height:1.8; }
.mobile-store-links a { color:#465a63; }
.mobile-store-info { background:white; padding:20px; border-radius:16px; }
.mobile-store-info dl { display:grid; gap:8px; }
.mobile-store-info dt { font-size:12px; color:#586774; }
.mobile-store-info dd { margin:0 0 8px; overflow-wrap:anywhere; }
.mobile-shop .mobile-install .button { margin:4px; }
.mobile-shop .summary-panel { display:block; position:static; width:100%; }
.mobile-shop .page-header { margin:0 0 18px; padding:0; }
.mobile-shop .page-header h1 { font-size:24px; }
.mobile-shop .page-header .eyebrow { display:none; }
.mobile-shop .cart-line { padding:12px; grid-template-columns:64px minmax(0,1fr); gap:12px; }
.mobile-shop .cart-line img { width:64px; height:64px; object-fit:contain; }
.mobile-shop .cart-line .quantity-control { grid-column:2; }
.mobile-shop .cart-line h2 { font-size:15px; }
.mobile-shop .cart-line p { font-size:12px; margin:5px 0; }
.mobile-shop .quantity-control button { min-width:44px; }
/* The category search has its own 44px clear button. */
.mobile-search input[aria-label="Buscar categoria"]::-webkit-search-cancel-button { -webkit-appearance:none; appearance:none; }