#ehco-colors .ec-card-selection{margin:12px 0;padding:10px 0;border-top:1px solid #e3e8dd;border-bottom:1px solid #e3e8dd;font-size:12px;line-height:1.4}
#ehco-colors .ec-card-selection div+div{margin-top:8px}
#ehco-colors .ec-card-selection dt{font-size:10px;color:#627056;letter-spacing:.04em;text-transform:uppercase;margin:0 0 2px}
#ehco-colors .ec-card-selection dd{margin:0;font-weight:700;color:#35442b;overflow-wrap:anywhere}
#ehco-colors #ec-grid .ec-open-color,#ehco-colors #ec-grid .ec-open-color:hover{position:absolute;inset:0;z-index:1;width:100%;height:100%;padding:0;border:0;border-radius:9px;background:transparent;display:block}
#ehco-colors #ec-grid .ec-open-color:focus-visible{outline:3px solid #5b7b08;outline-offset:-4px}
#ehco-colors .ec-card-actions{display:flex;justify-content:flex-end;align-items:center;padding:8px 10px;border-top:1px solid #e3e8dd;background:#fff}
#ehco-colors #ec-grid .ec-card-actions .ec-fav{position:relative;inset:auto;z-index:2;min-height:38px;width:38px}
#ehco-colors #ec-grid .ec-card:hover{border-color:#8a9d72;box-shadow:0 3px 12px #23300012}
#ehco-colors #ec-grid .ec-card{contain-intrinsic-height:auto 540px;display:flex;flex-direction:column}
#ehco-colors #ec-grid .ec-swatch{flex-shrink:0}
#ehco-colors #ec-grid .ec-info{flex:1}
#ehco-colors #ec-grid.ec-hidden-prices .ec-price-list{display:block}
html:has(#ec-color-detail[open]){overflow:hidden;scrollbar-gutter:stable}
#ehco-colors .ec-color-dialog{width:min(1000px,calc(100vw - 48px));max-width:1000px;max-height:calc(100vh - 40px);max-height:calc(100dvh - 40px);padding:0;margin:auto;border:1px solid #ccd6c1;border-radius:18px;background:#fff;color:#202820;overflow:auto;overscroll-behavior:contain;box-shadow:0 24px 100px #0005}
#ehco-colors .ec-color-dialog::backdrop{background:#14200bb3}
#ehco-colors .ec-detail-head{position:sticky;top:0;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 28px;background:#fff;border-bottom:1px solid #e3e8dd}
#ehco-colors .ec-detail-head h2{font-size:30px;line-height:1.15;margin:0;overflow-wrap:anywhere}
#ehco-colors #ec-detail-code{font-size:15px;font-weight:700;line-height:1.3;margin:6px 0 0;color:#49650b}
#ehco-colors #ec-grid h3{margin-bottom:4px}
#ehco-colors .ec-detail-head .ec-similar{font-size:11px;margin-bottom:6px}
#ehco-colors #ec-detail-close{flex-shrink:0;min-height:44px;padding:8px 12px;font-size:13px}
#ehco-colors #ec-detail-close span{font-size:23px;line-height:1}
#ehco-colors .ec-detail-body{display:grid;grid-template-columns:1fr 1.12fr;gap:30px;padding:28px}
#ehco-colors .ec-detail-swatch{min-height:350px;border:1px solid #00000012;border-radius:12px}
#ehco-colors .ec-detail-info{min-width:0;align-self:center}
#ehco-colors .ec-detail-code{font-size:17px;color:#49650b;margin:0 0 16px}
#ehco-colors .ec-detail-code strong{font-size:22px}
#ehco-colors .ec-detail-info .ec-card-selection{font-size:16px;margin:0 0 18px;padding:0 0 16px;border-top:0}
#ehco-colors .ec-detail-info .ec-card-selection dt{font-size:11px}
#ehco-colors .ec-detail-info .ec-card-selection div+div{margin-top:12px}
#ehco-colors .ec-detail-selection{display:flex;align-items:center;gap:16px;margin:0 0 18px;padding:0 0 16px;border-bottom:1px solid #e3e8dd}
#ehco-colors .ec-detail-selection .ec-card-selection{flex:1;min-width:0;margin:0;padding:0;border:0}
#ehco-colors #ec-detail-paint-change{display:flex;flex:none;flex-direction:column;align-items:center;gap:4px;min-width:96px;padding:4px 4px 7px;border:1px solid #759329;border-radius:8px;background:#fff;color:#354b12}
#ehco-colors #ec-detail-paint-change:hover{background:#f2f7e7;border-color:#49650b}
#ehco-colors #ec-detail-paint-change:focus-visible{outline:3px solid #49650b;outline-offset:3px}
#ehco-colors #ec-detail-paint-change span{font-size:12px;font-weight:700;line-height:1.4}
#ehco-colors .ec-detail-paint-thumb{display:block;width:96px;height:110px;object-fit:contain;padding:6px;background:transparent;border:0;border-radius:4px}
#ehco-colors .ec-detail-list{font-size:13px;font-weight:700;color:#536340;margin-bottom:12px}
#ehco-colors .ec-detail-variants{display:grid;gap:10px}
#ehco-colors .ec-detail-variant{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 16px;background:#f5f8f0;border:1px solid #e4eadb;border-radius:9px}
#ehco-colors .ec-detail-variant div span{display:block;font-size:12px;color:#627056}
#ehco-colors .ec-detail-variant div strong{font-size:17px}
#ehco-colors .ec-detail-price{font-size:23px;text-align:right;line-height:1.25;color:#2e4c0b}
#ehco-colors .ec-detail-note{font-size:13px;color:#627056;line-height:1.6;margin-top:14px}
#ehco-colors #ec-detail-reveal{margin-top:18px}
#ehco-colors .ec-detail-disclaimer{padding:0 28px 22px;font-size:12px;color:#627056}
@media(max-width:600px){
 #ehco-colors .ec-card-selection{font-size:11px}
 #ehco-colors .ec-color-dialog{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);border-radius:13px}
 #ehco-colors .ec-detail-head{padding:16px;gap:10px}
 #ehco-colors .ec-detail-head h2{font-size:23px}
 #ehco-colors .ec-detail-body{grid-template-columns:1fr;gap:20px;padding:16px}
 #ehco-colors .ec-detail-swatch{min-height:0;height:210px}
 #ehco-colors .ec-detail-info .ec-card-selection{font-size:15px}
 #ehco-colors .ec-detail-selection{gap:12px}
 #ehco-colors #ec-detail-paint-change{min-width:80px}
 #ehco-colors .ec-detail-paint-thumb{width:80px;height:96px;padding:4px}
 #ehco-colors .ec-detail-price{font-size:21px}
 #ehco-colors .ec-detail-disclaimer{padding:0 16px 18px}
}

#ehco-colors .ec-detail-export{padding:0 28px 16px}
#ehco-colors .ec-detail-actions{display:flex;flex-wrap:wrap;gap:10px}
#ehco-colors .ec-detail-actions button{display:inline-flex;justify-content:center;align-items:center;gap:8px;min-height:44px;padding:9px 18px;font-size:14px;line-height:1.3}
#ehco-colors .ec-detail-actions button[hidden]{display:none}
#ehco-colors .ec-detail-actions button:disabled{opacity:.55;cursor:wait}
#ehco-colors .ec-detail-actions svg{width:19px;height:19px;flex:none}
#ehco-colors #ec-detail-share{background:#49650b;color:white;border-color:#49650b}
#ehco-colors #ec-detail-export-status{font-size:13px;line-height:1.5;color:#536340;margin:10px 0 0;max-width:700px}
@media(max-width:600px){
 #ehco-colors .ec-detail-body{gap:16px;padding-bottom:12px}
 #ehco-colors .ec-detail-swatch{height:180px}
 #ehco-colors .ec-detail-export{padding:0 16px 14px}
 #ehco-colors .ec-detail-actions button{flex:1;padding:9px 12px}
}
