/* polydata.cloud — внешний вид, UI style v1 (polydata_ui_style_v1.md, 15.10.2026).
   Подключается после Bootstrap и style.css и переопределяет только вид: структура и
   логика страниц не меняются. Все цвета — переменные ниже; синего и зелёного нет,
   акцент (--ac) — только у основной кнопки, включённого чипа, выбранной строки,
   линии цены, счётчика корзины и активного пункта меню. Тема одна — тёмная. */

:root {
    --bg:    #0A0A0A;  /* фон страницы */
    --s1:    #111111;  /* панели, таблицы, поля ввода */
    --s2:    #161616;  /* шапка таблицы, плитки цифр */
    --line:  #222222;  /* рамки и разделители */
    --row:   #1A1A1A;  /* линия между строками таблицы */
    --tx:    #E8E8E8;  /* основной текст */
    --mu:    #8A8A8A;  /* второстепенный текст, подписи */
    --dim:   #5A5A5A;  /* третичный текст, плейсхолдеры, иконки */
    --ac:    #E8B04B;  /* единственный акцент */
    --ac-bg: #1B1710;  /* фон выбранной строки */
    --pop:   #1F1F1F;  /* всплывающие окна (календарь) — светлее панелей */
    --pop-line: #3A3A3A;

    --navbar-height: 56px;
    --font-ui: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
    --font-head: 'Lora', Georgia, 'Times New Roman', serif;
}

/* Переменные Bootstrap — через палитру (тема всегда тёмная, data-bs-theme="dark") */
[data-bs-theme="dark"], :root {
    --bs-body-bg: var(--bg);
    --bs-body-bg-rgb: 10, 10, 10;
    --bs-body-color: var(--tx);
    --bs-body-color-rgb: 232, 232, 232;
    --bs-emphasis-color: var(--tx);
    --bs-secondary-color: var(--mu);
    --bs-tertiary-color: var(--dim);
    --bs-secondary-bg: var(--s2);
    --bs-tertiary-bg: var(--s1);
    --bs-border-color: var(--line);
    --bs-border-color-translucent: var(--line);
    --bs-heading-color: var(--tx);
    --bs-link-color: var(--tx);
    --bs-link-color-rgb: 232, 232, 232;
    --bs-link-hover-color: var(--tx);
    --bs-link-hover-color-rgb: 232, 232, 232;
    --bs-link-decoration: none;
    --bs-primary: var(--ac);
    --bs-primary-rgb: 232, 176, 75;
    /* синего и зелёного нет: «success», «info» — нейтральные */
    --bs-success: var(--mu);
    --bs-success-rgb: 138, 138, 138;
    --bs-info: var(--mu);
    --bs-info-rgb: 138, 138, 138;
    --bs-success-text-emphasis: var(--tx);
    --bs-info-text-emphasis: var(--tx);
    --bs-success-bg-subtle: var(--s2);
    --bs-info-bg-subtle: var(--s2);
    --bs-success-border-subtle: var(--line);
    --bs-info-border-subtle: var(--line);
    --bs-focus-ring-color: rgba(232, 176, 75, .25);
    --bs-border-radius: 6px;
    --bs-border-radius-sm: 6px;
    --bs-border-radius-lg: 8px;
    --bs-font-sans-serif: var(--font-ui);
    --bs-body-font-family: var(--font-ui);
    --bs-body-font-size: 13px;
    --bs-body-line-height: 1.4;
    --breadcrumb-accent: var(--tx);
}

html, body { background: var(--bg); color: var(--tx); }
body { font-family: var(--font-ui); font-size: 13px; line-height: 1.4; font-weight: 400; }
.small, small { font-size: 12px; }

/* Все числа — по разрядам */
table, .stat-row, .stat-tile, .badge, input, .price-big, .page-jump { font-variant-numeric: tabular-nums; }

