/* ==========================================================================
   ImagenMed · Tokens de diseño
   Fuente única de colores, tipografía, radios y sombras.
   Se importa desde admin.css y auth.css, y se enlaza en las páginas públicas.
   Tema claro en :root / [data-bs-theme=light], oscuro en [data-bs-theme=dark].
   ========================================================================== */

:root,
[data-bs-theme="light"] {
  /* Superficies */
  --im-bg:            #f4f6f8;   /* fondo de página */
  --im-surface:       #ffffff;   /* tarjetas, topbar, modales */
  --im-surface-2:     #eef2f5;   /* cabecera de tablas, hover, inputs deshabilitados */
  --im-border:        #dfe5ea;   /* bordes de tarjetas y divisores */
  --im-border-strong: #85929d;   /* bordes de inputs y controles (3:1) */

  /* Texto */
  --im-ink:   #102231;           /* texto principal */
  --im-ink-2: #51606d;           /* texto secundario */
  --im-ink-3: #627080;           /* ayudas, placeholders, metadatos */

  /* Marca: teal clínico */
  --im-primary:        #0a6f80;
  --im-primary-hover:  #085a68;
  --im-primary-subtle: #e0f1f4;
  --im-primary-text:   #075261;  /* texto sobre primary-subtle */
  --im-on-primary:     #ffffff;
  --im-focus:          rgba(10, 111, 128, .28);

  /* Navegación lateral (siempre oscura) */
  --im-nav-bg:        #0b1d2b;
  --im-nav-ink:       #b8c7d3;
  --im-nav-muted:     #7f94a5;
  --im-nav-hover:     rgba(255, 255, 255, .06);
  --im-nav-active:    #16354d;
  --im-nav-indicator: #36c2cf;
  --im-nav-border:    rgba(255, 255, 255, .08);

  /* Estados */
  --im-success:        #157347;
  --im-success-subtle: #e2f3ea;
  --im-success-text:   #0f5535;
  --im-warning:        #a35200;
  --im-warning-subtle: #fcefdc;
  --im-warning-text:   #7a3d00;
  --im-danger:         #b42318;
  --im-danger-subtle:  #fdecea;
  --im-danger-text:    #8a1b12;

  /* Modalidades de estudio (fondo / texto / color de gráfico) */
  --im-rx-bg:  #e3eefb; --im-rx-ink:  #123f73; --im-rx:  #2563b8;
  --im-eco-bg: #dff3ec; --im-eco-ink: #0b4d3c; --im-eco: #138a6b;
  --im-tac-bg: #fbeedb; --im-tac-ink: #6b3a05; --im-tac: #c27612;
  --im-mam-bg: #fbe7ef; --im-mam-ink: #74203f; --im-mam: #c2416f;
  --im-rmn-bg: #ece9fd; --im-rmn-ink: #3b2f8a; --im-rmn: #6a55d6;
  --im-otr-bg: #eceff2; --im-otr-ink: #3c4752; --im-otr: #74828f;

  /* Visor de imágenes (siempre oscuro) */
  --im-viewer-bg: #070d13;

  /* Forma */
  --im-radius-sm: 6px;
  --im-radius:    8px;
  --im-radius-lg: 12px;
  --im-shadow-sm: 0 1px 2px rgba(16, 34, 49, .06);
  --im-shadow:    0 1px 2px rgba(16, 34, 49, .05), 0 4px 12px rgba(16, 34, 49, .06);
  --im-shadow-lg: 0 12px 32px rgba(16, 34, 49, .16);

  /* Tipografía */
  --im-font: 'Inter', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --im-font-mono: ui-monospace, "SFMono-Regular", "Cascadia Mono", Consolas, monospace;

  /* Puente con Bootstrap 5.3 */
  --bs-body-font-family: var(--im-font);
  --bs-body-bg: var(--im-bg);
  --bs-body-color: var(--im-ink);
  --bs-secondary-color: var(--im-ink-2);
  --bs-tertiary-bg: var(--im-surface-2);
  --bs-border-color: var(--im-border);
  --bs-border-radius: var(--im-radius);
  --bs-border-radius-lg: var(--im-radius-lg);
  --bs-primary: #0a6f80;
  --bs-primary-rgb: 10, 111, 128;
  --bs-success: #157347;
  --bs-success-rgb: 21, 115, 71;
  --bs-warning-rgb: 163, 82, 0;
  --bs-danger: #b42318;
  --bs-danger-rgb: 180, 35, 24;
  --bs-link-color: #0a6f80;
  --bs-link-color-rgb: 10, 111, 128;
  --bs-link-hover-color: #085a68;
  --bs-link-hover-color-rgb: 8, 90, 104;
  --bs-focus-ring-color: var(--im-focus);
  --bs-primary-bg-subtle: #e0f1f4;
  --bs-primary-text-emphasis: #075261;
  --bs-primary-border-subtle: #a9d8df;
  --bs-success-bg-subtle: #e2f3ea;
  --bs-success-text-emphasis: #0f5535;
  --bs-warning-bg-subtle: #fcefdc;
  --bs-warning-text-emphasis: #7a3d00;
  --bs-danger-bg-subtle: #fdecea;
  --bs-danger-text-emphasis: #8a1b12;
  --bs-info-bg-subtle: #e0f1f4;
  --bs-info-text-emphasis: #075261;

  /* Alias heredados (estilos inline existentes) */
  --accent: var(--im-primary);
  --accent-dark: var(--im-primary-hover);
  --brand: var(--im-ink);
  --border-c: var(--im-border);
  --bg-page: var(--im-bg);
  --radius: var(--im-radius);
  --radius-lg: var(--im-radius-lg);
}

