/* Keçid animasiyaları: düymə, pəncərə, siyahı ↔ texnika məlumatı, sifariş siyahısı. Hər biri istifadəçinin hərəkətinə cavabdır.
   "Hərəkəti azalt" ayarı açıq olanda heç biri işləmir. Pəncərənin bağlanma animasiyası yeni brauzerlərdə işləyir (@starting-style),
   köhnələrdə pəncərə sadəcə animasiyasız açılıb-bağlanır. */
@media (prefers-reduced-motion: no-preference) {
  /* ---------- Pəncərələr: yumşaq açılır və bağlanır ---------- */
  .mi, .qr {
    opacity: 0; transform: translateY(18px) scale(.985);
    transition: opacity .22s ease, transform .32s cubic-bezier(.2, .8, .2, 1), overlay .32s allow-discrete, display .32s allow-discrete;
  }
  .mi[open], .qr[open] { opacity: 1; transform: none; }
  @starting-style { .mi[open], .qr[open] { opacity: 0; transform: translateY(18px) scale(.985); } }
  .mi::backdrop, .qr::backdrop { opacity: 0; transition: opacity .25s ease, overlay .32s allow-discrete, display .32s allow-discrete; }
  .mi[open]::backdrop, .qr[open]::backdrop { opacity: 1; }
  @starting-style { .mi[open]::backdrop, .qr[open]::backdrop { opacity: 0; } }

  /* ---------- Pəncərənin içində görünüş dəyişəndə ---------- */
  /* siyahıdan texnikaya: məlumat sağdan sürüşüb gəlir */
  .mi-pick-detail:not([hidden]) { animation: sm-in-right .34s cubic-bezier(.2, .8, .2, 1); }
  /* "Geri": siyahı soldan qayıdır (machine-info.js .mi-anim qoyur) */
  .mi-pick-main.mi-anim:not([hidden]) { animation: sm-in-left .3s cubic-bezier(.2, .8, .2, 1); }
  /* texnika pəncərəsində "İcarəyə götür" → forma */
  .mi-view:not([hidden]) { animation: sm-in-up .3s cubic-bezier(.2, .8, .2, 1); }
  /* sifariş göndəriləndən sonra təsdiq yazısı */
  .qr-done:not([hidden]), .qr-wa:not([hidden]) { animation: sm-in-pop .4s cubic-bezier(.2, .9, .3, 1.2); }

  /* ---------- Sifarişə əlavə ---------- */
  /* siyahıda ✓ işarəsi böyüyərək çıxır */
  .mi-pick-it { transition: background-color .2s, box-shadow .25s; }
  .mi-pick-it.is-in::after { animation: sm-pop .38s cubic-bezier(.2, .9, .3, 1.4); }
  /* "Sifarişə əlavə et" ↔ "Sifarişdən çıxar" */
  .mi-pd-add { transition: background-color .25s, border-color .25s, transform .15s; }
  .mi-pd-add:active, .cx-btn:active, .sm-btn:active, .qr-send:active, .qr-bar-go:active, .mi-rent:active { transform: scale(.97); }
  .mi-pd-add.is-in { animation: sm-pop-soft .4s cubic-bezier(.2, .9, .3, 1.3); }
  /* formanın üstündəki "Seçilən texnikalar": yeni sətir aşağı sürüşüb sarı işıqla gəlir, say dəyişəndə rəqəm atılır */
  .qr-items-list li.qr-in { animation: sm-row-in .45s cubic-bezier(.2, .8, .2, 1); }
  .qr-items-list output.qr-bump { animation: sm-bump .3s ease-out; }

  /* ---------- Kartdakı "İcarəyə götür" → "✓ Sifarişi tamamla" ---------- */
  [data-rent] { transition: background-color .3s ease, color .3s ease, border-color .3s ease, transform .15s; }
  [data-rent].is-picked { animation: sm-pop-soft .45s cubic-bezier(.2, .9, .3, 1.3); }
  [data-rent] .rent-ck { display: inline-block; animation: sm-check .45s cubic-bezier(.2, .9, .3, 1.5); }

  /* telefonda pəncərə aşağıdan qalxır */
  @media (max-width: 760px) {
    .mi, .qr { transform: translateY(48px); }
    .mi[open], .qr[open] { transform: none; }
    @starting-style { .mi[open], .qr[open] { transform: translateY(48px); } }
  }
}

@keyframes sm-in-right { from { opacity: 0; transform: translateX(28px); } to { opacity: 1; transform: none; } }
@keyframes sm-in-left { from { opacity: 0; transform: translateX(-22px); } to { opacity: 1; transform: none; } }
@keyframes sm-in-up { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes sm-in-pop { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: none; } }
@keyframes sm-pop { 0% { transform: scale(0); } 70% { transform: scale(1.2); } 100% { transform: scale(1); } }
@keyframes sm-pop-soft { 0% { transform: scale(.94); } 55% { transform: scale(1.04); } 100% { transform: scale(1); } }
@keyframes sm-check { 0% { opacity: 0; transform: scale(0) rotate(-30deg); } 60% { opacity: 1; transform: scale(1.35) rotate(0); } 100% { transform: scale(1); } }
@keyframes sm-row-in { 0% { opacity: 0; transform: translateY(-10px); background: #FFF5D4; } 60% { opacity: 1; transform: none; background: #FFF5D4; } 100% { background: #FFFFFF; } }
@keyframes sm-bump { 0% { transform: scale(1); } 40% { transform: scale(1.35); color: #B98500; } 100% { transform: scale(1); } }

/* uçan şəkil (quick-rent.js smFly): kartdan aşağı zolağa */
.sm-fly { position: fixed; z-index: 60; margin: 0; border-radius: 12px; object-fit: cover; pointer-events: none; box-shadow: 0 12px 30px rgb(0 0 0 / .25); background: #ECEDE8; }
