/* Modo oscuro de la plataforma (Edgar Amaro / Rafael, 2026-10-21; solicitud #64).
   Se activa con la clase «oscuro» en <html> (botón 🌙/☀️ del encabezado, preferencia en localStorage «tema»).
   Solo en pantalla: lo que se imprime (cotizaciones, PDF) se queda en claro. Paleta: tinta AM y verde AM. */
@media screen {
  html.oscuro { color-scheme: dark; }
  html.oscuro body { background: #121110; color: #ECE9E2; }

  /* Superficies */
  html.oscuro .bg-fondo, html.oscuro [class*="bg-fondo/"] { background-color: #121110 !important; }
  html.oscuro .bg-white, html.oscuro [class*="bg-white/"], html.oscuro .bg-superficie { background-color: #1C1A17 !important; }
  html.oscuro .bg-superficie-2 { background-color: #201E1A !important; }
  html.oscuro .bg-line, html.oscuro .bg-line-2 { background-color: #2A2723 !important; }
  html.oscuro .bg-am-50 { background-color: rgba(114,191,68,.14) !important; }
  html.oscuro .bg-am-100 { background-color: rgba(114,191,68,.22) !important; }
  html.oscuro .bg-peach, html.oscuro .bg-peach-soft { background-color: #2A201C !important; }
  html.oscuro .bg-ink { background-color: #000 !important; }
  html.oscuro .bg-\[\#E9E7E1\] { background-color: #121110 !important; }

  /* Hover */
  html.oscuro .hover\:bg-fondo:hover, html.oscuro .hover\:bg-white:hover, html.oscuro .hover\:bg-line-2:hover { background-color: #26231F !important; }
  html.oscuro .hover\:bg-am-50:hover { background-color: rgba(114,191,68,.2) !important; }

  /* Texto */
  html.oscuro .text-ink { color: #ECE9E2 !important; }
  html.oscuro .text-ink-2 { color: #D6D2CA !important; }
  html.oscuro .text-ink-3 { color: #ABA69D !important; }
  html.oscuro .text-ink-4 { color: #8E897F !important; }
  html.oscuro .text-am-700 { color: #8FD066 !important; }
  html.oscuro .text-am-800 { color: #A8DD86 !important; }
  html.oscuro .hover\:text-am-700:hover { color: #A8DD86 !important; }

  /* Bordes */
  html.oscuro .border-line, html.oscuro .border-line-2 { border-color: #2F2C27 !important; }
  html.oscuro .border-am-100 { border-color: rgba(114,191,68,.35) !important; }
  html.oscuro .divide-line > :not([hidden]) ~ :not([hidden]), html.oscuro .divide-line-2 > :not([hidden]) ~ :not([hidden]) { border-color: #2F2C27 !important; }
  html.oscuro .ring-line { --tw-ring-color: #2F2C27 !important; }

  /* Formularios */
  html.oscuro input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]), html.oscuro select, html.oscuro textarea {
    background-color: #1C1A17; color: #ECE9E2; border-color: #3A362F;
  }
  html.oscuro input::placeholder, html.oscuro textarea::placeholder { color: #7D786F; }
  html.oscuro option { background: #1C1A17; color: #ECE9E2; }

  /* Sobre verde AM o fondos claros de color fijo (avisos, etiquetas, franja «Ver como»), el texto tinta se queda oscuro */
  html.oscuro .bg-am .text-ink, html.oscuro .bg-am.text-ink,
  html.oscuro :is([class*="bg-[#F"], [class*="bg-[#E"], [class*="bg-[#D"], [class*="bg-[#C"]):is(.text-ink, .text-ink-2, .text-ink-3, .text-ink-4),
  html.oscuro :is([class*="bg-[#F"], [class*="bg-[#E"], [class*="bg-[#D"], [class*="bg-[#C"]) :is(.text-ink, .text-ink-2, .text-ink-3, .text-ink-4) { color: #16140F !important; }

  /* Tablas con franjas */
  html.oscuro tr.bg-fondo, html.oscuro .odd\:bg-fondo:nth-child(odd), html.oscuro .even\:bg-fondo:nth-child(even) { background-color: #181613 !important; }

  /* Código y detalles */
  html.oscuro code { background-color: #2A2723 !important; color: #ECE9E2; }
  html.oscuro hr { border-color: #2F2C27; }
}

/* Botón del encabezado */
.tema-btn .luna { display: inline; } .tema-btn .sol { display: none; }
html.oscuro .tema-btn .luna { display: none; } html.oscuro .tema-btn .sol { display: inline; }

/* Cuadro de chat estilo Claude (partials/compositor.php) */
html.oscuro .comp-btn { color: #C9C5BC; }
html.oscuro .comp-btn:hover { background: #2E2A25; color: #FAFAFA; }
html.oscuro .comp-btn.activo { background: #24361A; color: #9FD97A; }
html.oscuro .comp-texto { color: #EDEAE4; }