[data-bs-theme="dark"] {
  --im-bg:            #0a1219;
  --im-surface:       #101b25;
  --im-surface-2:     #16242f;
  --im-border:        #22323f;
  --im-border-strong: #5a6d7c;

  --im-ink:   #e5ecf1;
  --im-ink-2: #a3b2be;
  --im-ink-3: #8394a2;

  --im-primary:        #38bfcc;
  --im-primary-hover:  #5fd0db;
  --im-primary-subtle: #0f3238;
  --im-primary-text:   #9fe3ea;
  --im-on-primary:     #04262b;
  --im-focus:          rgba(56, 191, 204, .32);

  --im-nav-bg:        #070e14;
  --im-nav-active:    #12283a;
  --im-nav-border:    #1a2733;

  --im-success:        #4cc38a;
  --im-success-subtle: #0d3322;
  --im-success-text:   #86e0b0;
  --im-warning:        #f0a64a;
  --im-warning-subtle: #3a2508;
  --im-warning-text:   #f7c37a;
  --im-danger:         #f0766b;
  --im-danger-subtle:  #3d1210;
  --im-danger-text:    #f8b4ad;

  --im-rx-bg:  #142a45; --im-rx-ink:  #b9d4f6; --im-rx:  #5b9be6;
  --im-eco-bg: #0d3328; --im-eco-ink: #a6e6d0; --im-eco: #3cc39a;
  --im-tac-bg: #3a2608; --im-tac-ink: #f6cf8f; --im-tac: #e3a043;
  --im-mam-bg: #3d1424; --im-mam-ink: #f6bfd3; --im-mam: #e3779e;
  --im-rmn-bg: #251d52; --im-rmn-ink: #d3cbfb; --im-rmn: #9a89f0;
  --im-otr-bg: #1e2a35; --im-otr-ink: #c4ced7; --im-otr: #8d9cab;

  --im-shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);
  --im-shadow:    0 1px 2px rgba(0, 0, 0, .3), 0 4px 12px rgba(0, 0, 0, .25);
  --im-shadow-lg: 0 12px 32px rgba(0, 0, 0, .5);

  --bs-body-bg: var(--im-bg);
  --bs-body-color: var(--im-ink);
  --bs-secondary-color: var(--im-ink-2);
  --bs-tertiary-bg: var(--im-surface-2);
  --bs-border-color: var(--im-border);
  --bs-primary: #38bfcc;
  --bs-primary-rgb: 56, 191, 204;
  --bs-success: #4cc38a;
  --bs-success-rgb: 76, 195, 138;
  --bs-warning-rgb: 240, 166, 74;
  --bs-danger: #f0766b;
  --bs-danger-rgb: 240, 118, 107;
  --bs-link-color: #38bfcc;
  --bs-link-color-rgb: 56, 191, 204;
  --bs-link-hover-color: #5fd0db;
  --bs-link-hover-color-rgb: 95, 208, 219;
  --bs-primary-bg-subtle: #0f3238;
  --bs-primary-text-emphasis: #9fe3ea;
  --bs-primary-border-subtle: #1d5a63;
  --bs-success-bg-subtle: #0d3322;
  --bs-success-text-emphasis: #86e0b0;
  --bs-warning-bg-subtle: #3a2508;
  --bs-warning-text-emphasis: #f7c37a;
  --bs-danger-bg-subtle: #3d1210;
  --bs-danger-text-emphasis: #f8b4ad;
  --bs-info-bg-subtle: #0f3238;
  --bs-info-text-emphasis: #9fe3ea;
}
