/* modern_skin_v2_lamp_retro_patch_v2.css
   FIX: в Modern Skin v2 фон рисуется через body::before (а не через body background).
   Поэтому этот патч переопределяет body::before/body::after и поверхности, чтобы "ламповость" была видна.

   Подключать ПОСЛЕ modern_skin_v2.css и ВСЕХ остальных патчей (самым последним).
*/

:root{
  --__modern_skin_v2_lamp_retro_patch_v2__: "2026-01-22";

  /* Dark (ретро-кассета) */
  --retro-bg-dark-0: #070606;
  --retro-bg-dark-1: #0f0b09;
  --retro-surface-dark: rgba(22, 16, 14, .78);
  --retro-surface-dark-2: rgba(18, 13, 11, .74);
  --retro-border-dark: rgba(255, 212, 170, .12);
  --retro-text-dark: rgba(255, 242, 228, .92);
  --retro-text-dark-dim: rgba(255, 242, 228, .72);

  /* "мягкий неон" */
  --retro-neon-pink: rgba(255, 90, 200, .25);
  --retro-neon-cyan: rgba(60, 220, 220, .20);
  --retro-neon-amber: rgba(255, 175, 70, .20);

  /* Light (ламповая бумага) */
  --retro-bg-light-0: #f6efe4;
  --retro-bg-light-1: #efe6d8;
  --retro-surface-light: rgba(255, 252, 247, .88);
  --retro-surface-light-2: rgba(255, 252, 247, .80);
  --retro-border-light: rgba(80, 55, 30, .14);
  --retro-text-light: rgba(25, 16, 10, .90);
  --retro-text-light-dim: rgba(25, 16, 10, .68);

  /* Accent */
  --retro-accent: #ffb24a;
}

/* ===== Фон именно через ::before (как в modern_skin_v2) ===== */
html[data-theme="dark"] body::before,
.v-application.v-theme--dark ~ body::before,
.v-application.v-theme--dark body::before{
  background:
    radial-gradient(900px 520px at 18% 16%, var(--retro-neon-pink), transparent 60%),
    radial-gradient(820px 520px at 82% 18%, var(--retro-neon-cyan), transparent 60%),
    radial-gradient(900px 560px at 52% 92%, var(--retro-neon-amber), transparent 64%),
    linear-gradient(180deg, var(--retro-bg-dark-1), var(--retro-bg-dark-0)) !important;

  animation: modernDrift 34s ease-in-out infinite alternate !important;
  opacity: 1 !important;
}

html[data-theme="light"] body::before,
.v-application.v-theme--light body::before{
  background:
    radial-gradient(900px 520px at 18% 16%, rgba(255, 140, 210, .12), transparent 62%),
    radial-gradient(820px 520px at 82% 18%, rgba(70, 210, 210, .10), transparent 62%),
    radial-gradient(900px 560px at 52% 92%, rgba(255, 185, 90, .12), transparent 66%),
    linear-gradient(180deg, var(--retro-bg-light-0), var(--retro-bg-light-1)) !important;

  animation: modernDrift 34s ease-in-out infinite alternate !important;
  opacity: 1 !important;
}

/* Текстура-плёнка через ::after (тоже как в v2) */
html[data-theme="dark"] body::after,
html[data-theme="light"] body::after{
  background:
    repeating-linear-gradient(0deg,
      rgba(255,255,255,.028),
      rgba(255,255,255,.028) 1px,
      transparent 1px,
      transparent 4px) !important;
  opacity: .30 !important;
  mix-blend-mode: overlay !important;
}

/* Включаем соответствующую color-scheme */
html[data-theme="dark"] body{ color-scheme: dark !important; }
html[data-theme="light"] body{ color-scheme: light !important; }

/* ===== Поверхности: применяем и по data-theme, и по Vuetify классу (чтобы не было "смешения") ===== */

/* Dark surfaces */
html[data-theme="dark"] .v-app-bar,
.v-application.v-theme--dark .v-app-bar{
  background: var(--retro-surface-dark-2) !important;
  border-bottom: 1px solid var(--retro-border-dark) !important;
}
html[data-theme="dark"] .v-navigation-drawer,
.v-application.v-theme--dark .v-navigation-drawer{
  background: var(--retro-surface-dark-2) !important;
  border-right: 1px solid var(--retro-border-dark) !important;
}

html[data-theme="dark"] .v-card,
html[data-theme="dark"] .v-sheet,
html[data-theme="dark"] .v-list,
html[data-theme="dark"] .v-menu__content,
html[data-theme="dark"] .v-overlay__content,
html[data-theme="dark"] .v-dialog .v-card,
.v-application.v-theme--dark .v-card,
.v-application.v-theme--dark .v-sheet,
.v-application.v-theme--dark .v-list,
.v-application.v-theme--dark .v-menu__content,
.v-application.v-theme--dark .v-overlay__content,
.v-application.v-theme--dark .v-dialog .v-card{
  background: var(--retro-surface-dark) !important;
  border: 1px solid var(--retro-border-dark) !important;
  color: var(--retro-text-dark) !important;
}

/* Light surfaces */
html[data-theme="light"] .v-app-bar,
.v-application.v-theme--light .v-app-bar{
  background: var(--retro-surface-light-2) !important;
  border-bottom: 1px solid var(--retro-border-light) !important;
}
html[data-theme="light"] .v-navigation-drawer,
.v-application.v-theme--light .v-navigation-drawer{
  background: var(--retro-surface-light-2) !important;
  border-right: 1px solid var(--retro-border-light) !important;
}

html[data-theme="light"] .v-card,
html[data-theme="light"] .v-sheet,
html[data-theme="light"] .v-list,
html[data-theme="light"] .v-menu__content,
html[data-theme="light"] .v-overlay__content,
html[data-theme="light"] .v-dialog .v-card,
.v-application.v-theme--light .v-card,
.v-application.v-theme--light .v-sheet,
.v-application.v-theme--light .v-list,
.v-application.v-theme--light .v-menu__content,
.v-application.v-theme--light .v-overlay__content,
.v-application.v-theme--light .v-dialog .v-card{
  background: var(--retro-surface-light) !important;
  border: 1px solid var(--retro-border-light) !important;
  color: var(--retro-text-light) !important;
}

/* Текст/подзаголовки */
html[data-theme="dark"] .v-card-subtitle,
html[data-theme="dark"] .v-list-item-subtitle,
.v-application.v-theme--dark .v-card-subtitle,
.v-application.v-theme--dark .v-list-item-subtitle{
  color: var(--retro-text-dark-dim) !important;
}
html[data-theme="light"] .v-card-subtitle,
html[data-theme="light"] .v-list-item-subtitle,
.v-application.v-theme--light .v-card-subtitle,
.v-application.v-theme--light .v-list-item-subtitle{
  color: var(--retro-text-light-dim) !important;
}

/* Акцент/ссылки */
.v-application a{
  color: var(--retro-accent) !important;
  text-underline-offset: 2px;
}

/* Скрим */
html[data-theme="dark"] .v-overlay__scrim{ background: rgba(0,0,0,.58) !important; }
html[data-theme="light"] .v-overlay__scrim{ background: rgba(0,0,0,.28) !important; }

/* IMPORTANT: не трогаем .v-btn, чтобы соцкнопки оставались бренд-цвета */