/* Brando — niza-combo.css: estilos del selector de clases de Niza (landing y gracias). Componente: niza-combo.js */
/* Selector Niza */
.l-niza__box { position: relative; }
.l-niza__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.l-niza__chips:empty { display: none; }
.l-niza__chips .b-chip b { font-family: var(--b-font-mono); font-weight: 600; }
.l-niza__list {
  /* en el flujo (no flota): nunca tapa ni intercepta clics de lo que está debajo */
  position: static; margin: 8px 0 0; max-height: 264px; overflow-y: auto; overscroll-behavior: contain;
  padding: 4px; list-style: none; background: var(--b-surface); border: 1px solid var(--b-line-strong);
  border-radius: var(--b-r-md);
}
.l-niza__opt { display: grid; grid-template-columns: 32px 1fr 20px; gap: 12px; align-items: center; min-height: var(--b-tap); padding: 8px 12px 8px 8px; border-radius: var(--b-r-sm); cursor: pointer; font-size: var(--b-t-callout); line-height: 1.3; }
.l-niza__opt b { font: 600 var(--b-t-footnote)/1 var(--b-font-mono); color: var(--b-ink-2); text-align: right; }
.l-niza__opt small { display: block; color: var(--b-ink-2); font-size: var(--b-t-caption); font-weight: 400; }
.l-niza__opt:hover { background: color-mix(in srgb, var(--b-surface-2) 60%, transparent); }
.l-niza__opt.is-active { background: var(--b-surface-2); box-shadow: inset 3px 0 0 var(--b-primary); }
.l-niza__opt[aria-selected="true"]::after {
  content: ""; width: 18px; height: 18px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.5 12.5l5 5L19.5 7' fill='none' stroke='%233d4bff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat;
}
.l-niza__empty { padding: 12px; color: var(--b-ink-2); font-size: var(--b-t-callout); }
@media (max-width: 600px) {
  .l-niza__list { max-height: min(48dvh, 360px); }
  .l-niza { scroll-margin-top: 8px; }
}