/* Movimiento de Nuria (ver nuria/motion.js). Solo transform/scale/translate, opacity
   y filter; transiciones interrumpibles para lo interactivo; nada con «all». */
:root {
  --m-out: cubic-bezier(.2, 0, 0, 1);
  --m-in: cubic-bezier(.4, 0, 1, 1);
  --m-press: 150ms;
  --m-color: 180ms;
}
@supports (transition-timing-function: linear(0, 1)) {
  :root { --m-out: var(--m-spring, cubic-bezier(.2, 0, 0, 1)); }
}

/* ---------- Pulsación: respuesta táctil en todo lo que se toca ---------- */
:is(.button, .nav-item, .tab, .summary-filter, .assistant-action, .assistant-send, .assistant-voice, .assistant-launcher, .pf-option,
    .identity-theme-option, .identity-item, .theme-toggle, .hc-swatch, .chip, .assistant-quick-actions button, .suggestion button, .setup-shift-link) {
  transition-property: scale, background-color, color, border-color, box-shadow, opacity;
  transition-duration: var(--m-press), var(--m-color), var(--m-color), var(--m-color), var(--m-color), var(--m-color);
  transition-timing-function: ease-out;
}
:is(.button, .nav-item, .tab, .assistant-action, .assistant-send, .assistant-voice, .pf-option, .identity-theme-option, .identity-item,
    .theme-toggle, .hc-swatch, .chip, .assistant-quick-actions button, .suggestion button):active:not(:disabled) { scale: .96; }
.assistant-launcher:active { scale: .94; }
/* Filas y tarjetas que se abren: una presión más sutil */
:is(.hc-row, .patient-item, .today-stat, .summary-filter, .guide-step, .agenda-row, .today-row, .appointment-card, .task-row) {
  transition-property: scale, translate, box-shadow, border-color, background-color;
  transition-duration: var(--m-press), 220ms, 220ms, var(--m-color), var(--m-color);
  transition-timing-function: ease-out;
}
:is(.hc-row, .patient-item, .today-stat, .summary-filter, .guide-step):active { scale: .985; }

/* ---------- Hover: se eleva un poco (solo con ratón) ---------- */
@media (hover: hover) and (pointer: fine) {
  :is(.hc-row, .today-stat, .guide-step, .appointment-card):hover { translate: 0 -1px; box-shadow: 0 6px 18px rgba(12, 40, 36, .08); }
  .button.primary:hover:not(:disabled) { box-shadow: 0 4px 14px color-mix(in srgb, var(--pino) 30%, transparent); }
}

