/* v1.127.0 — дизайн-система кабинета Crossplace.
   Один акцент вместо смеси фиолетового (#7b2ff7), синего Bootstrap (#0d6efd) и #4d7cff; цвета площадок — отдельно
   (WB — фиолетовый, Ozon — синий, Тильда — зелёный) и только для меток площадок. Обе темы — на одних токенах.
   Переопределения Bootstrap 5.3 — через его CSS-переменные (--bs-*, --bs-btn-*), без !important где можно. */

:root, html[data-theme="light"] {
  --accent: #5b5ff0; --accent-hover: #4a4ee0; --accent-press: #3f43cc; --accent-soft: #eef0ff; --accent-ink: #3a3dbd;
  --accent-rgb: 91, 95, 240;
  --wb: #9b3cf5; --ozon: #005bff; --tilda: #12a35f; --avito: #00aaff; --ym: #e8a400;
  --ok: #12a35f; --ok-soft: #e7f7ef; --warn: #c27a00; --warn-soft: #fff5df; --bad: #d63a3a; --bad-soft: #fdecec;
  --bg: #f5f6fa; --surface: #ffffff; --surface-2: #f4f5f9; --surface-3: #eceef4; --line: #e3e5ee; --line-2: #d6d9e4;
  --text: #191b27; --muted: #686d82; --faint: #9aa0b4;
  --r-sm: 8px; --r: 12px; --r-lg: 16px; --r-xl: 22px;
  --sh-1: 0 1px 2px rgba(16, 24, 40, .04), 0 1px 3px rgba(16, 24, 40, .06);
  --sh-2: 0 6px 20px rgba(16, 24, 40, .08);
  --sh-3: 0 18px 48px rgba(16, 24, 40, .16);
  --ease: cubic-bezier(.2, .7, .2, 1);
  --bs-primary: var(--accent); --bs-primary-rgb: var(--accent-rgb);
  --bs-link-color: var(--accent); --bs-link-color-rgb: var(--accent-rgb); --bs-link-hover-color: var(--accent-hover);
  --bs-body-font-family: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --bs-border-radius: .6rem; --bs-border-radius-sm: .5rem; --bs-border-radius-lg: .9rem;
  --bs-focus-ring-color: rgba(var(--accent-rgb), .25);
}
html[data-theme="dark"] {
  --accent: #7c80ff; --accent-hover: #9396ff; --accent-press: #6a6ef0; --accent-soft: #1e2042; --accent-ink: #b9bbff;
  --accent-rgb: 124, 128, 255;
  --wb: #b56dff; --ozon: #4d8dff; --tilda: #3ccf8a; --avito: #4cc3ff; --ym: #ffc933;
  --ok: #3ccf8a; --ok-soft: #10281d; --warn: #f0b429; --warn-soft: #2b2310; --bad: #ff6b6b; --bad-soft: #2d1416;
  --bg: #0e0e10; --surface: #19191c; --surface-2: #202025; --surface-3: #26262b; --line: #2c2c32; --line-2: #3a3a42;
  --text: #e9e9ee; --muted: #9a9aa6; --faint: #6f6f7a;
  --sh-1: 0 1px 0 rgba(255, 255, 255, .03) inset, 0 6px 18px rgba(0, 0, 0, .22);
  --sh-2: 0 10px 28px rgba(0, 0, 0, .32);
  --sh-3: 0 20px 56px rgba(0, 0, 0, .5);
  --bs-primary: var(--accent); --bs-primary-rgb: var(--accent-rgb);
  --bs-primary-text-emphasis: var(--accent-ink); --bs-primary-bg-subtle: var(--accent-soft); --bs-primary-border-subtle: #34377a;
  --bs-link-color: #a3a6ff; --bs-link-color-rgb: 163, 166, 255; --bs-link-hover-color: #c3c5ff; --bs-link-hover-color-rgb: 195, 197, 255;
}

/* ---------- основа ---------- */
body { font-family: var(--bs-body-font-family); -webkit-font-smoothing: antialiased; }
.main-content { background: var(--bg); }
html[data-theme="light"] .main-content, :root:not([data-theme="dark"]) .main-content { background: radial-gradient(1100px 520px at 15% -12%, rgba(var(--accent-rgb), .06), transparent 60%), var(--bg); }
h1, h2, h3, h4, h5, h6 { font-weight: 800; letter-spacing: -.012em; }
h4 { font-size: 1.45rem; }
::selection { background: rgba(var(--accent-rgb), .3); }
a { text-underline-offset: 3px; }
:focus-visible { outline: 2px solid rgba(var(--accent-rgb), .6); outline-offset: 2px; }

/* ---------- иконки (спрайт static/icons/sprite.svg, макрос icon() в _icons.html) ---------- */
.ic { width: 1.15em; height: 1.15em; display: inline-block; vertical-align: -.2em; flex-shrink: 0; fill: currentColor; }
.ic-lg { width: 1.5em; height: 1.5em; } .ic-xl { width: 2.2em; height: 2.2em; }
.ic { margin-right: .28em; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .38em; }
.btn .ic, .btn-group .ic { margin-right: 0; }
.btn.d-block, .btn.w-100 { display: flex; }

/* ---------- поверхности ---------- */
.card { --bs-card-bg: var(--surface); --bs-card-border-color: var(--line); --bs-card-cap-bg: var(--surface-2);
        --bs-card-border-radius: var(--r-lg); --bs-card-inner-border-radius: calc(var(--r-lg) - 1px); box-shadow: var(--sh-1); }
