.ht-product-lightbox{height:100vh;height:100dvh;overflow:hidden;color:var(--ht-ink, #1c1b19);background:var(--ht-cream, #f6f2ec)}.ht-product-lightbox .product-media-modal__dialog{box-sizing:border-box;display:grid;grid-template-rows:auto minmax(0,1fr) auto;align-items:stretch;height:100%;padding:20px 32px 14px;gap:16px;outline:none}.ht-lightbox-header{display:grid;grid-template-columns:180px minmax(0,1fr) 180px;align-items:center;gap:24px;min-height:44px}.ht-lightbox-logo{display:block;width:180px;height:auto}.ht-lightbox-title{margin:0;text-align:center;font:400 15px/1.5 var(--font-body-family);color:var(--ht-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ht-product-lightbox .product-media-modal__toggle{position:static;justify-self:end;width:44px;height:44px;padding:12px;border:1px solid var(--ht-line);background:transparent;color:var(--ht-ink)}.ht-lightbox-stage{min-height:0;position:relative}.ht-product-lightbox .product-media-modal__content{width:calc(100% - 144px);max-width:1400px;height:100%;max-height:100%;margin:0 auto;padding:0;overflow:hidden;touch-action:pan-y pinch-zoom;cursor:grab}.ht-product-lightbox .product-media-modal__content:active{cursor:grabbing}.ht-product-lightbox .product-media-modal__content>.ht-lightbox-track{display:flex;width:100%;height:100%;max-height:100%;margin:0;padding:0;transition:transform .38s cubic-bezier(.22,.68,.18,1)}.ht-lightbox-slide{display:grid;grid-template:minmax(0,1fr) / minmax(0,1fr);place-items:center;flex:0 0 100%;min-width:0;min-height:0;height:100%;padding:0}.ht-lightbox-slide>img{display:block;position:static;width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%;margin:0;border:0;border-radius:2px;object-fit:contain;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.ht-lightbox-slide>deferred-media,.ht-lightbox-slide>.product-media-modal__model{max-width:100%;max-height:100%}.ht-lightbox-arrow{position:absolute;z-index:2;top:calc(50% - 24px);display:grid;place-items:center;width:48px;height:48px;border:1px solid var(--ht-line);border-radius:50%;background:transparent;color:var(--ht-ink);cursor:pointer;transition:color .18s,background .18s,border-color .18s}.ht-lightbox-prev{left:0}.ht-lightbox-next{right:0}.ht-lightbox-arrow:disabled{opacity:.3;cursor:default}.ht-lightbox-footer{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0}.ht-lightbox-thumbnails{display:flex;position:relative;gap:10px;max-width:100%;padding:3px;overflow-x:auto;scrollbar-width:none}.ht-lightbox-thumbnails::-webkit-scrollbar{display:none}.ht-lightbox-thumbnail{flex:0 0 48px;width:48px;height:54px;padding:2px;border:1px solid transparent;border-radius:2px;background:transparent;cursor:pointer;opacity:.6;transition:opacity .18s,border-color .18s}.ht-lightbox-thumbnail img{display:block;width:100%;height:100%;object-fit:contain;background:#fff}.ht-lightbox-thumbnail[aria-current]{opacity:1;border-color:var(--ht-ink)}.ht-lightbox-counter{margin:0;font:400 13px/20px var(--font-body-family);font-variant-numeric:tabular-nums;letter-spacing:.15em;color:var(--ht-muted)}.ht-product-lightbox button:focus-visible,.ht-product-lightbox .product-media-modal__content:focus-visible{outline:2px solid var(--ht-ink);outline-offset:3px;box-shadow:none}@media(hover:hover){.ht-lightbox-arrow:not(:disabled):hover,.ht-product-lightbox .product-media-modal__toggle:hover{background:var(--ht-ink);border-color:var(--ht-ink);color:var(--ht-cream)}.ht-lightbox-thumbnail:hover{opacity:1}}@media(max-width:749px){.ht-product-lightbox .product-media-modal__dialog{padding:12px 16px max(12px,env(safe-area-inset-bottom));gap:12px}.ht-lightbox-header{grid-template-columns:1fr auto;gap:16px}.ht-lightbox-logo{width:150px}.ht-lightbox-title{display:none}.ht-product-lightbox .product-media-modal__content{width:100%}.ht-lightbox-arrow{position:fixed;top:auto;bottom:max(12px,env(safe-area-inset-bottom));width:44px;height:44px}.ht-lightbox-prev{left:20px}.ht-lightbox-next{right:20px}.ht-lightbox-thumbnails{gap:8px}.ht-lightbox-thumbnail{flex-basis:44px;width:44px;height:50px}.ht-lightbox-footer{gap:8px}.ht-lightbox-counter{line-height:44px}}@media(max-height:500px)and (min-width:750px){.ht-product-lightbox .product-media-modal__dialog{padding-block:8px;gap:8px}.ht-lightbox-footer{flex-direction:row;justify-content:center;gap:20px}.ht-lightbox-thumbnail{height:40px;flex-basis:36px;width:36px}}@media(prefers-reduced-motion:reduce){.ht-product-lightbox .product-media-modal__content>.ht-lightbox-track,.ht-product-lightbox button{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/2/assets/hair-temple-lightbox.css.map */