/* ── Заголовки и логотип: Lora — только здесь ─────────────────────────────── */
h1, h2, h3, .h1, .h2, .h3, .h4, .h5, h4, h5, .page-title, .preview-title {
    font-family: var(--font-head); font-weight: 500; font-size: 20px; color: var(--tx); letter-spacing: 0;
}
h6, .h6 { font-family: var(--font-ui); font-weight: 500; font-size: 13px; }
.navbar-brand { font-family: var(--font-head); font-weight: 500; font-size: 22px; color: var(--tx) !important; padding: 0; }
.navbar-brand .brand-tld { color: var(--mu); }

/* ── Ссылки: цвет текста, подчёркивание при наведении ─────────────────────── */
a { color: var(--tx); text-decoration: none; }
a:hover { color: var(--tx); text-decoration: underline; }
.btn:hover, .menu-leaf:hover, .navbar-brand:hover { text-decoration: none; }

/* ── Шапка 56px ───────────────────────────────────────────────────────────── */
.navbar { min-height: var(--navbar-height); height: var(--navbar-height); background: var(--bg) !important;
          border-bottom: 1px solid var(--line) !important; padding-top: 0; padding-bottom: 0; }
.navbar .breadcrumb { font-size: 13px; margin-left: 16px; }
.navbar .breadcrumb-item, .navbar .breadcrumb-item + .breadcrumb-item::before { color: var(--mu); }
.navbar .breadcrumb-item.active { color: var(--tx); }
.navbar .breadcrumb-item + .breadcrumb-item::before { content: '/'; color: var(--dim); }
.head-link { color: var(--mu); font-size: 13px; background: none; border: 0; padding: 0; }
.head-link:hover { color: var(--tx); text-decoration: none; }
.head-link.is-active { color: var(--tx); }
.head-cart-count { color: var(--ac); font-weight: 500; }
#menuToggle { border: 0; color: var(--mu); background: none; }
#menuToggle:hover { color: var(--tx); }

/* ── Меню 200px: без иконок, раздел CATALOG мелкими прописными ────────────── */
.side-menu { background: var(--bg); border-right: 1px solid var(--line) !important; }
.menu-tree a.menu-leaf { padding: 7px 24px; color: var(--mu); border-left: 2px solid transparent;
                         font-size: 13px; border-radius: 0; }
.menu-tree a.menu-leaf:hover { background: var(--s1); color: var(--tx); }
.menu-tree a.menu-leaf.is-active { color: var(--tx); background: transparent; border-left-color: var(--ac); font-weight: 500; }
.menu-branch > summary { padding: 14px 24px 4px; font-size: 11px; font-weight: 500; text-transform: uppercase;
                         letter-spacing: .4px; color: var(--mu); cursor: pointer; }
.menu-branch > summary:hover { color: var(--tx); }
/* Раздел сворачивается щелчком: стрелка справа от названия, тусклая (--dim) */
.menu-branch > summary::before { display: none; }
.menu-branch > summary::after { content: '▸'; display: inline-block; margin-left: 6px; color: var(--dim);
                                font-size: 10px; transition: transform .15s ease; }
.menu-branch[open] > summary::after { transform: rotate(90deg); }
.menu-branch a.menu-leaf { padding-left: 24px; }
.menu-branch { border-bottom: 1px solid var(--line); padding-bottom: 6px; margin-bottom: 6px; }
.menu-tree .badge { background: transparent !important; color: var(--mu) !important; font-weight: 400; }
.menu-tree [data-cart-badge] { color: var(--ac) !important; }

/* ── Содержимое ───────────────────────────────────────────────────────────── */
.page-content > main, .page-content > .container-fluid { padding: 20px 24px; }

/* Подписи полей, шапка таблицы — мелкие прописные */
.form-label, .field-label, .table thead th, .stat-title {
    font-family: var(--font-ui); font-size: 11px; font-weight: 500; text-transform: uppercase;
    letter-spacing: .4px; color: var(--mu);
}

