/* Базові стилі тумблера (працює у світлій темі) */
.theme-toggle {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(0, 0, 0, 0.12);
  color: #E67E22;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
  transition: box-shadow 280ms ease, transform 280ms ease, background 280ms ease;
}

.theme-toggle__icon {
  position: absolute;
  transition: transform 280ms ease, opacity 280ms ease;
  transform-origin: center;
}

/* Іконка сонця (CSS) */
.theme-toggle__sun {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: currentColor;
}

.theme-toggle__sun::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  box-shadow:
    0 -8px 0 0 currentColor,
    0 8px 0 0 currentColor,
    -8px 0 0 0 currentColor,
    8px 0 0 0 currentColor,
    6px 6px 0 0 currentColor,
    -6px 6px 0 0 currentColor,
    6px -6px 0 0 currentColor,
    -6px -6px 0 0 currentColor;
  opacity: 0.9;
}

/* Іконка місяця (CSS) */
.theme-toggle__moon {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  box-shadow: -4px -2px 0 2px currentColor;
  background: transparent;
}

/* Стан light: 70/30 */
html:not([data-theme="dark"]) .theme-toggle__sun {
  transform: translate(-4px, -2px) scale(0.7);
  opacity: 1;
}

html:not([data-theme="dark"]) .theme-toggle__moon {
  transform: translate(6px, 4px) scale(0.3);
  opacity: 0.6;
}

.theme-toggle:hover {
  box-shadow: 0 0 0 3px rgba(230, 126, 34, 0.18), 0 8px 20px rgba(230, 126, 34, 0.22);
}

.theme-toggle:focus-visible {
  outline: 2px solid #E67E22;
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .theme-toggle,
  .theme-toggle__icon {
    transition: none;
  }
}

html[data-theme="dark"] {
  /* Змінні темної теми */
  --color-bg: #0b0b0f;
  --color-bg-light: #101018;
  --color-bg-dark: #07070b;
  --color-text: rgba(255, 255, 255, 0.92);
  --color-text-light: rgba(255, 255, 255, 0.82);
  --color-text-muted: rgba(255, 255, 255, 0.65);
  --color-border: rgba(255, 255, 255, 0.10);
  --shell-border: rgba(255, 255, 255, 0.12);
  --color-accent: #E67E22;
  --color-accent-hover: #FF8A2A;
}

html[data-theme="dark"] body {
  /* Базовий фон і текст */
  background: var(--color-bg);
  color: var(--color-text);
}

html[data-theme="dark"] .page-shell {
  /* Прибираємо білу "простиню" */
  background: rgba(10, 10, 14, 0.78) !important;
  border-color: var(--shell-border) !important;
  box-shadow: 0 18px 52px rgba(0, 0, 0, 0.60) !important;
}

html[data-theme="dark"] main,
html[data-theme="dark"] section {
  background: transparent;
}

html[data-theme="dark"] .section--alt {
  background: var(--color-bg-light) !important;
}

html[data-theme="dark"] .header {
  /* Темний premium glass у хедері */
  background: rgba(10, 10, 14, 0.72);
  border-bottom: 1px solid var(--color-border);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45);
}

html[data-theme="dark"] .header__social {
  color: #fff;
  background: transparent;
}

html[data-theme="dark"] .header__social:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .header__burger span {
  background-color: #fff;
}

html[data-theme="dark"] .hero-title {
  /* Посилюємо контраст заголовка в hero */
  color: #ffffff !important;
  text-shadow: 0 4px 18px rgba(0, 0, 0, 0.55);
}

html[data-theme="dark"] .hero-subtitle {
  /* Підзаголовок у hero */
  color: rgba(255, 255, 255, 0.85) !important;
}

html[data-theme="dark"] .btn-primary {
  /* Текст у primary-кнопках має бути білим */
  color: #fff !important;
}

html[data-theme="dark"] .btn-primary:hover {
  color: #fff !important;
}

