/* Nexus brand override - main styles come from brainzlab-ui gem dashboard.css */
:root {
  /* Puente al token unico de marca. dm_compat dice literalmente "override
     --dm-brand per service": esto es exactamente eso, con la marca resuelta
     por host en vez de una constante por servicio. Asi las pantallas de auth
     —que usan el vocabulario --color-* derivado de aqui— siguen a la marca
     sin refactorizar ese tercer sistema de tokens. */
  --dm-brand: var(--color-brand, #0ea5e9);

  /* Aliases: map --color-* (used in views) to --dm-* (defined in brainzlab-ui) */
  --color-text: var(--dm-text);
  --color-text-secondary: var(--dm-text-secondary);
  --color-text-muted: var(--dm-text-muted);
  --color-text-placeholder: var(--dm-text-placeholder);
  --color-bg: var(--dm-bg);
  --color-surface: var(--dm-surface);
  --color-surface-light: var(--dm-surface-light);
  --color-border: var(--dm-border);
  --color-input-bg: var(--dm-input-bg);
  --color-input-border: var(--dm-input-border);
  --color-primary: var(--dm-brand);
  --color-primary-bg: var(--dm-info-bg);
  --color-primary-text: var(--dm-info-text);
  --color-success: var(--dm-success);
  --color-success-bg: var(--dm-success-bg);
  --color-success-text: var(--dm-success-text);
  --color-warning: var(--dm-warning);
  --color-warning-bg: var(--dm-warning-bg);
  --color-warning-text: var(--dm-warning-text);
  --color-error: var(--dm-error);
  --color-error-bg: var(--dm-error-bg);
  --color-error-text: var(--dm-error-text);
  --color-info: var(--dm-info);
  --color-info-bg: var(--dm-info-bg);
  --color-info-text: var(--dm-info-text);
  --color-table-header: var(--dm-surface-alt);
  --color-sidebar-bg: var(--dm-surface-alt);
  --color-sidebar-border: var(--dm-border);
  --color-sidebar-text: var(--dm-text);
  --shadow-sm: var(--dm-shadow-sm);

  /* Accent colors for badges and status indicators */
  --color-purple: #7c3aed;
  --color-purple-bg: #ede9fe;
  --color-purple-text: #6b21a8;
  --color-active-green: #10b981;
  --color-violet: #8b5cf6;
  --color-on-warning: #1a1a1a;
}

/* Normalize button_to <form><button> to match link_to <a> dimensions */
td form {
  display: inline;
}

td form button {
  line-height: 1rem;
}

/* Dark mode overrides for accent colors */
html.dark {
  --color-purple: #a78bfa;
  --color-purple-bg: rgba(139, 92, 246, 0.15);
  --color-purple-text: #c4b5fd;
  --color-active-green: #34d399;
  --color-violet: #c084fc;
  --color-on-warning: #1a1a1a;
}

/* Date/time input calendar icon — visible in both themes.
   Browsers paint ::-webkit-calendar-picker-indicator dark by default,
   which is invisible against dark backgrounds. We give it explicit color
   in light mode and invert it in dark mode. */
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator,
input[type="month"]::-webkit-calendar-picker-indicator,
input[type="week"]::-webkit-calendar-picker-indicator {
  cursor: pointer;
  opacity: 0.7;
  filter: none;
  transition: opacity 0.15s ease;
}

input[type="date"]::-webkit-calendar-picker-indicator:hover,
input[type="time"]::-webkit-calendar-picker-indicator:hover,
input[type="datetime-local"]::-webkit-calendar-picker-indicator:hover,
input[type="month"]::-webkit-calendar-picker-indicator:hover,
input[type="week"]::-webkit-calendar-picker-indicator:hover {
  opacity: 1;
}

html.dark input[type="date"]::-webkit-calendar-picker-indicator,
html.dark input[type="time"]::-webkit-calendar-picker-indicator,
html.dark input[type="datetime-local"]::-webkit-calendar-picker-indicator,
html.dark input[type="month"]::-webkit-calendar-picker-indicator,
html.dark input[type="week"]::-webkit-calendar-picker-indicator {
  filter: invert(1) brightness(1.4);
  opacity: 0.85;
}

html.dark input[type="date"]::-webkit-calendar-picker-indicator:hover,
html.dark input[type="time"]::-webkit-calendar-picker-indicator:hover,
html.dark input[type="datetime-local"]::-webkit-calendar-picker-indicator:hover,
html.dark input[type="month"]::-webkit-calendar-picker-indicator:hover,
html.dark input[type="week"]::-webkit-calendar-picker-indicator:hover {
  opacity: 1;
}

/* Firefox fallback — no pseudo-element control, but ensure text color */
html.dark input[type="date"],
html.dark input[type="time"],
html.dark input[type="datetime-local"],
html.dark input[type="month"],
html.dark input[type="week"] {
  color-scheme: dark;
}

/* ─── Fix tema claro con marca (theme_mode=light) ──────────────────────────
   El gem brainzlab-ui (dark-mode.css) tiñe body y h1..h6 de oscuro bajo
   @media (prefers-color-scheme: dark) con el guard `:root:not(.light)` —
   SOLO la clase, sin `[data-theme="light"]`. Pero el script del layout usa
   data-theme como fuente de verdad (la clase .light puede faltar por el
   timing de Turbo), así que una marca de socio con theme_mode="light"
   quedaba con el contenido en oscuro sobre un chrome claro: título
   invisible, tarjetas grises.

   Esto re-declara esas reglas con el guard completo, alineado con el resto
   del sistema (dm_compat usa `:not(.light):not([data-theme="light"])`). Se
   carga DESPUÉS del gem, así que gana en cascada.

   Causa raíz: está en el gem. Debería subirse también a brainzlab-ui para
   que synapse y las demás apps se beneficien. Ver [[ventures/nexus/todo]]. */
@media (prefers-color-scheme: dark) {
  :root:not(.light)[data-theme="light"] body {
    background-color: var(--dm-bg);
    color: var(--dm-text);
  }

  :root:not(.light)[data-theme="light"] h1,
  :root:not(.light)[data-theme="light"] h2,
  :root:not(.light)[data-theme="light"] h3,
  :root:not(.light)[data-theme="light"] h4,
  :root:not(.light)[data-theme="light"] h5,
  :root:not(.light)[data-theme="light"] h6 {
    color: var(--dm-text);
  }
}