/* Theme tokens and the light/dark switch. dark.css (generated) recolors the legacy stylesheets. */
:root {
    --bg: #ffffff;
    --surface: #ffffff;
    --surface-2: #f4f4f5;
    --surface-3: #e9e9ec;
    --ink: #111317;
    --muted: #6b6f78;
    --line: rgba(0, 0, 0, 0.1);
    --chip: #f1f1f4;
    --accent: #c95757;
    --accent-strong: #b44747;
    --accent-soft: rgba(201, 87, 87, 0.12);
    --accent-ink: #ffffff;
    --warn-bg: #fff6e8;
    --warn-line: #fba50c;
    --warn-ink: #5a4a2a;
    --shadow: 0 10px 24px -12px rgba(0, 0, 0, 0.25);
    --shadow-hover: 0 18px 34px -14px rgba(0, 0, 0, 0.32);
    color-scheme: light;
}

html[data-theme="dark"] {
    --bg: #0e1013;
    --surface: #171a20;
    --surface-2: #1d2128;
    --surface-3: #262b34;
    --ink: #eceef1;
    --muted: #9aa0aa;
    --line: rgba(255, 255, 255, 0.09);
    --chip: #232832;
    --accent: #e06868;
    --accent-strong: #c95757;
    --accent-soft: rgba(224, 104, 104, 0.14);
    --accent-ink: #ffffff;
    --warn-bg: rgba(251, 165, 12, 0.1);
    --warn-line: #d98f0b;
    --warn-ink: #f2d9a8;
    --shadow: 0 12px 28px -14px rgba(0, 0, 0, 0.7);
    --shadow-hover: 0 20px 40px -16px rgba(0, 0, 0, 0.85);
    color-scheme: dark;
}

html,
body {
    background-color: var(--bg);
}

html[data-theme="dark"] body,
html[data-theme="dark"] .site-container {
    background-color: var(--bg);
    color: var(--ink);
}

/* ---------- theme toggle ---------- */
.amc-theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    flex: none;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.25);
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.amc-theme-toggle:hover {
    background: rgba(255, 255, 255, 0.18);
}

.amc-theme-toggle:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

.amc-theme-toggle svg {
    width: 20px;
    height: 20px;
}

.amc-theme-toggle .icon-sun {
    display: none;
}

html[data-theme="dark"] .amc-theme-toggle .icon-sun {
    display: block;
}

html[data-theme="dark"] .amc-theme-toggle .icon-moon {
    display: none;
}

.header-a-rside {
    gap: 14px;
}

.amc-theme-toggle--menu {
    margin-top: 18px;
    border-color: var(--line);
    background: var(--surface-2);
    color: var(--ink);
    width: auto;
    border-radius: 50px;
    padding: 0 16px;
    gap: 8px;
    font-family: var(--font-family);
    font-size: 15px;
}

/* ---------- global dark fixes the generator can't infer ---------- */
html[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
    background-color: var(--surface-2);
    color: var(--ink);
    border-color: var(--line);
}

html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder {
    color: var(--muted);
}

html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4 {
    color: var(--ink);
}

html[data-theme="dark"] .modal-car__close svg path,
html[data-theme="dark"] .header-a-menu-close svg path {
    fill: var(--ink);
    stroke: var(--ink);
}

html[data-theme="dark"] .header-a-menu {
    background-color: var(--surface);
    color: var(--ink);
}

html[data-theme="dark"] .header-a-menu .link,
html[data-theme="dark"] .header-a-menu .phone,
html[data-theme="dark"] .header-a-menu .text,
html[data-theme="dark"] .header-a-menu-top span {
    color: var(--ink);
}

html[data-theme="dark"] .header-a-menu svg path[stroke="black"] {
    stroke: var(--muted);
}

html[data-theme="dark"] .footer img[src*="logo.svg"] {
    filter: invert(1) hue-rotate(180deg);
}

html[data-theme="dark"] .swiper-pagination-bullet {
    background: var(--muted);
}

/* ---------- smooth switch ---------- */
html.amc-theme-anim,
html.amc-theme-anim * {
    transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease !important;
}

.footer__policy {
    color: var(--ink);
}
