/* Modo oscuro: se activa con el botón de la luna (abajo en la barra lateral) y se recuerda en cada ordenador.
   Solo cambia los colores; la hoja para guías se queda en claro porque es para imprimir. */
html[data-modo="oscuro"] {
  color-scheme: dark;
  --fondo: #0d1a20;
  --superficie: #13242c;
  --superficie-2: #182e37;
  --texto: #e3edf0;
  --suave: #93aab4;
  --linea: #25404b;
  --petroleo: #7cc4dc;
  --petroleo-medio: #5aa3bd;
  --acento: #7cc4dc;
  --acento-texto: #0b1b22;
  --acento-suave: #1b3a46;
  --rojo: #f08a8f;
  --rojo-fondo: #3a1d21;
  --azul: #8db4f0;
  --azul-fondo: #1a2a45;
  --ambar: #f2b36b;
  --ambar-fondo: #3a2a14;
  --verde: #7fd3a2;
  --verde-fondo: #163327;
  --sombra: 0 1px 2px rgba(0, 0, 0, .3), 0 4px 14px rgba(0, 0, 0, .25);
}
html[data-modo="oscuro"] body { background: var(--fondo); color: var(--texto); }
html[data-modo="oscuro"] .lateral { background: linear-gradient(180deg, #08303f 0%, #062836 40%, #041d27 100%); }
html[data-modo="oscuro"] .menu a.activo { background: #e3edf0; color: #00384d; }
html[data-modo="oscuro"] .cal-dia.fuera .cal-num,
html[data-modo="oscuro"] tr.cancelada td { color: #5f7782; }
html[data-modo="oscuro"] .cal-act.cal-cancelada { border-left-color: #5f7782; }
html[data-modo="oscuro"] .boton.peligro { color: #2a0d10; }
html[data-modo="oscuro"] .saludo-fecha { color: #ff9f66; }
html[data-modo="oscuro"] img.marca-logo, html[data-modo="oscuro"] .logo-acceso { filter: none; }

/* Botón para cambiar de modo */
.cambiar-modo { background: none; border: 0; padding: .3rem; color: var(--lateral-suave); cursor: pointer; display: inline-flex; border-radius: 6px; }
.cambiar-modo:hover { color: var(--lateral-texto); background: var(--lateral-activo); }
.cambiar-modo svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.cambiar-modo .sol { display: none; }
html[data-modo="oscuro"] .cambiar-modo .sol { display: block; }
html[data-modo="oscuro"] .cambiar-modo .luna { display: none; }
.sesion-acciones { display: flex; align-items: center; gap: .2rem; }

/* Los textos que se van a pegar en un email se ven como en el email: sobre blanco */
html[data-modo="oscuro"] .editor,
html[data-modo="oscuro"] .plantilla-texto { background: #f7fafb; color: #10303d; border-color: #2f4c57; }

html[data-modo="oscuro"] .cal-act.cal-salida, html[data-modo="oscuro"] .cal-act.muestra[style*="--tono"] {
  background: hsl(var(--tono) 35% 20%); border-left-color: hsl(var(--tono) 60% 58%); color: hsl(var(--tono) 30% 90%);
  box-shadow: inset 0 0 0 1px hsl(var(--tono) 30% 28%); }
html[data-modo="oscuro"] .cal-act.cal-salida b { color: hsl(var(--tono) 65% 78%); }
html[data-modo="oscuro"] .cal-act.cal-salida span { color: hsl(var(--tono) 20% 72%); }
html[data-modo="oscuro"] .cal-act.cal-salida:hover { background: hsl(var(--tono) 35% 25%); }
html[data-modo="oscuro"] .cal-act.cal-salida span .falta-pago { color: #f0a85a; }

html[data-modo="oscuro"] .salida.salida-color { background: hsl(var(--tono) 25% 13%); border-color: hsl(var(--tono) 25% 24%);
  border-left-color: hsl(var(--tono) 60% 55%); }
html[data-modo="oscuro"] .salida-color .salida-cabecera { background: hsl(var(--tono) 30% 19%); }
html[data-modo="oscuro"] .salida-color .salida-cabecera strong { color: hsl(var(--tono) 65% 82%); }
html[data-modo="oscuro"] .salida-color .salida-cabecera small { color: hsl(var(--tono) 20% 70%); }
html[data-modo="oscuro"] .salida-hora { background: hsl(var(--tono) 50% 38%); }
html[data-modo="oscuro"] .salida-color .tabla-salida tr + tr td { border-top-color: hsl(var(--tono) 20% 20%); }

html[data-modo="oscuro"] .agenda-tour { background: hsl(var(--tono) 25% 14%); border-color: hsl(var(--tono) 25% 25%); border-left-color: hsl(var(--tono) 60% 55%); }
html[data-modo="oscuro"] .agenda-tour:hover { background: hsl(var(--tono) 28% 18%); }
html[data-modo="oscuro"] .agenda-tour-hora { color: hsl(var(--tono) 65% 72%); }
html[data-modo="oscuro"] .agenda-tour-cuerpo strong { color: hsl(var(--tono) 60% 86%); }
html[data-modo="oscuro"] .agenda-tour-datos { color: hsl(var(--tono) 15% 70%); }