html[data-theme="dark"] .hero__content {
  /* Прибираємо широку скляну смугу під текстом */
  background: transparent !important;
  border: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

html[data-theme="dark"] .hero-title-box {
  /* Скло лише для блоку з текстом */
  background: rgba(18, 18, 26, 0.55) !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3 {
  /* Заголовки з нормальним контрастом */
  color: var(--color-text) !important;
}

html[data-theme="dark"] p,
html[data-theme="dark"] li {
  /* Текст у списках і абзацах */
  color: var(--color-text-muted) !important;
}

html[data-theme="dark"] #contact .section-subtitle,
html[data-theme="dark"] #contact .form-label,
html[data-theme="dark"] #contact .contact-method__title {
  /* Текст у блоці консультації */
  color: #fff !important;
}

html[data-theme="dark"] #contact .form-input::placeholder,
html[data-theme="dark"] #contact textarea.form-input::placeholder {
  /* Плейсхолдери у формі */
  color: rgba(255, 255, 255, 0.85) !important;
}

html[data-theme="dark"] #clients {
  background: var(--color-bg-light) !important;
}

html[data-theme="dark"] #clients .clients-slot {
  /* Підкладка логотипів світліша на 20% */
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] #clients .clients-logo {
  filter: drop-shadow(0 12px 26px rgba(0, 0, 0, 0.60)) !important;
}

html[data-theme="dark"] #clients .clients-arrow {
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(10, 10, 14, 0.65);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.45);
}

html[data-theme="dark"] #clients .clients-arrow::before {
  border-right-color: #fff;
  border-bottom-color: #fff;
}

html[data-theme="dark"] #clients .clients-arrow:hover {
  background: rgba(10, 10, 14, 0.78);
}

html[data-theme="dark"] #clients .clients-dot {
  background: rgba(255, 255, 255, 0.18);
  border-color: rgba(255, 255, 255, 0.28);
}

html[data-theme="dark"] #clients .clients-dot:hover {
  background: rgba(255, 255, 255, 0.28);
}

html[data-theme="dark"] #clients .clients-dot.is-active {
  background: var(--color-accent);
  border-color: transparent;
}

html[data-theme="dark"] .ass-card {
  /* Картки асортименту без білого фону */
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
}

html[data-theme="dark"] .hero-card-title {
  /* Підписи під hero-картками */
  color: rgba(255, 255, 255, 0.92) !important;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.55);
}

html[data-theme="dark"] .modal--aroma .modal-content,
html[data-theme="dark"] .modal--cups .modal-content,
html[data-theme="dark"] .modal--choco .modal-content {
  /* Темна скляна картка модалки товару */
  background: rgba(12, 12, 18, 0.92) !important;
  color: rgba(255, 255, 255, 0.88) !important;
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
  box-shadow: 0 22px 70px rgba(0, 0, 0, 0.65) !important;
}

html[data-theme="dark"] .modal-overlay {
  /* Темніша підкладка модалки */
  background: rgba(0, 0, 0, 0.65) !important;
}

html[data-theme="dark"] .modal--aroma .modal-header,
html[data-theme="dark"] .modal--cups .modal-header,
html[data-theme="dark"] .modal--choco .modal-header {
  /* Хедер модалки без білих плашок */
  background: rgba(12, 12, 18, 0.92) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] .modal-title {
  /* Заголовок модалки */
  color: #fff !important;
}

html[data-theme="dark"] .modal-close {
  /* Кнопка закриття */
  background: rgba(255, 255, 255, 0.08) !important;
  color: rgba(255, 255, 255, 0.85) !important;
}

html[data-theme="dark"] .modal-close:hover {
  color: #fff !important;
}

html[data-theme="dark"] .modal-close svg {
  fill: currentColor !important;
  stroke: currentColor !important;
}

html[data-theme="dark"] .aroma-type-btn,
html[data-theme="dark"] .cups-volume-btn {
  /* Варіанти без білих кнопок */
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: rgba(255, 255, 255, 0.88) !important;
}

html[data-theme="dark"] .aroma-type-btn.is-active,
html[data-theme="dark"] .cups-volume-btn.is-active {
  /* Активний варіант */
  background: rgba(230, 126, 34, 0.18) !important;
  border-color: rgba(230, 126, 34, 0.70) !important;
  color: #fff !important;
}

