/* ===== Diálogo base ===== */
.dlg { border: none; border-radius: var(--radius-xl); padding: var(--space-8) var(--space-6) var(--space-6); max-width: 440px; width: 92%; box-shadow: var(--shadow-elevated); }
.dlg::backdrop { background: rgba(42,32,24,.5); backdrop-filter: blur(2px); }
.dlg[open] { animation: dlg-in var(--transition-spring) both; }
@keyframes dlg-in { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }

/* ===== Modal de ficha de persona (compartido: calendario e historia) ===== */
.dlg-ficha { position: relative; max-width: 460px; }
.dlg-ficha .ficha-cerrar {
  position: absolute; top: var(--space-3); right: var(--space-3);
  width: 34px; height: 34px; border-radius: var(--radius-full);
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--color-bg); color: var(--color-text-secondary);
  border: 1px solid var(--color-border); cursor: pointer;
}
.dlg-ficha .ficha-cerrar:hover { background: var(--color-surface-2); color: var(--color-primary-dark); }
.fc-cabecera { display: flex; align-items: center; gap: var(--space-4); margin-bottom: var(--space-4); padding-right: var(--space-8); }
.fc-foto { width: 84px; height: 84px; border-radius: var(--radius-full); object-fit: cover; border: 3px solid var(--color-accent); box-shadow: var(--shadow-card); flex: 0 0 auto; }
.fc-cabecera h2 { margin: 0 0 var(--space-1); }
.fc-cabecera .badge { margin-top: var(--space-1); }
.fc-datos { margin: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.fc-row { display: grid; grid-template-columns: 96px 1fr; gap: var(--space-3); padding: var(--space-2) 0; border-top: 1px solid var(--color-border); }
.fc-row dt { color: var(--color-text-soft); font-size: var(--font-size-sm); font-weight: var(--font-weight-semibold); margin: 0; }
.fc-row dd { margin: 0; color: var(--color-text-primary); }

/* Nombres de familiares clicables dentro de la ficha */
.fc-link {
  background: none; border: none; padding: 0; font: inherit;
  color: var(--color-primary); font-weight: var(--font-weight-semibold);
  cursor: pointer; text-align: left;
}
.fc-link:hover { color: var(--color-primary-dark); text-decoration: underline; }
.fc-link:focus-visible { outline: none; box-shadow: var(--ring-focus); border-radius: var(--radius-sm); }