/* ---------------------------------------------------------------------
   Pasada minimalista (prompts 031/032): estilos nuevos de Inicio. Archivo aparte para no subir la versión de isona-shell.css
   (su ?v=1x está fijado por tests). Se carga después de isona-shell.css.
   --------------------------------------------------------------------- */

/* Resumen de Inicio: dos pastillas tocables (agenda y pendientes), con el estilo de las tarjetas de abajo. */
.isona-view[data-view="inicio"] .secretaria-texto{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.isona-resumen-chip{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--isona-borde);
  background: var(--isona-azul-acento-suave);
  color: var(--isona-texto);
  border-radius: var(--isona-radio-pill);
  padding: 7px 14px 7px 8px;
  font: inherit;
  font-size: 14px;
  line-height: 1.2;
  cursor: pointer;
  text-decoration: none;
}
.isona-resumen-chip:hover{ border-color: var(--isona-azul-acento); }
.isona-resumen-chip:focus-visible{ outline: 2px solid var(--isona-azul-acento); outline-offset: 2px; }
.isona-resumen-chip-icono{
  width: 26px; height: 26px;
  border-radius: 50%;
  background: var(--isona-fondo-tarjeta);
  color: var(--isona-azul-acento);
  display: inline-flex; align-items: center; justify-content: center;
}
.isona-resumen-chip-icono svg{ width: 15px; height: 15px; }
.isona-resumen-chip strong{ font-weight: 700; }
/* El separador queda en el texto (lo lee el contexto de la Secretaría y el lector de pantalla), no se ve. */
.isona-resumen-sep{ position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.isona-resumen-texto{ font-size: 14px; color: var(--isona-texto-tenue); }

/* Clima: tira dinámica con UNA sola copia (sin el texto repetido). El texto entra por la derecha y sale por la izquierda. */
#isona-clima-tira-track{
  display: inline-block;
  width: auto;
  padding-left: 100%;
  animation: isona-clima-una-copia 22s linear infinite;
}
@keyframes isona-clima-una-copia{
  from{ transform: translateX(0); }
  to{ transform: translateX(-100%); }
}
@media (prefers-reduced-motion: reduce){
  #isona-clima-tira-track{ padding-left: 0; }
}

/* ---------------------------------------------------------------------
   Fondo según el clima, en todas las vistas (prompts 033 y 034). Solo degradés CSS, sin descargas.
   src/main.js pone data-fondo-clima en cada vista. Sin ese atributo (clima caído o Modo privacidad) el fondo es neutro:
   los valores iniciales de abajo son el fondo y el texto de siempre.
   Los colores están registrados con @property para que la transición los anime; el contraste AA lo calcula src/clima-fondo.test.js.
   --------------------------------------------------------------------- */
@property --clima-a{ syntax: '<color>'; inherits: true; initial-value: #f6f7fb; }
@property --clima-b{ syntax: '<color>'; inherits: true; initial-value: #f6f7fb; }
@property --clima-texto{ syntax: '<color>'; inherits: true; initial-value: #1b2333; }

.isona-view{
  transition: --clima-a 1.2s ease, --clima-b 1.2s ease, --clima-texto 1.2s ease;
}
.isona-view[data-fondo-clima="despejado-dia"]{ --clima-a: #eaf2ff; --clima-b: #fdf3df; --clima-texto: #1b2333; }
.isona-view[data-fondo-clima="nublado-dia"]{ --clima-a: #eef1f5; --clima-b: #dde3eb; --clima-texto: #1b2333; }
.isona-view[data-fondo-clima="lluvia"]{ --clima-a: #dfe6ef; --clima-b: #c9d3df; --clima-texto: #1b2333; }
.isona-view[data-fondo-clima="noche-despejada"]{ --clima-a: #14213d; --clima-b: #1f2f57; --clima-texto: #ffffff; }
.isona-view[data-fondo-clima="noche-nublada"]{ --clima-a: #1c2433; --clima-b: #2b3445; --clima-texto: #ffffff; }

/* Capa fija detrás de todo: cubre la pantalla entera y la pone la vista activa (las demás están en display: none). */
.isona-view::before{
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  background: linear-gradient(160deg, var(--clima-a), var(--clima-b));
}
.isona-view[data-view="inicio"] .saludo{ color: var(--clima-texto); }
/* Solo el título suelto de la vista: la carátula de la causa abierta usa la misma clase, pero va dentro de un panel blanco. */
.isona-view > .isona-view-titulo{ color: var(--clima-texto); }

/* El contenido manda: tarjetas, tira y chat blancos encima, con una sombra leve. */
.isona-view[data-view="inicio"] .secretaria-texto,
.isona-view[data-view="inicio"] .isona-clima-tira,
.isona-view[data-view="inicio"] .isona-sugerencia-card{
  background: var(--isona-fondo-tarjeta);
  box-shadow: var(--isona-sombra-sm);
}
.isona-view[data-view="inicio"] .isona-clima-tira-item{ color: var(--isona-texto-tenue); }

/* Resto de las vistas: todo lo que no sea el título va sobre un panel blanco. Ningún texto queda apoyado sobre el degradé.
   Quedan afuera los modales (van por encima de todo), el botón «Volver» (blanco, sin el relleno de panel) y las líneas divisorias (los paneles ya separan). */
.isona-view:not([data-view="inicio"]) > :not(.isona-view-titulo, hr, .isona-modal-overlay, .isona-btn-secundario){
  background: var(--isona-fondo-tarjeta);
  border-radius: var(--isona-radio-md);
  box-shadow: var(--isona-sombra-sm);
  padding: var(--isona-space-4);
  margin: 0 0 var(--isona-space-4);
}
.isona-view:not([data-view="inicio"]) > hr{ display: none; }
.isona-view:not([data-view="inicio"]) > .isona-btn-secundario{
  background: var(--isona-fondo-tarjeta);
  box-shadow: var(--isona-sombra-sm);
  margin-bottom: var(--isona-space-4);
}

@media (prefers-reduced-motion: reduce){
  .isona-view[data-view="inicio"]{ transition: none; }
  .isona-view{ transition: none; }
}