/**
 * Тема и основные цвета — легко менять для кастомизации всего сайта
 */
@font-face {
  font-family: 'Inter';
  src: url('/fonts/Inter-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('/fonts/Inter-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('/fonts/Inter-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('/fonts/Inter-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-sans: 'Inter', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  /* Основные цвета */
  --color-primary: #1e3c72;
  --color-primary-light: #2a5298;
  --color-primary-dark: #152a50;
  --color-accent: #f8b500;
  --color-accent-hover: #e6a400;
  --color-secondary: #26d0ce;
  --color-secondary-alt: #3498db;

  /* Фоны */
  --color-background: #f4f4f4;
  --color-surface: #ffffff;
  --color-surface-alt: #f8f9fa;

  /* Текст */
  --color-text: #333333;
  --color-text-muted: #555555;
  --color-text-light: #95a5a6;

  /* Границы и тени */
  --color-border: #e0e0e0;
  --color-border-light: #eee;
  --table-border: #222222;   /* Чёрные границы для таблиц */
  --shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 4px 20px rgba(0, 0, 0, 0.15);

  /* Радиусы */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;

  /* Хедер / футер — один градиент на весь сайт */
  --header-from: #162b4d;
  --header-to: #1b7a8c;
  --header-bg: linear-gradient(135deg, var(--header-from) 0%, var(--header-to) 100%);
  --footer-bg: linear-gradient(180deg, var(--header-from) 0%, #12333c 100%);

  /* Отступы и размеры */
  --page-max-width: 1500px;
  --spacing-xs: 8px;
  --spacing-sm: 12px;
  --spacing-md: 20px;
  --spacing-lg: 24px;
  --spacing-xl: 32px;

  /* Таблицы (аукционы, торги, лоты) */
  --table-header-bg: var(--color-primary-light);
  --table-header-color: #fff;
  --table-row-hover: rgba(42, 82, 152, 0.08);
  --table-shadow: 0 4px 16px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08);
  /* Таблица с лотами — мягкий тон в стиле темы (голубовато-серый) */
  --table-lot-bg: #e6eef6;
  --table-lot-row-bg: #dce6f2;
  --table-lot-header-bg: rgba(42, 82, 152, 0.18);
  --table-lot-header-color: #1e3c72;
  --table-lot-row-hover: rgba(42, 82, 152, 0.1);
  --table-link-color: var(--color-primary-light);

  /* Лендинг (главная, о платформе): тот же navy→teal, что и хедер */
  --landing-bg: linear-gradient(160deg, #12243f 0%, #1b7a8c 48%, #134650 100%);
  --landing-surface: linear-gradient(180deg, #163d4c 0%, #122a38 100%);
  --landing-surface-solid: #163d4c;
  --landing-foreground: #ffffff;
  --landing-muted: rgba(255, 255, 255, 0.7);
  --landing-border: rgba(255, 255, 255, 0.08);
  --landing-spot: #3ec4d4;
  --landing-spot-secondary: #1b7a8c;

  /* Breakpoints (для справки в медиа-запросах) */
  /* mobile: 768px, tablet: 1024px */
}


html {
  background-color: var(--color-background);
  color-scheme: light;
}
html[data-theme="dark"] {
  color-scheme: dark;
}
:root[data-theme="dark"] {
  --color-primary: #22c55e;
  --landing-bg: linear-gradient(160deg, #020617 0%, #0f172a 50%, #020617 100%);
  --landing-surface: linear-gradient(180deg, #0b1120 0%, #020617 100%);
  --landing-surface-solid: #0b1120;
  --landing-spot: #4ade80;
  --landing-spot-secondary: #0ea5e9;
  --color-primary-light: #4ade80;
  --color-primary-dark: #15803d;
  /* Мягкий акцент для хедера и футера (не режет глаза) */
  --color-accent: #67e8f9;
  --color-accent-hover: #22d3ee;
  --color-secondary: #0ea5e9;
  --color-secondary-alt: #22c55e;

  --color-background: #020617;
  --color-surface: #020617;
  --color-surface-alt: #0b1120;

  --color-text: #e5e7eb;
  --color-text-muted: #9ca3af;
  --color-text-light: #6b7280;

  --color-border: #1f2937;
  --color-border-light: #111827;
  --table-border: #020617;

  --header-bg: linear-gradient(135deg, #0f172a 0%, #020617 100%);
  --footer-bg: linear-gradient(180deg, #0f172a 0%, #020617 100%);

  --table-header-bg: #111827;
  --table-header-color: #e5e7eb;
  --table-row-hover: rgba(55, 65, 81, 0.4);

  --table-lot-bg: #020617;
  --table-lot-row-bg: #020617;
  --table-lot-header-bg: rgba(31, 41, 55, 0.9);
  --table-lot-header-color: #e5e7eb;
  --table-lot-row-hover: rgba(55, 65, 81, 0.6);
  --table-link-color: #4ade80;
}

/* Поля ввода в тёмной теме: фон, текст, граница */
:root[data-theme="dark"] input,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select {
  background-color: var(--color-surface-alt);
  color: var(--color-text);
  border-color: var(--color-border);
}
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder {
  color: var(--color-text-muted);
}
:root[data-theme="dark"] input:hover,
:root[data-theme="dark"] textarea:hover,
:root[data-theme="dark"] select:hover {
  background-color: var(--color-surface-alt);
  color: var(--color-text);
  border-color: var(--color-border);
}
:root[data-theme="dark"] input:hover,
:root[data-theme="dark"] textarea:hover,
:root[data-theme="dark"] select:hover {
  background-color: var(--color-surface-alt);
  color: var(--color-text);
  border-color: var(--color-border);
}
:root[data-theme="dark"] input:focus,
:root[data-theme="dark"] textarea:focus,
:root[data-theme="dark"] select:focus {
  border-color: var(--color-primary-light);
  background-color: var(--color-surface-alt);
  color: var(--color-text);
}
/* Убираем белый фон автозаполнения и подсветку в тёмной теме */
:root[data-theme="dark"] input:-webkit-autofill,
:root[data-theme="dark"] input:-webkit-autofill:hover,
:root[data-theme="dark"] input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--color-text);
  -webkit-box-shadow: 0 0 0 1000px var(--color-surface-alt) inset;
  caret-color: var(--color-text);
}