/**
 * Neomorphism (soft UI) — карточки, панели, кнопки, чипы.
 * Токены: design-tokens.css (--neu-*).
 * Подключается после ui-patterns.css; переопределяет объёмные поверхности проекта.
 */

/* ===== Базовая поверхность страницы (после style.css) ===== */
html body {
  background: var(--neu-bg);
  color: var(--neu-text-on-surface, var(--text-primary, #212121));
}

main,
.business-container,
.dashboard,
.messages-container,
.notifications-container {
  background-color: transparent;
}

/* ===== Универсальная выпуклая карточка ===== */
.neu-card,
.neu-surface {
  background-color: var(--neu-bg);
  border: none;
  border-radius: var(--neu-radius-card);
  box-shadow: var(--neu-shadow-raised);
  transition: var(--neu-transition);
  overflow: visible;
  color: var(--neu-text-on-surface, var(--text-primary, #212121));
}

.neu-card--panel {
  border-radius: var(--neu-radius-panel);
  padding: var(--space-6, 1.5rem);
}

.neu-card--compact {
  border-radius: var(--neu-radius-chip);
  padding: var(--space-4, 1rem);
}

@media (hover: hover) and (pointer: fine) {
  .neu-card:hover,
  .neu-surface:hover {
    box-shadow: var(--neu-shadow-raised-hover);
    transform: translateY(var(--neu-lift-y));
  }
}

.neu-card:active,
.neu-surface:active,
.neu-card--pressed {
  box-shadow: var(--neu-shadow-inset);
  transform: scale(0.98);
}

/* Вдавленная поверхность (поля, чипы внутри карточки) */
.neu-inset,
.neu-pressed {
  background-color: var(--neu-bg);
  border: none;
  border-radius: var(--neu-radius-chip);
  box-shadow: var(--neu-shadow-inset);
}

/* ===== Кнопка-таблетка (сценарий А — нажатие) ===== */
.neu-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  padding: 0.55rem 1.15rem;
  background-color: var(--neu-bg);
  border: none;
  border-radius: var(--neu-radius-btn);
  box-shadow: var(--neu-shadow-raised);
  color: var(--primary-color, #2a4b7c);
  font-weight: 600;
  cursor: pointer;
  transition: var(--neu-transition);
}

@media (hover: hover) and (pointer: fine) {
  .neu-btn:hover {
    box-shadow: var(--neu-shadow-pressed);
    transform: scale(0.98);
  }
}

.neu-btn:active {
  box-shadow: var(--neu-shadow-inset);
  transform: scale(0.96);
}

/* ===== Интеграция: ui-panel-card / business-panel ===== */
.ui-panel-card,
.business-panel-card,
.business-panel-card--kpi,
.business-chart-panel {
  background: var(--neu-bg) !important;
  border: none !important;
  border-radius: var(--neu-radius-panel) !important;
  box-shadow: var(--neu-shadow-raised) !important;
  transition: var(--neu-transition) !important;
  overflow: visible;
}

.ui-panel-card::before,
.business-panel-card::before {
  opacity: 0.35;
}

.ui-panel-card::after {
  opacity: 0.4;
}

@media (hover: hover) and (pointer: fine) {
  .ui-panel-card:hover,
  .business-panel-card:hover,
  .business-chart-panel:hover {
    border: none !important;
    box-shadow: var(--neu-shadow-raised-hover) !important;
    transform: translateY(var(--neu-lift-y));
  }

  .ui-panel-card:hover .ui-panel-card__icon {
    transform: scale(1.05) rotate(3deg);
  }
}

/* Чипы внутри панелей — inset (не глобально: не ломает business info-bar на mobile) */
.ui-panel-card .ui-chip,
.ui-panel-card__footer .ui-chip {
  background: var(--neu-bg) !important;
  border: none !important;
  box-shadow: var(--neu-shadow-inset) !important;
}

@media (hover: hover) and (pointer: fine) {
  .ui-panel-card:hover .ui-chip:not(:hover) {
    box-shadow: var(--neu-shadow-inset) !important;
  }
}

/* Бизнес-кабинет: плитки info-bar/footer (business.css @768) */
@media (max-width: 768px) {
  .business-page .business-panel-card__info-bar .ui-chip,
  .business-page .business-panel-card__footer .ui-chip {
    box-shadow: var(--neu-shadow-raised) !important;
  }
}

.ui-panel-card__footer {
  border-top-color: rgba(166, 171, 189, 0.35);
}

/* ===== Stat-cards (бизнес, избранное, мои вещи) ===== */
.stat-card,
.stat-card--steel,
.business-page .stat-card,
.my-items-stats .stat-card,
.favorites-stats .stat-card {
  background: var(--neu-bg) !important;
  border: none !important;
  border-radius: var(--neu-radius-card) !important;
  box-shadow: var(--neu-shadow-raised) !important;
  transition: var(--neu-transition) !important;
  overflow: visible;
}

.stat-card--steel::before,
.business-page .stat-card::before {
  opacity: 0.25;
}

@media (hover: hover) and (pointer: fine) {
  .stat-card:hover,
  .stat-card--steel:hover,
  .business-page .stat-card:hover,
  .my-items-stats .stat-card:hover,
  .favorites-stats .stat-card:hover {
    border: none !important;
    box-shadow: var(--neu-shadow-raised-hover) !important;
    transform: translateY(var(--neu-lift-y));
  }
}

/* ===== Секционные блоки ===== */
.stats-header,
.portfolio-section:not(.portfolio-section--panel),
.chart-container,
.owner-reviews-container .reviews-header,
.showcase-glass-panel,
.discounts-card,
.reviews-hub-summary__card,
.payment-status-card {
  background: var(--neu-bg) !important;
  border: none !important;
  box-shadow: var(--neu-shadow-raised) !important;
  border-radius: var(--neu-radius-panel) !important;
}

.portfolio-section--panel,
.business-rating-section.portfolio-section--panel {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* Карточки каталога и сеток */
.item-card,
.favorite-showcase-card,
.modal-content:not(.no-neu) {
  background: var(--neu-bg) !important;
  border: none !important;
  box-shadow: var(--neu-shadow-raised) !important;
  border-radius: var(--neu-radius-card) !important;
  transition: var(--neu-transition) !important;
}

.filters-section,
.filters-content.collapsed,
.collapsible-search__trigger,
.my-items-filters-sheet-trigger,
.catalog-view-controls__filter-toggle {
  background: var(--neu-bg);
  border: none;
  box-shadow: var(--neu-shadow-raised);
}

.collapsible-search__trigger:active,
.catalog-view-controls__filter-toggle:active {
  box-shadow: var(--neu-shadow-inset);
}

@media (hover: hover) and (pointer: fine) {
  .stats-header:hover,
  .chart-container:hover,
  .favorite-showcase-card:hover,
  .item-card:hover,
  .items-grid .item-card:hover {
    box-shadow: var(--neu-shadow-raised-hover) !important;
    transform: translateY(var(--neu-lift-y));
  }
}

/* Bootstrap card в main */
main .card:not(.no-neu):not(.card-header):not(.card-body) {
  background: var(--neu-bg);
  border: none;
  box-shadow: var(--neu-shadow-raised);
  border-radius: var(--neu-radius-card);
}

main .card:not(.no-neu) .card-header,
main .card:not(.no-neu) .card-body {
  background: transparent;
  border-color: rgba(166, 171, 189, 0.25);
}

/* Подсказка «?» в крошках */
.catalog-section-help__summary {
  background: var(--neu-bg);
  border: none;
  box-shadow: var(--neu-shadow-raised);
}

.catalog-section-help__summary:hover {
  box-shadow: var(--neu-shadow-pressed);
}

.catalog-section-help__body {
  box-shadow: var(--neu-shadow-raised);
}

/* Иконки панели — оставляем brand gradient, лёгкий neu halo */
.ui-panel-card__icon {
  box-shadow:
    var(--neu-shadow-raised),
    0 4px 14px rgba(42, 75, 124, 0.2);
}

/* Отступы в гридах — не обрезать тени */
.business-widgets-row > [class*="col-"],
.business-metrics-row > [class*="col-"],
#mainMetrics,
.main-metrics-grid,
.my-items-stats,
.favorites-stats {
  overflow: visible;
}

.business-panel-host,
#portfolioStats,
#financialStats,
#commercialStats {
  overflow: visible;
}

/* ===== prefers-reduced-motion ===== */
@media (prefers-reduced-motion: reduce) {
  .neu-card,
  .neu-surface,
  .neu-btn,
  .ui-panel-card,
  .business-panel-card,
  .stat-card,
  .my-items-stats .stat-card,
  .favorites-stats .stat-card,
  .stats-header,
  .chart-container,
  .item-card {
    transition: none;
  }

  .neu-card:hover,
  .neu-surface:hover,
  .ui-panel-card:hover,
  .business-panel-card:hover,
  .stat-card:hover,
  .my-items-stats .stat-card:hover,
  .favorites-stats .stat-card:hover,
  .item-card:hover {
    transform: none;
    box-shadow: var(--neu-shadow-raised-hover);
  }

  .neu-btn:hover {
    transform: none;
  }
}