html[data-theme="dark"] .price-label {
  /* Підписи цін */
  color: rgba(255, 255, 255, 0.72) !important;
}

html[data-theme="dark"] .price-value {
  /* Значення цін */
  color: #fff !important;
  font-weight: 700;
}

html[data-theme="dark"] .aroma-price .price-main,
html[data-theme="dark"] .aroma-price .price-note {
  /* Текст ціни в плашці (модалка) */
  color: #fff !important;
}

html[data-theme="dark"] .qty-options button,
html[data-theme="dark"] .qty-options .qty-item {
  /* Тємні чіпси кількості */
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: rgba(255, 255, 255, 0.88) !important;
}

html[data-theme="dark"] .qty-options .is-selected,
html[data-theme="dark"] .qty-options button.active {
  /* Активний чіп */
  background: rgba(230, 126, 34, 0.22) !important;
  border-color: rgba(230, 126, 34, 0.85) !important;
  color: #fff !important;
}

html[data-theme="dark"] .qty-btn {
  /* Кількість: базовий стиль у модалці */
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: rgba(255, 255, 255, 0.88) !important;
}

html[data-theme="dark"] .qty-btn.is-active {
  /* Кількість: активний вибір */
  background: rgba(230, 126, 34, 0.22) !important;
  border-color: rgba(230, 126, 34, 0.85) !important;
  color: #fff !important;
}

html[data-theme="dark"] .aroma-carousel-btn,
html[data-theme="dark"] .photo-lightbox__nav {
  /* Робимо кнопки перегортання сірими */
  background: rgba(255, 255, 255, 0.15) !important;
  color: rgba(255, 255, 255, 0.75) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
}

html[data-theme="dark"] .aroma-carousel-btn:hover:not(:disabled),
html[data-theme="dark"] .photo-lightbox__nav:hover {
  color: rgba(255, 255, 255, 0.9) !important;
  background: rgba(255, 255, 255, 0.22) !important;
}

html[data-theme="dark"] .modal--aroma input,
html[data-theme="dark"] .modal--aroma textarea,
html[data-theme="dark"] .modal--cups input,
html[data-theme="dark"] .modal--cups textarea,
html[data-theme="dark"] .modal--choco input,
html[data-theme="dark"] .modal--choco textarea {
  /* Інпути у модалках */
  background: rgba(0, 0, 0, 0.25) !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  color: rgba(255, 255, 255, 0.92) !important;
}

html[data-theme="dark"] .modal--aroma input::placeholder,
html[data-theme="dark"] .modal--aroma textarea::placeholder,
html[data-theme="dark"] .modal--cups input::placeholder,
html[data-theme="dark"] .modal--cups textarea::placeholder,
html[data-theme="dark"] .modal--choco input::placeholder,
html[data-theme="dark"] .modal--choco textarea::placeholder {
  color: rgba(255, 255, 255, 0.45) !important;
}

html[data-theme="dark"] .modal--aroma .btn-primary,
html[data-theme="dark"] .modal--cups .btn-primary,
html[data-theme="dark"] .modal--choco .btn-primary {
  /* Primary CTA */
  color: #fff !important;
}

html[data-theme="dark"] .modal--aroma .btn-secondary,
html[data-theme="dark"] .modal--cups .btn-secondary,
html[data-theme="dark"] .modal--choco .btn-secondary {
  /* Outline CTA */
  background: transparent !important;
  color: rgba(255, 255, 255, 0.92) !important;
  border: 1px solid rgba(230, 126, 34, 0.75) !important;
}

html[data-theme="dark"] .modal--aroma .btn-secondary:hover,
html[data-theme="dark"] .modal--cups .btn-secondary:hover,
html[data-theme="dark"] .modal--choco .btn-secondary:hover {
  background: rgba(230, 126, 34, 0.15) !important;
}

