/* OrganizationDirectory / PuntoCobroSheet / detail / RoleHome QR, Mobile 7686e83. */
.dui-point-target { display:flow-root; }
.dui-point-directory { position:relative; }
.dui-point-labels { display:flex; flex-wrap:wrap; gap:.5em; color:var(--dui-muted); font-size:.875em; margin:.875em 0; }
.dui-point-assigned-heading { display:flex; align-items:center; justify-content:space-between; gap:.5em; padding:1em 0; }
.dui-point-assigned-heading .dui-icon { transform:rotate(90deg); }
.dui-point-card .dui-directory-tools .dui-icon { margin:0; }
.dui-point-toast { position:absolute; bottom:6.2em; left:1.25em; right:1.25em; padding:.85em; display:flex; align-items:center; gap:.5em; background:var(--dui-ink); color:white; border-radius:1em; font-size:.875em; }
.dui-point-sheet .dui-heading h2 { font-size:1.375em; }
.dui-point-sheet .dui-flow-field,.dui-point-target .dui-flow-field { margin-top:1em; }
.dui-point-sheet h4,.dui-point-assignment h4 { font-size:1em; margin:.875em 0 .4em; }
.dui-point-help { font-size:.875em; line-height:1.4; color:var(--dui-muted); margin:.5em 0!important; }
.dui-point-switch { display:flex; gap:1em; align-items:center; padding:.75em 0; }
.dui-point-switch>div { flex:1; min-width:0; }
.dui-point-switch b { font-weight:500; }
.dui-point-switch small { display:block; margin-top:.25em; color:var(--dui-muted); font-size:.875em; }
.dui-point-toggle { display:flex; align-items:center; width:3.25em; height:2em; border:2px solid #738078; border-radius:2em; background:#e0e4df; padding:.25em; flex:none; }
.dui-point-toggle>i { width:1.125em; height:1.125em; background:#738078; border-radius:50%; }
.dui-point-toggle.is-on { background:var(--dui-ink); border-color:var(--dui-ink); justify-content:flex-end; padding:.125em; }
.dui-point-toggle.is-on>i { background:white; width:1.5em; height:1.5em; }
.dui-point-check { display:flex; align-items:center; gap:1em; padding:.625em .75em; }
.dui-point-check>i { display:grid; place-items:center; flex:none; width:1.15em; height:1.15em; border:2px solid var(--dui-muted); border-radius:.15em; }
.dui-point-check>i.is-checked { color:white; background:var(--dui-ink); border-color:var(--dui-ink); }
.dui-point-check .dui-icon { width:1em; height:1em; }
.dui-point-check>div { min-width:0; }
.dui-point-check b { font-size:.875em; font-weight:500; }
.dui-point-check small { display:block; color:var(--dui-muted); overflow-wrap:anywhere; font-size:.75em; }
.dui-point-type-options { padding:.5em 0; margin-top:.4em; background:var(--dui-paper); box-shadow:0 .3em 1.3em #173f3126; border-radius:.5em; }
.dui-point-type-options>span,.dui-point-type-options>b { display:flex; align-items:center; gap:.75em; padding:.875em 1em; font-weight:400; }
.dui-point-type-options>b { background:var(--dui-soft); }
.dui-point-map { position:relative; height:14.375em; overflow:hidden; border-radius:1em; }
.dui-point-map-art { display:block; width:100%; height:100%; }
.dui-point-map-expand { position:absolute; top:.5em; right:.5em; background:var(--dui-paper); border-radius:50%; padding:.6em; box-shadow:0 .2em .5em #173f3133; }
.dui-point-map-expand .dui-icon { display:block; width:1.35em; height:1.35em; }
.dui-point-map-pin { position:absolute; left:79%; top:47%; transform:translate(-50%,-100%); color:#d54638; filter:drop-shadow(0 .15em .15em #0003); }
.dui-point-map-pin .dui-icon { width:2.5em; height:2.5em; fill:#d54638; stroke:white; }
.dui-point-map-pin circle { fill:white; }
.dui-point-location>.dui-heading { flex:none; margin:.75em 1em; }
.dui-point-location>.dui-heading h2 { font-size:1.375em; }
.dui-point-location-body { position:relative; flex:1; min-height:0; }
.dui-point-map.is-expanded { position:absolute; inset:0; height:100%; border-radius:0; }
.dui-point-map-note { position:absolute; top:.75em; left:1em; right:1em; padding:1em; background:var(--dui-paper); border:1px solid var(--dui-line); border-radius:1.5em; }
.dui-point-location-confirm { position:absolute; bottom:1em; left:1em; right:1em; }
.dui-point-detail { padding:.75em 1em 0; }
.dui-point-detail-bar { display:flex; align-items:center; gap:1em; margin-bottom:1em; }
.dui-point-detail-bar .dui-heading { flex:1; margin:0; }
.dui-point-detail-bar h2 { font-size:1.375em; }
.dui-point-detail-header { padding:1.25em; border-radius:1.5em; background:var(--dui-soft); }
.dui-point-detail-header>div:first-child { display:flex; align-items:center; justify-content:space-between; }
.dui-point-detail-header .dui-avatar { width:4em; height:4em; }
.dui-point-detail-header h3 { margin-top:.75em; font-size:1.5em; }
.dui-point-detail-header p { color:var(--dui-muted); margin-top:.5em; }
.dui-point-chips { display:flex; flex-wrap:wrap; gap:.5em; margin-top:1em; font-size:.875em; }
.dui-point-chips>* { padding:.5em .75em; background:white; border-radius:.875em; font-weight:600; }
.dui-point-chips>b { color:var(--dui-inflow); }
.dui-point-detail-card { border:1px solid var(--dui-line); padding:1em; border-radius:1.125em; background:white; margin:.75em 0; }
.dui-point-detail-card h4 { margin:0 0 .75em; font-size:1em; }
.dui-point-detail-card dl { display:grid; gap:.5em; margin:0; }
.dui-point-detail-card dl>div { display:flex; align-items:start; justify-content:space-between; gap:1em; font-size:.875em; }
.dui-point-detail-card dt { color:var(--dui-muted); }
.dui-point-detail-card dd { margin:0; text-align:right; }
.dui-point-detail-card>p { margin:.75em 0 0; }
.dui-point-person-chip { display:inline-block; padding:.4em .75em; background:#f2f4f1; border:1px solid #d7ddd8; border-radius:2em; font-size:.75em; }
.dui-point-modules { padding:.5em .75em; }
.dui-point-module { display:flex; align-items:center; gap:1em; padding:1em .5em; }
.dui-point-module+.dui-point-module { border-top:1px solid var(--dui-line); }
.dui-point-module>div { flex:1; min-width:0; }
.dui-point-module b { font-weight:500; }
.dui-point-module small { display:block; color:var(--dui-muted); margin-top:.3em; font-size:.875em; }
.dui-point-qr-sheet { text-align:center; padding:.75em 1em 1.5em; }
.dui-point-qr-heading { display:flex; align-items:start; gap:.75em; text-align:left; padding-top:.5em; }
.dui-point-qr-heading h3 { font-size:1.375em; flex:1; }
.dui-point-qr-sheet>p { text-align:left; font-size:1em; color:var(--dui-muted); margin:.5em 0 1em; }
.dui-point-qr-default { display:inline-block; padding:.3em .75em; font-size:.875em; border:1px solid var(--dui-line); border-radius:.5em; margin-bottom:1em; }
.dui-point-qr-frame { width:17em; max-width:100%; padding:1em; background:white; margin:0 auto .625em; }
.dui-point-qr-frame danta-branded-qr { --danta-qr-size:15em; }
.dui-point-qr-sheet>b { display:block; font-size:.875em; margin-top:.6em; }
.dui-point-qr-sheet>small { display:block; font-size:.75em; margin-top:.25em; }
.dui-point-qr-actions { display:flex; flex-wrap:wrap; gap:.5em .625em; justify-content:center; margin-top:.875em; }
.dui-point-qr-actions .dui-flow-action { flex:none; min-height:2.5em; font-size:.875em; padding:.625em 1.1em; }

/* Concise mobile narration leaves the enlarged control unobscured. */
@media(max-width:900px) {
  .tutorial-player-root--point-of-sale .tutorial-step-card { padding:16px; border-radius:22px; }
  .tutorial-player-root--point-of-sale .tutorial-step h2 { font-size:clamp(1.5rem,6vw,2.125rem); line-height:1.08; margin-bottom:12px; letter-spacing:-.045em; }
  .tutorial-player-root--point-of-sale .tutorial-step-kicker { margin-bottom:10px; font-size:.65rem; }
  .tutorial-player-root--point-of-sale .tutorial-step-card>p:not(.tutorial-step-kicker) { font-size:.86rem; line-height:1.5; margin-bottom:12px; }
  .tutorial-player-root--point-of-sale .tutorial-step-tips li { font-size:.67rem; line-height:1.45; padding:7px 10px; border-radius:16px; }
  .tutorial-player-root--point-of-sale .tutorial-step-links { margin-top:10px; }
  .tutorial-player-root--point-of-sale .tutorial-step-links a { font-size:.67rem; padding:9px 11px; }
}
