/* Riel de secciones del panel completo: el mismo en todas, abajo a la izquierda (ver riel.js).
   Colores propios (--nr-*) para no depender de los de cada sección. */
.nebo-riel {
  --nr-fondo: #fcfcfb;
  --nr-hover: #f3f3ef;
  --nr-borde: rgba(11, 11, 11, 0.10);
  --nr-texto: #52514e;
  --nr-texto-fuerte: #0b0b0b;
  --nr-on: #2a78d6;
  --nr-etiqueta-fondo: #0b0b0b;
  --nr-etiqueta-texto: #f9f9f7;
  --nr-sombra: 0 1px 2px rgba(11, 11, 11, 0.06), 0 8px 24px rgba(11, 11, 11, 0.05);
  position: fixed; left: 16px; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 2147483000;
  display: flex; flex-direction: column; gap: 4px; padding: 5px;
  background: var(--nr-fondo); border: 1px solid var(--nr-borde); border-radius: 14px; box-shadow: var(--nr-sombra);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}
:root[data-theme="dark"] .nebo-riel {
  --nr-fondo: #1a1a19; --nr-hover: #232321; --nr-borde: rgba(255, 255, 255, 0.10);
  --nr-texto: #c3c2b7; --nr-texto-fuerte: #ffffff; --nr-on: #3987e5;
  --nr-etiqueta-fondo: #ffffff; --nr-etiqueta-texto: #0d0d0d; --nr-sombra: 0 1px 2px rgba(0, 0, 0, 0.4);
}
.nebo-riel__it {
  position: relative; width: 42px; height: 42px; display: grid; place-items: center;
  border-radius: 10px; color: var(--nr-texto); text-decoration: none; box-sizing: border-box;
}
a.nebo-riel__it:hover { background: var(--nr-hover); color: var(--nr-texto-fuerte); }
.nebo-riel__it--on { background: var(--nr-on); color: #fff; }
.nebo-riel__sep { height: 1px; margin: 2px 6px; background: var(--nr-borde); }
.nebo-riel__lb {
  position: absolute; left: calc(100% + 10px); top: 50%; transform: translateY(-50%); white-space: nowrap;
  font-size: 12.5px; font-weight: 650; line-height: 1.2; background: var(--nr-etiqueta-fondo); color: var(--nr-etiqueta-texto);
  padding: 5px 9px; border-radius: 7px; opacity: 0; pointer-events: none; transition: opacity .12s;
}
.nebo-riel__it:hover .nebo-riel__lb, .nebo-riel__it:focus-visible .nebo-riel__lb { opacity: 1; }
.nebo-riel svg { display: block; }
/* Íconos de línea siempre, aunque la página tenga reglas generales para svg (conversaciones rellena
   todos los svg con currentColor y los dejaba como bloques). */
.nebo-riel .nebo-riel__it svg { width: 19px; height: 19px; fill: none; stroke: currentColor; }

/* Incrustado al fondo de la barra lateral de conversaciones: sin caja ni sombra, con sus colores, pero
   con las MISMAS medidas que el flotante (ítems de 42 px, separación de 4, borde y relleno iguales) y
   el último ítem a la misma distancia del borde de abajo (22 px): cada ícono queda a la misma altura
   que en las otras secciones. La barra de conversaciones tiene 14 px de relleno abajo: 14 + 1 + 5 + 2. */
.nebo-riel--incrustado {
  position: static; box-shadow: none; background: transparent; border-color: transparent;
  margin: 8px 0 2px; flex-shrink: 0;
  --nr-texto: #9aa6c4; --nr-texto-fuerte: #fff; --nr-hover: rgba(255, 255, 255, 0.10);
  --nr-borde: rgba(255, 255, 255, 0.14);
}

/* Embebida dentro de otra sección (?embed=1): sin riel. */
.embebido .nebo-riel { display: none; }

@media (max-width: 999px) {
  .nebo-riel:not(.nebo-riel--incrustado) { flex-direction: row; }
  .nebo-riel:not(.nebo-riel--incrustado) .nebo-riel__it { width: 38px; height: 38px; }
  .nebo-riel:not(.nebo-riel--incrustado) .nebo-riel__sep { width: 1px; height: auto; margin: 6px 2px; }
  .nebo-riel__lb { display: none; }
}
/* Celular: barra a lo ancho pegada abajo, y la página deja ese hueco para que no tape contenido. */
@media (max-width: 820px) {
  .nebo-riel:not(.nebo-riel--incrustado) {
    left: 0; right: 0; bottom: 0; justify-content: space-around; gap: 2px;
    padding: 5px 8px calc(5px + env(safe-area-inset-bottom, 0px));
    border-radius: 0; border-width: 1px 0 0;
    z-index: 50;   /* a lo ancho taparía los botones de abajo de las ventanas (las más bajas van en 60) */
  }
  .nebo-riel:not(.nebo-riel--incrustado) .nebo-riel__it { width: 46px; height: 42px; }
  body:has(> .nebo-riel:not(.nebo-riel--incrustado)) { padding-bottom: calc(56px + env(safe-area-inset-bottom, 0px)); }
}
/* ⚙ Secciones (solo super admins) y aviso de sección apagada. Mismos colores que el riel flotante. */
.nebo-riel__aj { border: 0; background: transparent; cursor: pointer; padding: 0; font: inherit; }
.nebo-riel__aj:hover, .nebo-riel__aj[aria-expanded="true"] { background: var(--nr-hover); color: var(--nr-texto-fuerte); }
.nebo-riel-panel, .nebo-apagada {
  --nr-fondo: #fcfcfb; --nr-hover: #f3f3ef; --nr-borde: rgba(11, 11, 11, 0.10); --nr-texto: #52514e;
  --nr-texto-fuerte: #0b0b0b; --nr-on: #2a78d6; --nr-error: #b42318;
  --nr-sombra: 0 1px 2px rgba(11, 11, 11, 0.06), 0 8px 24px rgba(11, 11, 11, 0.08);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  color: var(--nr-texto); box-sizing: border-box;
}
:root[data-theme="dark"] .nebo-riel-panel, :root[data-theme="dark"] .nebo-apagada {
  --nr-fondo: #1a1a19; --nr-hover: #232321; --nr-borde: rgba(255, 255, 255, 0.10); --nr-texto: #c3c2b7;
  --nr-texto-fuerte: #ffffff; --nr-on: #3987e5; --nr-error: #f97066; --nr-sombra: 0 1px 2px rgba(0, 0, 0, 0.4);
}
.nebo-riel-panel {
  position: fixed; z-index: 2147483001; width: 300px; max-width: calc(100vw - 16px); padding: 14px 14px 12px;
  background: var(--nr-fondo); border: 1px solid var(--nr-borde); border-radius: 14px; box-shadow: var(--nr-sombra);
  font-size: 13px; line-height: 1.4;
}
@media (max-width: 820px) { .nebo-riel-panel { width: auto; } }
.nebo-riel-panel h2 { margin: 0 0 4px; font-size: 14px; font-weight: 700; color: var(--nr-texto-fuerte); }
.nebo-riel-panel p { margin: 0 0 10px; }
.nebo-riel-panel__lista { display: flex; flex-direction: column; border-top: 1px solid var(--nr-borde); }
.nebo-riel-panel__fila {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 2px;
  border-bottom: 1px solid var(--nr-borde); cursor: pointer;
}
.nebo-riel-panel__fila b { display: block; font-weight: 650; color: var(--nr-texto-fuerte); }
.nebo-riel-panel__fila small { display: block; font-size: 12px; }
.nebo-riel-panel__fila input {
  appearance: none; -webkit-appearance: none; flex-shrink: 0; position: relative; width: 36px; height: 22px; margin: 0;
  border-radius: 999px; background: var(--nr-borde); cursor: pointer; transition: background-color .15s;
}
.nebo-riel-panel__fila input::after {
  content: ''; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%;
  background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); transition: transform .15s;
}
.nebo-riel-panel__fila input:checked { background: var(--nr-on); }
.nebo-riel-panel__fila input:checked::after { transform: translateX(14px); }
.nebo-riel-panel__fila input:focus-visible { outline: 2px solid var(--nr-on); outline-offset: 2px; }
.nebo-riel-panel__fila input:disabled { opacity: .5; cursor: progress; }
.nebo-riel-panel__nota { margin: 10px 0 0 !important; font-size: 12px; }
.nebo-riel-panel__error { margin: 8px 0 0 !important; color: var(--nr-error); font-weight: 600; }