html[data-theme="dark"] .cart-block,
html[data-theme="dark"] .cart-list,
html[data-theme="dark"] .cart-title,
html[data-theme="dark"] .cart-empty {
  /* Блок "Обрані позиції" */
  color: rgba(255, 255, 255, 0.85) !important;
}

html[data-theme="dark"] .cart-empty {
  color: rgba(255, 255, 255, 0.60) !important;
}

html[data-theme="dark"] .form-cart {
  /* Блок товарів у формі: темний фон */
  background: rgba(12, 12, 18, 0.92) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: rgba(255, 255, 255, 0.88) !important;
}

html[data-theme="dark"] .form-cart__title,
html[data-theme="dark"] .form-cart__item {
  /* Текст у блоці форми */
  color: rgba(255, 255, 255, 0.90) !important;
}

html[data-theme="dark"] .order-cart-preview {
  /* Прев’ю кошика у формі */
  background: rgba(12, 12, 18, 0.92) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] .order-cart-head,
html[data-theme="dark"] .order-cart-preview__head {
  /* Шапка блоку кошика */
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] .order-cart-title,
html[data-theme="dark"] .order-cart-preview__title {
  /* Заголовок блоку кошика */
  color: rgba(255, 255, 255, 0.92) !important;
}

html[data-theme="dark"] .order-cart-item {
  /* Рядок позиції у кошику */
  border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
  color: rgba(255, 255, 255, 0.85) !important;
}

html[data-theme="dark"] .order-cart-preview__hint,
html[data-theme="dark"] .order-cart-preview__list {
  /* Підказки/список у кошику */
  color: rgba(255, 255, 255, 0.75) !important;
}

html[data-theme="dark"] .cart-item {
  /* Картка обраної позиції без білого фону */
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: rgba(255, 255, 255, 0.92) !important;
}

html[data-theme="dark"] .cart-item-text {
  /* Текст позиції читаємий */
  color: rgba(255, 255, 255, 0.88) !important;
}

html[data-theme="dark"] .cart-item-remove {
  /* Кнопка видалення без білої плашки */
  background: rgba(255, 255, 255, 0.10) !important;
  color: rgba(255, 255, 255, 0.85) !important;
}

html[data-theme="dark"] .cart-item-remove:hover {
  color: #fff !important;
}

html[data-theme="dark"] .modal--aroma .modal-footer,
html[data-theme="dark"] .modal--cups .modal-footer,
html[data-theme="dark"] .modal--choco .modal-footer {
  /* Нижній блок CTA без білого фону */
  background: rgba(12, 12, 18, 0.92) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] #modal-cart .modal-content {
  /* Контейнер корзини */
  background: rgba(12, 12, 18, 0.94) !important;
  color: rgba(255, 255, 255, 0.88) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 22px 70px rgba(0, 0, 0, 0.65) !important;
}

html[data-theme="dark"] #modal-cart .modal-header {
  /* Хедер корзини */
  background: rgba(12, 12, 18, 0.94) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] #modal-cart .modal-title {
  /* Заголовок корзини */
  color: #fff !important;
}

html[data-theme="dark"] #modal-cart .modal-close {
  /* Кнопка закриття корзини */
  background: rgba(255, 255, 255, 0.08) !important;
  color: rgba(255, 255, 255, 0.85) !important;
}

html[data-theme="dark"] #modal-cart .modal-close:hover {
  color: #fff !important;
}

html[data-theme="dark"] #modal-cart .cart-body {
  /* Тіло корзини */
  background: transparent !important;
}

html[data-theme="dark"] .cart-modal-item {
  /* Рядок товару */
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] .cart-modal-item-title {
  /* Назва товару */
  color: rgba(255, 255, 255, 0.92) !important;
}

html[data-theme="dark"] .cart-modal-item-qty {
  /* Кількість */
  color: rgba(255, 255, 255, 0.72) !important;
}

html[data-theme="dark"] .cart-modal-item-price {
  /* Ціна */
  color: #fff !important;
}

html[data-theme="dark"] .cart-modal-item-controls {
  /* Блок з ціною/кнопками в корзині */
  color: rgba(255, 255, 255, 0.9) !important;
}

