/* 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; }
.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; }