/* w8 Sprievodca A (web/product-tour.js): panel sprievodcu a zvýraznenie cieľa. Panel je nemodálne okno vpravo dole;
   pri cieli v pravej časti obrazovky ide vľavo (product-tour-left). Do 699 px (bočné menu je zásuvka, design.css) je panel dole
   na celú šírku s okrajom 16 px; otvorená zásuvka (body.nav-open, z-index 60) a jej clona (55) sú nad panelom.
   Zvýraznenie je vo vnútri cieľa: rodič s overflow ho neoreže a na modrej aktívnej položke menu ostane svetlý pás. */
.product-tour{position:fixed;z-index:150;right:max(16px,env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));
 width:min(380px,calc(100vw - 32px));max-height:min(60vh,420px);overflow:auto;display:flex;flex-direction:column;gap:var(--space-2);
 padding:var(--space-4);border:1px solid var(--accent);border-radius:var(--radius);background:var(--surface);color:var(--ink);
 box-shadow:0 12px 32px #0c1b2a33;font-size:var(--text-md);line-height:var(--leading)}
.product-tour[hidden]{display:none}
.product-tour.product-tour-left{right:auto;left:calc(var(--sidebar) + 16px)}
body.nav-open .product-tour{z-index:50}
.product-tour:focus{outline:none}
.product-tour:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.product-tour-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}
.product-tour-count{margin:0;font-size:var(--text-xs);font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums}
.product-tour-close{flex-shrink:0}
.product-tour-title{margin:0;font-size:var(--text-xl);line-height:var(--leading-tight);overflow-wrap:anywhere}
.product-tour-text{margin:0;color:var(--ink-2);overflow-wrap:anywhere}
.product-tour-note{margin:0;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);background:var(--surface-2);color:var(--ink-2);
 font-size:var(--text-sm)}
.product-tour-note[hidden]{display:none}
.product-tour-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--space-2);margin-top:var(--space-1)}
body[data-product-tour] .workspace{padding-bottom:calc(var(--space-5) + 260px)}
.product-tour-target{outline:3px solid var(--accent)!important;outline-offset:-3px;box-shadow:inset 0 0 0 6px var(--accent-soft)!important;
 scroll-margin-top:72px;scroll-margin-bottom:24px}
@media(max-width:699px){
 .product-tour,.product-tour.product-tour-left{left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));width:auto;
  max-height:46vh}
 .product-tour-actions .btn{min-height:44px;flex:1 1 auto}
 .product-tour-close{min-width:44px;min-height:44px}
 .product-tour-target{scroll-margin-top:68px}
 body[data-product-tour] .workspace{padding-bottom:calc(46vh + 40px)}
}
@media(prefers-reduced-motion:no-preference){.product-tour{animation:product-tour-in .16s ease-out}}
@keyframes product-tour-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(forced-colors:active){.product-tour{border-color:CanvasText}.product-tour-target{outline-color:Highlight!important}}

/* PR-97a (web/product-tour-hints.js): žlté bodky pri prvkoch obrazovky a ich bublina, podľa prototypu V6.11 (.tutdot, .tutpop).
   Vrstva je nad zásuvkou (60) a pod hláseniami (200); bodka a bublina dostanú polohu iba cez transform v CSSOM, skryté sú cez hidden.
   Kliky prejdú iba na bodku a bublinu, nie na vrstvu. */
.product-tour-hints{position:fixed;inset:0;z-index:61;pointer-events:none}
.product-tour-hints[hidden],.product-tour-hint-dot[hidden],.product-tour-hint-pop[hidden]{display:none}
.product-tour-hint-dot{position:fixed;left:0;top:0;display:flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;
 border:0;border-radius:50%;background:transparent;pointer-events:auto;cursor:pointer;will-change:transform}
.product-tour-hint-dot>span{width:12px;height:12px;border-radius:50%;background:#f5b400;box-shadow:0 0 0 3px #f5b40047,0 1px 3px #00000040;
 animation:product-tour-hint-pulse 2s ease-in-out infinite}
.product-tour-hint-dot:hover>span,.product-tour-hint-dot.is-open>span{background:#ffcb2e;box-shadow:0 0 0 5px #f5b40052,0 1px 3px #00000040;animation:none}
.product-tour-hint-dot:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
@keyframes product-tour-hint-pulse{0%,100%{box-shadow:0 0 0 3px #f5b40047,0 1px 3px #00000040}50%{box-shadow:0 0 0 7px #f5b4001f,0 1px 3px #00000040}}
.product-tour-hint-pop{position:fixed;left:0;top:0;max-height:calc(100vh - 16px);overflow:auto;padding:10px 12px 12px;border:1px solid #f0d27a;
 border-radius:12px;background:#fffbea;color:var(--ink);box-shadow:0 14px 40px #102b4e38;font-size:var(--text-sm);line-height:1.45;pointer-events:auto;
 will-change:transform}
.product-tour-hint-pop:focus{outline:none}
.product-tour-hint-head{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.product-tour-hint-head>strong{flex:1 1 auto;font-size:var(--text-md)}
.product-tour-hint-count{color:var(--muted);font-size:var(--text-xs);white-space:nowrap}
.product-tour-hint-close{display:inline-flex;align-items:center;justify-content:center;min-width:32px;min-height:32px;padding:0;border:0;
 border-radius:6px;background:transparent;color:inherit}
.product-tour-hint-close:is(:hover,:focus-visible){background:#f5b40033}
.product-tour-hint-pop>p{margin:0 0 10px}
.product-tour-hint-foot{display:flex;flex-wrap:wrap;gap:6px}
@media (prefers-reduced-motion:reduce){.product-tour-hint-dot>span{animation:none}}
/* PR-97c: veta Vysvetlivky vypol administrátor v menu používateľa nie je ovládací prvok. */
.customer-user-item.is-note,.staff-user-item.is-note{color:var(--muted);cursor:default}
