/* Navex · демо · demo.css — плашка «Демо» и скрытие симуляций лаборатории */


/* кнопка «Демо ▾» с имитациями — справа внизу, один стиль и одно место на всех страницах */
.demo-sim-host { position: fixed !important; z-index: 90; left: auto !important; top: auto !important; right: 16px !important; bottom: 16px !important; margin: 0 !important; transform: none !important; translate: none !important; width: auto; display: block; }
.demo-sim-host > .btn, .demo-sim-host > button { min-height: 44px; padding: 0 16px; border-radius: 999px; background: var(--ink, #161616); color: #fff; box-shadow: 0 10px 28px -8px rgba(20, 24, 22, .45); font-weight: 600; }
.demo-sim-host > .btn .nx-icon { --nx-size: 18px; }
@media (hover: hover) and (pointer: fine) { .demo-sim-host > .btn:hover { background: #2a2c2d; color: #fff; } }
@media (max-width: 767.98px) {
  .demo-sim-host { right: 12px !important; bottom: calc(var(--demo-nav, 84px) + 72px + env(safe-area-inset-bottom, 0px)) !important; }
}
/* плашка «Макет» — слева внизу (на телефоне она — кружок справа сверху) и выше кнопки «Демо» по слою */
#nx-lab { z-index: 95; }

/* подсказки страницы («?») */
.demo-tour__bd { position: fixed; inset: 0; z-index: 199; background: transparent; }
.demo-tour__hl { position: fixed; z-index: 200; border-radius: 12px; box-shadow: 0 0 0 9999px rgba(22, 22, 22, .6); pointer-events: none; transition: top .18s ease, left .18s ease, width .18s ease, height .18s ease; }
.demo-tour__card { position: fixed; z-index: 201; width: 320px; max-width: calc(100vw - 24px); padding: 16px 18px; border-radius: 20px; background: #fff; color: #161616; box-shadow: 0 24px 60px -18px rgba(22, 22, 22, .5); font-family: var(--font-text, Inter, system-ui, sans-serif); }
.demo-tour__cnt { margin-bottom: 6px; color: #4C7A14; font: 700 11px/1 var(--font-text, Inter, system-ui, sans-serif); letter-spacing: .04em; text-transform: uppercase; }
.demo-tour__t { margin-bottom: 6px; font: 600 16px/1.3 var(--font-text, Inter, system-ui, sans-serif); letter-spacing: -.01em; }
.demo-tour__b { margin-bottom: 14px; color: #5C5F61; font-size: 13.5px; line-height: 1.5; }
.demo-tour__act { display: flex; align-items: center; gap: 8px; }
.demo-tour__sp { flex: 1; }
.demo-tour__btn { min-height: 44px; padding: 0 16px; border: 0; border-radius: 999px; font: 600 14px/1 var(--font-text, Inter, system-ui, sans-serif); cursor: pointer; }
.demo-tour__btn--pri { background: #E3F450; color: #161616; }
.demo-tour__btn--sec { background: #EEEFEE; color: #161616; }
.demo-tour__btn--ghost { background: none; color: #5C5F61; padding: 0 8px; }
.demo-tour__card--docked { top: auto !important; left: 0 !important; right: 0; bottom: 0; width: 100%; max-width: none; border-radius: 22px 22px 0 0; padding: 16px 16px calc(16px + env(safe-area-inset-bottom, 0px)); }
.demo-helpfab { position: fixed; z-index: 80; right: 16px; top: 16px; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: #fff; color: #161616; font: 600 18px/1 var(--font-text, Inter, system-ui, sans-serif); box-shadow: 0 6px 20px -6px rgba(22, 22, 22, .35); cursor: pointer; }