/* ---------- «Pill» deslizante: la selección es un fondo que se mueve ---------- */
/* Menú principal (lateral en PC, barra inferior en móvil) */
:root .sidebar .sidebar-nav > .nav-item.nav-item[aria-current="page"][aria-current] { background: transparent !important; }
/* La selección anterior se apaga al instante: solo existe un «pill», el que viaja. */
:is(.sidebar-nav, .pf-segmented, .identity-theme, .tabs, .section-links, .practice-tabs, .platform-filters) > *::before,
.pf-segmented .pf-option::before, .identity-theme .identity-theme-option::before { transition: none !important; }
/* Obligatorio / Opcional / No pedir */
.pf-segmented .pf-option { position: relative; }
.pf-segmented .pf-option::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none; transform-origin: top left; background: transparent; }
:root .pf-segmented .pf-option.pf-option[aria-checked="true"][role="radio"] { background: transparent !important; }
.pf-segmented .pf-option[aria-checked="true"]::before { background: var(--pino); }
.pf-segmented .pf-option[aria-checked="true"][data-mode="optional"]::before { background: var(--salvia); }
.pf-segmented .pf-option[aria-checked="true"][data-mode="off"]::before { background: #EFE9DE; }
/* Automático / Claro / Oscuro del menú de la cuenta */
.identity-theme-option { position: relative; isolation: isolate; z-index: 0; }
.identity-theme-option::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none; transform-origin: top left; }
:root .identity-theme .identity-theme-option.identity-theme-option[aria-pressed="true"] { background: transparent !important; box-shadow: none !important; }
.identity-theme-option[aria-pressed="true"]::before { background: var(--surface); box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
/* Pestañas de la ficha del paciente */
:root .tabs > .tab.tab.active, :root .tabs > .tab.tab[aria-selected="true"] { background: transparent !important; box-shadow: none !important; }
.tabs > .tab[aria-selected="true"]::before, .tabs > .tab.active::before { background: var(--surface, #fff); box-shadow: 0 1px 5px rgba(0, 0, 0, .08), 0 0 1px rgba(0, 0, 0, .1); }

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .pf-segmented .pf-option[aria-checked="true"]::before { background: var(--pino); }
  :root:not([data-theme="light"]) .pf-segmented .pf-option[aria-checked="true"][data-mode="optional"]::before { background: #2A3057; }
  :root:not([data-theme="light"]) .pf-segmented .pf-option[aria-checked="true"][data-mode="off"]::before { background: #2A2721; }
  :root:not([data-theme="light"]) .tabs > .tab[aria-selected="true"]::before, :root:not([data-theme="light"]) .tabs > .tab.active::before { background: var(--surface-2); }
}
:root[data-theme="dark"] .pf-segmented .pf-option[aria-checked="true"][data-mode="optional"]::before { background: #2A3057; }
:root[data-theme="dark"] .pf-segmented .pf-option[aria-checked="true"][data-mode="off"]::before { background: #2A2721; }
:root[data-theme="dark"] .tabs > .tab[aria-selected="true"]::before, :root[data-theme="dark"] .tabs > .tab.active::before { background: var(--surface-2); }

/* ---------- Diálogos: el fondo se oscurece con suavidad ---------- */
dialog[open]::backdrop { animation: m-fade 220ms ease-out both; }
dialog[data-closing]::backdrop { animation: m-fade-out 150ms var(--m-in) both; }
dialog { transform-origin: 50% 60%; }
@keyframes m-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes m-fade-out { from { opacity: 1; } to { opacity: 0; } }

/* ---------- Acordeones: la flecha gira con la apertura ---------- */
details > summary .disclosure-chevron, .patient-group > summary::after { transition: rotate 260ms var(--m-out), transform 260ms var(--m-out); }
details > summary { -webkit-tap-highlight-color: transparent; }

/* ---------- Cambio de tema: revelado circular (View Transitions) ---------- */
::view-transition-old(root), ::view-transition-new(root) { animation: none; mix-blend-mode: normal; }
::view-transition-new(root) { z-index: 2; }

/* ---------- Carga: brillo que recorre el esqueleto ---------- */
.ui-skeleton-row span, .nuria-skeleton, .reply-suggestion-loading {
  background-image: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, .55) 45%, transparent 90%);
  background-size: 220% 100%; background-repeat: no-repeat; animation: m-shimmer 1.3s ease-in-out infinite;
}
@keyframes m-shimmer { from { background-position: 130% 0; } to { background-position: -90% 0; } }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) :is(.ui-skeleton-row span, .nuria-skeleton, .reply-suggestion-loading) { background-image: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, .08) 45%, transparent 90%); }
}
:root[data-theme="dark"] :is(.ui-skeleton-row span, .nuria-skeleton, .reply-suggestion-loading) { background-image: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, .08) 45%, transparent 90%); }

/* ---------- Foco visible que aparece con suavidad ---------- */
:focus-visible { transition: outline-offset 150ms ease-out; }

/* ---------- Estados que cambian de texto ---------- */
.hc-status, .pf-status, .setup-status { transition: background-color 220ms ease-out, color 220ms ease-out; }

/* ---------- Tacto en móvil: sin destello gris al tocar ---------- */
@media (pointer: coarse) {
  :is(button, a, summary, .hc-row, .patient-item, .today-stat) { -webkit-tap-highlight-color: transparent; }
}

html.ui-page-hidden .ui-skeleton-row span, html.ui-page-hidden .nuria-skeleton { animation-play-state: paused; }

@media (prefers-reduced-motion: reduce) {
  :is(.button, .nav-item, .tab, .summary-filter, .assistant-action, .assistant-send, .assistant-voice, .assistant-launcher, .pf-option,
      .identity-theme-option, .identity-item, .theme-toggle, .hc-swatch, .chip, .hc-row, .patient-item, .today-stat, .guide-step,
      .agenda-row, .today-row, .appointment-card, .task-row) { scale: none !important; translate: none !important; }
  dialog[open]::backdrop, dialog[data-closing]::backdrop, .ui-skeleton-row span, .nuria-skeleton, .reply-suggestion-loading { animation: none; }
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}

/* El «pill» viaja por debajo del texto de todas las opciones: la capa la crea el grupo, no cada botón. */
:is(.sidebar-nav, .platform-filters, .attention-summary, .tabs, .practice-tabs, .section-links, .pf-segmented, .identity-theme) { position: relative; isolation: isolate; }
:is(.sidebar-nav, .platform-filters, .attention-summary, .tabs, .practice-tabs, .section-links) > :is(button, a),
.pf-segmented .pf-option, .identity-theme .identity-theme-option { isolation: auto !important; z-index: auto !important; }
