/* Tema claro */
:root {
  color-scheme: light;

  /* Superficies. --color-surface-alt (cabeceras de grid, paneles fijos de
     ficha...) — un paso mas claro que el primer intento (aquel quedaba
     demasiado oscuro dentro del workspace). */
  --color-bg: #e1e7ef;
  --color-surface: #ffffff;
  --color-surface-alt: #edf0f4;
  --color-surface-hover: #e6eaf0;
  --color-surface-selected: #d9ecff;
  --color-surface-warm: #f8f0e0;

  /* Bordes */
  --color-border: #d6dee8;
  --color-border-subtle: #e6ebf2;

  /* Texto — mas oscuros que antes para mantener el contraste sobre los
     grises mas fuertes de arriba. */
  --color-text: #16202f;
  --color-text-secondary: #384658;
  --color-text-muted: #626d80;
  --color-text-on-primary: #ffffff;
  --color-heading: #16202f;

  /* Color de las etiquetas de campo cuando NO tienen el foco (ver
     field-styles.js). En claro, --color-text-secondary quedaba demasiado
     oscura y con el foco (--color-heading, igual de oscuro) apenas se
     notaba el resaltado — de ahi este tono, mas gris/mas claro, solo para
     este uso. En oscuro se deja igual que --color-text-secondary, que ya
     contrasta bien contra el blanco del foco. */
  --color-field-label: var(--color-text-muted);

  /* Marca — alineada con los colores exactos del logo (azul del rectangulo,
     verde del icono), en vez del azul ligeramente distinto que habia antes. */
  --color-primary: #0c6df5;
  --color-primary-hover: #0956c7;
  --color-primary-soft: #dceaff;
  --color-focus-ring: rgb(12 109 245 / 22%);
  --color-accent: #23923c;

  /* Tercer color de marca, deliberadamente distinto del azul/verde del logo
     — para romper la monotonia de solo esos dos tonos. Un naranja intenso,
     distinguible a proposito del ambar mas apagado de --color-warning. Por
     ahora solo se usa en el item activo del menu principal. */
  --color-highlight: #f97316;
  --color-highlight-hover: #ea580c;
  --color-highlight-bg: #ffedd5;
  --color-highlight-text: #9a3412;

  /* Estados */
  --color-success: #16a34a;
  --color-success-bg: #dcf6e6;
  --color-danger: #dc2626;
  --color-danger-bg: #fce4e2;
  --color-warning: #d97706;
  --color-warning-bg: #fdedd3;

  /* Estructura (barra lateral): grises claros/medio-claros en vez de la
     mezcla de azules de antes — el azul de marca queda reservado para
     --color-primary, no diluido aqui en varios tonos propios. El item
     activo usa el tercer color (naranja) en vez de azul, para que se
     distinga claramente de "hover"/"en el camino hacia el activo". */
  --color-shell-bg: #e4e7ec;
  /* Degradado sutil del menu principal (pedido explicitamente): un poco
     mas oscuro que --color-shell-bg arriba-izquierda, un poco mas claro
     abajo-derecha, en diagonal. */
  --color-shell-gradient: linear-gradient(135deg, #d4d8df 0%, #eef1f4 100%);
  --color-shell-border: #cbd1da;
  --color-shell-text: #1f2937;
  --color-shell-text-muted: #454e5c;
  /* Mas oscuro que antes (#d8dce3, pedido explicitamente) — con el
     degradado del menu (--color-shell-gradient) casi no contrastaba,
     sobre todo en la zona de arriba (mas oscura de por si en el degradado). */
  --color-shell-hover-bg: #c3c8d1;
  /* Fondo del buscador del menu: mas fuerte que --color-shell-hover-bg —
     con el degradado del menu (--color-shell-gradient) casi no hacia
     contraste. */
  --color-shell-search-bg: #c6ccd5;
  --color-shell-active-bg: var(--color-highlight-bg);
  --color-shell-active-text: var(--color-highlight-text);
  --color-shell-scrollbar: #b7bec9;

  /* Cabecera: mismo degradado de marca que el tema oscuro (ver dark.css),
     pero mucho mas tenue — sobre fondo blanco el mismo color a la misma
     opacidad se percibe bastante mas fuerte que sobre un fondo oscuro. */
  --color-titlebar-gradient: linear-gradient(
    100deg,
    rgb(255 255 255 / 0%) 0%,
    rgb(255 255 255 / 0%) 8%,
    rgb(12 109 245 / 26%) 26%,
    rgb(35 146 60 / 18%) 50%,
    rgb(255 255 255 / 0%) 75%
  );

  /* Elevacion */
  --shadow-sm: 0 1px 2px rgb(15 23 42 / 8%);
  --shadow-md: 0 14px 32px rgb(15 23 42 / 18%);
  --shadow-lg: 0 24px 64px rgb(15 23 42 / 22%);
  --shadow-active-tab: 0 -6px 14px rgb(15 23 42 / 8%);
}