/* ============================================================
   AiMusica — animații pentru ferestrele Cadou și Distribuie
   ------------------------------------------------------------
   Doar CSS: nu schimbă nimic în logica din account.js.
   - La deschidere: fundalul apare, fereastra urcă și se așază,
     apoi elementele din interior apar pe rând (titlu, previzualizare,
     file, câmpuri, butoane).
   - Pe telefon, Cadou urcă de jos ca o foaie de aplicație.
   - La închidere: fereastra coboară puțin și dispare (în browserele
     care știu să anime trecerea la display:none; în rest se închide
     instant, ca înainte).
   - Animațiile folosesc „backwards”: după ce se termină nu mai
     influențează nimic (hover, transformări proprii, dark mode).
   Cu „reducerea mișcării” pornită nu se aplică nimic din acest fișier.
   ============================================================ */

@media (prefers-reduced-motion: no-preference) {
  :root {
    --dm-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --dm-sheet-ease: cubic-bezier(0.32, 0.72, 0, 1);
  }

  /* ---------- Deschidere: fundal + fereastră ---------- */

  #gift-dialog:not(.hidden),
  #song-share-dialog:not(.hidden) {
    animation: dm-fade 240ms ease-out backwards;
  }

  #gift-dialog:not(.hidden) .gift-dialog-sheet,
  #song-share-dialog:not(.hidden) .song-share-sheet {
    animation: dm-sheet-in 460ms var(--dm-ease) backwards;
  }

  /* ---------- Cadou: elementele apar pe rând ---------- */

  #gift-dialog:not(.hidden) .gift-dialog-head {
    animation: dm-rise 420ms var(--dm-ease) 80ms backwards;
  }

  /* Previzualizarea apare și atunci când e afișată mai târziu (după încărcare). */
  #gift-dialog:not(.hidden) .gift-dialog-preview:not([hidden]) {
    animation: dm-pop 520ms var(--dm-ease) 130ms backwards;
  }

  #gift-dialog:not(.hidden) .gift-composer-tabs {
    animation: dm-rise 420ms var(--dm-ease) 190ms backwards;
  }

  /* Panoul activ (Text / Cu poze): fără întârziere, ca schimbarea filei să fie imediată. */
  #gift-dialog:not(.hidden) [role="tabpanel"]:not([hidden]) {
    animation: dm-rise 320ms var(--dm-ease) backwards;
  }

  #gift-dialog:not(.hidden) .gift-dialog-details {
    animation: dm-rise 420ms var(--dm-ease) 270ms backwards;
  }

  #gift-dialog:not(.hidden) #gift-extra-options {
    animation: dm-rise 420ms var(--dm-ease) 320ms backwards;
  }

  #gift-dialog:not(.hidden) .gift-dialog-actions {
    animation: dm-rise-bottom 460ms var(--dm-ease) 220ms backwards;
  }

  #gift-dialog:not(.hidden) .gift-dialog-share-actions > * {
    animation: dm-chip 380ms var(--dm-ease) backwards;
  }

  #gift-dialog:not(.hidden) .gift-dialog-share-actions > :nth-child(1) { animation-delay: 320ms; }
  #gift-dialog:not(.hidden) .gift-dialog-share-actions > :nth-child(2) { animation-delay: 350ms; }
  #gift-dialog:not(.hidden) .gift-dialog-share-actions > :nth-child(3) { animation-delay: 370ms; }
  #gift-dialog:not(.hidden) .gift-dialog-share-actions > :nth-child(4) { animation-delay: 410ms; }
  #gift-dialog:not(.hidden) .gift-dialog-share-actions > :nth-child(5) { animation-delay: 450ms; }
  #gift-dialog:not(.hidden) .gift-dialog-share-actions > :nth-child(n + 6) { animation-delay: 490ms; }

  /* ---------- Distribuie: elementele apar pe rând ---------- */

  #song-share-dialog:not(.hidden) .song-share-head {
    animation: dm-rise 400ms var(--dm-ease) 70ms backwards;
  }

  #song-share-dialog:not(.hidden) .song-share-track {
    animation: dm-rise 420ms var(--dm-ease) 120ms backwards;
  }

  /* Codul QR „se desenează”: crește ușor din centru. */
  #song-share-dialog:not(.hidden) .song-share-qr {
    animation: dm-qr 560ms var(--dm-ease) 180ms backwards;
  }

  #song-share-dialog:not(.hidden) .song-share-qr-note {
    animation: dm-fade 360ms ease-out 300ms backwards;
  }

  #song-share-dialog:not(.hidden) .song-share-social-block > :not(.song-share-social-actions) {
    animation: dm-fade 360ms ease-out 260ms backwards;
  }

  #song-share-dialog:not(.hidden) .song-share-social-button {
    animation: dm-chip 420ms var(--dm-ease) backwards;
  }

  #song-share-dialog:not(.hidden) .song-share-social-button:nth-child(1) { animation-delay: 290ms; }
  #song-share-dialog:not(.hidden) .song-share-social-button:nth-child(2) { animation-delay: 330ms; }
  #song-share-dialog:not(.hidden) .song-share-social-button:nth-child(3) { animation-delay: 370ms; }
  #song-share-dialog:not(.hidden) .song-share-social-button:nth-child(4) { animation-delay: 410ms; }
  #song-share-dialog:not(.hidden) .song-share-social-button:nth-child(n + 5) { animation-delay: 450ms; }

  #song-share-dialog:not(.hidden) .song-share-copy-card {
    animation: dm-rise 420ms var(--dm-ease) 400ms backwards;
  }

  #song-share-dialog:not(.hidden) .song-share-player-button {
    animation: dm-rise 420ms var(--dm-ease) 450ms backwards;
  }

  /* ---------- Închidere ---------- */
  /* Fereastra rămâne vizibilă cât durează ieșirea, apoi primește display:none. */

  #gift-dialog,
  #song-share-dialog {
    transition:
      opacity 200ms ease,
      display 200ms allow-discrete;
  }

  #gift-dialog.hidden,
  #song-share-dialog.hidden {
    opacity: 0;
    pointer-events: none;
  }

  #gift-dialog.hidden .gift-dialog-sheet,
  #song-share-dialog.hidden .song-share-sheet {
    transform: translateY(10px) scale(0.985);
    transition: transform 200ms ease-in;
  }

  /* ---------- Telefon ---------- */

  /* Cadou e o foaie care ocupă ecranul: urcă de jos și coboară la închidere. */
  @media (max-width: 600px) {
    #gift-dialog:not(.hidden) .gift-dialog-sheet {
      animation: dm-sheet-up 480ms var(--dm-sheet-ease) backwards;
    }

    #gift-dialog {
      transition:
        opacity 260ms ease,
        display 260ms allow-discrete;
    }

    #gift-dialog.hidden .gift-dialog-sheet {
      transform: translateY(42%);
      transition: transform 260ms cubic-bezier(0.4, 0, 1, 1);
    }
  }

  /* Distribuie rămâne card centrat pe telefon, dar urcă puțin mai mult. */
  @media (max-width: 860px) {
    #song-share-dialog:not(.hidden) .song-share-sheet {
      animation-name: dm-sheet-in-tall;
    }
  }

  @keyframes dm-fade {
    from {
      opacity: 0;
    }
  }

  /* Fereastra devine opacă repede (la 35%), apoi doar se mai așază, ca pagina din spate să nu se vadă prin ea. */
  @keyframes dm-sheet-in {
    0% {
      opacity: 0;
      transform: translateY(18px) scale(0.97);
    }

    35% {
      opacity: 1;
    }

    100% {
      opacity: 1;
      transform: none;
    }
  }

  @keyframes dm-sheet-in-tall {
    0% {
      opacity: 0;
      transform: translateY(34px) scale(0.98);
    }

    35% {
      opacity: 1;
    }

    100% {
      opacity: 1;
      transform: none;
    }
  }

  @keyframes dm-sheet-up {
    from {
      transform: translateY(100%);
    }
  }

  @keyframes dm-rise {
    from {
      opacity: 0;
      transform: translateY(10px);
    }
  }

  @keyframes dm-rise-bottom {
    from {
      opacity: 0;
      transform: translateY(18px);
    }
  }

  @keyframes dm-pop {
    from {
      opacity: 0;
      transform: scale(0.95);
    }
  }

  @keyframes dm-chip {
    from {
      opacity: 0;
      transform: translateY(8px) scale(0.86);
    }
  }

  @keyframes dm-qr {
    from {
      opacity: 0;
      transform: scale(0.88);
    }
  }
}