/* Una escala visual compartida por tienda, cuenta, legales y operaciones. */
:root{--surface:#fff;--surface-soft:#f2f6f1;--border-ui:#dce6dc;--shadow-ui:0 8px 24px #153a2910}
body{background:#f5f7f3}
body .header{background:#fffefb;border-bottom:1px solid var(--border-ui);box-shadow:0 3px 14px #163d3208}
body .header nav a{padding-block:8px;color:#294d40}
body .header .search>div{background:#f2f5f0;border-color:var(--border-ui);border-radius:10px}
body[data-page=inicio] #main{max-width:1200px;margin:auto;padding:18px 20px 24px}
body[data-page=inicio] #main>section[id]{max-width:none;margin:0 0 16px;border:1px solid var(--border-ui);border-radius:18px;padding:24px!important;background:var(--surface);box-shadow:0 3px 16px #153a2905}
body[data-page=inicio] #main>.hero{background:linear-gradient(120deg,#fffef7 45%,#eaf3df);border-color:#d9e4cc;gap:28px}
body[data-page=inicio] #main>.hero .hero-visual{background:#e2edd3;border:1px solid #d4e1c6;border-radius:14px;padding:14px}
body[data-page=inicio] #main>.about{background:#ecf4e9}
body[data-page=inicio] #main>.contact-section{background:#f1f5ed}
body[data-page=inicio] .contact-card{background:white;border:1px solid var(--border-ui);border-radius:12px;box-shadow:none}
body[data-page=inicio] #main>.closing{border:1px solid #c9dcc5;border-radius:18px!important;padding:24px!important;background:#e5efde}
body[data-page=inicio] .hero-actions .button{border-radius:10px}
body[data-page=inicio] .eyebrow{color:#41744c;letter-spacing:.12em}
body[data-page=inicio] .steps article:last-child{border:0}
.faq-list details{border:1px solid var(--border-ui);border-radius:10px;background:white;margin:8px 0;padding:12px 14px!important}
.faq-list summary{font-size:13px;line-height:1.4;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;list-style:none}
.faq-list summary::after{content:'+';font-size:20px;color:#427550;line-height:1}
.faq-list details[open] summary::after{content:'−'}
.faq-list summary::-webkit-details-marker{display:none}
body[data-page=catalogo] .catalog-controls{border-color:var(--border-ui);background:white;border-radius:12px;box-shadow:0 2px 8px #163d3205}
body[data-page=catalogo] #catalog-facets{padding:4px 0;gap:10px;align-items:center}
body[data-page=catalogo] .products .product{border-color:var(--border-ui);box-shadow:0 3px 12px #163d3206;border-radius:14px}
body[data-page=catalogo] .products .product:hover{border-color:#a6c59e;box-shadow:0 5px 18px #163d3214}
body[data-page=catalogo] .categories button{border-radius:8px;padding:7px 10px}
body[data-page=carritos] #main>.household{max-width:1100px;padding:22px 24px!important}
body[data-page=carritos] #household-form{border:1px solid var(--border-ui);box-shadow:var(--shadow-ui);border-radius:16px}
body[data-page=carritos] #household-form>details{background:#f2f7ee;border-color:#dbe6d4;padding:11px 14px}
body[data-page=carritos] #household-form>details>summary{font-size:13px;color:#315a40;font-weight:600;cursor:pointer}
body dialog{border:1px solid var(--border-ui);box-shadow:0 24px 70px #12332230;border-radius:18px}
body .ux-modal>.dialog-head{padding-bottom:12px;border-bottom:1px solid var(--border-ui);margin-bottom:12px}
body #product-comparison-dialog{width:min(460px,calc(100vw - 24px))}
body #product-comparison-dialog ul{list-style:none;padding:0;margin:0}
body #product-comparison-dialog li{display:flex;justify-content:space-between;gap:20px;padding:13px 4px;border-bottom:1px solid var(--border-ui);font-size:13px}
body #product-comparison-dialog li:last-child{border:0}
body #product-comparison-dialog strong{white-space:nowrap;color:#075740}
body .account-main{max-width:1080px;padding:0 24px}
body .account-card{padding:20px;border-radius:14px;border-color:var(--border-ui);box-shadow:0 3px 14px #163d3206}
body .member-heading{border:1px solid var(--border-ui);border-radius:14px;background:#edf5e9}
body .profile-tabs{border-radius:12px;border:1px solid var(--border-ui);box-shadow:none;padding:5px;background:white}
body .profile-tabs button{border-radius:8px;font-size:13px;padding:9px 13px}
body .profile-tabs button[aria-selected=true]{background:#075740;color:white;border-color:transparent}
body[data-page=legal] main{max-width:860px;padding:24px 30px;margin:24px auto;background:white;border:1px solid var(--border-ui);border-radius:16px;box-shadow:var(--shadow-ui)}
body[data-page=legal] h1{font-size:30px;letter-spacing:-.04em}
body[data-page=legal] h2{font-size:19px;margin-top:26px;padding-top:18px;border-top:1px solid var(--border-ui)}
body select{border:1px solid #cad9c7!important;border-radius:9px!important;background-color:#fff!important;color:#244c3a;min-height:34px;padding:7px 10px!important;font-size:13px;cursor:pointer;transition:border-color .16s,box-shadow .16s}
body select:hover{border-color:#8caf81!important}
body select:focus-visible{outline:2px solid #5d9860;outline-offset:2px}
body select:disabled{color:#7b877a;background:#f0f3ed!important;cursor:default;opacity:.8}
/* El picker nativo mantiene teclado, validación, semántica y colocación en pantalla. */
@supports (appearance:base-select){
 body select,body select::picker(select){appearance:base-select}
 body select{display:inline-flex!important;align-items:center;justify-content:space-between;flex-wrap:nowrap;gap:10px}
 body select::picker(select){margin-block:5px;padding:5px;border:1px solid #cbdac8;border-radius:12px;box-shadow:0 12px 36px #163d3228;background:white;max-height:min(330px,55dvh);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;color:#244c3a;font-size:13px}
 body select option{min-height:32px;padding:8px 12px;border-radius:7px;gap:10px;white-space:normal;line-height:1.4}
 body select option:hover,body select option:focus{background:#edf5e7}
 body select option:checked{background:#e5f0db;color:#064e36;font-weight:600}
 body select option::checkmark{color:#398143}
 body select::picker-icon{color:#4c7b48;transition:rotate .18s;margin-left:10px}
 body select:open::picker-icon{rotate:180deg}
}
.anchored-panel[popover]{position:fixed;inset:auto;margin:0;box-sizing:border-box;padding:16px!important;border:1px solid #cbdac8;border-radius:12px;background:white;box-shadow:0 14px 44px #173c3228;overflow:auto;overscroll-behavior:contain;z-index:100;line-height:1.6;font-size:13px}
.anchored-panel[popover]:popover-open{animation:panel-enter .15s ease-out}
.anchored-panel[popover]::backdrop{background:transparent}
.anchored-panel[popover][data-house-panel]{transform:none!important;box-shadow:0 14px 44px #173c3228!important}
@keyframes panel-enter{from{opacity:0;translate:0 -5px}to{opacity:1;translate:0 0}}
body .content>.panel{border-radius:12px;border:1px solid #dce6dc;box-shadow:0 3px 16px #163d3205}
body .kpi{border-radius:12px;border:1px solid #dce6dc}
@media(max-width:999px){body select{font-size:14px}body[data-page=inicio] #main{padding:12px}body[data-page=inicio] #main>section[id]{padding:20px!important;border-radius:14px}body[data-page=legal] main{margin:16px 12px;padding:20px}body .account-main{padding:0 16px}.anchored-panel[popover]{font-size:14px}}
@media(prefers-reduced-motion:reduce){body select,body select::picker-icon{transition:none}.anchored-panel[popover]:popover-open{animation:none}}
@media print{body[data-page=legal] main{border:0;box-shadow:none;margin:0;padding:0}body #main>section{box-shadow:none!important}}

body[data-page=carritos] #household-form>details .anchored-panel[popover]{transform:none!important;box-shadow:0 14px 44px #173c3228!important}
.faq-list details>.anchored-panel[popover]{position:fixed;right:auto}
html[data-theme=dark] body{background:var(--paper)}
html[data-theme=dark] body select,html[data-theme=dark] body select::picker(select){background:var(--card)!important;color:var(--ink);border-color:var(--line)!important}
@media print{body{background:white!important}}

#products[aria-busy=true]{opacity:.55;pointer-events:none;transition:opacity .12s}
body .back-top:not([hidden]),body .scroll-assist{display:none!important}
html:has(.anchored-panel:popover-open){scroll-snap-type:none!important}
.faq-item{border:1px solid var(--border-ui);border-radius:10px;background:white;margin:8px 0}
.faq-question{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:12px 14px;border:0;border-radius:10px;background:transparent;color:var(--ink);font:600 13px/1.4 inherit;text-align:left;cursor:pointer}
.faq-question::after{content:'+';color:#427550;font-size:20px;line-height:1}
.faq-question[aria-expanded=true]{background:#edf5e7}
.faq-question[aria-expanded=true]::after{content:'−'}