.hdp{--hdp-columns:4;--hdp-gap:24px;--hdp-accent:var(--e-global-color-primary,#888888);--hdp-title:var(--e-global-color-secondary,#202b26);--hdp-price:var(--e-global-color-text,#303e36);--hdp-background:#fff;--hdp-border:#E5E5E5;--hdp-button-bg:var(--hdp-accent);--hdp-button-text:#fff;--hdp-badge-bg:var(--hdp-accent);--hdp-badge-text:#fff;--hdp-rating:var(--hdp-price);--hdp-nav-bg:var(--hdp-background);--hdp-nav-text:var(--hdp-title);font-family:inherit;min-width:0;container-type:inline-size}
.hdp,.hdp *{box-sizing:border-box}
.hdp .hdp-track{display:grid;gap:var(--hdp-gap);align-items:stretch;min-width:0;list-style:none;margin:0;padding:6px 2px 14px}
.hdp--grid .hdp-track{grid-template-columns:repeat(var(--hdp-columns),minmax(0,1fr))}
.hdp--carousel .hdp-track{grid-auto-flow:column;grid-auto-columns:calc((100% - (var(--hdp-columns) - 1)*var(--hdp-gap))/var(--hdp-columns));overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x mandatory;scrollbar-width:thin}
.hdp .hdp-card{position:relative;display:flex;flex-direction:column;gap:14px;min-width:0;margin:0;padding:var(--hdp-padding,16px);border:1px solid var(--hdp-border);border-radius:var(--hdp-radius,16px);background:var(--hdp-background);color:var(--hdp-title);scroll-snap-align:start;transition:transform .22s ease,background-color .22s,border-color .22s}
.hdp .hdp-body{display:flex;flex:1;flex-direction:column;gap:10px;min-width:0}
.hdp .hdp-media{position:relative;min-width:0}
.hdp .hdp-image{display:block;aspect-ratio:var(--hdp-ratio,1);overflow:hidden;border-radius:var(--hdp-radius,10px);background:#f4f6f4}
.hdp .hdp-image img{display:block;width:100%;height:100%;max-width:100%;margin:0;object-fit:var(--hdp-image-fit,contain);transition:transform .3s ease}
.hdp .hdp-title{margin:0;padding:0;font-size:17px;font-weight:600;line-height:1.65;overflow-wrap:anywhere}
.hdp .hdp-title a{color:var(--hdp-title);text-decoration:none}
.hdp .hdp-price{color:var(--hdp-price);font-size:15px;font-weight:600;line-height:1.8}
.hdp .hdp-price del{opacity:.65;font-size:.85em;margin-inline-end:6px}
.hdp .hdp-price ins{background:none;text-decoration:none;color:inherit}
.hdp .hdp-price .amount{white-space:normal}
.hdp .hdp-action{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px;padding:10px 14px;margin-block-start:auto;border:0;border-radius:var(--hdp-radius,10px);background:var(--hdp-button-bg);color:var(--hdp-button-text);font:inherit;font-size:14px;line-height:1.5;text-decoration:none;transition:background-color .2s,color .2s}
.hdp .hdp-badge{position:absolute;inset-block-start:10px;inset-inline-start:10px;z-index:1;padding:5px 10px;border-radius:99px;background:var(--hdp-badge-bg);color:var(--hdp-badge-text);font-size:12px;font-weight:600;pointer-events:none}
.hdp .hdp-rating{font-size:13px;color:var(--hdp-rating);line-height:1.5}
.hdp .hdp-rating small{font-size:inherit}
.hdp .hdp-card:is(:hover,:focus-within){background:var(--hdp-background-hover,var(--hdp-background));border-color:var(--hdp-border-hover,var(--hdp-border))}
.hdp .hdp-card:is(:hover,:focus-within) .hdp-title a{color:var(--hdp-title-hover,var(--hdp-title))}
.hdp .hdp-card:is(:hover,:focus-within) .hdp-price{color:var(--hdp-price-hover,var(--hdp-price))}
.hdp .hdp-card:is(:hover,:focus-within) .hdp-action{background:var(--hdp-button-bg-hover,var(--hdp-button-bg));color:var(--hdp-button-text-hover,var(--hdp-button-text))}
.hdp .hdp-card:is(:hover,:focus-within) .hdp-badge{background:var(--hdp-badge-bg-hover,var(--hdp-badge-bg));color:var(--hdp-badge-text-hover,var(--hdp-badge-text))}
.hdp .hdp-card:is(:hover,:focus-within) .hdp-rating{color:var(--hdp-rating-hover,var(--hdp-rating))}
.hdp .hdp-navigation{display:flex;align-items:center;justify-content:center;gap:16px;margin-block-start:12px}
.hdp .hdp-navigation[hidden]{display:none}
.hdp--carousel .hdp-track{scrollbar-width:none;cursor:grab;scroll-snap-type:none;scroll-behavior:auto}
.hdp .hdp-card,.hdp .hdp-card *{cursor:inherit}
.hdp--grid .hdp-card{cursor:default}
.hdp--carousel .hdp-card{cursor:grab!important}
.hdp .hdp-card a,.hdp .hdp-card a *{cursor:pointer!important}
.hdp--carousel .hdp-track.is-dragging,.hdp--carousel .hdp-track.is-dragging *{cursor:grabbing!important}
.hdp--carousel .hdp-card:hover{transform:none}
.hdp--carousel .hdp-track::-webkit-scrollbar{display:none}
.hdp--carousel .hdp-track.is-dragging{cursor:grabbing;user-select:none;scroll-snap-type:none}
.hdp .hdp-scrollbar{appearance:none;-webkit-appearance:none;display:block;width:var(--hdp-bar-width,160px);max-width:100%;margin:0;padding:0;border:0;border-radius:99px;cursor:pointer;background:transparent;box-shadow:none;touch-action:pan-y}
.hdp .hdp-scrollbar::-webkit-slider-runnable-track{height:var(--hdp-bar-height,5px);background:var(--hdp-nav-bg,var(--hdp-border));border-radius:99px}
.hdp .hdp-scrollbar::-webkit-slider-thumb{-webkit-appearance:none;width:var(--hdp-thumb,32%);height:var(--hdp-bar-height,5px);background:var(--hdp-nav-text,var(--hdp-accent));border:0;border-radius:99px;box-shadow:0 1px 4px #0002;transition:background-color .2s}
.hdp .hdp-scrollbar::-moz-range-track{height:var(--hdp-bar-height,5px);background:var(--hdp-nav-bg,var(--hdp-border));border-radius:99px}
.hdp .hdp-scrollbar::-moz-range-thumb{width:var(--hdp-thumb,32%);height:var(--hdp-bar-height,5px);background:var(--hdp-nav-text,var(--hdp-accent));border:0;border-radius:99px}
.hdp .hdp-scrollbar:hover::-webkit-slider-thumb{background:var(--hdp-nav-text-hover,var(--hdp-accent))}
.hdp .hdp-scrollbar:hover::-moz-range-thumb{background:var(--hdp-nav-text-hover,var(--hdp-accent))}
.hdp .hdp-scrollbar:hover::-webkit-slider-runnable-track{background:var(--hdp-nav-bg-hover,var(--hdp-border))}
.hdp .hdp-scrollbar:hover::-moz-range-track{background:var(--hdp-nav-bg-hover,var(--hdp-border))}
.hdp .hdp-scrollbar:focus-visible{outline:2px solid var(--hdp-accent);outline-offset:2px}
.hdp a:focus-visible,.hdp button:focus-visible,.hdp .hdp-track:focus-visible{outline:2px solid var(--hdp-accent);outline-offset:3px}
.hdp .hdp-empty{padding:20px;text-align:center}
@media(prefers-reduced-motion:reduce){.hdp .hdp-card,.hdp .hdp-image img,.hdp .hdp-action{transition:none!important;transform:none!important}.hdp .hdp-track{scroll-behavior:auto}}