.alert { --bs-alert-border-radius: var(--r); }
.alert-light { --bs-alert-bg: var(--surface-2); --bs-alert-color: var(--text); --bs-alert-border-color: var(--line); }
.dropdown-menu { --bs-dropdown-border-radius: var(--r); --bs-dropdown-border-color: var(--line); --bs-dropdown-link-active-bg: var(--accent); box-shadow: var(--sh-3); padding: 6px; }
.dropdown-item { border-radius: 8px; }
.modal-content { border-radius: var(--r-lg); }
.badge { font-weight: 700; letter-spacing: .01em; border-radius: 999px; padding: .38em .62em; }
.text-muted, .form-text { color: var(--muted) !important; }

/* ---------- кнопки ---------- */
.btn { --bs-btn-border-radius: 10px; --bs-btn-font-weight: 600; transition: background-color .15s var(--ease), border-color .15s var(--ease), box-shadow .15s var(--ease), transform .08s; }
.btn:active { transform: translateY(1px); }
.btn-sm { --bs-btn-border-radius: 9px; --bs-btn-padding-y: .3rem; --bs-btn-padding-x: .65rem; }
.btn-primary { --bs-btn-bg: var(--accent); --bs-btn-border-color: var(--accent); --bs-btn-hover-bg: var(--accent-hover); --bs-btn-hover-border-color: var(--accent-hover);
               --bs-btn-active-bg: var(--accent-press); --bs-btn-active-border-color: var(--accent-press); --bs-btn-disabled-bg: var(--accent); --bs-btn-disabled-border-color: var(--accent);
               --bs-btn-focus-shadow-rgb: var(--accent-rgb); box-shadow: 0 4px 14px rgba(var(--accent-rgb), .25); }
.btn-outline-primary { --bs-btn-color: var(--accent); --bs-btn-border-color: rgba(var(--accent-rgb), .45); --bs-btn-hover-bg: var(--accent); --bs-btn-hover-border-color: var(--accent);
                       --bs-btn-active-bg: var(--accent-press); --bs-btn-active-border-color: var(--accent-press); --bs-btn-focus-shadow-rgb: var(--accent-rgb); }
.btn-success { --bs-btn-bg: var(--ok); --bs-btn-border-color: var(--ok); --bs-btn-hover-bg: #0f8c51; --bs-btn-hover-border-color: #0f8c51; }
html[data-theme="dark"] .btn-success { --bs-btn-color: #062314; --bs-btn-hover-color: #062314; --bs-btn-hover-bg: #5bdb9f; --bs-btn-hover-border-color: #5bdb9f; }
.btn-outline-secondary { --bs-btn-color: var(--text); --bs-btn-border-color: var(--line-2); --bs-btn-hover-bg: var(--surface-3); --bs-btn-hover-border-color: var(--line-2); --bs-btn-hover-color: var(--text);
                         --bs-btn-active-bg: var(--surface-3); --bs-btn-active-color: var(--text); --bs-btn-active-border-color: var(--line-2); }
.btn-link { --bs-btn-color: var(--accent); --bs-btn-hover-color: var(--accent-hover); }

/* ---------- формы ---------- */
.form-control, .form-select { border-radius: 10px; border-color: var(--line-2); background-color: var(--surface); color: var(--text); }
html[data-theme="dark"] .form-control, html[data-theme="dark"] .form-select { background-color: var(--surface-2); border-color: #303036; }
.form-control:focus, .form-select:focus { border-color: var(--accent); box-shadow: 0 0 0 .2rem rgba(var(--accent-rgb), .2); }
.form-control::placeholder { color: var(--faint); }
.form-check-input:checked { background-color: var(--accent); border-color: var(--accent); }
.form-check-input:focus { box-shadow: 0 0 0 .2rem rgba(var(--accent-rgb), .2); border-color: var(--accent); }
.form-label, label { font-weight: 500; }

/* ---------- таблицы ---------- */
.table { --bs-table-bg: transparent; --bs-table-border-color: var(--line); --bs-table-hover-bg: rgba(var(--accent-rgb), .04); color: var(--text); }
.table > thead th, .table > :not(caption) > tr > th { color: var(--muted); font-size: .76em; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; }
.table-light { --bs-table-bg: var(--surface-2); --bs-table-color: var(--muted); --bs-table-border-color: var(--line); }

/* ---------- заголовок страницы и пустые состояния ---------- */
.page-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 6px; }
.page-head h4 { margin: 0; }
.page-head .ph-act { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }
.empty { text-align: center; padding: 36px 20px; border: 1px dashed var(--line-2); border-radius: var(--r-lg); background: var(--surface); }
.empty .ic { width: 44px; height: 44px; color: var(--accent); opacity: .85; margin-bottom: 10px; }
.empty b { display: block; font-size: 16px; margin-bottom: 4px; }
.empty p { color: var(--muted); max-width: 460px; margin: 0 auto 12px; font-size: 14px; }

/* ---------- метки площадок ---------- */
.mp { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; }
.mp::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.mp-wb { color: var(--wb); } .mp-ozon { color: var(--ozon); } .mp-tilda { color: var(--tilda); } .mp-avito { color: var(--avito); } .mp-ym { color: var(--ym); }

/* ---------- плавность ---------- */
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }
.ic-h { width: .95em; height: .95em; color: var(--accent); margin-right: .3em; vertical-align: -.08em; }
.sidebar .ic, .sec-tabs .ic, .empty .ic { margin-right: 0 !important; }
/* нижние панели страниц не заезжают на меню */
@media (min-width: 901px) {
  body:has(.sidebar:not(.collapsed)) .ce-bottom { left: 248px; }
  body:has(.sidebar.collapsed) .ce-bottom { left: 64px; }
}
.sidebar .sb-foot .ic { margin-right: .25em !important; width: 14px; height: 14px; }