/* ==========================================================================
 * СДЕРЖАННЫЕ ЭФФЕКТЫ: окна и секции — motion.js, интерактивные состояния — здесь.
 * Никакого постоянного движения. На телефоне hover-эффекты отключены.
 * ========================================================================== */
:root { --motion-ease: cubic-bezier(.2,.75,.25,1); }
dialog[open]::backdrop { animation: backdrop-in .24s ease-out both; }
dialog[data-motion-closing]::backdrop { animation: backdrop-out .16s ease-in both; }
@keyframes backdrop-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes backdrop-out { from { opacity: 1; } to { opacity: 0; } }
.btn,.shop-primary,.shop-icon,.shop-back,.icon-link,.budget-chip,.page-arrow,.page-number,.theme-chips button,.slot-chips button,.shop-text-button,.product-preview {
  transition: background-color .22s,border-color .22s,color .22s,box-shadow .22s,transform .22s var(--motion-ease);
}
.request-field input,.request-field textarea,.shop-label input,.shop-label textarea {
  transition: border-color .2s,background-color .2s,box-shadow .2s;
}
.request-field input:focus,.request-field textarea:focus,.shop-label input:focus,.shop-label textarea:focus {
  box-shadow: 0 0 0 3px rgba(115,115,115,.1);
}
.extra-option,.channel-options label,.segmented-control label,.reminder-check {
  transition: background-color .22s,border-color .22s,box-shadow .22s;
}
.extra-option:has(input:checked) { background: #e6e6e6; border-radius: 8px; }
.theme-chips button[aria-pressed="true"],.slot-chips button[aria-pressed="true"] { box-shadow: 0 2px 8px #46464612; }
.faq-list summary,.shop-accordions summary,.checkout-step>summary { transition: color .2s,background-color .2s; }
.checkout-step { transition: background-color .22s,border-color .22s; }
.faq-list summary::after,.shop-accordions summary::after,.checkout-step>summary::after { transition: transform .24s var(--motion-ease); }
.faq-list details[open]>summary::after,.shop-accordions details[open]>summary::after,.checkout-step[open]>summary::after { transform: rotate(180deg); }

/* АККОРДЕОНЫ: нативное открытие/закрытие с анимацией высоты и прозрачности.
 * В старых браузерах остаётся обычный рабочий details без скрытого содержимого. */
@supports (interpolate-size: allow-keywords) {
  [data-accordion] { interpolate-size: allow-keywords; }
  [data-accordion]>details::details-content {
    block-size: 0;
    opacity: 0;
    overflow: clip;
    transition: block-size .32s var(--motion-ease),opacity .24s,content-visibility .32s allow-discrete;
  }
  [data-accordion]>details[open]::details-content { block-size: auto; opacity: 1; }
}
@media(hover:hover) and (pointer:fine) {
  .product-card { transition: border-color .25s,box-shadow .25s,transform .25s var(--motion-ease); }
  .product-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px #00000022; }
  .product-media>img { transition: transform .5s var(--motion-ease); }
  .product-card:hover .product-media>img { transform: scale(1.035); }
  .shop-primary:hover,.product-preview:hover { transform: translateY(-2px); box-shadow: 0 5px 15px #00000022; }
  .icon-link:hover,.shop-icon:hover { transform: translateY(-2px); }
}
.btn:active,.shop-primary:active,.shop-icon:active,.page-arrow:active,.product-preview:active { transform: scale(.98); }

/* ОТПРАВКА: индикатор появляется только при реальном ожидании ответа сервера. */
form[aria-busy="true"] button[type="submit"]::after {
  content: ''; width: 13px; height: 13px; flex: none; border: 2px solid currentColor;
  border-right-color: transparent; border-radius: 50%; animation: form-wait .8s linear infinite;
}
@keyframes form-wait { to { transform: rotate(360deg); } }

/* ДОСТУПНОСТЬ: мгновенные переходы при системной настройке уменьшения движения. */
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  *,*::before,*::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
