/* ============================================================
   Книга Памʼяті (стартова)
   Файл: memoryglobal.css
   Версія: 1.0
   ============================================================ */

/* ================================
   БАЗА — коли активний .contrast-mode
   ================================ */
body.memory.contrast-mode {
  background: #ffffff !important;
  color: #000000 !important;
  text-shadow: none !important;
}

/* Відключаємо фоновий прапор */
body.memory.contrast-mode .flag-bg {
  display: none !important;
}

/* Заголовки */
body.memory.contrast-mode h1,
body.memory.contrast-mode .title,
body.memory.contrast-mode .sup {
  color: #000 !important;
  text-shadow: none !important;
}

/* ================================
   Картки "Захисники / Волонтери"
   ================================ */

body.memory.contrast-mode .hero-buttons a {
  background: #ffffff !important;
  border: 3px solid #000 !important;
  color: #000 !important;
  box-shadow: none !important;
}

body.memory.contrast-mode .hero-buttons a span {
  color: #000 !important;
}

body.memory.contrast-mode .hero-buttons a:hover {
  background: #eaeaea !important;
}

/* Логотипи """
   робимо ч/б і чіткі */
body.memory.contrast-mode .hero-emblem {
  filter: grayscale(100%) contrast(1.25) !important;

  box-shadow: none !important;
}

/* ================================
   Обгортка / блоки
   ================================ */

body.memory.contrast-mode .wrap {
  background: #fff !important;
  border: 2px solid #000 !important;
  box-shadow: none !important;
}

body.memory.contrast-mode .hero-buttons-container {
  background: #fff !important;

  box-shadow: none !important;
}

/* ================================
   Кнопки футера
   ================================ */

body.memory.contrast-mode .about,
body.memory.contrast-mode .back {
  background: #000 !important;
  color: #fff !important;
  border: 2px solid #000 !important;
  box-shadow: none !important;
}

body.memory.contrast-mode .about:hover,
body.memory.contrast-mode .back:hover {
  background: #222 !important;
  text-decoration: underline !important;
}

/* Small screens */
@media (max-width: 600px) {
  body.memory.contrast-mode .hero-buttons a {
    border-width: 2px !important;
  }
}
/* ============================================================
   ♿ КОНТРАСТНИЙ РЕЖИМ — ANGELS PAGE
   Сторінка: memory/angels.html
   Версія стилів: 1.0
   ============================================================ */

/* Основний контейнер */
body.memory.angels-page.contrast-mode {
  background: #ffffff !important;
  color: #000 !important;
  text-shadow: none !important;
}

/* Вимикаємо фонову картинку та затемнення */
body.memory.angels-page.contrast-mode .flag-bg,
body.memory.angels-page.contrast-mode .flag-bg::after {
  display: none !important;
}

/* Заголовки */
body.memory.angels-page.contrast-mode .title,
body.memory.angels-page.contrast-mode .subtitle {
  color: #000 !important;
  text-shadow: none !important;
}

/* Контейнер контенту */
body.memory.angels-page.contrast-mode main.content {
  background: #fff !important;

  box-shadow: none !important;
  color: #000 !important;
}

/* Відео блок */
body.memory.angels-page.contrast-mode .video-wrapper {
  background: #fff !important;
  border: 2px solid #000 !important;
  box-shadow: none !important;
}

body.memory.angels-page.contrast-mode .video-wrapper video {
  filter: grayscale(100%) contrast(1.2) !important;
  border-radius: 0 !important;
}

