/* BUAN PHP-порт: дополнения к основному бандлу стилей.
   Здесь собраны: keyframes из styled-jsx (они инжектились в рантайме),
   анимации диалогов, тосты, состояние прозрачной шапки при скролле. */

/* ── Бегущие строки (marquee.tsx, styled-jsx) ── */
@keyframes marquee-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.marquee-track {
  animation: marquee-scroll 36s linear infinite;
}
@media (prefers-reduced-motion: reduce) {
  .marquee-track { animation: none; }
}

/* ── Лайтбокс каталога (catalog-lightbox.tsx, styled-jsx) ── */
@keyframes catalog-photo-in {
  from { opacity: 0; transform: scale(0.985); }
  to { opacity: 1; transform: scale(1); }
}
.catalog-photo { animation: catalog-photo-in 0.3s ease-out; }
@keyframes hint-chev-l {
  0%, 100% { transform: translateX(0); opacity: 0.55; }
  50% { transform: translateX(-4px); opacity: 1; }
}
@keyframes hint-chev-r {
  0%, 100% { transform: translateX(0); opacity: 0.55; }
  50% { transform: translateX(4px); opacity: 1; }
}
.hint-chev-left { animation: hint-chev-l 1.4s ease-in-out infinite; }
.hint-chev-right { animation: hint-chev-r 1.4s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) {
  .catalog-photo { animation: none; }
  .hint-chev-left, .hint-chev-right { animation: none; }
}

/* ── Диалоги (Radix-подобные, vanilla) ── */
@keyframes buan-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes buan-zoom-in {
  from { opacity: 0; transform: translate(-50%, -50%) scale(0.95); }
  to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}
.buan-overlay-in { animation: buan-fade-in 0.2s ease-out; }
.buan-dialog { animation: buan-zoom-in 0.2s ease-out; }
.buan-dialog-close {
  background: transparent; border: 0; cursor: pointer; color: inherit;
  width: 1.75rem; height: 1.75rem; display: grid; place-items: center;
}
.buan-dialog-close svg { width: 1rem; height: 1rem; pointer-events: none; }

/* Кнопки-вторички в диалогах: проявляем бордер полутоном (input #e5e5e5 почти невидим на фоне #fafaf9) */
.buan-dialog .border-input { border-color: rgb(28 25 23 / 0.22); }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border-width: 0;
}

/* ── Тосты ── */
.buan-toasts {
  position: fixed; bottom: 1rem; right: 1rem; z-index: 200;
  display: flex; flex-direction: column; gap: 0.5rem; max-width: 22rem;
}
.buan-toast {
  background: #1c1917; color: #fafaf9; border-radius: 0.5rem;
  padding: 0.75rem 1rem; font-size: 0.8125rem; line-height: 1.4;
  box-shadow: 0 10px 30px rgba(28, 25, 23, 0.35);
  animation: buan-fade-in 0.2s ease-out;
}
.buan-toast-destructive { background: #b91c1c; }
.buan-toast-out { opacity: 0; transition: opacity 0.5s ease; }

/* ── Прозрачная шапка на главной: состояние после скролла ── */
header[data-over-hero] nav a { color: rgb(255 255 255 / 0.85); }
header[data-over-hero] nav a:hover { color: #fff; }
header[data-over-hero] a[href^="tel:"],
header[data-over-hero] button[aria-label="Открыть меню"] { color: rgb(255 255 255 / 0.9); }
header[data-over-hero] .site-kicker { color: rgb(255 255 255 / 0.7); }
header[data-over-hero][data-scrolled] {
  border-bottom-width: 1px;
  background: rgb(250 250 249 / 0.95);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  color: var(--foreground, #1c1917);
}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  header[data-over-hero][data-scrolled] { background: rgb(250 250 249 / 0.85); }
}
header[data-over-hero][data-scrolled] nav a { color: var(--muted-foreground, #78716c); }
header[data-over-hero][data-scrolled] nav a:hover { color: var(--foreground, #1c1917); }
header[data-over-hero][data-scrolled] a[href^="tel:"],
header[data-over-hero][data-scrolled] button[aria-label="Открыть меню"] { color: var(--foreground, #1c1917); }
header[data-over-hero][data-scrolled] .site-kicker { color: var(--muted-foreground, #78716c); }

/* ── Нативные select в форме заявки ── */
select.buan-select option { color: #1c1917; background: #fff; }

/* ── Утилиты-компенсации для статических страниц ── */
img[data-nimg] { color: transparent; }

/* ── Плашка «заявка принята» (после отправки формы) ── */
.buan-lead-banner {
  position: fixed;
  left: 1rem; right: 1rem; bottom: 1rem;
  z-index: 95;
  background: #fafaf9;
  border: 1px solid #e7e5e4;
  border-radius: 0.5rem;
  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  padding: 1rem;
  animation: buan-fade-in 0.2s ease-out;
}
.buan-lead-banner.buan-toast-out { opacity: 0; transition: opacity 0.5s ease; }
@media (min-width: 640px) {
  .buan-lead-banner { left: auto; max-width: 24rem; }
}
