/* Aurora — второй шаблон витрины (первый — перенос CakeWorld/Nebula,
   app/layouts/default.vue + public/shop_files/*). Свой шрифтовой набор не
   грузим — используем те же саморазмещённые Inter-файлы, что и у Nebula
   (public/shop_files/inter-*.woff2), просто со своим набором токенов и
   компонентной вёрсткой (app/components/aurora/*), без унаследованного
   ported-HTML CSS. */

@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/shop_files/inter-cyrillic.woff2') format('woff2');
  unicode-range: U+301, U+400-45F, U+490-491, U+4B0-4B1, U+2116;
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('/shop_files/inter-latin.woff2') format('woff2');
}

html.aurora-app {
  --a-bg: #08090c;
  --a-surface: #121420;
  --a-surface-2: #171a28;
  --a-line: rgba(255, 255, 255, 0.07);
  --a-line-2: rgba(255, 255, 255, 0.12);
  --a-text: #f4f5f8;
  --a-mute: rgba(244, 245, 248, 0.62);
  --a-mute-2: rgba(244, 245, 248, 0.4);
  --a-accent: var(--shop-accent, #2fe0ac);
  --a-accent-2: #8b6bf0;
  --a-accent-rgb: var(--shop-accent-rgb, 47, 224, 172);
  --a-btn-text: var(--shop-btn-text, #06120e);
  --a-radius-sm: 12px;
  --a-radius: 18px;
  --a-radius-lg: 26px;
  --a-pad: clamp(16px, 4vw, 32px);
  --a-shadow: 0 24px 60px -24px rgba(0, 0, 0, 0.65);
  /* Крупный geometric-display — только для hero-заголовка и «жирных» акцентов,
     не для сплошного текста (грузится отдельным <link> в layouts/default.vue). */
  --a-font-display: 'Unbounded', Inter, system-ui, sans-serif;
  color-scheme: dark;
}

html.aurora-app body {
  background:
    radial-gradient(1100px 620px at 12% -8%, rgba(var(--a-accent-rgb), 0.16), transparent 60%),
    radial-gradient(900px 560px at 92% 4%, rgba(139, 107, 240, 0.14), transparent 55%),
    var(--a-bg) !important;
  background-attachment: fixed, fixed, fixed;
  color: var(--a-text);
  font-family: Inter, system-ui, -apple-system, 'Segoe UI', sans-serif;
  -webkit-font-smoothing: antialiased;
}

html.aurora-app * {
  box-sizing: border-box;
}

html.aurora-app .a-wrap {
  max-width: 1180px;
  margin: 0 auto;
  padding-left: var(--a-pad);
  padding-right: var(--a-pad);
}

html.aurora-app .a-label {
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--a-mute);
}

/* Кнопки перенесены на систему antiddos.lol/zdonate: прямоугольник (не пилюля),
   Unbounded светлым начертанием, заливка снизу вверх по наведению вместо
   filter:brightness. Акцент витрины (--a-accent) у каждого магазина свой —
   это база кнопки не меняем; заливка на hover — фирменный второй акцент
   движка (--a-accent-2), он один и тот же на всех витринах Aurora. */
html.aurora-app .a-btn {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 46px;
  padding: 0 24px;
  border-radius: 14px;
  border: none;
  font-family: var(--a-font-display);
  font-weight: 300;
  font-size: 14.5px;
  letter-spacing: -0.01em;
  cursor: pointer;
  background: var(--a-accent);
  color: var(--a-btn-text);
  transition: transform 0.15s ease;
}
html.aurora-app .a-btn::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--a-accent-2);
  transform: scaleY(0);
  transform-origin: 50% 100%;
  transition: transform 0.42s cubic-bezier(0.16, 1, 0.3, 1);
}
html.aurora-app .a-btn:hover::before { transform: scaleY(1); }
html.aurora-app .a-btn:active { transform: scale(0.96); }
html.aurora-app .a-btn[disabled] { opacity: 0.5; cursor: not-allowed; }
html.aurora-app .a-btn[disabled]::before { transform: scaleY(0); }

html.aurora-app .a-btn-ghost {
  background: transparent;
  color: var(--a-text);
  box-shadow: inset 0 0 0 1px var(--a-line-2);
}
html.aurora-app .a-btn-ghost::before { background: var(--a-text); }
html.aurora-app .a-btn-ghost:hover { color: var(--a-bg); }

html.aurora-app .a-card {
  background: linear-gradient(160deg, var(--a-surface), var(--a-surface-2));
  border: 1px solid var(--a-line);
  border-radius: var(--a-radius);
}