/* RÖRELSE OCH MODALER PÅ DATORN — datorrundan AT-74 (Patrik 10-14: "kika om alla modaler öppnas lika mjukt"; "hur ärenden laddas").
   Mätt: anteckningar/historik/tilldela/Fråga kollega = atlasOverlayIn 0,16 s + modalIn 0,16 s med studs (cubic-bezier …1.2);
   kundanteckningarna (#customer-notes-overlay, customer-notes.js) INGEN intoning, mörkare bakgrund 0,6 mot 0,28, grön 2px-ram.
   Modalrutans ram varierade 1px/2px grå/2px grön. Ärendebyte i listvy: innehållet byttes rakt av (atlasViewEnter bara när rutan var dold).
   Nu: alla modaler samma mjuka intoning (0,2 s, ingen studs), samma dimning, samma tunna ram och mjuka skugga;
   ärendebyte tonar in nya rutan (detail-swap-fade.js sätter .atlas-detail-swap). Stängningsanimationen (.modal-closing) lämnas orörd. */
@keyframes atlasModalSoftIn {
  from { opacity: 0; transform: translateY(8px) scale(0.985); }
  to { opacity: 1; transform: none; }
}
@keyframes atlasFadeOnlyIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes atlasFadeOnlyOut { from { opacity: 1; } to { opacity: 0; } }
@keyframes atlasDetailSwapIn {
  from { opacity: 0.35; transform: translateY(3px); }
  to { opacity: 1; transform: none; }
}
@media (min-width: 769px) {
  html body :is(.custom-modal-overlay, #customer-notes-overlay):not(.modal-closing) {
    animation: atlasOverlayIn 200ms ease-out both !important;
  }
  html body #customer-notes-overlay {
    background: rgba(0, 0, 0, 0.28) !important;
  }
  html body :is(.custom-modal-overlay, #customer-notes-overlay):not(.modal-closing) .glass-modal-box {
    animation: atlasModalSoftIn 220ms cubic-bezier(0.2, 0.8, 0.2, 1) both !important;
  }
  html body :is(.custom-modal-overlay, #customer-notes-overlay) .glass-modal-box {
    border: 1px solid color-mix(in srgb, var(--border-color) 55%, transparent) !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08), 0 20px 50px -14px rgba(0, 0, 0, 0.38) !important;
  }
  /* Kundanteckningarna saknar .custom-modal-overlay ⇒ egen uttoning (atlasCloseModal sätter .modal-closing). */
  html body #customer-notes-overlay.modal-closing {
    animation: atlasOverlayOut 130ms ease-in both !important;
    pointer-events: none !important;
  }
  html body #customer-notes-overlay.modal-closing .glass-modal-box {
    animation: atlasModalBoxOut 130ms ease-in both !important;
  }
  /* Global sök (global-search.js): egen overlay utan .custom-modal-overlay — samma in-/uttoning och dimning. */
  html body #atlas-global-search-overlay:not(.modal-closing) {
    animation: atlasOverlayIn 200ms ease-out both !important;
    background: rgba(0, 0, 0, 0.28) !important;
  }
  html body #atlas-global-search-overlay:not(.modal-closing) > div:first-of-type {
    /* Bara opacitet: rutan centreras med egen transform (translateX(-50%)) som en transform-animation skulle skriva över. */
    animation: atlasFadeOnlyIn 200ms ease-out both !important;
  }
  html body #atlas-global-search-overlay.modal-closing {
    animation: atlasOverlayOut 130ms ease-in both !important;
    pointer-events: none !important;
  }
  html body #atlas-global-search-overlay.modal-closing > div:first-of-type {
    animation: atlasFadeOnlyOut 130ms ease-in both !important;
  }
  html body .atlas-detail-swap {
    animation: atlasDetailSwapIn 180ms ease-out both;
  }
}
@media (prefers-reduced-motion: reduce) {
  html body :is(.custom-modal-overlay, #customer-notes-overlay) .glass-modal-box,
  html body :is(.custom-modal-overlay, #customer-notes-overlay),
  html body #atlas-global-search-overlay, html body #atlas-global-search-overlay > div:first-of-type,
  html body .atlas-detail-swap { animation: none !important; }
}
