/* receta: mando del kit · software/crm/app/public/kit-mando.css · 07/10
   ISLA del Mando del kit (DS § 77, catálogo 77; SPEC-CRM6-KIT-2 K3-K5).
   Fuente de verdad: este fichero y kit-mando.js, en el CRM. Se copian BYTE A
   BYTE a software/web/app/public/ y a
   playbooks/agente-reservas-hostal/web/public/: pruebas/kit.js compara el
   sha256 de los tres pares (una copia distinta = sonda en rojo).
   Autocontenida: no depende de app.css ni de tokens.css (la demo y la web no
   los cargan). Lleva la receta del § 77 con los valores del tema OSCURO de
   tokens.css fijos, en las tres webs y con cualquier tema (Yaz 07/10):
     #1E1E20 bg-elevated · #F3F3F3 text · #2E2E31 border · #29292C
     bg-tertiary (hover) · 0 12px 40px rgba(0,0,0,.5) shadow-float ·
     40 spacing-control · 16 spacing-xs · 8 spacing-2xs · 4 radius-card y
     paso medio · 12 paso-12 · 200 menu-min · 2 foco · 14/20 ui-sm.
   Todo cuelga de .ds-mando-kit para no tocar nada de la página que la
   carga; `all: initial` corta lo que la página herede (fuente, color). */
.ds-mando-kit {
  all: initial;
  position: fixed; z-index: 2147483000; display: block;
  top: calc(16px + env(safe-area-inset-top));
  right: calc(16px + env(safe-area-inset-right));
  font-family: Geist, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.ds-mando-kit *, .ds-mando-kit *::before, .ds-mando-kit *::after { box-sizing: border-box; }
.ds-mando-kit .ds-icono { display: block; flex: none; width: 20px; height: 20px; }
.ds-mando-kit .ds-mando-kit__boton {
  display: flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; margin: 0; padding: 0;
  border: 1px solid #2E2E31; border-radius: 9999px;
  background: #1E1E20; color: #F3F3F3;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
  opacity: .92; cursor: pointer; font: inherit;
  -webkit-appearance: none; appearance: none; -webkit-tap-highlight-color: transparent;
  transition: opacity 100ms cubic-bezier(0.22, 1, 0.36, 1);
}
.ds-mando-kit .ds-mando-kit__boton:hover,
.ds-mando-kit .ds-mando-kit__boton:focus-visible,
.ds-mando-kit .ds-mando-kit__boton[aria-expanded="true"] { opacity: 1; }
.ds-mando-kit .ds-mando-kit__boton:focus-visible { outline: 2px solid #F3F3F3; outline-offset: 2px; }
.ds-mando-kit .ds-menu {
  position: absolute; top: calc(100% + 8px); right: 0;
  display: flex; flex-direction: column; margin: 0;
  min-width: 200px; max-width: calc(100vw - 32px); padding: 4px;
  background: #1E1E20; color: #F3F3F3;
  border: 1px solid #2E2E31; border-radius: 4px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
}
.ds-mando-kit .ds-menu[hidden] { display: none; }
.ds-mando-kit .ds-menu__item {
  display: flex; align-items: center; gap: 8px; width: 100%;
  min-height: 40px; margin: 0; padding: 0 12px;
  border: 0; border-radius: 4px; background: none; color: #F3F3F3;
  font-family: inherit; font-size: 14px; line-height: 20px; font-weight: 400;
  text-align: left; text-decoration: none; white-space: nowrap; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.ds-mando-kit .ds-menu__item:hover, .ds-mando-kit .ds-menu__item:focus-visible { background: #29292C; color: #F3F3F3; text-decoration: none; }
.ds-mando-kit .ds-menu__item:focus-visible { outline: 2px solid #F3F3F3; outline-offset: -2px; }
.ds-mando-kit .ds-menu__item[aria-checked="true"] { font-weight: 500; }
.ds-mando-kit .ds-menu__item .ds-icono { margin-left: auto; visibility: hidden; color: #F3F3F3; }
.ds-mando-kit .ds-menu__item[aria-checked="true"] .ds-icono { visibility: visible; }