/* QuickCart premium storefront — presentation only */
:root {
    --store-primary: #2563eb;
    --store-secondary: #1d4ed8;
    --store-accent: #f97316;
    --store-font: Inter, sans-serif;
    --store-bg: #f7f8fa;
    --store-surface: #fff;
    --store-surface-soft: #f3f4f6;
    --store-text: #111827;
    --store-muted: #6b7280;
    --store-border: #e5e7eb;
    --store-shadow: 0 8px 30px rgba(15, 23, 42, .07);
    --store-shadow-lg: 0 22px 55px rgba(15, 23, 42, .14);
}

.store-app {
    --qc-primary: var(--store-primary);
    --qc-primary-hover: var(--store-secondary);
    --qc-text: var(--store-text);
    --qc-text-secondary: var(--store-muted);
    --qc-bg: var(--store-bg);
    --qc-surface: var(--store-surface);
    --qc-border: var(--store-border);
    min-width: 320px;
    overflow-x: hidden;
    background: var(--store-bg);
    color: var(--store-text);
    font-family: var(--store-font), system-ui, sans-serif;
}

.store-app a { color: inherit; }
.store-app img { max-width: 100%; }
.store-container { width: 100%; max-width: 1500px; padding-right: 24px; padding-left: 24px; }
.store-skip-link { position: fixed; z-index: 1090; top: 8px; left: 8px; padding: 10px 16px; border-radius: 12px; background: var(--store-primary); color: #fff !important; transform: translateY(-150%); }
.store-skip-link:focus { transform: translateY(0); }

/* Keep button labels legible instead of inheriting the global link hover color. */
.store-app .btn-primary,
.store-app .btn-primary:hover,
.store-app .btn-primary:focus-visible,
.store-app .btn-primary:active,
.store-app .btn-primary.active,
.store-app .btn-success,
.store-app .btn-success:hover,
.store-app .btn-success:focus-visible,
.store-app .btn-success:active,
.store-app .btn-success.active,
.store-app .btn-danger,
.store-app .btn-danger:hover,
.store-app .btn-danger:focus-visible,
.store-app .btn-danger:active,
.store-app .btn-danger.active { color: #fff !important; }
.store-app .btn-light,
.store-app .btn-light:hover,
.store-app .btn-light:focus-visible,
.store-app .btn-light:active,
.store-app .btn-light.active { color: #111827 !important; }
.store-app .btn-outline-light { color: #fff !important; }
.store-app .btn-outline-light:hover,
.store-app .btn-outline-light:focus-visible,
.store-app .btn-outline-light:active,
.store-app .btn-outline-light.active { color: #111827 !important; }
.store-app .btn-outline-primary { color: var(--store-primary) !important; }
.store-app .btn-outline-primary:hover,
.store-app .btn-outline-primary:focus-visible,
.store-app .btn-outline-primary:active,
.store-app .btn-outline-primary.active { border-color: var(--store-primary); background: var(--store-primary); color: #fff !important; }
.store-app .btn-outline-secondary { border-color: #9ca3af; color: #4b5563 !important; }
.store-app .btn-outline-secondary:hover,
.store-app .btn-outline-secondary:focus-visible,
.store-app .btn-outline-secondary:active,
.store-app .btn-outline-secondary.active { border-color: #4b5563; background: #4b5563; color: #fff !important; }

/* Header */
.store-header { position: sticky; z-index: 1025; top: 0; height: 76px; border-bottom: 1px solid var(--store-border); background: rgba(255,255,255,.96); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
.store-header .navbar { height: 76px; padding: 0; }
.store-header .store-container { display: grid; grid-template-columns: minmax(220px,1fr) auto minmax(220px,1fr); align-items: center; gap: 24px; }
.store-brand { display: inline-flex; min-width: 0; align-items: center; gap: 12px; color: var(--store-text) !important; text-decoration: none; }
.store-brand img, .store-footer-logo { width: 48px; height: 48px; flex: 0 0 auto; border: 1px solid var(--store-border); border-radius: 14px; object-fit: cover; }
.store-brand-placeholder { display: inline-flex; width: 48px; height: 48px; flex: 0 0 auto; align-items: center; justify-content: center; border: 1px solid var(--store-border); border-radius: 14px; background: var(--store-surface-soft); color: var(--store-primary); font-size: 1.2rem; }
.store-brand-copy { display: flex; min-width: 0; align-items: flex-start; flex-direction: column; line-height: 1.2; }
.store-brand-copy strong { overflow: hidden; max-width: 230px; color: var(--store-text); font-size: 1rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.store-header-status { display: inline-flex; margin-top: 5px; padding: 3px 8px; align-items: center; gap: 6px; border-radius: 999px; font-size: .68rem; font-weight: 700; }
.store-header-status.is-open { background: #ecfdf3; color: #15803d; }.store-header-status.is-closed { background: #fef2f2; color: #dc2626; }
.store-status-dot { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: currentColor; }
.store-hero-kicker .store-status-dot.is-open { background: #4ade80; }.store-hero-kicker .store-status-dot.is-closed { background: #f87171; }
.store-desktop-nav { padding: 4px; align-items: center; justify-content: center; gap: 3px; border: 1px solid var(--store-border); border-radius: 14px; background: var(--store-surface-soft); box-shadow: inset 0 1px 0 rgba(255,255,255,.7); }
.store-desktop-nav a { display: inline-flex; min-height: 38px; padding: 8px 14px; align-items: center; justify-content: center; gap: 8px; border: 1px solid transparent; border-radius: 10px; color: #4b5563; font-size: .84rem; font-weight: 600; line-height: 1; text-decoration: none; white-space: nowrap; transition: border-color .18s ease, background-color .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease; }
.store-desktop-nav a .bi { color: #7c8798; font-size: .9rem; line-height: 1; transition: color .18s ease; }
.store-desktop-nav a:hover { border-color: rgba(229,231,235,.85); background: var(--store-surface); color: var(--store-text); box-shadow: 0 3px 10px rgba(15,23,42,.07); transform: translateY(-1px); }
.store-desktop-nav a:hover .bi { color: var(--store-primary); }
.store-desktop-nav a:focus-visible { border-color: var(--store-primary); background: var(--store-surface); color: var(--store-text); box-shadow: 0 0 0 3px color-mix(in srgb, var(--store-primary) 16%, transparent); }
.store-header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.store-header-icon, .store-menu-button { display: inline-flex; width: 44px; height: 44px; padding: 0; align-items: center; justify-content: center; border: 1px solid var(--store-border); border-radius: 13px; background: #fff; color: var(--store-text); font-size: 1rem; text-decoration: none; }
.store-header-icon:hover, .store-menu-button:hover { border-color: #cbd5e1; background: #f9fafb; color: var(--store-primary); }
.store-header-whatsapp, .store-header-call, .store-cart-button { display: inline-flex; min-height: 44px !important; padding: 9px 14px !important; align-items: center; gap: 8px; border-radius: 13px !important; font-size: .82rem; font-weight: 700; }
.store-header-whatsapp { border-color: #16a34a !important; background: #16a34a !important; color: #fff !important; }.store-header-whatsapp:hover { border-color: #15803d !important; background: #15803d !important; }
.store-header-call { border-color: var(--store-border) !important; background: #fff !important; color: var(--store-text) !important; }.store-header-call:hover { border-color: #cbd5e1 !important; background: #f9fafb !important; }
.store-cart-button { position: relative; border-color: var(--store-primary) !important; background: var(--store-primary) !important; color: #fff !important; }.store-cart-button:hover { border-color: var(--store-secondary) !important; background: var(--store-secondary) !important; }
.store-cart-count { display: inline-flex; min-width: 20px; height: 20px; padding: 0 5px; align-items: center; justify-content: center; border-radius: 999px; background: #fff; color: var(--store-primary); font-size: .68rem; }
.store-menu-button { min-height: 44px !important; }
.store-menu { background: #fff; color: var(--store-text); }.store-menu-link { display: flex; min-height: 48px; padding: 12px 14px; align-items: center; gap: 12px; border-radius: 12px; color: var(--store-text); font-weight: 600; text-decoration: none; }.store-menu-link:hover { background: #f3f4f6; color: var(--store-primary); }

/* Hero */
.store-hero { padding: 32px 0 0; background: #fff; }
.store-hero-card { position: relative; height: 380px; overflow: hidden; border-radius: 24px; background: #111827; box-shadow: var(--store-shadow); }
.store-hero-media { position: absolute; inset: 0; }.store-hero-media img { width: 100%; height: 100%; object-fit: cover; }.store-hero-media::after { position: absolute; content: ""; inset: 0; background: linear-gradient(90deg, rgba(3,7,18,.86) 0%, rgba(3,7,18,.66) 42%, rgba(3,7,18,.12) 78%); }
.store-hero-fallback { position: absolute; inset: 0; background: radial-gradient(circle at 82% 20%, rgba(255,255,255,.18), transparent 28%), linear-gradient(135deg, var(--store-primary), var(--store-secondary)); }
.store-hero-content { position: relative; z-index: 1; display: flex; height: 380px; padding: 48px 56px; align-items: center; color: #fff; }
.store-hero-copy { max-width: 720px; }.store-hero-kicker { display: flex; margin-bottom: 12px; align-items: center; gap: 8px; color: rgba(255,255,255,.88); font-size: .8rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.store-hero h1 { margin: 0 0 14px; color: #fff; font-size: 48px; font-weight: 700; letter-spacing: -.045em; line-height: 1.08; }
.store-hero-description { max-width: 640px; margin-bottom: 24px; color: rgba(255,255,255,.82); font-size: 18px; line-height: 1.6; }
.store-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }.store-hero-actions .btn { min-height: 50px; padding: 11px 20px; border-radius: 13px; }
.store-hero-actions .btn-success { border-color: #16a34a; background: #16a34a; }.store-hero-actions .btn-success:hover { border-color: #15803d; background: #15803d; }
.store-hero-actions .btn-ghost-light { --bs-btn-color: #fff; --bs-btn-hover-color: #111827; --bs-btn-active-color: #111827; --bs-btn-disabled-color: rgba(255,255,255,.7); border: 1px solid rgba(255,255,255,.78); background: rgba(15,23,42,.12); color: #fff !important; }
.store-hero-actions .btn-ghost-light:focus-visible { border-color: #fff; background: rgba(15,23,42,.2); color: #fff !important; box-shadow: 0 0 0 4px rgba(255,255,255,.24); }
.store-hero-actions .btn-ghost-light:hover,
.store-hero-actions .btn-ghost-light:active,
.store-hero-actions .btn-ghost-light.active { border-color: #fff; background: #fff; color: #111827 !important; }
.store-hero-meta { display: flex; margin-top: 22px; flex-wrap: wrap; gap: 10px 22px; color: rgba(255,255,255,.82); font-size: .85rem; }.store-hero-meta span { display: inline-flex; align-items: center; gap: 7px; }

/* Search, categories and catalog */
.store-main { min-height: 45vh; padding: 0 0 80px; background: linear-gradient(#fff 0, #fff 140px, var(--store-bg) 140px); }
.store-main > .store-container { padding-top: 32px; }
.store-catalog-toolbar { display: grid; margin-bottom: 28px; padding: 18px; grid-template-columns: minmax(0,1fr) 230px; align-items: center; gap: 18px; border: 1px solid rgba(229,231,235,.8); border-radius: 18px; background: #fff; box-shadow: 0 12px 35px rgba(15,23,42,.08); }
.store-search { position: relative; display: flex; min-width: 0; align-items: center; }.store-search > i { position: absolute; z-index: 2; left: 18px; color: #9ca3af; font-size: 1.05rem; }
.store-search .form-control { height: 56px; padding-right: 126px; padding-left: 48px; border: 1px solid #d1d5db; border-radius: 14px; background: #f9fafb; font-size: .95rem; }.store-search .form-control:focus { border-color: var(--store-accent); background: #fff; box-shadow: 0 0 0 4px color-mix(in srgb,var(--store-accent) 18%,transparent); }
.store-search-button { position: absolute; top: 5px; right: 5px; display: inline-flex; min-width: 108px; height: 46px; min-height: 46px !important; padding: 0 16px !important; align-items: center; justify-content: center; gap: 8px; border-color: var(--store-accent) !important; border-radius: 11px !important; background: var(--store-accent) !important; color: #fff !important; }.store-search-button:hover { border-color: color-mix(in srgb,var(--store-accent) 82%,#000) !important; background: color-mix(in srgb,var(--store-accent) 82%,#000) !important; }
.store-sort { width: 100%; height: 56px; border: 1px solid #d1d5db; border-radius: 14px; background-color: #fff; font-size: .9rem; font-weight: 600; }
.store-categories { display: flex; margin: 0 0 36px; padding: 2px 0 6px; gap: 16px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; }.store-categories::-webkit-scrollbar { display: none; }
.store-category-chip { display: inline-flex; min-height: 46px; padding: 10px 18px; flex: 0 0 auto; align-items: center; gap: 8px; border: 1px solid var(--store-border); border-radius: 999px; background: #fff; color: #4b5563; box-shadow: 0 2px 8px rgba(15,23,42,.035); font-size: .86rem; font-weight: 700; text-decoration: none; scroll-snap-align: start; transition: transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease; }
.store-category-chip:hover { border-color: color-mix(in srgb,var(--store-primary) 34%,#e5e7eb); color: var(--store-primary); transform: translateY(-1px); }.store-category-chip.is-active { border-color: var(--store-primary); background: var(--store-primary); color: #fff; box-shadow: 0 8px 18px color-mix(in srgb,var(--store-primary) 24%,transparent); }
.store-results-heading { margin-bottom: 24px; }.store-results-heading h2 { margin: 0; color: var(--store-text); font-size: 1.55rem; font-weight: 700; letter-spacing: -.025em; }.store-results-heading p { margin: 5px 0 0; color: var(--store-muted); font-size: .86rem; }
.store-product-grid { --bs-gutter-x: 28px; --bs-gutter-y: 28px; }

/* Product card */
.store-product-card { display: flex; height: 100%; overflow: hidden; border: 0; border-radius: 16px; background: #fff; box-shadow: 0 7px 24px rgba(15,23,42,.075); flex-direction: column; transition: transform .22s ease, box-shadow .22s ease; }
.store-product-card:hover { box-shadow: var(--store-shadow-lg); transform: translateY(-6px); }
.store-product-media { position: relative; height: 240px; flex: 0 0 240px; overflow: hidden; background: #f3f4f6; }.store-product-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }.store-product-card:hover .store-product-media img { transform: scale(1.04); }
.store-image-placeholder { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; color: #9ca3af; font-size: 2rem; }
.store-product-badges { position: absolute; z-index: 2; top: 14px; left: 14px; display: flex; flex-wrap: wrap; gap: 7px; max-width: calc(100% - 28px); }.store-badge { display: inline-flex; min-height: 27px; padding: 6px 10px; align-items: center; gap: 5px; border-radius: 999px; box-shadow: 0 4px 12px rgba(15,23,42,.1); font-size: .68rem; font-weight: 800; line-height: 1; }.store-badge-sale { background: #ef4444; color: #fff; }.store-badge-featured { background: #fff7d6; color: #92400e; }
.store-product-body { display: flex; padding: 22px; flex: 1 1 auto; flex-direction: column; }
.store-product-category { margin-bottom: 7px; color: #9ca3af; font-size: 12px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.store-product-name { display: -webkit-box; min-height: 2.5em; margin: 0 0 8px; overflow: hidden; color: var(--store-text); font-size: 22px; font-weight: 700; letter-spacing: -.025em; line-height: 1.25; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.store-product-description { display: -webkit-box; min-height: 2.9em; margin: 0 0 18px; overflow: hidden; color: var(--store-muted); font-size: .86rem; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.store-product-price { display: flex; margin-top: auto; align-items: baseline; flex-wrap: wrap; gap: 8px; }.store-price-current { color: var(--store-text); font-size: 1.45rem; font-weight: 800; letter-spacing: -.025em; }.store-price-old { color: #9ca3af; font-size: .88rem; text-decoration: line-through; }
.store-availability { display: inline-flex; margin-top: 8px; align-items: center; gap: 7px; color: #15803d; font-size: .78rem; font-weight: 700; }.store-availability.is-unavailable { color: #dc2626; }.store-availability::before { width: 8px; height: 8px; content: ""; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 3px rgba(22,163,74,.09); }
.store-product-action { display: flex; width: 100%; height: 52px; min-height: 52px !important; margin-top: 18px; align-items: center; justify-content: center; gap: 8px; border-radius: 13px !important; font-size: .9rem; font-weight: 700; }
[data-image-frame]:not(.is-loaded):has(img)::after { position: absolute; z-index: 1; content: ""; inset: 0; background: linear-gradient(100deg,#f3f4f6 25%,#fff 45%,#f3f4f6 65%); background-size: 200% 100%; animation: store-shimmer 1.3s infinite; }
@keyframes store-shimmer { to { background-position-x: -200%; } }

/* Product modal */
.store-product-modal .modal-dialog { max-width: 980px; }.store-product-modal .modal-content { overflow: hidden; border: 0; border-radius: 20px; background: #fff; color: var(--store-text); box-shadow: var(--store-shadow-lg); }.store-product-modal .modal-body { padding: 0; }
.store-modal-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); }.store-modal-gallery { padding: 28px; background: #f3f4f6; }.store-modal-main-image { width: 100%; aspect-ratio: 1/.86; border-radius: 16px; object-fit: cover; }.store-modal-details { max-height: min(80vh,760px); padding: 34px; overflow-y: auto; }.store-modal-category { color: var(--store-primary); font-size: .75rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }.store-modal-title { margin: 7px 0 10px; font-size: clamp(1.55rem,3vw,2.15rem); }.store-modal-description { color: var(--store-muted); font-size: .92rem; line-height: 1.65; }
.store-thumbnails { display: flex; margin-top: 14px; gap: 10px; overflow-x: auto; }.store-thumbnail { width: 66px; height: 66px; padding: 3px; flex: 0 0 auto; overflow: hidden; border: 2px solid transparent; border-radius: 12px; background: #fff; }.store-thumbnail img { width: 100%; height: 100%; border-radius: 8px; object-fit: cover; }.store-thumbnail.is-active { border-color: var(--store-primary); }
.store-option-group { margin-top: 22px; }.store-option-title { margin-bottom: 11px; color: var(--store-text); font-size: .88rem; font-weight: 800; }.store-option-label { min-height: 40px !important; padding: 8px 13px !important; border-color: var(--store-border) !important; border-radius: 11px !important; color: var(--store-text) !important; font-size: .8rem !important; }.btn-check:checked + .store-option-label { border-color: var(--store-primary) !important; background: color-mix(in srgb,var(--store-primary) 10%,#fff) !important; color: var(--store-primary) !important; }.store-extra { display: flex; padding: 11px 0; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--store-border); }.store-extra:last-child { border: 0; }.store-extra .form-check { margin: 0; }
.store-purchase-bar { display: grid; margin-top: 26px; padding-top: 22px; grid-template-columns: 120px minmax(0,1fr); gap: 12px; border-top: 1px solid var(--store-border); }.store-quantity { display: grid; grid-template-columns: 38px 1fr 38px; border: 1px solid var(--store-border); border-radius: 13px; overflow: hidden; }.store-quantity button { border: 0; background: transparent; color: var(--store-text); }.store-quantity input { width: 100%; min-width: 0; padding: 0; border: 0; background: transparent; color: var(--store-text); text-align: center; -moz-appearance: textfield; }.store-quantity input::-webkit-inner-spin-button { appearance: none; }.store-live-price { margin-top: 10px; color: var(--store-muted); font-size: .78rem; text-align: right; }.store-live-price strong { color: var(--store-text); }

/* Cart and checkout */
.store-cart-drawer { width: min(100%,470px) !important; background: #fff; color: var(--store-text); }.store-cart-drawer .offcanvas-body { padding: 0; }.store-cart-items { padding: 8px 22px; overflow-y: auto; }.store-cart-item { display: grid; padding: 18px 0; grid-template-columns: 76px minmax(0,1fr) auto; gap: 14px; border-bottom: 1px solid var(--store-border); }.store-cart-image { width: 76px; height: 76px; overflow: hidden; border: 1px solid var(--store-border); border-radius: 14px; background: #f3f4f6; }.store-cart-image img { width: 100%; height: 100%; object-fit: cover; }.store-cart-name { color: var(--store-text); font-size: .9rem; font-weight: 700; }.store-cart-meta { margin-top: 4px; color: var(--store-muted); font-size: .73rem; line-height: 1.5; }.store-cart-price { color: var(--store-text); font-size: .84rem; font-weight: 700; white-space: nowrap; }.store-cart-controls { display: flex; margin-top: 10px; align-items: center; gap: 8px; }.store-cart-controls .btn { width: 30px; min-height: 30px; padding: 0; border-radius: 9px; }.store-cart-remove { min-height: auto !important; padding: 2px !important; color: #dc2626 !important; font-size: .72rem; }.store-cart-footer { padding: 20px 22px 26px; border-top: 1px solid var(--store-border); background: #fff; box-shadow: 0 -8px 24px rgba(15,23,42,.04); }.store-cart-total { display: flex; margin-bottom: 18px; align-items: end; justify-content: space-between; }.store-cart-total small { display: block; color: var(--store-muted); }.store-cart-total strong { font-size: 1.3rem; }.store-empty-cart { display: flex; min-height: 420px; padding: 34px; align-items: center; justify-content: center; flex-direction: column; text-align: center; }.store-empty-cart-icon,.store-empty-icon { display: inline-flex; width: 70px; height: 70px; margin-bottom: 17px; align-items: center; justify-content: center; border-radius: 20px; background: color-mix(in srgb,var(--store-primary) 10%,#fff); color: var(--store-primary); font-size: 1.8rem; }
.store-page-header { margin: 32px 0 24px; }.store-page-header a { color: var(--store-muted); font-size: .86rem; text-decoration: none; }.store-page-header h1 { margin: 10px 0 5px; font-size: clamp(1.8rem,4vw,2.35rem); }.store-page-header p { margin: 0; color: var(--store-muted); }.store-checkout-card,.store-summary-card,.store-success-card { border: 1px solid var(--store-border); border-radius: 20px; background: #fff; box-shadow: var(--store-shadow); }.store-checkout-card { padding: clamp(22px,4vw,34px); }.store-form-section + .store-form-section { margin-top: 30px; padding-top: 28px; border-top: 1px solid var(--store-border); }.store-form-section-title { display: flex; margin-bottom: 19px; align-items: center; gap: 10px; font-size: 1.07rem; }.store-form-section-title span { display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; border-radius: 10px; background: color-mix(in srgb,var(--store-primary) 10%,#fff); color: var(--store-primary); font-size: .86rem; }.store-checkout-actions { display: grid; margin-top: 16px; grid-template-columns: auto minmax(0,1fr); align-items: stretch; gap: 10px; }.store-checkout-actions > .btn,.store-checkout-actions form .btn { display: inline-flex; min-height: 52px; align-items: center; justify-content: center; }.store-checkout-actions form { min-width: 0; }.store-summary-card { position: sticky; top: 100px; padding: 24px; }.store-summary-title { margin-bottom: 15px; font-size: 1.05rem; }.store-summary-item { display: grid; padding: 13px 0; grid-template-columns: 54px minmax(0,1fr) auto; gap: 11px; border-bottom: 1px solid var(--store-border); }.store-summary-image { width: 54px; height: 54px; overflow: hidden; border: 1px solid var(--store-border); border-radius: 11px; background: #f3f4f6; }.store-summary-image img { width: 100%; height: 100%; object-fit: cover; }.store-summary-totals { padding-top: 17px; }.store-summary-row { display: flex; margin-bottom: 7px; justify-content: space-between; color: var(--store-muted); font-size: .83rem; }.store-summary-grand { display: flex; margin-top: 14px; padding-top: 15px; justify-content: space-between; border-top: 1px solid var(--store-border); font-size: 1.1rem; font-weight: 700; }.store-detail-list { display: grid; margin: 0; grid-template-columns: 145px 1fr; }.store-detail-list dt,.store-detail-list dd { margin: 0; padding: 12px 0; border-bottom: 1px solid var(--store-border); }.store-detail-list dt { color: var(--store-muted); font-weight: 500; }.store-detail-list dd { overflow-wrap: anywhere; }.store-success-card { padding: clamp(30px,6vw,58px); text-align: center; }.store-success-copy { max-width:560px; }.store-success-icon { display: inline-flex; width: 86px; height: 86px; margin-bottom: 24px; align-items: center; justify-content: center; border-radius: 50%; background: #dcfce7; color: #16a34a; font-size: 2.6rem; box-shadow: 0 0 0 10px rgba(22,163,74,.07); }.store-order-number { max-width: 430px; margin: 25px auto; padding: 18px; border: 1px solid var(--store-border); border-radius: 15px; background: #f9fafb; }.store-whatsapp-status { display: inline-flex; margin-bottom: 19px; align-items: center; gap: 7px; color: var(--store-muted); font-size: .8rem; }

/* Footer and states */
.store-footer { padding: 68px 0 24px; border-top: 1px solid var(--store-border); background: #fff; }.store-footer-copy { max-width: 500px; color: var(--store-muted); font-size: .9rem; line-height: 1.65; }.store-footer-title { margin-bottom: 17px; color: var(--store-text); font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }.store-footer-link { display: flex; margin-bottom: 11px; align-items: flex-start; gap: 9px; color: var(--store-muted) !important; font-size: .86rem; text-decoration: none; overflow-wrap: anywhere; }.store-footer-link:hover { color: var(--store-primary) !important; }.store-social-links { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; }.store-social-links a { display: inline-flex; width: 42px; height: 42px; align-items: center; justify-content: center; border: 1px solid var(--store-border); border-radius: 12px; background: #fff; color: #4b5563; text-decoration: none; transition: transform .18s ease, border-color .18s ease, color .18s ease; }.store-social-links a:hover { border-color: color-mix(in srgb,var(--store-primary) 34%,#e5e7eb); color: var(--store-primary); transform: translateY(-2px); }.store-footer-bottom { display: flex; margin-top: 54px; padding-top: 20px; justify-content: space-between; gap: 12px; border-top: 1px solid var(--store-border); color: var(--store-muted); font-size: .76rem; }
.store-cms-links { display: block; }
.store-empty-state { padding: clamp(44px,8vw,84px) 24px; border: 1px solid var(--store-border); border-radius: 20px; background: #fff; box-shadow: var(--store-shadow); text-align: center; }.store-empty-state h3 { font-size: 1.2rem; }.store-empty-state p { max-width: 440px; margin-right: auto; margin-left: auto; color: var(--store-muted); }.store-app .pagination { gap: 6px; }.store-app .page-link { min-width: 42px; min-height: 42px; border-color: var(--store-border); border-radius: 11px !important; background: #fff; color: var(--store-text); text-align: center; }.store-app .page-item.active .page-link { border-color: var(--store-primary); background: var(--store-primary); color: #fff; }
.store-not-found { display: flex; min-height: 100vh; padding: 24px; align-items: center; justify-content: center; background: var(--store-bg); }.store-not-found-card { width: min(100%,620px); padding: clamp(34px,7vw,66px); border: 1px solid var(--store-border); border-radius: 24px; background: #fff; box-shadow: var(--store-shadow-lg); text-align: center; }.store-not-found-code { color: var(--store-primary); font-size: .78rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.store-app .form-control,.store-app .form-select { background-color: #fff; color: var(--store-text); }.store-app .modal-content,.store-app .offcanvas { border-color: var(--store-border); background: #fff; color: var(--store-text); }
.store-mobile-cart { position: fixed; z-index: 1020; right: 16px; bottom: max(16px,env(safe-area-inset-bottom)); left: 16px; display: flex; min-height: 56px !important; padding: 10px 18px !important; align-items: center; justify-content: space-between; gap: 14px; border: 0 !important; border-radius: 16px !important; background: var(--store-primary) !important; color: #fff !important; box-shadow: 0 16px 36px color-mix(in srgb,var(--store-primary) 34%,transparent); }.store-mobile-cart > span:first-child { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; }.store-mobile-cart-meta { font-size: .78rem; font-weight: 600; opacity: .88; }

/* Store-selected dark mode. Layout and dimensions remain identical. */
.store-app[data-theme="dark"] {
    --store-bg: #0b1120;
    --store-surface: #111827;
    --store-surface-soft: #1f2937;
    --store-text: #f8fafc;
    --store-muted: #a7b0c0;
    --store-border: #334155;
    --store-shadow: 0 10px 32px rgba(0,0,0,.28);
    --store-shadow-lg: 0 24px 58px rgba(0,0,0,.42);
    --qc-primary: var(--store-primary);
    --qc-primary-hover: var(--store-secondary);
    --qc-primary-soft: #172554;
    --qc-bg: var(--store-bg);
    --qc-surface: var(--store-surface);
    --qc-border: var(--store-border);
    --qc-border-strong: #475569;
    --qc-text: var(--store-text);
    --qc-text-secondary: var(--store-muted);
    --qc-text-subtle: #7c899b;
    color-scheme: dark;
}
.store-app[data-theme="dark"] .store-header { border-color: var(--store-border); background: rgba(11,17,32,.96); }
.store-app[data-theme="dark"] .store-brand img,
.store-app[data-theme="dark"] .store-footer-logo,
.store-app[data-theme="dark"] .store-brand-placeholder { border-color: var(--store-border); background: var(--store-surface-soft); }
.store-app[data-theme="dark"] .store-desktop-nav { border-color: var(--store-border); background: var(--store-surface-soft); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
.store-app[data-theme="dark"] .store-desktop-nav a { color: #cbd5e1; }
.store-app[data-theme="dark"] .store-desktop-nav a .bi { color: #94a3b8; }
.store-app[data-theme="dark"] .store-desktop-nav a:hover,
.store-app[data-theme="dark"] .store-desktop-nav a:focus-visible { border-color: #475569; background: var(--store-surface); color: #fff; box-shadow: 0 5px 14px rgba(0,0,0,.2); }
.store-app[data-theme="dark"] .store-desktop-nav a:hover .bi,
.store-app[data-theme="dark"] .store-desktop-nav a:focus-visible .bi { color: var(--store-primary); }
.store-app[data-theme="dark"] .store-header-icon,
.store-app[data-theme="dark"] .store-menu-button,
.store-app[data-theme="dark"] .store-header-call { border-color: var(--store-border) !important; background: var(--store-surface) !important; color: var(--store-text) !important; }
.store-app[data-theme="dark"] .store-header-icon:hover,
.store-app[data-theme="dark"] .store-menu-button:hover,
.store-app[data-theme="dark"] .store-header-call:hover { border-color: #64748b !important; background: var(--store-surface-soft) !important; }
.store-app[data-theme="dark"] .store-menu,
.store-app[data-theme="dark"] .store-menu .offcanvas-header,
.store-app[data-theme="dark"] .store-menu .offcanvas-body { background: var(--store-surface); color: var(--store-text); }
.store-app[data-theme="dark"] .store-menu-link:hover { background: var(--store-surface-soft); }
.store-app[data-theme="dark"] .store-hero { background: var(--store-bg); }
.store-app[data-theme="dark"] .store-main { background: linear-gradient(var(--store-bg) 0,var(--store-bg) 140px,#0b1120 140px); }
.store-app[data-theme="dark"] .store-catalog-toolbar { border-color: var(--store-border); background: var(--store-surface); box-shadow: var(--store-shadow); }
.store-app[data-theme="dark"] .store-search .form-control { border-color: #475569; background: var(--store-surface-soft); color: var(--store-text); }
.store-app[data-theme="dark"] .store-search .form-control::placeholder { color: #7c899b; }
.store-app[data-theme="dark"] .store-search .form-control:focus { border-color: var(--store-accent); background: var(--store-surface); }
.store-app[data-theme="dark"] .store-sort { border-color: #475569; background-color: var(--store-surface-soft); color: var(--store-text); }
.store-app[data-theme="dark"] .store-category-chip { border-color: var(--store-border); background: var(--store-surface); color: #cbd5e1; box-shadow: 0 3px 12px rgba(0,0,0,.15); }
.store-app[data-theme="dark"] .store-category-chip:hover { border-color: #64748b; color: #fff; }
.store-app[data-theme="dark"] .store-category-chip.is-active { border-color: var(--store-primary); background: var(--store-primary); color: #fff; }
.store-app[data-theme="dark"] .store-product-card { background: var(--store-surface); box-shadow: 0 8px 26px rgba(0,0,0,.24); }
.store-app[data-theme="dark"] .store-product-media,
.store-app[data-theme="dark"] .store-cart-image,
.store-app[data-theme="dark"] .store-summary-image { background: var(--store-surface-soft); }
.store-app[data-theme="dark"] [data-image-frame]:not(.is-loaded):has(img)::after { background: linear-gradient(100deg,#1f2937 25%,#334155 45%,#1f2937 65%); background-size: 200% 100%; }
.store-app[data-theme="dark"] .store-product-modal .modal-content,
.store-app[data-theme="dark"] .store-cart-drawer,
.store-app[data-theme="dark"] .store-cart-footer,
.store-app[data-theme="dark"] .store-checkout-card,
.store-app[data-theme="dark"] .store-summary-card,
.store-app[data-theme="dark"] .store-success-card { border-color: var(--store-border); background: var(--store-surface); color: var(--store-text); }
.store-app[data-theme="dark"] .store-modal-gallery { background: var(--store-surface-soft); }
.store-app[data-theme="dark"] .store-thumbnail { background: var(--store-surface); }
.store-app[data-theme="dark"] .btn-check:checked + .store-option-label { border-color: var(--store-primary) !important; background: color-mix(in srgb,var(--store-primary) 22%,#111827) !important; color: color-mix(in srgb,var(--store-primary) 55%,#fff) !important; }
.store-app[data-theme="dark"] .store-purchase-bar { background: var(--store-surface); }
.store-app[data-theme="dark"] .store-order-number { border-color: var(--store-border); background: var(--store-surface-soft); }
.store-app[data-theme="dark"] .store-form-section-title span,
.store-app[data-theme="dark"] .store-empty-cart-icon,
.store-app[data-theme="dark"] .store-empty-icon { background: color-mix(in srgb,var(--store-primary) 20%,#111827); color: color-mix(in srgb,var(--store-primary) 55%,#fff); }
.store-app[data-theme="dark"] .store-footer { border-color: var(--store-border); background: var(--store-surface); }
.store-app[data-theme="dark"] .store-social-links a { border-color: var(--store-border); background: var(--store-surface-soft); color: #cbd5e1; }
.store-app[data-theme="dark"] .store-social-links a:hover { border-color: #64748b; color: #fff; }
.store-app[data-theme="dark"] .store-empty-state,
.store-app[data-theme="dark"] .store-not-found-card { border-color: var(--store-border); background: var(--store-surface); }
.store-app[data-theme="dark"] .store-app .page-link,
.store-app[data-theme="dark"] .page-link { border-color: var(--store-border); background: var(--store-surface); color: var(--store-text); }
.store-app[data-theme="dark"] .page-item.active .page-link { border-color: var(--store-primary); background: var(--store-primary); color: #fff; }
.store-app[data-theme="dark"] .form-control,
.store-app[data-theme="dark"] .form-select { border-color: #475569; background-color: var(--store-surface-soft); color: var(--store-text); }
.store-app[data-theme="dark"] .form-control::placeholder { color: #7c899b; }
.store-app[data-theme="dark"] .form-control:focus,
.store-app[data-theme="dark"] .form-select:focus { border-color: var(--store-primary); background-color: var(--store-surface); color: var(--store-text); }
.store-app[data-theme="dark"] .form-check-label,
.store-app[data-theme="dark"] .store-option-label { color: var(--store-text) !important; }
.store-app[data-theme="dark"] .btn-outline-primary { color: color-mix(in srgb,var(--store-primary) 55%,#fff) !important; }
.store-app[data-theme="dark"] .btn-outline-primary:hover,
.store-app[data-theme="dark"] .btn-outline-primary:focus-visible,
.store-app[data-theme="dark"] .btn-outline-primary:active,
.store-app[data-theme="dark"] .btn-outline-primary.active { border-color: var(--store-primary); background: var(--store-primary); color: #fff !important; }
.store-app[data-theme="dark"] .btn-outline-secondary { border-color: #64748b; color: #e2e8f0 !important; }
.store-app[data-theme="dark"] .btn-outline-secondary:hover,
.store-app[data-theme="dark"] .btn-outline-secondary:focus-visible,
.store-app[data-theme="dark"] .btn-outline-secondary:active,
.store-app[data-theme="dark"] .btn-outline-secondary.active { border-color: #64748b; background: #334155; color: #fff !important; }
.store-app[data-theme="dark"] .btn-close { filter: invert(1) grayscale(1) brightness(1.8); }
.store-app[data-theme="dark"] .alert-success { border-color: #166534; background: #052e1b; color: #bbf7d0; }
.store-app[data-theme="dark"] .alert-warning { border-color: #92400e; background: #351b04; color: #fde68a; }
.store-app[data-theme="dark"] .alert-danger { border-color: #991b1b; background: #3b0a0a; color: #fecaca; }
.store-app[data-theme="dark"] .alert-info { border-color: #075985; background: #082f49; color: #bae6fd; }

@media (max-width: 1199.98px) {
    .store-header .store-container { grid-template-columns: minmax(210px,1fr) auto minmax(210px,1fr); gap: 16px; }
    .store-desktop-nav a { padding-right: 11px; padding-left: 11px; }
    .store-header-whatsapp,.store-header-call,.store-cart-button { padding-right: 11px !important; padding-left: 11px !important; }
}

@media (max-width: 991.98px) {
    .store-header .store-container { display: flex; }
    .store-header { height: 72px; }.store-header .navbar { height: 72px; }
    .store-cart-button { display: none; }
    .store-hero { padding-top: 24px; }.store-hero-card,.store-hero-content { height: 360px; }.store-hero-content { padding: 42px; }
    .store-product-media { height: 240px; flex-basis: 240px; }
    .store-summary-card { position: static; }
    .store-main { padding-bottom: 110px; }
}

@media (max-width: 767.98px) {
    .store-container { padding-right: 16px; padding-left: 16px; }
    .store-brand img,.store-brand-placeholder { width: 44px; height: 44px; border-radius: 13px; }.store-brand-copy strong { max-width: 170px; }
    .store-hero { padding-top: 16px; }.store-hero-card,.store-hero-content { height: 330px; }.store-hero-content { padding: 28px; align-items: flex-end; }.store-hero-media::after { background: linear-gradient(0deg,rgba(3,7,18,.9),rgba(3,7,18,.24)); }.store-hero h1 { font-size: 36px; }.store-hero-description { margin-bottom: 18px; font-size: 16px; }.store-hero-meta { margin-top: 16px; }.store-hero-actions .btn { min-height: 48px; }
    .store-main { background: linear-gradient(#fff 0,#fff 100px,var(--store-bg) 100px); }.store-main > .store-container { padding-top: 22px; }
    .store-catalog-toolbar { padding: 14px; grid-template-columns: 1fr; gap: 12px; }.store-sort { height: 52px; }.store-categories { margin-bottom: 28px; gap: 16px; }
    .store-results-heading h2 { font-size: 1.35rem; }
    .store-modal-grid { grid-template-columns: 1fr; }.store-modal-gallery { padding: 18px; }.store-modal-main-image { aspect-ratio: 1/.74; }.store-modal-details { max-height: none; padding: 22px; }.store-product-modal .modal-dialog { margin: .5rem; }.store-product-modal .modal-content { max-height: calc(100dvh - 1rem); overflow-y: auto; }.store-purchase-bar { position: sticky; z-index: 3; bottom: 0; margin-right: -22px; margin-left: -22px; padding: 15px 22px; background: #fff; box-shadow: 0 -8px 20px rgba(15,23,42,.07); }.store-live-price { text-align: left; }
    .store-footer { padding-top: 50px; padding-bottom: 96px; }.store-footer-bottom { margin-top: 38px; flex-direction: column; }
    .store-detail-list { grid-template-columns: 110px 1fr; font-size: .86rem; }
}

@media (max-width: 575.98px) {
    .store-header-status { display: none; }.store-brand-copy strong { max-width: 145px; }.store-header-actions { gap: 6px; }
    .store-hero > .store-container { padding: 0 12px; }.store-hero-card { border-radius: 20px; }.store-hero-card,.store-hero-content { height: 320px; }.store-hero-content { padding: 24px 20px; }.store-hero h1 { font-size: 32px; }.store-hero-description { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }.store-hero-meta { font-size: .75rem; }
    .store-search .form-control { height: 54px; padding-right: 60px; }.store-search-button { min-width: 44px; width: 44px; height: 44px; padding: 0 !important; }.store-sort { height: 50px; }
    .store-category-chip { min-height: 44px; padding: 9px 15px; }
    .store-product-grid { --bs-gutter-x: 12px; --bs-gutter-y: 18px; }
    .store-product-media { height: 158px; flex-basis: 158px; }.store-product-badges { top: 8px; left: 8px; gap: 4px; max-width: calc(100% - 16px); }.store-badge { min-height: 22px; padding: 5px 7px; font-size: .58rem; }
    .store-product-body { padding: 14px 12px; }.store-product-category { margin-bottom: 5px; font-size: 10px; }.store-product-name { min-height: 2.55em; margin-bottom: 6px; font-size: 16px; }.store-product-description { display: none; }.store-price-current { font-size: 1.08rem; }.store-price-old { font-size: .72rem; }.store-availability { margin-top: 6px; font-size: .68rem; }.store-product-action { height: 48px; min-height: 48px !important; margin-top: 13px; padding: 8px !important; font-size: .75rem; }
    .store-cart-drawer { height: min(88dvh,760px) !important; top: auto !important; border-top-left-radius: 22px; border-top-right-radius: 22px; }.store-cart-drawer.offcanvas-end { right: 0; bottom: 0; left: 0; width: 100% !important; border-left: 0; transform: translateY(100%); }.store-cart-drawer.offcanvas-end.showing,.store-cart-drawer.offcanvas-end.show:not(.hiding) { transform: none; }.store-cart-item { grid-template-columns: 62px minmax(0,1fr) auto; }.store-cart-image { width: 62px; height: 62px; }
    .store-checkout-card,.store-summary-card { border-radius: 16px; }.store-page-header { margin: 24px 0 18px; }.store-checkout-actions { grid-template-columns: 1fr; }.store-checkout-actions > .btn,.store-checkout-actions form,.store-checkout-actions form .btn { width: 100%; }.store-purchase-bar { grid-template-columns: 108px minmax(0,1fr); }
}

@media (prefers-reduced-motion: reduce) {
    .store-product-card,.store-product-media img,.store-category-chip,.store-social-links a,.store-desktop-nav a,.store-desktop-nav a .bi { transition: none; }
    [data-image-frame]:not(.is-loaded):has(img)::after { animation: none; }
}