/* Інформаційна панель */
body.memory.angels-page.contrast-mode .side-info {
  background: #fff !important;
  color: #000 !important;
  border: 2px solid #000 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

body.memory.angels-page.contrast-mode .side-info h3 {
  color: #000 !important;
}

body.memory.angels-page.contrast-mode .side-info a {
  color: #000 !important;
  text-decoration: underline !important;
}

body.memory.angels-page.contrast-mode .side-info a:hover {
  color: #333 !important;
}

/* Фото / відео межі */
body.memory.angels-page.contrast-mode video,
body.memory.angels-page.contrast-mode img {
  border: 2px solid #000 !important;
}

/* Футер */
body.memory.angels-page.contrast-mode .footer {
  background: #fff !important;
  border-top: 2px solid #000 !important;
  color: #000 !important;
  box-shadow: none !important;
}

/* Кнопка повернення */
body.memory.angels-page.contrast-mode .back-link {
  background: #000 !important;
  color: #fff !important;
  border: 2px solid #000 !important;
  box-shadow: none !important;
}

body.memory.angels-page.contrast-mode .back-link:hover {
  background: #222 !important;
}
/* ============================================================
   ♿ КОНТРАСТНИЙ РЕЖИМ — DEFENDERS PAGE
   Сторінка: memory/defenders.html
   Версія стилів: 1.0
   ============================================================ */

/* База */
body.memory.defenders-page.contrast-mode {
  background: #ffffff !important;
  color: #000 !important;
  text-shadow: none !important;
}

/* Вимикаємо фоновий прапор */
body.memory.defenders-page.contrast-mode .flag-bg,
body.memory.defenders-page.contrast-mode .flag-bg::after {
  display: none !important;
}

/* Заголовки */
body.memory.defenders-page.contrast-mode .title,
body.memory.defenders-page.contrast-mode .sup {
  color: #000 !important;
  text-shadow: none !important;
}

/* Основний контейнер */
body.memory.defenders-page.contrast-mode main.content {
  background: #fff !important;
  border: 2px solid #000 !important;
  box-shadow: none !important;
  color: #000 !important;
}

/* Контейнер зі скролом */
body.memory.defenders-page.contrast-mode .heroes-scroll-container {
  scrollbar-color: #000 transparent !important;
}

/* Сітка */
body.memory.defenders-page.contrast-mode .heroes-grid {
  background: #fff !important;
}

/* Картки */
body.memory.defenders-page.contrast-mode .hero-card {
  background: #fff !important;
  border: 2px solid #000 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

/* Внутрішня рамка картки */
body.memory.defenders-page.contrast-mode .hero-card::before {
  border: 1px solid #000 !important;
  opacity: 1 !important;
}

/* Фото */
body.memory.defenders-page.contrast-mode .hero-card__photo-wrapper {
  background: #fff !important;
  border: 2px solid #000 !important;
}

body.memory.defenders-page.contrast-mode .hero-card__photo {
  filter: grayscale(100%) contrast(1.2) !important;
}

/* Тексти картки */
body.memory.defenders-page.contrast-mode .hero-card__name,
body.memory.defenders-page.contrast-mode .hero-card__fullname,
body.memory.defenders-page.contrast-mode .hero-card__dates {
  color: #000 !important;
  text-shadow: none !important;
}

/* Кнопка всередині картки */
body.memory.defenders-page.contrast-mode .hero-card__btn {
  background: #000 !important;
  color: #fff !important;
  border: 2px solid #000 !important;
  box-shadow: none !important;
}

body.memory.defenders-page.contrast-mode .hero-card__btn:hover {
  background: #333 !important;
  box-shadow: none !important;
}

/* Футер */
body.memory.defenders-page.contrast-mode .fixed-footer {
  background: #fff !important;
  border-top: 2px solid #000 !important;
  backdrop-filter: none !important;
}

/* Кнопки футера */
body.memory.defenders-page.contrast-mode .footer-btn {
  background: #000 !important;
  color: #fff !important;
  border: 2px solid #000 !important;
  box-shadow: none !important;
}

body.memory.defenders-page.contrast-mode .footer-btn:hover {
  background: #333 !important;
  box-shadow: none !important;
}

/* Пошук у футері */
body.memory.defenders-page.contrast-mode #heroSearchInput {
  background: #fff !important;
  color: #000 !important;
  border: 2px solid #000 !important;
}

body.memory.defenders-page.contrast-mode .search-suggestions {
  background: #fff !important;
  border: 1px solid #000 !important;
}

body.memory.defenders-page.contrast-mode .search-suggestions div {
  color: #000 !important;
}

body.memory.defenders-page.contrast-mode .search-suggestions div:hover {
  background: #e5e5e5 !important;
}

/* Модалка пошуку */
body.memory.defenders-page.contrast-mode .search-modal__dialog {
  background: #fff !important;
  border: 2px solid #000 !important;
  color: #000 !important;
}

body.memory.defenders-page.contrast-mode .search-modal__title {
  color: #000 !important;
}

body.memory.defenders-page.contrast-mode .search-modal__input {
  background: #fff !important;
  color: #000 !important;
  border: 2px solid #000 !important;
}

body.memory.defenders-page.contrast-mode .search-modal__suggestions {
  background: #fff !important;
  border: 2px solid #000 !important;
}

body.memory.defenders-page.contrast-mode .search-modal__suggestions div {
  color: #000 !important;
}

body.memory.defenders-page.contrast-mode .search-modal__close {
  color: #000 !important;
}
/* ============================================================
   🟦 HERO PAGE — КОНТРАСТНИЙ РЕЖИМ
   (hero.html — short, extended, gallery, footer)
   ============================================================ */

/* 🔳 Загальний фон */
body.memory.contrast-mode.hero-page {
  background: #ffffff !important;
  color: #000 !important;
  text-shadow: none !important;
}

/* ❌ Прибираємо темний фон і градієнти */
body.memory.contrast-mode .hero-short-layout,
body.memory.contrast-mode .hero-extended-layout,
body.memory.contrast-mode .hero-photos {
  background: #ffffff !important;
  border: 2px solid #000 !important;
  box-shadow: none !important;
}

body.memory.contrast-mode .hero-short-layout::before,
body.memory.contrast-mode .hero-extended-layout::before,
body.memory.contrast-mode .hero-photos::before {
  display: none !important;
}

/* 🔱 Вимикаємо тризуб у фоні */
body.memory.contrast-mode .hero-short-layout::after,
body.memory.contrast-mode .hero-extended-layout::after {
  display: none !important;
}

/* 🖼 Фото */
body.memory.contrast-mode .hero-short__photo-wrapper,
body.memory.contrast-mode .hero-extended__photo-wrapper,
body.memory.contrast-mode .hero-photos__frame {
  border: 2px solid #000 !important;
  box-shadow: none !important;
  background: #fff !important;
}

/* 🖼 Фото (саме зображення) */
body.memory.contrast-mode img {
  filter: grayscale(100%) contrast(1.2) !important;
}

/* 🟨 Замість золота — чорний текст */
body.memory.contrast-mode .hero-short__name,
body.memory.contrast-mode .hero-extended__name {
  background: none !important;
  -webkit-background-clip: unset !important;
  -webkit-text-fill-color: #000 !important;
  color: #000 !important;
  text-shadow: none !important;
}

/* 🕊 Дати */
body.memory.contrast-mode .hero-short__dates,
body.memory.contrast-mode .hero-extended__dates {
  color: #333 !important;
  text-shadow: none !important;
}

/* 📝 Рядки у short/extended */
body.memory.contrast-mode .hero-short__label {
  color: #000 !important;
  font-weight: 700 !important;
}
body.memory.contrast-mode .hero-short__value {
  color: #000 !important;
}

body.memory.contrast-mode .hero-extended__bio {
  color: #000 !important;
  text-shadow: none !important;
}

/* 📜 Скролбар */
body.memory.contrast-mode ::-webkit-scrollbar-thumb {
  background: #000 !important;
}
body.memory.contrast-mode ::-webkit-scrollbar-track {
  background: #dfdfdf !important;
}

/* 📸 Галерея – навігація */
body.memory.contrast-mode .hero-photos__nav {
  background: #000 !important;
  color: #fff !important;
  border: 1px solid #000 !important;
}

/* 📸 Галерея — лічильник */
body.memory.contrast-mode .hero-photos__counter {
  background: #000 !important;
  color: #fff !important;
}

/* 📸 Мініатюри */
body.memory.contrast-mode .hero-thumb {
  border: 2px solid #000 !important;
  opacity: 1 !important;
  box-shadow: none !important;
}
body.memory.contrast-mode .hero-thumb--active {
  background: #000 !important;
  border-color: #000 !important;
}

/* 🔍 Повноекранне фото */
body.memory.contrast-mode .hero-lightbox__backdrop {
  background: rgba(0, 0, 0, 0.9) !important;
}
body.memory.contrast-mode .hero-lightbox__close {
  background: #000 !important;
  color: #fff !important;
}

/* 🦶 Футер */
body.memory.contrast-mode .hero-footer {
  background: #fff !important;
  border-top: 2px solid #000 !important;
}

body.memory.contrast-mode .hero-tab,
body.memory.contrast-mode .hero-back-btn {
  background: #fff !important;
  border: 2px solid #000 !important;
  color: #000 !important;
  box-shadow: none !important;
}

body.memory.contrast-mode .hero-tab--active {
  background: #000 !important;
  color: #fff !important;
}
/* ============================================================
   ♿ Контраст — емодзі на сторінках Книги Пам'яті
   Застосовується до стартової, angels, defenders, hero
   ============================================================ */

/* Загальний фільтр для емодзі у заголовках та тексті */
body.memory.contrast-mode h1,
body.memory.contrast-mode h2,
body.memory.contrast-mode h3,
body.memory.contrast-mode h4,
body.memory.contrast-mode p,
body.memory.contrast-mode span,
body.memory.contrast-mode .title,
body.memory.contrast-mode .sup {
  /* Емодзі тьмяніють (але текст не змінюється, бо не підпадає під фільтр) */
  filter: grayscale(100%) brightness(0.35);
  transition: filter 0.3s ease;
}

/* Трохи темніше при наведенні на активні блоки */
body.memory.contrast-mode h1:hover,
body.memory.contrast-mode h2:hover,
body.memory.contrast-mode p:hover {
  filter: grayscale(100%) brightness(0.18);
}