/* ============================================================
   Светлая тема сайта
   Базовые цвета задаются переменными в inline-<style> каждой страницы.
   Здесь переопределяются переменные для светлой темы и элементы,
   у которых цвета захардкожены (не через var()).
   ============================================================ */

:root{color-scheme:dark}
[data-theme="dark"]{color-scheme:dark}

[data-theme="light"]{
    color-scheme:light;
    --bg:#f1f5f9;
    --surface:#ffffff;
    --text:#0f172a;
    --muted:#475569;
    --primary:#0d9488;
    --success:#0d9488;
    --danger:#dc2626;
    --accent:#d97706;
    --border:#e2e8f0;
}

/* Плавная смена фона и текста */
body{transition:background .3s ease,color .3s ease}

/* ===== Шапка и ключевые элементы в светлой теме ===== */
[data-theme="light"] .header{background:rgba(248,250,252,.85)}
[data-theme="light"] .logo-mark{color:#ffffff;box-shadow:0 2px 8px rgba(13,148,136,.35)}
[data-theme="light"] .btn-primary,
[data-theme="light"] .success-btn,
[data-theme="light"] .nav .btn-primary,
[data-theme="light"] .hero-tag span,
[data-theme="light"] .success-icon{color:#ffffff}
[data-theme="light"] .hero-tag{background:rgba(13,148,136,.1);border-color:rgba(13,148,136,.25)}
[data-theme="light"] .form-status.err{color:#b91c1c}

/* ===== Футер ===== */
[data-theme="light"] .footer{background:#ffffff;color:#64748b;border-top:1px solid #e2e8f0}
[data-theme="light"] .footer a{color:#475569}
[data-theme="light"] .footer a:hover{color:var(--primary)}

/* ===== Демо-секция ===== */
/* Демо-блок намеренно остаётся тёмной панелью в обеих темах:
   он использует инлайн-стили с белым текстом и полупрозрачным
   полем ввода, которые не переопределяются CSS. */

/* ============================================================
   Кнопка переключения темы (плавющая, сверху справа)
   ============================================================ */
.theme-toggle{
    position:fixed;
    z-index:150;
    top:88px;
    right:20px;
    width:42px;
    height:42px;
    border-radius:12px;
    border:1px solid var(--border);
    background:var(--surface);
    color:var(--text);
    cursor:pointer;
    font-size:1.15rem;
    line-height:1;
    font-family:inherit;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 4px 14px rgba(0,0,0,.18);
    transition:all .25s cubic-bezier(.4,0,.2,1);
}
.theme-toggle:hover{border-color:var(--primary);color:var(--primary);transform:translateY(-2px)}
/* Если на странице нет шапки — разместить выше */
.theme-toggle-fixed{top:20px}