/* Progressive enhancement: native open/close semantics remain authoritative. */
:root {
  --motion-enter: 220ms;
  --motion-exit: 140ms;
  --motion-ease: cubic-bezier(.16, 1, .3, 1);
}

:is(.appointment-modal, .message-discard-dialog, .calendar-popover, .date-picker) {
  opacity: 0;
  transform: translateY(4px) scale(.98);
  transition: opacity var(--motion-exit) ease-out, transform var(--motion-exit) ease-out,
    display var(--motion-exit) allow-discrete, overlay var(--motion-exit) allow-discrete;
}
:is(.calendar-popover, .date-picker) { transform-origin: top left; }
:is(.appointment-modal, .message-discard-dialog, .calendar-popover)[open], .date-picker:popover-open {
  opacity: 1;
  transform: none;
  transition-duration: var(--motion-enter);
}
:is(.appointment-modal, .message-discard-dialog)::backdrop {
  opacity: 0;
  transition: opacity var(--motion-exit) ease-out,
    display var(--motion-exit) allow-discrete, overlay var(--motion-exit) allow-discrete;
}
:is(.appointment-modal, .message-discard-dialog)[open]::backdrop { opacity: 1; }
@starting-style {
  :is(.appointment-modal, .message-discard-dialog, .calendar-popover)[open], .date-picker:popover-open {
    opacity: 0;
    transform: translateY(4px) scale(.98);
  }
  :is(.appointment-modal, .message-discard-dialog)[open]::backdrop { opacity: 0; }
}

/* Browsers without intrinsic-size interpolation keep ordinary details behavior. */
@supports (interpolate-size: allow-keywords) and (transition-behavior: allow-discrete) {
  :is(.clinical-review-section, .clinical-review-subgroup, .laboratory-study-disclosure, .results-study)::details-content {
    interpolate-size: allow-keywords;
    block-size: 0;
    overflow: clip;
    opacity: 0;
    transition: block-size var(--motion-enter) var(--motion-ease),
      opacity var(--motion-exit) ease-out, content-visibility var(--motion-enter) allow-discrete;
  }
  :is(.clinical-review-section, .clinical-review-subgroup, .laboratory-study-disclosure, .results-study)[open]::details-content {
    block-size: auto;
    opacity: 1;
  }
}

:is(.patient-save-dot, .clinical-review-save-indicator) {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
}
.patient-save-state.saving .patient-save-dot,
.clinical-review-save-status[data-state="saving"] .clinical-review-save-indicator {
  background: transparent;
  border: 2px solid var(--periwinkle);
  border-right-color: transparent;
  animation: kaya-saving 800ms linear infinite;
}
.patient-save-state.saved .patient-save-dot,
.clinical-review-save-status[data-state="saved"] .clinical-review-save-indicator {
  border: 0;
  border-radius: 0;
  background: var(--success);
  clip-path: polygon(0 48%, 15% 34%, 39% 59%, 85% 10%, 100% 24%, 39% 90%);
  animation: kaya-confirmed 180ms var(--motion-ease);
}
/* This flash is emitted only after server-side document admission succeeds. */
.flash.upload_received::before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-inline-end: .5rem;
  background: var(--success);
  clip-path: polygon(0 48%, 15% 34%, 39% 59%, 85% 10%, 100% 24%, 39% 90%);
  animation: kaya-confirmed 180ms var(--motion-ease);
}
@keyframes kaya-saving { to { transform: rotate(360deg); } }
@keyframes kaya-confirmed {
  from { opacity: 0; clip-path: polygon(0 48%, 0 34%, 0 59%, 0 10%, 0 24%, 0 90%); }
  to { opacity: 1; clip-path: polygon(0 48%, 15% 34%, 39% 59%, 85% 10%, 100% 24%, 39% 90%); }
}
@media (prefers-reduced-motion: reduce) {
  :is(.appointment-modal, .message-discard-dialog, .calendar-popover, .date-picker) {
    transform: none;
    transition-property: opacity, display, overlay;
    transition-duration: 80ms;
  }
  @starting-style {
    :is(.appointment-modal, .message-discard-dialog, .calendar-popover)[open], .date-picker:popover-open { transform: none; }
  }
  :is(.clinical-review-section, .clinical-review-subgroup, .laboratory-study-disclosure, .results-study)::details-content,
  :is(.clinical-review-section, .clinical-review-subgroup, .laboratory-study-disclosure, .results-study) > summary::after { transition: none; }
  .patient-save-state.saving .patient-save-dot,
  .clinical-review-save-status[data-state="saving"] .clinical-review-save-indicator,
  .patient-save-state.saved .patient-save-dot,
  .clinical-review-save-status[data-state="saved"] .clinical-review-save-indicator,
  .flash.upload_received::before { animation: none; }
}