html[data-theme="dark"] .cart-modal-item-controls * {
  color: rgba(255, 255, 255, 0.9) !important;
}

html[data-theme="dark"] .cart-modal-item-qty-control {
  /* Контрол кількості */
  background: rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .cart-modal-item-qty-btn {
  /* Кнопки +/- */
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: rgba(255, 255, 255, 0.9) !important;
}

html[data-theme="dark"] .cart-modal-item-qty-btn:hover {
  background: rgba(230, 126, 34, 0.35) !important;
  border-color: rgba(230, 126, 34, 0.75) !important;
  color: #fff !important;
}

html[data-theme="dark"] .cart-modal-item-qty-value {
  /* Значення кількості */
  color: rgba(255, 255, 255, 0.9) !important;
}

html[data-theme="dark"] .cart-modal-item-remove {
  /* Кнопка видалення */
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: rgba(255, 255, 255, 0.85) !important;
}

html[data-theme="dark"] .cart-modal-item-remove:hover {
  color: #fff !important;
  background: rgba(230, 126, 34, 0.35) !important;
  border-color: rgba(230, 126, 34, 0.75) !important;
}

html[data-theme="dark"] .cart-modal-empty {
  /* Порожня корзина */
  color: rgba(255, 255, 255, 0.65) !important;
}

html[data-theme="dark"] .cart-modal-total {
  /* Підсумок */
  background: rgba(255, 255, 255, 0.06) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] .cart-modal-total-label {
  color: rgba(255, 255, 255, 0.75) !important;
}

html[data-theme="dark"] .cart-modal-total-value {
  color: #fff !important;
}

html[data-theme="dark"] .cart-total-label {
  /* Загальна сума (label) */
  color: rgba(255, 255, 255, 0.85) !important;
}

html[data-theme="dark"] .cart-total-value {
  /* Загальна сума (value) */
  color: #fff !important;
}

html[data-theme="dark"] #modal-cart .cart-footer {
  /* Футер корзини */
  background: rgba(12, 12, 18, 0.94) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] #reviews .rev-count,
html[data-theme="dark"] .reviews-section .rev-count {
  /* Нумерація слайдера у відгуках */
  color: #fff !important;
}

@media (min-width: 1024px) {
  html[data-theme="dark"] .hero-section::after,
  html[data-theme="dark"] #hero::after {
    /* Менше глушимо фон на desktop */
    background: linear-gradient(
      to bottom,
      rgba(5, 5, 8, 0.45) 0%,
      rgba(5, 5, 8, 0.35) 45%,
      rgba(5, 5, 8, 0.55) 100%
    ) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  html[data-theme="dark"] .hero-section::before,
  html[data-theme="dark"] #hero::before {
    opacity: 1 !important;
    filter: none !important;
  }
}

@media (max-width: 1023px) {
  html[data-theme="dark"] .hero-section::before,
  html[data-theme="dark"] #hero::before {
    /* Темний градієнт поверх hero для читабельності (mobile/tablet) */
    background: linear-gradient(
      to bottom,
      rgba(5, 5, 8, 0.65) 0%,
      rgba(5, 5, 8, 0.55) 40%,
      rgba(5, 5, 8, 0.75) 100%
    ) !important;
  }
}

html[data-theme="dark"] .ass-card::before {
  /* Прибираємо молочний градієнт */
  background: radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.09), rgba(0, 0, 0, 0) 60%) !important;
}

html[data-theme="dark"] #audience .audience-icon {
  /* Іконки у блоці "Кому це потрібно" */
  color: #ffffff !important;
}

html[data-theme="dark"] #audience .audience-icon svg {
  fill: currentColor !important;
  stroke: currentColor !important;
}

html[data-theme="dark"] #audience svg path {
  fill: #ffffff !important;
  stroke: #ffffff !important;
}

html[data-theme="dark"] #audience .benefit-icon {
  /* Іконки в "Кому це потрібно" робимо білими */
  color: #ffffff !important;
}

html[data-theme="dark"] #audience .benefit-icon img {
  /* Перефарбовуємо PNG-іконки в білий */
  filter: brightness(0) invert(1) !important;
}