/* Sección apagada, para quien no es super admin: tapa la página (su API ya no responde). */
.nebo-apagada {
  position: fixed; inset: 0; z-index: 2147482000; display: grid; place-items: center; padding: 16px;
  background: var(--nr-fondo);
}
.nebo-apagada__caja { max-width: 420px; text-align: center; }
.nebo-apagada h1 { margin: 0 0 8px; font-size: 20px; font-weight: 700; color: var(--nr-texto-fuerte); }
.nebo-apagada p { margin: 0 0 16px; font-size: 14.5px; line-height: 1.5; }
.nebo-apagada__ir { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.nebo-apagada__ir a {
  padding: 8px 14px; border: 1px solid var(--nr-borde); border-radius: 9px; color: var(--nr-texto-fuerte);
  font-size: 13.5px; font-weight: 600; text-decoration: none;
}
.nebo-apagada__ir a:hover { background: var(--nr-hover); }
/* Al super admin solo se le recuerda, arriba y sin tapar clics, que la sección está apagada. */
.nebo-apagada--franja {
  inset: 8px auto auto 50%; transform: translateX(-50%); display: block; width: max-content; max-width: calc(100vw - 32px);
  padding: 6px 14px; border-radius: 999px; text-align: center; font-size: 12.5px; font-weight: 600;
  background: #fef0c7; color: #7a2e0e; border: 1px solid rgba(122, 46, 14, 0.2); pointer-events: none;
}
.embebido .nebo-apagada--franja { display: none; }
@media print { .nebo-riel { display: none; } }