/* ── Поля ввода и селекты ─────────────────────────────────────────────────── */
.form-control, .form-select, .form-control-sm, .form-select-sm {
    background-color: var(--s1); border: 1px solid var(--line); color: var(--tx);
    border-radius: 6px; min-height: 34px; padding: 0 12px; font-size: 13px;
}
textarea.form-control { padding: 8px 12px; }
.form-control::placeholder { color: var(--dim); }
.form-control:focus, .form-select:focus { background-color: var(--s1); color: var(--tx);
    border-color: var(--mu); box-shadow: none; }   /* фокус без акцента: акцент — только в местах п. 1 */
/* Галочки и радиокнопки: рамка --mu (на --line #222 их не видно на чёрном фоне),
   1.5 px; отмеченная — акцент; при наведении рамка светлее */
.form-check-input { background-color: var(--bg); border: 1.5px solid var(--mu); }
.form-check-input:hover { border-color: var(--tx); }
.form-check-input:focus { border-color: var(--tx); box-shadow: none; }
.form-check-input:checked { background-color: var(--ac); border-color: var(--ac); }
.form-check-input:disabled { opacity: .35; }

/* ── Кнопки ───────────────────────────────────────────────────────────────── */
.btn { border-radius: 6px; font-size: 13px; font-weight: 500; }
.btn-primary, .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.disabled, .btn-primary:disabled {
    background: var(--ac); border-color: var(--ac); color: #0A0A0A; min-height: 34px;
}
.btn-primary:hover { filter: brightness(1.08); }
/* «success» и «info» — бывшие зелёные и синие: включённое состояние — акцент контуром */
.btn-success, .btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success:disabled,
.btn-info, .btn-info:hover {
    background: transparent; border-color: var(--ac); color: var(--ac);
}
.btn-outline-primary { border-color: var(--line); color: var(--tx); background: transparent; }
.btn-outline-primary:hover { border-color: var(--ac); color: var(--ac); background: transparent; }
/* Второстепенная (Reset, Cancel, переключатели страниц) — без фона, текст --mu */
.btn-outline-secondary, .btn-secondary, .btn-link {
    background: transparent; border-color: transparent; color: var(--mu);
}
.btn-outline-secondary:hover, .btn-secondary:hover, .btn-link:hover,
.btn-outline-secondary.active, .btn-outline-secondary:active {
    background: transparent; border-color: transparent; color: var(--tx);
}
.btn-group > .btn-outline-secondary { border-color: var(--line); }
.btn-outline-danger { border-color: var(--line); color: var(--mu); }
.btn-outline-danger:hover { background: transparent; border-color: #8a3a35; color: #e8a09a; }

/* Фильтры-чипы (Buyable, With news и т. п.) */
.chip, a.chip.btn, a.chip.btn-sm {
    border: 1px solid var(--line) !important; border-radius: 14px; padding: 3px 12px; background: transparent;
    color: var(--mu); font-weight: 400; font-size: 12px; line-height: 1.4;
}
.chip:hover { color: var(--tx); border-color: var(--mu) !important; text-decoration: none; }
.chip.is-on, .chip[aria-pressed="true"] { border-color: var(--ac) !important; color: var(--ac); }

/* ── Значки ───────────────────────────────────────────────────────────────── */
.badge.text-bg-success, .badge.text-bg-info, .badge.text-bg-primary, .badge.text-bg-secondary {
    background: transparent !important; color: var(--mu) !important; border: 1px solid var(--line); font-weight: 400;
}
.text-success, .text-info, .text-primary { color: var(--tx) !important; }
.alert { border-radius: 6px; }
.alert-info, .alert-success, .alert-secondary, .alert-primary {
    background: var(--s1); border-color: var(--line); color: var(--tx);
}
.alert-warning { background: #1B1710; border-color: #3a2f18; color: var(--tx); }

/* ── Карточки, панели ─────────────────────────────────────────────────────── */
.card { background: var(--s1); border: 1px solid var(--line); border-radius: 8px; color: var(--tx); }
.card-header, .card-footer { background: var(--s2); border-color: var(--line); }
.border, .border-top, .border-bottom, .border-start, .border-end { border-color: var(--line) !important; }
hr { border-color: var(--line); opacity: 1; }

/* ── Таблицы ──────────────────────────────────────────────────────────────── */
.table {
    --bs-table-bg: transparent; --bs-table-color: var(--tx); --bs-table-border-color: var(--row);
    --bs-table-hover-bg: var(--s2); --bs-table-hover-color: var(--tx);
    --bs-table-striped-bg: transparent; color: var(--tx);
}
.table > :not(caption) > * > * { padding: 9px 10px; border-bottom-color: var(--row); }
.table thead th, .table-scroll thead th { background: var(--s2) !important; padding: 10px; border-bottom: 1px solid var(--line); }
.table tbody tr:hover > * { background: var(--s2); }
.table tbody tr.is-picked > *, .table tbody tr.table-active > * { background: var(--ac-bg) !important;
    --bs-table-bg-state: var(--ac-bg); }   /* состояние строки Bootstrap рисует внутренней тенью */
.table-scroll { background: var(--s1); border: 1px solid var(--line); border-radius: 8px; }
.table .text-body-secondary, .table .text-muted { color: var(--mu) !important; }
.sort-link { color: var(--mu); }
.sort-link.is-active, .sort-link:hover { color: var(--tx); }
/* «+» в строке: --dim, при наведении и в выбранной строке — акцент */
.cart-plus, form.js-cart:not(.js-cart-main) .btn { color: var(--dim); border-color: transparent; background: transparent; }
.table tbody tr:hover form.js-cart .btn, .table tbody tr.is-picked form.js-cart .btn { color: var(--ac); }

/* ── Таблица и превью: 63% / 37%, зазор 16px ──────────────────────────────── */
.split-body { --split-w: 63%; gap: 16px; }
.split-resizer { width: 0; margin: 0 -8px; }
.split-right > .card { border-radius: 8px; }
.stat-row { border-color: var(--row); }
.stat-row > span { color: var(--mu); }

/* Плитки цифр превью */
.stat-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 12px 0; }
.stat-tile { background: var(--s2); border-radius: 6px; padding: 10px 12px; }
.stat-tile .tile-label { font-size: 11px; font-weight: 500; text-transform: uppercase; letter-spacing: .4px; color: var(--mu); }
.stat-tile .tile-value { font-size: 18px; font-weight: 500; color: var(--tx); }
.price-big { font-size: 18px; font-weight: 500; color: var(--tx); }
.preview-meta { color: var(--mu); font-size: 12px; }
.preview-empty { color: var(--mu); text-align: center; padding: 40px 12px; }
.price-chart { width: 100%; height: 140px; display: block; }
.price-chart .grid { stroke: var(--row); stroke-width: 1; }
.price-chart .line-lead { stroke: var(--ac); stroke-width: 2; fill: none; }
.price-chart .line-other { stroke: var(--dim); stroke-width: 1; fill: none; }

/* Служебная строка внизу */
.service-line { font-size: 12px; color: var(--mu); margin-top: 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* На экранах уже 1280px превью выезжает поверх таблицы справа при выборе строки */
@media (max-width: 1279.98px) {
    .split-body { --split-w: 100%; }
    .split-resizer { display: none; }
    .split-right { position: fixed; top: var(--navbar-height); right: 0; bottom: 0;
                   width: min(460px, 92vw); z-index: 1050; background: var(--bg);
                   box-shadow: -8px 0 24px rgba(0, 0, 0, .6); padding: 12px; overflow-y: auto; }
    .split-right.is-empty { display: none; }
}

/* Подсказки браузера оформить нельзя; свои подсказки (.ui-tip) — справа от элемента */
.ui-tip { background: var(--s2); border: 1px solid var(--line); color: var(--tx); font-size: 12px; }

/* Часики загрузки — в цветах палитры */
.page-busy { background: var(--ac); }
.page-clock > div { background: var(--s2); border: 1px solid var(--line); color: var(--tx); }

/* ── Логотип (UI style v1.1, раздел 4a) ─────────────────────────────────── */
.navbar-brand { display: inline-flex; align-items: center; gap: 10px; }
.brand-word { white-space: nowrap; }
.brand-mark { height: 28px; width: auto; display: block; }
.preview-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; }
.preview-empty-mark { height: 300px; max-height: 50vh; width: auto; }  /* знак вытянут по вертикали: размер — по высоте; цвет — как на Home (по просьбе 15.10.2026, в UI v1.2 было 16 %) */
.home-hero { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.home-hero-text { flex: 1 1 auto; min-width: 0; }
.home-hero-mark { height: min(520px, 48vh); width: auto; flex: 0 0 auto; }
@media (max-width: 991.98px) { .home-hero-mark { display: none; } }

/* Подсказки Bootstrap: фон --s2, рамка --line, текст 12px */
.tooltip { --bs-tooltip-bg: var(--s2); --bs-tooltip-color: var(--tx); --bs-tooltip-font-size: 12px; }
.tooltip-inner { border: 1px solid var(--line); }

/* ── Цены на виду (UI style v1.2, раздел 4b) ────────────────────────────── */
.price-rule { color: var(--mu); font-size: 13px; white-space: nowrap; }
.price-rule b { color: var(--tx); font-weight: 500; font-variant-numeric: tabular-nums; }
.price-cards { display: flex; flex-wrap: wrap; gap: 16px; }
.price-card { background: var(--s1); border: 1px solid var(--line); border-radius: 8px; padding: 14px 24px; min-width: 220px; }
.price-card-name { color: var(--mu); font-size: 13px; margin-bottom: 2px; }
.price-card-unit { color: var(--mu); }
.price-card.is-coming { opacity: .5; }
.home-facts { display: flex; flex-wrap: wrap; gap: 12px 40px; border-top: 1px solid var(--line); padding-top: 16px; }
.home-fact { color: var(--tx); font-weight: 500; font-variant-numeric: tabular-nums; }
.home-fact-sub { color: var(--mu); font-size: 12px; }

/* Выбор радиокнопкой-кнопкой (рынок на «Коротких рынках») — как включённый чип,
   без синей заливки Bootstrap */
.btn-check:checked + .btn-outline-primary, .btn-check:checked + .btn-outline-secondary {
    background: transparent; border-color: var(--ac); color: var(--ac); }
/* Подсветка обновившейся строки заказов — фон выбранной строки, не зелёный */
.table tbody tr.table-success > * { --bs-table-bg-state: var(--ac-bg); --bs-table-bg: var(--ac-bg); color: var(--tx); }
.progress-bar { background-color: var(--ac); color: #0A0A0A; }
.page-link { background: var(--s1); border-color: var(--line); color: var(--mu); }
.page-item.active .page-link { background: transparent; border-color: var(--ac); color: var(--ac); }
.split-left > .service-line { flex: 0 0 auto; line-height: 16px; }
.home-account { max-width: 640px; }
.home-account .card-body { padding: 12px 16px; }
.home-account p, .home-account ul { margin-bottom: .5rem !important; }

/* ── Юридические тексты и выбор лицензии (бриф юридических текстов 15.10.2026) ── */
.legal-meta { color: var(--mu); font-size: 12px; }
.legal-text { line-height: 1.55; }
.legal-text h2 { font-family: var(--font-head); font-weight: 500; font-size: 17px; margin: 22px 0 8px; }
.legal-text h3 { font-size: 14px; font-weight: 500; margin: 16px 0 6px; }
.legal-text p, .legal-text li { color: var(--tx); }
.legal-text a { text-decoration: underline; }
.open-item { background: var(--ac-bg); color: var(--ac); padding: 0 2px; }
.license-accept { border-top: 1px solid var(--line); padding-top: 12px; }
.license-accept-head { font-weight: 500; }
.license-accept-sub, .license-accept-links, .license-accept-note, .register-terms { color: var(--mu); font-size: 12px; }
.license-accept-links a, .register-terms a { color: var(--tx); text-decoration: underline; }
.license-option { display: flex; gap: 10px; align-items: flex-start; border: 1px solid var(--line); border-radius: 6px;
                  padding: 8px 12px; margin-bottom: 8px; cursor: pointer; }
.license-option:has(input:checked) { border-color: var(--ac); }
.license-option input { margin-top: 3px; flex: 0 0 auto; }
.license-option-text { display: block; color: var(--mu); font-size: 12px; }
.license-decl { font-size: 12px; }
.license-decl a[data-license-link] { text-decoration: underline; }
.license-accept-note { margin: 4px 0 0 24px; }
.menu-foot { padding: 12px 24px; font-size: 11px; color: var(--dim); line-height: 1.8; }
.menu-foot a { color: var(--mu); }

/* ✕ страницы, открытой из другой формы (_close.html) */
.page-close { float: right; margin-left: 12px; }
/* Тексты лицензий, Terms, About: шапка на месте, прокручивается только текст */
.legal-head { flex: 0 0 auto; }
.legal-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding-right: 8px; }

/* Кнопка оформления до выбора лицензии и декларации — выглядит неактивной, но с подсказкой */
.btn.is-blocked { opacity: .45; cursor: not-allowed; }
.license-accept.needs-attention { animation: pd-attention 1.2s ease; }
@keyframes pd-attention { 0%, 60% { box-shadow: 0 0 0 1px var(--ac); border-radius: 6px; } 100% { box-shadow: none; } }

/* Поле даты YYYY-MM-DD с кнопкой календаря и своим календарём (скрипт в base.html) */
.date-field { position: relative; display: block; width: 150px; }
.date-field > .form-control { width: 100%; padding-right: 30px; }
.date-btn { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); background: transparent;
            border: 0; color: var(--mu); padding: 2px 6px; line-height: 1; cursor: pointer; }
.date-btn:hover { color: var(--tx); }
.cal-pop { position: absolute; z-index: 1060; top: calc(100% + 4px); left: 0; width: 236px; padding: 8px;
           background: var(--pop); border: 1px solid var(--pop-line); border-radius: 8px; box-shadow: 0 10px 28px rgba(0,0,0,.7); }
.cal-foot { display: flex; justify-content: space-between; border-top: 1px solid var(--pop-line); margin-top: 6px; padding-top: 6px; }
.cal-foot button { background: transparent; border: 0; color: var(--mu); font-size: 12px; padding: 2px 6px; cursor: pointer; }
.cal-foot button:hover { color: var(--tx); }
.cal-foot button:disabled { opacity: .35; cursor: default; }
.cal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; font-weight: 500; }
.cal-head button { background: transparent; border: 0; color: var(--mu); font-size: 16px; padding: 0 8px; cursor: pointer; }
.cal-head button:hover { color: var(--tx); }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; text-align: center; }
.cal-dow { color: var(--dim); font-size: 11px; padding: 2px 0; }
.cal-day { background: transparent; border: 1px solid transparent; border-radius: 4px; color: var(--tx);
           font-size: 12px; padding: 3px 0; font-variant-numeric: tabular-nums; cursor: pointer; }
.cal-day:hover { background: var(--pop-line); }
.cal-day.is-today { border-color: var(--line); }
.cal-day.is-on { border-color: var(--ac); color: var(--ac); }
.cal-day:disabled { color: var(--dim); opacity: .4; cursor: default; background: transparent; }