html[data-theme="dark"] #production .production-list-icon img {
  /* Перефарбовуємо іконки блоку "Власне виробництво" у білий */
  filter: brightness(0) invert(1) !important;
}

html[data-theme="dark"] .icon,
html[data-theme="dark"] .feature-icon {
  /* Білимо лише UI-іконки */
  color: #fff !important;
}

html[data-theme="dark"] .icon svg,
html[data-theme="dark"] .feature-icon svg {
  fill: currentColor !important;
  stroke: currentColor !important;
}

html[data-theme="dark"] footer {
  /* Забираємо білий sticky-футер */
  background: rgba(10, 10, 14, 0.92) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.10) !important;
  color: rgba(255, 255, 255, 0.70) !important;
  position: static !important;
}

html[data-theme="dark"] .nav-menu a,
html[data-theme="dark"] .nav-menu__link {
  /* Текст у боковому меню */
  color: rgba(255, 255, 255, 0.92) !important;
}

html[data-theme="dark"] .nav-menu a:hover,
html[data-theme="dark"] .nav-menu__link:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .nav-menu a.active,
html[data-theme="dark"] .nav-menu a.nav-link--active,
html[data-theme="dark"] .nav-menu__link.is-active {
  color: var(--color-accent) !important;
}

html[data-theme="dark"] .nav-menu svg {
  fill: currentColor;
  stroke: currentColor;
}

html[data-theme="dark"] .footer-legal {
  background: rgba(10, 10, 14, 0.92) !important;
  color: rgba(255, 255, 255, 0.78) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 -10px 24px rgba(0, 0, 0, 0.45);
}

html[data-theme="dark"] .footer-legal * {
  color: rgba(255, 255, 255, 0.78) !important;
}

html[data-theme="dark"] .theme-toggle {
  /* Тумблер у dark: темний glass */
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  background: rgba(10, 10, 14, 0.75);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #fff;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.45);
  transition: box-shadow 280ms ease, transform 280ms ease, background 280ms ease;
}

html[data-theme="dark"] .theme-toggle__icon {
  position: absolute;
  transition: transform 280ms ease, opacity 280ms ease;
  transform-origin: center;
}

html[data-theme="dark"] .theme-toggle__sun {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: currentColor;
}

html[data-theme="dark"] .theme-toggle__sun::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  box-shadow:
    0 -8px 0 0 currentColor,
    0 8px 0 0 currentColor,
    -8px 0 0 0 currentColor,
    8px 0 0 0 currentColor,
    6px 6px 0 0 currentColor,
    -6px 6px 0 0 currentColor,
    6px -6px 0 0 currentColor,
    -6px -6px 0 0 currentColor;
  opacity: 0.9;
}

html[data-theme="dark"] .theme-toggle__moon {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  box-shadow: -4px -2px 0 2px currentColor;
  background: transparent;
}

html[data-theme="dark"] .theme-toggle__moon {
  /* 70% для місяця */
  transform: translate(4px, -2px) scale(0.7);
  opacity: 1;
}

html[data-theme="dark"] .theme-toggle__sun {
  /* 30% для сонця */
  transform: translate(-6px, 4px) scale(0.3);
  opacity: 0.6;
}

html[data-theme="dark"] .theme-toggle:hover {
  box-shadow: 0 0 0 3px rgba(230, 126, 34, 0.18), 0 8px 20px rgba(230, 126, 34, 0.22);
}

html[data-theme="dark"] .theme-toggle:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  html[data-theme="dark"] .theme-toggle,
  html[data-theme="dark"] .theme-toggle__icon {
    transition: none;
  }
}

/* === Dark overrides: order1.php / order2.php === */
html[data-theme="dark"] .order-success-page {
  /* Темний фон сторінки підтвердження */
  background: transparent;
}

html[data-theme="dark"] .order-success-title {
  color: #ffffff !important;
}

html[data-theme="dark"] .order-success-text {
  color: rgba(255, 255, 255, 0.72) !important;
}

