/**
 * PaviBhuvi Smart Zoom — styles.
 * Scoped to .pbz-box (added by the JS to whichever gallery element it binds).
 */

.pbz-box{position:relative;overflow:hidden;cursor:zoom-in;touch-action:manipulation;user-select:none}
.pbz-box.pbz-on{cursor:zoom-out}
.pbz-box>img{transform-origin:0 0;-webkit-user-drag:none;user-select:none}

/* smooth return for resets / double-click toggles */
.pbz-box.pbz-anim>img,.pbz-box.pbz-anim>.pbz-hi{transition:transform .24s ease}

/* hi-res twin layer — sits over the main image only while zoomed */
.pbz-hi{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 18%;opacity:0;transition:opacity .15s ease;pointer-events:none;transform-origin:0 0}
.pbz-box.pbz-on>.pbz-hi{opacity:1}

/* centred first-hover tip — tells the visitor zoom exists, fades after
   ~2s or as soon as they actually zoom */
.pbz-tip{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.92);z-index:7;display:flex;align-items:center;gap:8px;background:oklch(24% .05 158/.88);color:#f4ead0;font-size:13px;font-weight:600;letter-spacing:.04em;white-space:nowrap;padding:11px 18px;border-radius:24px;border:1px solid color-mix(in oklab,#c8a24c 55%,transparent);box-shadow:0 14px 40px oklch(20% .04 158/.42);opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}
.pbz-tip.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.pbz-tip svg{width:17px;height:17px;flex:none;color:#c8a24c}

/* soft lens-flare that trails the cursor while unzoomed */
.pbz-glint{position:absolute;left:0;top:0;width:210px;height:210px;z-index:4;border-radius:50%;background:radial-gradient(circle,color-mix(in oklab,#fff 26%,transparent),transparent 62%);mix-blend-mode:screen;opacity:0;transition:opacity .25s;pointer-events:none}
.pbz-glint.on{opacity:1}

/* always-visible zoom controls — right edge, vertically centred.
   Gold ring pulses until the visitor has zoomed once. */
.pbz-ctl{position:absolute;right:12px;top:50%;transform:translateY(-50%);z-index:8;display:flex;flex-direction:column;gap:6px;padding:6px;border-radius:30px;background:oklch(24% .05 158/.86);backdrop-filter:blur(6px);border:1px solid color-mix(in oklab,#c8a24c 50%,transparent);box-shadow:0 10px 30px oklch(20% .04 158/.4)}
.pbz-btn{width:40px;height:40px;border-radius:50%;border:0;background:transparent;color:#f4ead0;display:grid;place-items:center;cursor:pointer;padding:0;transition:background .18s,color .18s,transform .15s}
.pbz-btn svg{width:19px;height:19px}
.pbz-btn:hover:not(:disabled){background:#c8a24c;color:#1d3a2b;transform:scale(1.06)}
.pbz-btn:active:not(:disabled){transform:scale(.96)}
.pbz-btn:disabled{opacity:.35;cursor:default}
.pbz-btn:focus-visible{outline:2px solid #c8a24c;outline-offset:2px}
.pbz-ctl::before{content:"";position:absolute;inset:-5px;border-radius:36px;border:2px solid #c8a24c;opacity:0;pointer-events:none}
.pbz-box:not(.pbz-learned) .pbz-ctl::before{animation:pbz-pulse 1.8s ease-out infinite}
.pbz-box:not(.pbz-learned) .pbz-in{background:#c8a24c;color:#1d3a2b}
@keyframes pbz-pulse{0%{opacity:.9;transform:scale(1)}70%{opacity:0;transform:scale(1.28)}100%{opacity:0;transform:scale(1.28)}}
@media (max-width:640px){.pbz-ctl{right:8px;gap:4px;padding:4px}.pbz-btn{width:36px;height:36px}}
@media (prefers-reduced-motion:reduce){.pbz-ctl::before{animation:none!important}}

/* current zoom level — bottom-left, fades while idle */
.pbz-badge{position:absolute;left:12px;bottom:12px;z-index:6;display:inline-block;background:color-mix(in oklab,#b08a3e 88%,transparent);color:#fff;font-size:11.5px;font-weight:700;letter-spacing:.04em;padding:5px 11px;border-radius:20px;opacity:0;transition:opacity .3s;pointer-events:none}
.pbz-badge.on{opacity:1}

/* retire the legacy lens zoom — the plugin replaces it entirely.
   (the JS also strips the zooming/inner-zoom classes and intercepts its
   event listeners, so these rules are belt-and-braces) */
.zoom-box .lens,.zoom-box .zoom-view{display:none!important}
