/* Shared full viewport photo viewer. Native dialog stays above order dialogs. */
.product-photo-frame{display:block;position:relative;min-width:0;width:100%;overflow:hidden;background:#202331;border-radius:inherit}
.product-photo-frame>img{cursor:zoom-in}
.product-photo-frame[data-photo-state=loading]{min-height:84px}
.product-photo-frame[data-photo-state=loading]::before{content:"";position:absolute;inset:0;background:linear-gradient(105deg,#202331 20%,#465064 45%,#202331 70%);background-size:240% 100%;animation:pg-shimmer 1.8s ease-in-out infinite;z-index:1;pointer-events:none}
.product-photo-frame[data-photo-state=loading]::after{content:"";position:absolute;left:calc(50% - 12px);top:calc(50% - 12px);width:24px;height:24px;border:2px solid #ffffff35;border-top-color:#8ee7ef;border-radius:50%;animation:pg-spin .8s linear infinite;z-index:2;pointer-events:none}
.product-photo-status{position:absolute;inset:auto 10px 10px;pointer-events:none;font:500 12px/1.5 system-ui;color:#fff;text-align:center;background:#121521dd;border-radius:8px;padding:8px;z-index:2}
.product-photo-frame:not([data-photo-state=error])>.product-photo-status{width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.product-photo-frame[data-photo-state=error]{min-height:100px}
.self-product-thumb>.product-photo-frame{width:100%;height:100%}
product-gallery figure>.product-photo-frame{flex:0 0 auto}
body dialog.pg-viewer{position:fixed!important;inset:0!important;margin:0!important;width:100vw!important;max-width:none!important;height:100vh!important;height:100dvh!important;max-height:none!important;padding:0!important;border:0!important;border-radius:0!important;background:#070a10!important;color:#f8f7f3!important;box-shadow:none!important;overflow:hidden!important;box-sizing:border-box!important}
body dialog.pg-viewer[open]{display:grid!important;grid-template-rows:auto minmax(0,1fr) auto;gap:0}
.pg-viewer::backdrop{background:#070a10!important;backdrop-filter:none!important}
.pg-viewer-header,.pg-viewer-footer{display:flex;align-items:center;gap:16px;min-height:64px;padding:12px max(16px,env(safe-area-inset-left));box-sizing:border-box;z-index:1}
.pg-viewer-header{justify-content:space-between;padding-top:max(12px,env(safe-area-inset-top));background:linear-gradient(#141a24,#0b1019)}
.pg-viewer-footer{padding-bottom:max(12px,env(safe-area-inset-bottom));background:#10151e}
.pg-viewer-header [data-pg-count]{font:600 13px/1.5 system-ui;font-variant-numeric:tabular-nums;color:#b9c8d8}
.pg-viewer-footer p{flex:1;min-width:0;margin:0;text-align:center;font:500 13px/1.5 system-ui;color:#e3e7ef;max-height:3em;overflow:auto}
body .pg-viewer button{flex:none;display:grid;place-items:center;min-width:48px!important;min-height:48px!important;width:auto!important;margin:0!important;padding:10px 15px!important;border:1px solid #657287!important;background:#263243!important;color:#fff!important;border-radius:14px!important;box-shadow:none!important;font:600 22px/1 system-ui!important;cursor:pointer;transform:none!important}
body .pg-viewer button:disabled{opacity:.35;cursor:default}
body .pg-viewer button:focus-visible,.product-photo-frame>img:focus-visible{outline:3px solid #8ee7ef!important;outline-offset:3px}
body .pg-viewer [data-pg-retry]{font-size:14px!important;margin:12px auto 0!important}
body .pg-viewer button[hidden]{display:none!important}
.pg-viewer-stage{position:relative;display:grid;place-items:center;min-width:0;min-height:0;overflow:hidden;touch-action:pan-y pinch-zoom}
.pg-viewer-stage>[data-pg-image]{display:block!important;width:100%!important;height:100%!important;min-height:0!important;max-height:100%!important;max-width:100%!important;object-fit:contain!important;aspect-ratio:auto!important;border:0!important;border-radius:0!important;margin:0!important;background:transparent!important;transform:none!important;box-shadow:none!important}
.pg-viewer-stage:not([data-photo-state=loaded])>[data-pg-image]{visibility:hidden}
.pg-viewer-feedback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center;pointer-events:none}
.pg-viewer-feedback p{max-width:420px;color:#d9e1ee;font:500 14px/1.6 system-ui}
.pg-viewer-feedback button{pointer-events:auto}
.pg-viewer-stage[data-photo-state=loaded] .pg-viewer-feedback{display:none}
.pg-spinner{display:block;width:38px;height:38px;border:3px solid #ffffff26;border-top-color:#8ee7ef;border-radius:50%;animation:pg-spin .8s linear infinite}
.pg-viewer-stage[data-photo-state=error] .pg-spinner{display:none}
@keyframes pg-spin{to{transform:rotate(360deg)}}
@keyframes pg-shimmer{from{background-position:100% 0}to{background-position:-100% 0}}
@media(prefers-reduced-motion:reduce){.pg-spinner,.product-photo-frame[data-photo-state=loading]::before,.product-photo-frame[data-photo-state=loading]::after{animation:none!important}}