html[data-theme="dark"] .order-success-card,
html[data-theme="dark"] .order-telegram-block,
html[data-theme="dark"] .order-no-data {
  /* Темні glass-картки */
  background: rgba(12, 12, 18, 0.92) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.55) !important;
}

html[data-theme="dark"] .order-success-card-title {
  color: #ffffff !important;
}

html[data-theme="dark"] .order-data-row {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .order-data-row--comment {
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .order-data-label {
  color: rgba(255, 255, 255, 0.72) !important;
}

html[data-theme="dark"] .order-data-value {
  color: #ffffff !important;
}

html[data-theme="dark"] .order-item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .order-item-title {
  color: #ffffff !important;
}

html[data-theme="dark"] .order-item-details {
  color: rgba(255, 255, 255, 0.72) !important;
}

html[data-theme="dark"] .order-item-total {
  color: #3ddc84 !important;
}

html[data-theme="dark"] .order-total-row {
  border-top: 2px solid rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .order-total-label {
  color: rgba(255, 255, 255, 0.85) !important;
}

html[data-theme="dark"] .order-total-value {
  color: #3ddc84 !important;
}

html[data-theme="dark"] .order-success-btn-primary {
  background: var(--color-accent) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] .order-success-btn-primary:hover {
  background: var(--color-accent-hover) !important;
}

html[data-theme="dark"] .order-success-btn-secondary {
  background: rgba(12, 12, 18, 0.65) !important;
  color: rgba(255, 255, 255, 0.92) !important;
  border: 1px solid rgba(230, 126, 34, 0.75) !important;
}

html[data-theme="dark"] .order-success-btn-secondary:hover {
  background: rgba(230, 126, 34, 0.14) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] .order-success-btn-note {
  color: rgba(255, 255, 255, 0.7) !important;
}

html[data-theme="dark"] .order-time-notice {
  /* Тепла dark warning-плашка */
  background: rgba(38, 28, 12, 0.85) !important;
  border: 1px solid rgba(230, 126, 34, 0.55) !important;
}

html[data-theme="dark"] .order-time-notice-icon {
  color: #f2b46a !important;
}

html[data-theme="dark"] .order-time-notice-text {
  color: rgba(255, 255, 255, 0.82) !important;
}

/* === Dark overrides: feedback.php === */
html[data-theme="dark"] .feedback-page {
  background: transparent;
}

html[data-theme="dark"] .feedback-title {
  color: #ffffff !important;
}

html[data-theme="dark"] .feedback-subtitle {
  color: rgba(255, 255, 255, 0.72) !important;
}

html[data-theme="dark"] .feedback-block,
html[data-theme="dark"] .feedback-success {
  background: rgba(12, 12, 18, 0.92) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.55) !important;
}

html[data-theme="dark"] .feedback-question-title {
  color: #ffffff !important;
}

html[data-theme="dark"] .feedback-question-text {
  color: rgba(255, 255, 255, 0.72) !important;
}

html[data-theme="dark"] .rating-item span,
html[data-theme="dark"] .recommend-item span {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  color: rgba(255, 255, 255, 0.88) !important;
}

html[data-theme="dark"] .rating-item input:checked + span,
html[data-theme="dark"] .recommend-item input:checked + span {
  background: var(--color-accent) !important;
  border-color: var(--color-accent) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(230, 126, 34, 0.35) !important;
}

html[data-theme="dark"] .feedback-comment textarea,
html[data-theme="dark"] .feedback-general textarea {
  background: rgba(0, 0, 0, 0.35) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
}

html[data-theme="dark"] .feedback-comment textarea::placeholder,
html[data-theme="dark"] .feedback-general textarea::placeholder {
  color: rgba(255, 255, 255, 0.55) !important;
}

html[data-theme="dark"] .feedback-submit,
html[data-theme="dark"] .feedback-success-btn {
  background: var(--color-accent) !important;
  color: #ffffff !important;
}

html[data-theme="dark"] .feedback-submit:hover,
html[data-theme="dark"] .feedback-success-btn:hover {
  background: var(--color-accent-hover) !important;
}