/* ═══════════════════════════════════════════════════════════════
ANRO — Shared Dashboard CSS (v7 design system)
Reference style: otto_dashboard_v2_redesign.html (cleanest)
All dashboards: kaufland · amazon · ebay · otto · gls · autofill
Migrated to design tokens — see tokens.css (loaded BEFORE this).
═══════════════════════════════════════════════════════════════ */
/* ── Scrollbar ── */
::-webkit-scrollbar { width: var(--space-1); height: var(--space-1); }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: var(--space-1); }
/* ── Page wrapper ──
No max-width: page fills v3-content fully. Sidebar collapse automatically
gives ~165px back via flex layout. Users with ultrawide monitors can
collapse the sidebar to gain real estate. */
.pg { padding: var(--space-5) var(--space-6); width: 100%; box-sizing: border-box; }
/* ── Page header ── */
.dash-head {
display: flex; align-items: center;
justify-content: space-between;
margin-bottom: 18px; flex-wrap: wrap; gap: 10px; /* TODO tokens: 18px/10px off-scale */
}
.dash-head-actions { display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; }
.csv-link { display: inline-flex; align-items: center; gap: var(--space-1); color: var(--color-accent); font-size: var(--fs-sm); text-decoration: none; align-self: flex-end; }
.csv-link:hover { text-decoration: underline; }
.mp-checks { display: flex; gap: var(--space-3); flex-wrap: wrap; margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px solid var(--border); }
.mp-check { display: flex; align-items: center; gap: var(--space-2); font-size: var(--fs-sm); cursor: pointer; color: var(--text-2); }
.mp-check input { accent-color: var(--color-accent); }
.thumb-ph { display: flex; align-items: center; justify-content: center; font-size: var(--fs-lg); }
.cell-ellipsis { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.filter-input-xs { width: 60px; text-transform: uppercase; }
/* intl-pricing: narrow input widths (классы вместо inline-style — IRON LAW) */
.intl-w-pct { width: 5rem; }
.intl-w-mm { width: 4rem; }
.intl-w-fx { width: 6rem; }
.intl-w-id { width: 10rem; }
.intl-w-reason { width: 14rem; }
/* intl-pricing: ECB rate display */
.intl-ecb-info-text { font-size: var(--fs-sm); color: var(--color-text-muted); margin-bottom: var(--space-4); }
.intl-fx-readonly { font-family: monospace; font-size: var(--fs-sm); color: var(--color-text); }
.intl-ecb-badge { display: block; font-size: var(--fs-xs); color: var(--color-text-muted); white-space: nowrap; }
.gp-no-jtl { color: var(--color-bad); font-size: var(--fs-xs); }
.cf-banner { background: rgba(245,158,11,.06); border: 1px solid var(--color-warn); border-radius: var(--radius-input); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4); font-size: var(--fs-md); color: var(--text-2); }
.cf-banner-list { margin-top: var(--space-2); padding-left: var(--space-5); font-size: var(--fs-sm); display: flex; flex-direction: column; gap: var(--space-1); }
.cf-nowrap { white-space: nowrap; }
.cf-sku { color: var(--color-text); font-family: monospace; font-weight: var(--fw-semibold); font-size: var(--fs-sm); }
.cf-field { font-size: var(--fs-xs); color: var(--text-3); margin-top: var(--space-1); font-family: monospace; }
.cf-locale { font-family: monospace; font-size: var(--fs-sm); color: var(--text-2); }
.cf-valcell { max-width: 180px; }
.cf-val { font-size: var(--fs-xs); color: var(--text-1); word-break: break-word; }
.cf-val-muted { color: var(--text-2); }
.cf-val-new { color: var(--color-warn); }
.cf-who { font-size: var(--fs-xs); }
.cf-who-name { font-weight: var(--fw-medium); }
.cf-who-pim { color: var(--text-3); }
.cf-who-jtl { color: var(--color-warn); }
.merk-name-btn { cursor: pointer; font-size: var(--fs-sm); padding: 0; text-align: left; }
.merk-chip { display: inline-block; background: var(--bg-surface); border: 1px solid var(--border); border-radius: var(--radius-badge); padding: 1px 5px; margin-right: var(--space-1); font-size: var(--fs-xs); }
.merk-assign-row { display: flex; gap: var(--space-2); align-items: center; }
.merk-modal-head { display: flex; justify-content: space-between; align-items: center; padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--border); }
.merk-modal-body { overflow-y: auto; flex: 1; padding: var(--space-3); }
.merk-modal-title { font-weight: var(--fw-semibold); color: var(--color-text); }
.merk-loading { text-align: center; color: var(--text-3); padding: var(--space-5); }
.dt-ext { color: var(--text-3); margin-left: var(--space-1); font-size: var(--fs-xs); }
.sev-crit { color: var(--color-bad); }
.sev-warn { color: var(--color-warn); }
.sev-ok { color: var(--color-good); }
.anom-resolve { display: flex; gap: var(--space-1); align-items: center; }
.anom-note { width: 100px; }
.link-del { color: var(--color-bad); font-size: var(--fs-sm); margin-left: var(--space-2); text-decoration: none; }
.link-del:hover { text-decoration: underline; }
.dash-title { font-size: var(--fs-xl); font-weight: var(--fw-bold); color: var(--text-1); letter-spacing: -0.4px; }
.dash-sub { font-size: var(--fs-sm); color: var(--text-3); margin-top: 2px; }
/* ── Sub-nav group separator ── */
.sub-nav-sep {
display: inline-block;
width: var(--space-px);
align-self: stretch;
background: var(--color-border);
margin: 0 var(--space-1);
}
/* ── Period switcher ── */
.period-sw { display: flex; gap: var(--space-1); align-items: center; flex-wrap: wrap; }
.period-btn {
font-size: var(--fs-sm); padding: var(--space-1) 10px; border-radius: var(--radius-pill);
border: 1px solid var(--border); background: var(--bg-page);
color: var(--text-3); cursor: pointer; text-decoration: none;
transition: all .12s; font-weight: var(--fw-medium);
display: inline-flex; align-items: center; gap: 5px; line-height: 1; /* TODO tokens: 10px/5px off-scale */
}
.period-btn .period-icon { display: inline-flex; align-items: center; line-height: 0; opacity: .8; }
.period-btn:hover { background: var(--bg-surface); color: var(--text-1); }
.period-btn:hover .period-icon { opacity: 1; }
.period-btn.act, .period-btn.active {
background: var(--text-1); color: var(--bg-surface); border-color: var(--text-1);
}
.period-btn.act .period-icon, .period-btn.active .period-icon { opacity: 1; }
@media (max-width: 900px) {
.period-btn .period-label { display: none; }
.period-btn { padding: 5px var(--space-2); } /* TODO tokens: 5px off-scale */
}
/* ── KPI grid ── */
.kpi-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
gap: 10px; margin-bottom: var(--space-4); /* TODO tokens: 10px/150px off-scale */
}
.kpi-card {
position: relative;
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: 10px; padding: 14px var(--space-4); /* TODO tokens: 10px/14px off-scale */
transition: box-shadow .12s;
}
.kpi-card:hover { box-shadow: 0 2px 8px rgba(0,0,0,.06); }
/* Left-border accent variants (all naming conventions consolidated) */
.kpi-card.accent-l, .kpi-card.accent-left, .kpi-card.left-accent,
.kpi-card.kpi-card-accent, .kpi-card.c-acc, .kpi-card.open-left { border-left: 3px solid var(--color-accent); }
.kpi-card.good-l, .kpi-card.good-left, .kpi-card.left-good,
.kpi-card.kpi-card-ok, .kpi-card.c-raise { border-left: 3px solid var(--color-good); }
.kpi-card.warn-l, .kpi-card.warn-left, .kpi-card.left-warn,
.kpi-card.kpi-card-warn, .kpi-card.c-lower, .kpi-card.soon-left { border-left: 3px solid var(--color-warn); }
.kpi-card.bad-l, .kpi-card.bad-left, .kpi-card.left-bad,
.kpi-card.c-stale, .kpi-card.urgent-left { border-left: 3px solid var(--color-bad); }
.kpi-card.blue-l, .kpi-card.blue-left { border-left: 3px solid #93c5fd; }
.kpi-card.slate-left, .kpi-card.neu-left, .kpi-card.c-ok,
.kpi-card.expired-left { border-left: 3px solid var(--color-neu); }
.kpi-card.violet-left { border-left: 3px solid #7c3aed; }
.kpi-label {
font-size: var(--fs-2xs); text-transform: uppercase; letter-spacing: .06em;
color: var(--text-3); margin-bottom: 6px; font-weight: var(--fw-semibold); /* TODO tokens: 10.5px/6px off-scale */
}
.kpi-value {
font-size: var(--fs-section); font-weight: var(--fw-bold); color: var(--text-1);
font-variant-numeric: tabular-nums; line-height: 1.2; /* TODO tokens: 22px off-scale */
}
.kpi-value.sm { font-size: var(--fs-1lg); } /* TODO tokens: 18px off-scale */
.kpi-value.good { color: #16a34a; }
.kpi-value.warn { color: #d97706; }
.kpi-value.bad { color: #dc2626; }
html.dark .kpi-value.good { color: #4ade80; }
html.dark .kpi-value.warn { color: #fbbf24; }
html.dark .kpi-value.bad { color: #f87171; }
.kpi-sub { font-size: var(--fs-xs); color: var(--text-3); margin-top: var(--space-1); }
/* ── Section card ── */
.sec-card, .v2-section, .section-card {
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: 10px; padding: var(--space-4) var(--space-5); margin-bottom: 14px; /* TODO tokens: 10px/14px off-scale */
}
.sec-head, .v2-section-h {
display: flex; align-items: baseline;
justify-content: space-between;
margin-bottom: var(--space-3); flex-wrap: wrap; gap: var(--space-2);
}
.sec-title, .v2-section-title { font-size: var(--fs-md); font-weight: var(--fw-bold); color: var(--text-1); }
/* canonical pg-title — единый заголовок секции на всех страницах (flex для иконочных вариантов) */
.pg-title { font-size: var(--fs-lg); font-weight: var(--fw-bold); color: var(--text-1); display: flex; align-items: center; gap: var(--space-2); }
.sec-sub, .v2-section-sub {
font-size: var(--fs-xs); color: var(--text-3);
text-transform: uppercase; letter-spacing: .04em;
}
/* ── Two-column grid ── */
.grid-2, .v2-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; } /* TODO tokens: 14px off-scale */
@media (max-width: 900px) { .grid-2, .v2-grid-2 { grid-template-columns: 1fr; } }
/* ── Phase-2 enrichment signals block (Google Ads agents) ── */
.v3-phase2-signals { margin-top: var(--sp-3); border-top: var(--border-width, 1px) solid var(--border); padding-top: var(--sp-2); }
.v3-signals-label { font-size: var(--text-xs); text-transform: uppercase; margin-bottom: var(--sp-1); }
/* ── Tables ── */
.v3-tbl, .v2-table { width: 100%; border-collapse: collapse; font-size: var(--fs-2sm); } /* TODO tokens: 13px off-scale */
.v3-tbl th, .v2-table th {
background: var(--bg-page); color: var(--text-3);
font-size: var(--fs-2xs); font-weight: var(--fw-bold); letter-spacing: .06em;
text-transform: uppercase; padding: var(--space-2) 10px; /* TODO tokens: 10.5px/10px off-scale */
text-align: left; border-bottom: 1px solid var(--border);
white-space: nowrap;
}
.v3-tbl td, .v2-table td {
padding: 9px 10px; border-bottom: 1px solid var(--border); /* TODO tokens: 9px/10px off-scale */
vertical-align: middle; color: var(--text-1);
}
.v3-tbl tr:last-child td, .v2-table tr:last-child td { border-bottom: none; }
.v3-tbl tr:hover td, .v2-table tr:hover td { background: var(--bg-page); }
.v3-tbl td.mono, .v2-table td.mono { font-size: var(--fs-sm); color: var(--text-2); font-variant-numeric: tabular-nums; } /* TODO tokens: 11.5px off-scale */
.v3-tbl td.num, .v2-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.v3-tbl td.muted, .v2-table td.muted { color: var(--text-3); font-size: var(--fs-sm); }
/* ── Buttons ── */
.btn-primary {
display: inline-flex; align-items: center; gap: 6px;
padding: 7px 14px; border-radius: 7px; /* TODO tokens: 6px/7px/14px off-scale */
font-size: var(--fs-2sm); font-weight: var(--fw-semibold); cursor: pointer; /* TODO tokens: 13px off-scale */
border: 1px solid var(--text-1); background: var(--text-1);
color: var(--bg-surface); transition: opacity .12s;
text-decoration: none;
}
.btn-primary:hover { opacity: .85; }
.btn-ghost {
display: inline-flex; align-items: center; gap: 6px;
padding: 6px var(--space-3); border-radius: 7px; /* TODO tokens: 6px/7px off-scale */
font-size: var(--fs-sm); font-weight: var(--fw-medium); cursor: pointer;
border: 1px solid var(--border); background: var(--bg-surface);
color: var(--text-2); transition: background .12s, border .12s, box-shadow .12s;
text-decoration: none;
box-shadow: 0 1px 2px rgba(0,0,0,.05);
}
.btn-ghost:hover { background: var(--bg-page); border-color: #94a3b8; box-shadow: 0 2px 4px rgba(0,0,0,.08); }
.btn-ghost:disabled { opacity: .4; cursor: not-allowed; pointer-events: none; }
/* btn-danger:disabled — серая и некликабельная, но tooltip на hover остаётся (без pointer-events:none) */
.btn-danger:disabled { opacity: .4; cursor: not-allowed; }
/* ── Widget settings panel ── */
.widget-panel {
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: 10px; padding: var(--space-4); margin-bottom: var(--space-4); /* TODO tokens: 10px off-scale */
}
/* ── Chart box ── */
.chart-box { position: relative; height: 240px; width: 100%; }
.chart-box-sm { position: relative; height: 180px; width: 100%; }
/* ── Mini progress bar ── */
.bar-track { height: var(--space-1); background: var(--border); border-radius: 2px; }
.bar-fill { height: var(--space-1); background: var(--color-good); border-radius: 2px; }
/* ── Unified sub-section header (used inside .sec-card for grouped panes) ── */
.sub-h {
font-size: var(--fs-2xs); font-weight: var(--fw-bold); text-transform: uppercase;
letter-spacing: .06em; color: var(--text-3); margin-bottom: var(--space-2); /* TODO tokens: 10.5px off-scale */
}
/* ── Mini-tile (used inside .sec-card for split groups: fulfillment / payout) ── */
.mini-tile {
background: var(--bg-page); border: 1px solid var(--border);
border-radius: var(--radius-input); padding: var(--space-3) var(--space-4); text-align: center; min-width: 90px;
}
.mini-tile-value {
font-size: var(--fs-xl); font-weight: var(--fw-bold); color: var(--text-1);
font-variant-numeric: tabular-nums; line-height: 1.1;
}
.mini-tile-label { font-size: var(--fs-xs); color: var(--text-3); margin-top: 2px; }
/* ── Empty state (unified) ── */
.empty-state {
color: var(--text-3); font-size: var(--fs-sm); padding: var(--space-4);
text-align: center;
}
/* ── Status badge (canonical, used by _partials/status_badge.html) ── */
.status-badge {
display: inline-flex; align-items: center;
gap: var(--space-1);
padding: var(--space-1) var(--space-2);
border-radius: var(--radius-badge);
font-size: var(--fs-xs);
font-weight: var(--fw-medium);
white-space: nowrap;
line-height: 1.2;
border: 1px solid transparent;
}
.status-badge.good-badge { background: rgba(16,185,129,.12); color: var(--color-good); }
.status-badge.warn-badge { background: rgba(245,158,11,.12); color: var(--color-warn); }
/* Vendor: «Временно нет на складе» — жёлтая опция в выпадающем списке действий */
select option.opt-warn { background-color: color-mix(in srgb, var(--color-warn) 22%, transparent); color: var(--color-warn); font-weight: 600; }
/* Кликабельные строки таблиц (вся строка = действие) */
tr.row-link, tr.row-toggle { cursor: pointer; }
tr.row-link:hover, tr.row-toggle:hover { background: var(--bg-page); }
.status-badge.bad-badge { background: rgba(239,68,68,.12); color: var(--color-bad); }
.status-badge.neu-badge { background: var(--bg-page); color: var(--text-2); border-color: var(--border); }
.status-badge.accent-badge { background: rgba(59,130,246,.12); color: var(--color-accent); }
.status-badge.violet-badge { background: rgba(139,92,246,.12); color: var(--color-violet); }
/* ── Empty state block (canonical, used by _partials/empty_state.html) ── */
.empty-state-block {
padding: var(--space-8);
text-align: center;
color: var(--color-text-muted);
}
.empty-state-icon { font-size: var(--fs-3xl); margin-bottom: var(--space-2); line-height: 1; }
.empty-state-title { font-size: var(--fs-md); font-weight: var(--fw-semibold); color: var(--color-text); margin-bottom: var(--space-1); }
.empty-state-sub { font-size: var(--fs-sm); color: var(--color-text-muted); }
.empty-state-action{ margin-top: var(--space-4); }
/* ── Status badges (legacy — keep until full migration to .status-badge) ── */
.badge {
display: inline-block; font-size: var(--fs-xs); padding: 2px 7px;
border-radius: var(--space-1); font-weight: var(--fw-medium); white-space: nowrap; /* TODO tokens: 7px off-scale */
}
.badge-green, .badge-accepted { background: #dcfce7; color: #16a34a; }
.badge-red, .badge-rejected { background: #fee2e2; color: #dc2626; }
.badge-yellow { background: #fef9c3; color: #854d0e; }
.badge-blue { background: #dbeafe; color: #1e40af; }
.badge-gray, .badge-neutral { background: var(--bg-page); color: var(--text-2); border: 1px solid var(--border); }
.badge-orange { background: #ffedd5; color: #9a3412; }
html.dark .badge-green, html.dark .badge-accepted { background: rgba(74,222,128,.12); color: #4ade80; }
html.dark .badge-red, html.dark .badge-rejected { background: rgba(248,113,113,.12); color: #f87171; }
html.dark .badge-yellow { background: rgba(251,191,36,.12); color: #fbbf24; }
html.dark .badge-blue { background: rgba(147,197,253,.12); color: #93c5fd; }
/* ── Widget info tooltip ── */
.wi {
position: absolute; top: 7px; right: var(--space-2); /* TODO tokens: 7px off-scale */
width: 15px; height: 15px; border-radius: 50%; /* TODO tokens: 15px off-scale */
background: var(--border); color: var(--text-3);
font-size: var(--fs-3xs); font-weight: 800; border: none; /* TODO tokens: 9px off-scale */
cursor: pointer; line-height: 15px; text-align: center;
transition: background .12s, color .12s; padding: 0;
display: flex; align-items: center; justify-content: center;
flex-shrink: 0;
}
.wi:hover { background: var(--text-3); color: var(--bg-surface); }
.wi-tip {
visibility: hidden; opacity: 0;
position: absolute; top: 100%; right: 0; margin-top: 6px; /* TODO tokens: 6px off-scale */
background: var(--text-1); color: var(--bg-surface);
font-size: var(--fs-xs); font-weight: var(--fw-normal); line-height: 1.5;
padding: var(--space-2) var(--space-3); border-radius: var(--radius-input);
width: 200px; z-index: 200;
box-shadow: 0 4px 16px rgba(0,0,0,.15);
transition: opacity .15s; pointer-events: none;
text-transform: none; letter-spacing: 0;
}
.wi:hover .wi-tip,
.wi:focus .wi-tip { visibility: visible; opacity: 1; }
/* ── PIM/JTL source toggle — pill segmented control ── */
.src-toggle {
display: inline-flex; align-items: center; gap: 0;
background: var(--bg-page); border: 1px solid var(--border);
border-radius: var(--radius-input); padding: 2px; width: 100%;
box-sizing: border-box;
}
.src-btn {
flex: 1; font-size: var(--fs-xs); font-weight: var(--fw-semibold); padding: 5px 10px; /* TODO tokens: 5px/10px off-scale */
border-radius: var(--radius-badge); cursor: pointer; border: none;
background: transparent; color: var(--text-3);
display: inline-flex; align-items: center; justify-content: center; gap: 5px;
transition: all .12s;
font-family: inherit; outline: none; line-height: 1.2;
}
.src-btn:hover { color: var(--text-1); }
.src-btn:focus { outline: none; }
.src-btn.active { background: var(--text-1); color: var(--bg-surface); box-shadow: 0 1px 2px rgba(0,0,0,.08); }
html.dark .src-btn.active { background: #e2e8f0; color: #0f172a; }
.src-btn svg { width: 11px; height: 11px; flex-shrink: 0; } /* TODO tokens: 11px off-scale */
/* === PAGE: backups_v2_redesign === */
.bk-wrap { padding: 20px 24px; max-width: 1200px; }
.bk-page-h { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 20px; }
.bk-page-title { font-size: var(--fs-xl); font-weight: 700; color: var(--text-1); }
.bk-page-sub { font-size: var(--fs-2sm); color: var(--text-3); margin-top: 2px; }
/* KPI grid */
.bk-kpi-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 20px; }
.bk-kpi-card {
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: 10px; padding: 14px 16px; border-left-width: 3px; border-left-color: var(--border);
}
.bk-kpi-card.green { border-left-color: #10b981; }
.bk-kpi-card.yellow { border-left-color: #f59e0b; }
.bk-kpi-card.red { border-left-color: #ef4444; }
.bk-kpi-card.blue { border-left-color: #3b82f6; }
.bk-kpi-label { font-size: var(--fs-xs); color: var(--text-3); font-weight: 600; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 5px; }
.bk-kpi-val { font-size: var(--fs-2xl); font-weight: 700; color: var(--text-1); line-height: 1.1; }
.bk-kpi-sub { font-size: var(--fs-xs); color: var(--text-4); margin-top: 4px; }
/* Section card */
.bk-card {
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: var(--radius-card); overflow: hidden; margin-bottom: var(--space-4);
}
.bk-card-header {
padding: 12px 18px; border-bottom: 1px solid var(--border);
display: flex; align-items: center; justify-content: space-between;
}
.bk-card-title { font-size: var(--fs-md); font-weight: 600; color: var(--text-1); }
.bk-card-body { padding: 16px 18px; }
/* Alert banner */
.bk-alert {
background: rgba(239,68,68,.07); border: 1px solid rgba(239,68,68,.25);
color: var(--color-bad); border-radius: var(--radius-input); padding: var(--space-3) var(--space-4);
font-size: var(--fs-sm); display: flex; align-items: center; gap: var(--space-2);
margin-bottom: var(--space-4);
}
.bk-alert-warn {
background: rgba(245,158,11,.07); border: 1px solid rgba(245,158,11,.3);
color: var(--color-warn); border-radius: var(--radius-input); padding: var(--space-3) var(--space-4);
font-size: var(--fs-sm); margin-bottom: var(--space-3);
}
/* Table */
.bk-table { width: 100%; border-collapse: collapse; }
.bk-table thead tr { border-bottom: 1px solid var(--border); }
.bk-table th {
padding: 9px 14px; text-align: left; font-size: var(--fs-xs); font-weight: 600;
color: var(--text-3); text-transform: uppercase; letter-spacing: .06em;
background: var(--bg-page); white-space: nowrap;
}
.bk-table td {
padding: 10px 14px; border-bottom: 1px solid var(--border);
font-size: var(--fs-2sm); color: var(--text-1); vertical-align: middle;
}
.bk-table tbody tr:last-child td { border-bottom: none; }
.bk-table tbody tr:hover td { background: var(--nav-hover); }
.bk-table .mono { font-family: 'Courier New', monospace; font-size: var(--fs-xs); }
.bk-table .num { font-variant-numeric: tabular-nums; text-align: right; }
/* Status pills */
.pill {
display: inline-flex; align-items: center; gap: 4px;
padding: 2px 9px; border-radius: 999px;
font-size: var(--fs-xs); font-weight: 600; white-space: nowrap;
}
.pill-ok { background: rgba(16,185,129,.12); color: #059669; }
.pill-warn { background: rgba(245,158,11,.12); color: #d97706; }
.pill-err { background: rgba(239,68,68,.12); color: #dc2626; }
.pill-run { background: rgba(59,130,246,.12); color: #2563eb; }
.pill-neutral { background: var(--bg-page); color: var(--text-3); border: 1px solid var(--border); }
/* Status dot */
.st-dot {
display: inline-block; width: 8px; height: 8px;
border-radius: 50%; flex-shrink: 0; vertical-align: middle;
}
.st-dot.green { background: #10b981; }
.st-dot.yellow { background: #f59e0b; }
.st-dot.red { background: #ef4444; }
.st-dot.gray { background: var(--text-4); }
.st-dot.pulse { animation: pulse-dot 1.5s infinite; }
@keyframes pulse-dot { 0%,100%{opacity:1} 50%{opacity:.3} }
/* Form elements */
.bk-label { font-size: var(--fs-sm); font-weight: 600; display: block; margin-bottom: 4px; color: var(--text-2); }
.bk-input {
width: 100%; border: 1px solid var(--border); border-radius: 7px;
padding: 8px 12px; font-size: var(--fs-2sm); font-family: 'Courier New', monospace;
background: var(--bg-page); color: var(--text-1); outline: none;
transition: border .12s;
}
.bk-input:focus { border-color:var(--text-4); }
.bk-btn {
padding: 8px 18px; border-radius: 7px; font-size: var(--fs-2sm); font-weight: 600;
border: 1px solid var(--border); background: var(--bg-surface); color: var(--text-2);
cursor: pointer; transition: all .12s; display: inline-flex; align-items: center; gap: 6px;
}
.bk-btn:hover { background: var(--nav-hover); color: var(--text-1); }
.bk-btn-primary { background: #1e293b; color: #fff; border-color:var(--text-1); }
.bk-btn-primary:hover { background: #0f172a; }
html.dark .bk-btn-primary { background: #e2e8f0; color: #111827; border-color: #e2e8f0; }
html.dark .bk-btn-primary:hover { background: #f1f5f9; }
.bk-btn-danger { background: #ef4444; color: #fff; border-color: #ef4444; }
.bk-btn-danger:hover { background: #dc2626; }
/* === PAGE: gls_audit_dashboard_v2_redesign === */
.ga-page { padding: 24px; max-width: 1400px; }
.ga-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
margin-bottom: 16px;
}
.ga-card-header {
padding: 12px 16px;
border-bottom: 1px solid var(--border);
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
flex-wrap: wrap;
}
/* KPI grid */
.ga-kpi-grid {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 12px;
margin-bottom: 20px;
}
@media (max-width: 1100px) { .ga-kpi-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px) { .ga-kpi-grid { grid-template-columns: repeat(2, 1fr); } }
.ga-kpi-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
padding: 14px 16px;
border-left: 3px solid var(--border);
cursor: default;
transition: box-shadow .15s;
}
.ga-kpi-card.clickable { cursor: pointer; }
.ga-kpi-card.clickable:hover { box-shadow: 0 2px 12px rgba(0,0,0,.08); }
.ga-kpi-card.red { border-left-color: #ef4444; }
.ga-kpi-card.yellow { border-left-color: #f59e0b; }
.ga-kpi-card.blue { border-left-color: #3b82f6; }
.ga-kpi-label { font-size: var(--fs-xs); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--text-3); margin-bottom: 6px; }
.ga-kpi-val { font-size: var(--fs-section); font-weight: 700; color: var(--text-1); font-variant-numeric: tabular-nums; line-height: 1; }
.ga-kpi-sub { font-size: var(--fs-xs); color: var(--text-4); margin-top: 4px; }
.ga-kpi-card.red .ga-kpi-val { color: #ef4444; }
.ga-kpi-card.yellow .ga-kpi-val { color: #f59e0b; }
.ga-kpi-card.blue .ga-kpi-val { color: #3b82f6; }
/* Buttons */
.ga-btn {
padding: 7px 14px; font-size: var(--fs-2sm); font-weight: 500;
border: 1px solid var(--border); border-radius: 7px;
background: var(--bg-surface); color: var(--text-2);
cursor: pointer; transition: all .12s; white-space: nowrap;
}
.ga-btn:hover { background: var(--bg-page); }
.ga-btn-primary {
background: #1e293b; border-color:var(--text-1); color: #f8fafc;
}
.ga-btn-primary:hover { background: #0f172a; border-color: #0f172a; }
html.dark .ga-btn-primary { background: #334155; border-color: #475569; }
.ga-btn-success {
background: #10b981; border-color: #10b981; color: #fff;
}
.ga-btn-success:hover { background: #059669; }
/* Table */
.ga-table { width: 100%; border-collapse: collapse; font-size: var(--fs-2sm); }
.ga-table thead th {
padding: 9px 13px;
text-align: left; font-size: var(--fs-xs); font-weight: 600; text-transform: uppercase; letter-spacing: .06em;
color: var(--text-3); background: var(--bg-page);
border-bottom: 1px solid var(--border); white-space: nowrap;
}
.ga-table tbody td {
padding: 11px 13px; border-bottom: 1px solid var(--border);
vertical-align: middle; color: var(--text-2);
}
.ga-table tbody tr:last-child td { border-bottom: none; }
.ga-table tbody tr:hover td { background: var(--bg-page); }
.ga-table td.mono { font-family: 'SFMono-Regular', Consolas, monospace; font-size: var(--fs-xs); color: var(--text-2); }
.ga-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
/* Banner */
.ga-info-banner {
margin-bottom: 16px; padding: 10px 14px;
background: #eff6ff; border: 1px solid #bfdbfe; border-radius: 8px;
font-size: var(--fs-2sm); color: #1e40af;
}
html.dark .ga-info-banner { background: rgba(59,130,246,.08); border-color: rgba(59,130,246,.2); color: #93c5fd; }
.ga-warn-banner {
margin-bottom: 16px; padding: 10px 14px;
background: #fffbeb; border: 1px solid #fde68a; border-radius: 8px;
font-size: var(--fs-2sm); color: #92400e;
}
html.dark .ga-warn-banner { background: rgba(245,158,11,.08); border-color: rgba(245,158,11,.25); color: #fbbf24; }
.ga-link { color: #3b82f6; text-decoration: none; }
.ga-link:hover { text-decoration: underline; }
html.dark .ga-link { color: #60a5fa; }
/* Dispute section */
.ga-dispute-section {
background: var(--bg-surface);
border: 1px solid #bfdbfe;
border-radius: 10px;
padding: 16px;
margin-bottom: 16px;
}
html.dark .ga-dispute-section { border-color: rgba(59,130,246,.2); }
/* === PAGE: kaufland_mapping_v2_redesign === */
/* page-specific: full-height split panel */
body { overflow: hidden; }
/* ─── THEMES ─── */
/* ── page-local theme tokens (additive over layout_v3) ── */
:root {
--bg-hover: #f1f5f9;
--border-strong: #cbd5e1;
--accent-soft: rgba(30,41,59,.08);
--success: #1B7A3E; --success-soft: rgba(27,122,62,.08);
--warn: #B45309; --warn-soft: rgba(180,83,9,.08);
--danger: #E01C1C; --danger-soft: rgba(224,28,28,.08);
--kl-red: #E01C1C;
--shadow: 0 8px 24px rgba(0,0,0,.08);
}
html.dark {
--bg-hover: #1f2937;
--border-strong: #374151;
--accent-soft: rgba(245,158,11,.12);
--success: #10B981; --success-soft: rgba(16,185,129,.12);
--warn: #F59E0B; --warn-soft: rgba(245,158,11,.12);
--danger: #EF4444; --danger-soft: rgba(239,68,68,.12);
--kl-red: #EF4444;
--shadow: 0 8px 24px rgba(0,0,0,.4);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; background: var(--bg-page); color: #1e293b; font-size: var(--fs-md); overflow: hidden; transition: background .25s, color .25s; }
button, input, textarea, select { font-family: inherit; font-size: inherit; color: inherit; }
/* ─── MASTHEAD ─── */
.mh { height: 52px; flex-shrink: 0; display: flex; align-items: center; padding: 0 20px; gap: 16px; background: var(--bg-surface); border-bottom: 1px solid var(--border); }
.brand { font-weight: 700; font-size: var(--fs-lg); letter-spacing: -0.3px; }
.brand .v { font-family: 'Inter', sans-serif; font-size: var(--fs-2xs); color: #6b7280; margin-left: 5px; }
.mh-sep { width: 1px; height: 18px; background: var(--border); }
.mh-nav { display: flex; align-items: stretch; gap: 0; flex: 1; }
.mh-nav-a { display: flex; align-items: center; gap: 5px; padding: 0 12px; cursor: pointer; font-size: var(--fs-sm); font-weight: 500; color: #374151; border-bottom: 2px solid transparent; margin-bottom: -1px; transition: all .12s; font-family: 'Inter', sans-serif; text-decoration: none; }
.mh-nav-a:hover { color: #1e293b; }
.mh-nav-a.act { color: var(--kl-red); border-bottom-color: var(--kl-red); font-weight: 700; }
.mh-right { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.lang-sw { display: flex; border: 1px solid var(--border); border-radius: 5px; overflow: hidden; }
.lang-sw button { background: var(--bg-surface); color: #374151; border: none; padding: 5px 10px; font-family: 'Inter', sans-serif; font-size: var(--fs-2xs); cursor: pointer; transition: all .12s; font-weight: 500; }
.lang-sw button + button { border-left: 1px solid var(--border); }
.lang-sw button:hover { background: var(--bg-hover); color: #1e293b; }
.lang-sw button.act { background: #1e293b; color: var(--bg-page); }
.theme-tg { width: 30px; height: 30px; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 5px; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: var(--fs-md); transition: all .12s; }
.theme-tg:hover { background: var(--bg-hover); border-color: var(--border-strong); }
.btn { background: var(--bg-surface); color: #1e293b; border: 1px solid var(--border); padding: 6px 12px; border-radius: 5px; cursor: pointer; font-family: 'Inter', sans-serif; font-size: var(--fs-2xs); font-weight: 600; letter-spacing: .3px; transition: all .12s; text-transform: uppercase; text-decoration: none; display: inline-flex; align-items: center; gap: 5px; }
.btn:hover { background: var(--bg-hover); border-color: var(--border-strong); }
.btn.primary { background: var(--kl-red); color: white; border-color: var(--kl-red); }
.btn.primary:hover { filter: brightness(1.1); }
/* ─── SUB-HEADER ─── */
.sh { padding: 12px 20px; background: var(--bg-surface); border-bottom: 1px solid var(--border); display: flex; gap: 16px; align-items: center; flex-shrink: 0; }
.sh-title { font-size: var(--fs-1lg); font-weight: 700; letter-spacing: -0.3px; display: flex; align-items: center; gap: 8px; }
.sh-badge { font-family: 'Inter', sans-serif; font-size: var(--fs-3xs); font-weight: 700; padding: 2px 7px; border-radius: 3px; text-transform: uppercase; }
.sh-badge.kl { background: var(--kl-red); color: white; }
/* ─── TABS ─── */
.tabs { display: flex; align-items: stretch; border-bottom: 1px solid var(--border); padding: 0 20px; background: var(--bg-surface); flex-shrink: 0; }
.tab { display: flex; align-items: center; gap: 6px; padding: 10px 14px; cursor: pointer; font-family: 'Inter', sans-serif; font-size: var(--fs-2xs); font-weight: 600; letter-spacing: .5px; color: #374151; border-bottom: 3px solid transparent; margin-bottom: -1px; text-transform: uppercase; transition: all .12s; text-decoration: none; }
.tab:hover { color: #1e293b; }
.tab.act { color: var(--kl-red); border-bottom-color: var(--kl-red); font-weight: 700; }
.tab-count { font-family: 'Inter', sans-serif; font-size: var(--fs-4xs); background: var(--bg-surface); color: #6b7280; padding: 1px 5px; border-radius: 2px; }
/* ─── SHELL ─── */
.shell { height: 100vh; display: flex; flex-direction: column; }
.body { flex: 1; overflow-y: auto; background: var(--bg-page); padding: 16px 20px; }
.body::-webkit-scrollbar { width: 5px; }
.body::-webkit-scrollbar-thumb { background: var(--border); }
/* ─── CARD ─── */
.card { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 8px; overflow: hidden; margin-bottom: 12px; }
.card-head { padding: 12px 16px; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.card-body { padding: 14px 16px; }
/* ─── TABLE ─── */
.tbl-wrap { overflow-x: auto; }
table.tbl { width: 100%; border-collapse: collapse; }
table.tbl th { background: var(--bg-surface); color: #6b7280; font-family: 'Inter', sans-serif; font-size: var(--fs-3xs); font-weight: 700; letter-spacing: .8px; text-transform: uppercase; padding: 7px 10px; text-align: left; border-bottom: 1px solid var(--border); white-space: nowrap; cursor: pointer; }
table.tbl th:hover { color: #1e293b; }
table.tbl td { padding: 7px 10px; border-bottom: 1px solid var(--border); vertical-align: middle; font-size: var(--fs-sm); }
table.tbl tr:last-child td { border-bottom: none; }
table.tbl tr:hover td { background: var(--bg-hover); }
.td-mono { font-family: 'Inter', sans-serif; font-size: var(--fs-2xs); color: #6b7280; }
/* ─── PILLS ─── */
.pill { display: inline-flex; align-items: center; font-family: 'Inter', sans-serif; font-size: var(--fs-3xs); font-weight: 700; padding: 2px 7px; border-radius: 3px; text-transform: uppercase; white-space: nowrap; }
.pill-red { background: var(--danger-soft); color: var(--danger); }
.pill-green { background: var(--success-soft); color: var(--success); }
.pill-amber { background: var(--warn-soft); color: var(--warn); }
.pill-blue { background: var(--accent-soft); color: #1e293b; }
.pill-slate { background: var(--bg-surface); color: #6b7280; }
.pill-violet { background: rgba(139,92,246,.1); color: #7C3AED; }
/* ─── PROGRESS ─── */
.prog { height: 5px; background: var(--bg-surface); border-radius: 3px; overflow: hidden; width: 100%; min-width: 80px; }
.prog-fill { height: 100%; border-radius: 3px; transition: width .3s; }
.prog-green { background: var(--success); }
.prog-amber { background: var(--warn); }
.prog-slate { background: #6b7280; }
/* ─── STATS GRID ─── */
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 12px; }
.stat-card { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 6px; padding: 12px 14px; }
.stat-label { font-family: 'Inter', sans-serif; font-size: var(--fs-3xs); letter-spacing: .8px; text-transform: uppercase; color: #6b7280; margin-bottom: 6px; }
.stat-val { font-size: var(--fs-section); font-weight: 700; letter-spacing: -0.5px; }
.stat-sub { font-family: 'Inter', sans-serif; font-size: var(--fs-3xs); color: #6b7280; margin-top: 3px; }
/* ─── MODAL ─── */
.modal-bg { position: fixed; inset: 0; background: rgba(0,0,0,.5); display: none; align-items: center; justify-content: center; z-index: 200; backdrop-filter: blur(4px); }
.modal-bg.open { display: flex; }
.modal { background: var(--bg-surface); border: 1px solid var(--border-strong); border-radius: 8px; max-width: 780px; width: 90vw; max-height: 85vh; box-shadow: var(--shadow); display: flex; flex-direction: column; }
.modal.modal-md { max-width: var(--modal-md-w, 540px); }
.modal-head { padding: 14px 18px; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 10px; }
.modal-h { font-size: var(--fs-md); font-weight: 700; flex: 1; }
.modal-close { background: none; border: 1px solid var(--border); padding: 4px 8px; border-radius: 4px; cursor: pointer; font-size: var(--fs-md); color: #374151; }
.modal-close:hover { background: var(--bg-hover); color: #1e293b; }
.modal-body { flex: 1; overflow-y: auto; display: flex; gap: 0; }
.modal-pane { flex: 1; display: flex; flex-direction: column; border-right: 1px solid var(--border); }
.modal-pane:last-child { border-right: none; }
.modal-pane-h { padding: 10px 14px 8px; font-family: 'Inter', sans-serif; font-size: var(--fs-3xs); letter-spacing: 1px; text-transform: uppercase; color: #6b7280; flex-shrink: 0; }
.modal-pane-search { padding: 0 14px 10px; flex-shrink: 0; }
.modal-pane-search input { width: 100%; background: var(--bg-page); border: 1.5px solid var(--border); border-radius: 5px; padding: 7px 10px; font-size: var(--fs-sm); outline: none; }
.modal-pane-search input:focus { border-color: #1e293b; }
.modal-pane-list { flex: 1; overflow-y: auto; padding: 0 8px 10px; }
.modal-foot { padding: 12px 18px; border-top: 1px solid var(--border); display: flex; align-items: center; gap: 10px; }
.kfl-item { border: 1px solid transparent; }
/* ─── ROW ACTIONS (hidden until hover) ─── */
.row-actions { opacity: 0; transition: opacity .12s; }
tr:hover .row-actions { opacity: 1; }
/* ─── EMPTY STATE ─── */
.empty { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 50px 20px; color: #6b7280; text-align: center; }
.empty-ic { font-size: var(--fs-hero); margin-bottom: 12px; }
.empty-t { font-size: var(--fs-md); font-weight: 600; color: #374151; margin-bottom: 6px; }
/* ─── STATUSBAR ─── */
.sb { height: 22px; background: #1e293b; color: rgba(255,255,255,.5); display: flex; align-items: center; padding: 0 16px; gap: 18px; font-family: 'Inter', sans-serif; font-size: var(--fs-4xs); flex-shrink: 0; letter-spacing: .3px; }
html.dark .sb { background: var(--bg-surface); color: #6b7280; border-top: 1px solid var(--border); }
.sb-dot { display: inline-block; width: 4px; height: 4px; border-radius: 50%; margin-right: 5px; vertical-align: middle; background: #4ADE80; }
.sb-r { margin-left: auto; }
/* ─── SEARCH INPUT ─── */
.search-wrap { position: relative; }
.search-wrap input { background: var(--bg-page); border: 1.5px solid var(--border); border-radius: 5px; padding: 7px 32px 7px 10px; font-size: var(--fs-sm); outline: none; width: 100%; transition: border-color .15s; }
.search-wrap input:focus { border-color: #1e293b; }
.search-icon { position: absolute; right: 9px; top: 50%; transform: translateY(-50%); color: #6b7280; font-size: var(--fs-sm); pointer-events: none; }
/* ─── UNMAPPED SECTION ─── */
.unmapped-h { font-family: 'Inter', sans-serif; font-size: var(--fs-xs); font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: var(--warn); display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.unmapped-h::after { content: ''; flex: 1; height: 1px; background: var(--warn-soft); }
/* Alpine cloak */
[x-cloak] { display: none !important; }
/* === PAGE: mp_attrs_dashboard_v2_redesign === */
.attr-wrap { padding: 24px; max-width: 1400px; margin: 0 auto; }
.attr-page-h { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 24px; }
.attr-page-title { font-size: var(--fs-xl); font-weight: 700; color: var(--text-1); letter-spacing: -0.3px; }
.attr-page-sub { margin-top: 4px; font-size: var(--fs-sm); color: var(--text-3); }
.mp-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-bottom: 20px; }
.mp-card { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 10px; padding: 16px;
transition: box-shadow .12s, border-color .12s; display: block; text-decoration: none; }
.mp-card:hover { border-color: #2563eb; box-shadow: 0 4px 12px rgba(0,0,0,.06); }
.quick-links { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; margin-bottom: 20px; }
.quick-link { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 10px;
padding: 14px; display: block; transition: border-color .12s; text-decoration: none; }
.quick-link:hover { border-color: #2563eb; }
.pill-badge { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 99px; font-size: var(--fs-xs); }
.pill-amber { background: rgba(245,158,11,.12); color: #d97706; }
.hint-box { background: rgba(37,99,235,.04); border: 1px solid rgba(37,99,235,.15); border-radius: 10px; padding: 14px 16px; font-size: var(--fs-sm); color: var(--text-3); }
html.dark .hint-box { background: rgba(37,99,235,.06); border-color: rgba(37,99,235,.2); }
/* Override dashboard.css btn-primary with blue accent for this page */
/* === PAGE: pim_conflicts_v2_redesign === */
.cf-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;padding:16px 20px;margin-bottom:16px;}
.cf-label{display:block;font-size:var(--fs-xs);font-weight:600;color:var(--text-3);margin-bottom:5px;text-transform:uppercase;letter-spacing:.04em;}
.cf-input{background:var(--bg-page);border:1px solid var(--border);border-radius:7px;padding:7px 11px;font-size: var(--fs-2sm);color:var(--text-1);outline:none;transition:border-color .12s;font-family:inherit;}
.cf-input:focus{border-color:#94a3b8;}
html.dark .cf-input{background:var(--bg-sidebar);}
.cf-btn-primary{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:7px;font-size: var(--fs-2sm);font-weight:600;cursor:pointer;border:1px solid #334155;background:#1e293b;color:#f8fafc;transition:background .12s;}
.cf-btn-primary:hover{background:#0f172a;}
html.dark .cf-btn-primary{background:#334155;border-color:#475569;color:#f1f5f9;}
.cf-btn-ghost{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:7px;font-size: var(--fs-2sm);font-weight:500;cursor:pointer;border:1px solid var(--border);background:var(--bg-surface);color:var(--text-2);transition:background .12s;text-decoration:none;}
.cf-btn-ghost:hover{background:var(--bg-page);}
/* Diff table */
.cf-tbl{width:100%;border-collapse:collapse;font-size:var(--fs-sm);}
.cf-tbl th{padding:8px 12px;text-align:left;font-size:var(--fs-xs);font-weight:700;color:var(--text-4);text-transform:uppercase;letter-spacing:.06em;background:var(--bg-page);border-bottom:1px solid var(--border);}
html.dark .cf-tbl th{background:#1e293b;border-color:#334155;}
.cf-tbl td{padding:9px 12px;border-bottom:1px solid var(--border);vertical-align:top;}
html.dark .cf-tbl td{border-color:#1f2937;}
.cf-tbl tr:hover td{background:var(--bg-page);}
html.dark .cf-tbl tr:hover td{background:#111827;}
.cf-badge-trans{display:inline-flex;align-items:center;padding:2px 7px;border-radius:4px;font-size: var(--fs-2xs);font-weight:600;background:rgba(239,68,68,.1);color:#ef4444;border:1px solid #ef4444;}
.cf-badge-attr{display:inline-flex;align-items:center;padding:2px 7px;border-radius:4px;font-size: var(--fs-2xs);font-weight:600;background:rgba(245,158,11,.1);color:#f59e0b;border:1px solid #f59e0b;}
.cf-cell-jtl-old{background:rgba(241,245,249,.5);}
html.dark .cf-cell-jtl-old{background:rgba(30,41,59,.4);}
.cf-cell-jtl-new{background:rgba(245,158,11,.04);}
/* === PAGE: amazon_listings_v2_redesign === */
[x-cloak] { display: none !important; }
.section-card { background:var(--bg-surface); border:1px solid var(--border); border-radius:10px; padding:18px; margin-bottom:16px; }
.tab-bar { display:flex; gap:0; border-bottom:1px solid var(--border); margin-bottom:16px; }
.tab-btn { padding:8px 16px; cursor:pointer; border:none; background:none; font-size:var(--fs-sm); font-weight:600; text-transform:uppercase; letter-spacing:.04em; color:var(--text-3); border-bottom:2px solid transparent; margin-bottom:-1px; transition:all .12s; }
.tab-btn.act { color:var(--text-1); border-bottom-color:var(--text-1); }
.tab-btn:hover { color:var(--text-2); }
/* === PAGE: amazon_listing_v2_redesign === */
.two-panel{display:grid;grid-template-columns:300px 1fr;gap:16px;min-height:70vh;}
@media(max-width:700px){.two-panel{grid-template-columns:1fr;}}
.tree-panel{background:var(--bg-surface);border:1px solid var(--border);border-radius:8px;
overflow-y:auto;max-height:80vh;}
.tree-header{padding:10px 12px;border-bottom:1px solid var(--border);font-size:var(--fs-xs);
text-transform:uppercase;letter-spacing:.5px;color:var(--text-3);
position:sticky;top:0;background:var(--bg-surface);z-index:1;}
.tree-search{padding:6px 12px;border-bottom:1px solid var(--border);position:sticky;top:30px;background:var(--bg-surface);}
.tree-search input{width:100%;background:var(--bg-surface);border:1px solid var(--border);
border-radius:var(--r-sm);padding:5px 8px;font-size:var(--fs-xs);color:var(--text-1);}
.tree-node{display:flex;align-items:center;gap:6px;padding:4px 8px;cursor:pointer;font-size:var(--fs-xs);}
.tree-node:hover{background:var(--bg-surface);}
.tree-node.active{background:color-mix(in srgb,var(--text-1) 10%,var(--bg-surface));color:var(--text-1);}
.tree-node.mapped .node-name{font-weight:600;}
.node-count{font-size:var(--fs-xs);margin-left:auto;color:var(--text-3);}
.node-count.has-active{color:var(--success);}
.detail-panel{background:var(--bg-surface);border:1px solid var(--border);border-radius:8px;overflow:hidden;display:flex;flex-direction:column;}
.mp-filter-btn{font-size:var(--fs-xs);padding:3px 8px;border-radius:4px;
border:1px solid var(--border);background:var(--bg-surface);cursor:pointer;color:var(--text-2);transition:all .1s;}
.mp-filter-btn.active{background:var(--text-1);color:#fff;border-color:var(--text-1);}
/* === PAGE: amazon_orphans_v2_redesign === */
.fba-badge{font-size:var(--fs-xs);padding:2px 7px;border-radius:3px;
background:color-mix(in srgb,var(--text-1) 12%,transparent);color:var(--text-1);font-weight:600;}
.thumb{width:32px;height:32px;object-fit:contain;border-radius:4px;border:1px solid var(--border);}
.filter-form{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;}
.filter-group{display:flex;flex-direction:column;gap:4px;}
/* canonical filter-label — единый вид меток фильтров на всех страницах */
.filter-label{font-size:var(--fs-xs);font-weight:var(--fw-semibold);color:var(--text-3);text-transform:uppercase;letter-spacing:.06em;}
.filter-input{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);
padding:6px 10px;font-size:var(--fs-sm);color:var(--text-1);min-width:200px;}
.filter-input:focus{outline:none;border-color:var(--text-1);}
.pager{display:flex;align-items:center;justify-content:space-between;margin-top:14px;flex-wrap:wrap;gap:8px;}
.pager-info{font-size:var(--fs-xs);color:var(--text-3);}
.pager-btns{display:flex;gap:6px;}
.pager-btn{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);
padding:5px 12px;font-size:var(--fs-xs);cursor:pointer;text-decoration:none;color:var(--text-2);}
/* === PAGE: amazon_sales_traffic_v2_redesign === */
.filter-row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:16px;}
.filter-row select{background:var(--bg-surface);border:1px solid var(--border);
border-radius:var(--r-sm);padding:6px 10px;font-size:var(--fs-sm);color:var(--text-1);}
/* === PAGE: amazon_dashboard_v2_redesign === */
.td-good { color:#16a34a; font-weight:600; }
.td-bad { color:#dc2626; font-weight:600; }
html.dark .td-good { color:#4ade80; }
html.dark .td-bad { color:#f87171; }
/* === PAGE: api_status_v2_redesign === */
/* ── KPI grid ── */
.as-kpi-grid {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 12px;
margin-bottom: 20px;
}
.as-kpi-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
padding: 14px 16px;
border-left-width: 3px;
}
.as-kpi-card.green { border-left-color: #10b981; }
.as-kpi-card.yellow { border-left-color: #f59e0b; }
.as-kpi-card.red { border-left-color: #ef4444; }
.as-kpi-card.gray { border-left-color: var(--border); }
.as-kpi-card.blue { border-left-color: #3b82f6; }
.as-kpi-label { font-size: var(--fs-xs); color: var(--text-3); font-weight: 500; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 5px; }
.as-kpi-val { font-size: var(--fs-2xl); font-weight: 700; color: var(--text-1); line-height: 1; }
/* ── MP summary cards ── */
.as-mp-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(152px, 1fr));
gap: 8px;
margin-bottom: 24px;
}
.as-mp-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 8px;
padding: 10px 14px;
border-left-width: 3px;
text-decoration: none;
display: block;
transition: box-shadow .12s, background .1s;
}
.as-mp-card:hover { box-shadow: 0 2px 8px rgba(0,0,0,.08); background: var(--nav-hover); }
.as-mp-card.ok { border-left-color: #10b981; }
.as-mp-card.warn { border-left-color: #f59e0b; }
.as-mp-card.bad { border-left-color: #ef4444; }
.as-mp-card.grey { border-left-color: var(--border); }
.as-mp-name { font-size: var(--fs-xs); font-weight: 700; color: var(--text-2); text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: .04em; }
.as-mp-counts { font-size: var(--fs-2sm); margin-top: 5px; font-variant-numeric: tabular-nums; }
/* ── Status ── */
.st-ok { color: #10b981; font-weight: 600; }
.st-part { color: #f59e0b; font-weight: 600; }
.st-bad { color: #ef4444; font-weight: 600; }
.st-skip { color: var(--text-4); }
/* ── Status dot (pulsing for live) ── */
.st-dot {
display: inline-block; width: 8px; height: 8px;
border-radius: 50%; flex-shrink: 0; vertical-align: middle;
}
.st-dot.green { background: #10b981; }
.st-dot.yellow { background: #f59e0b; }
.st-dot.red { background: #ef4444; }
.st-dot.gray { background: var(--text-4); }
.st-dot.pulse { animation: pls 1.5s infinite; }
@keyframes pls { 0%,100%{opacity:1} 50%{opacity:.3} }
/* ── Section card ── */
.as-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
margin-bottom: 16px;
}
.as-card-header {
padding: 12px 18px;
border-bottom: 1px solid var(--border);
display: flex;
align-items: center;
justify-content: space-between;
}
.as-card-title { font-size: var(--fs-md); font-weight: 600; color: var(--text-1); }
/* ── Table ── */
.as-table { width: 100%; border-collapse: collapse; }
.as-table thead tr { border-bottom: 1px solid var(--border); }
.as-table th {
padding: 9px 14px;
text-align: left;
font-size: var(--fs-xs);
font-weight: 600;
color: var(--text-3);
text-transform: uppercase;
letter-spacing: .06em;
background: var(--bg-page);
white-space: nowrap;
}
.as-table td {
padding: 11px 14px;
border-bottom: 1px solid var(--border);
font-size: var(--fs-2sm);
color: var(--text-1);
vertical-align: middle;
}
.as-table tbody tr:last-child td { border-bottom: none; }
.as-table tbody tr:hover td { background: var(--nav-hover); }
.as-table .mono { font-family: 'Courier New', monospace; font-size: var(--fs-sm); }
.as-table .num { font-variant-numeric: tabular-nums; }
.as-err-row td {
font-size: var(--fs-xs);
font-family: 'Courier New', monospace;
color: #ef4444;
word-break: break-all;
padding: 6px 14px;
background: rgba(239,68,68,.04);
border-top: 1px solid rgba(239,68,68,.1);
}
html.dark .as-err-row td { background: rgba(239,68,68,.07); }
/* ── Button ── */
.as-btn {
display: inline-flex; align-items: center; gap: 6px;
padding: 7px 14px; border-radius: 7px;
font-size: var(--fs-2sm); font-weight: 500;
border: 1px solid var(--border);
background: var(--bg-surface);
color: var(--text-1);
cursor: pointer;
transition: background .1s, border-color .1s;
}
.as-btn:hover { background: var(--nav-hover); border-color: var(--text-4); }
.as-btn-primary {
background: #111827; color: #fff; border-color: #111827;
}
.as-btn-primary:hover { background: #1f2937; border-color: #1f2937; }
html.dark .as-btn-primary { background: #e5e7eb; color: #111827; border-color: #e5e7eb; }
html.dark .as-btn-primary:hover { background: #f9fafb; }
.as-btn-sm { padding: 5px 10px; font-size: var(--fs-sm); }
.as-btn-ghost {
background: transparent; color: var(--text-2); border-color: var(--border);
}
.as-btn-ghost:hover { background: var(--nav-hover); color: var(--text-1); }
.as-btn-creds {
padding: 3px 10px; font-size: var(--fs-xs); font-weight: 500;
background: transparent; border: 1px solid var(--border);
color: var(--text-3); border-radius: var(--radius-badge); cursor: pointer;
transition: background .1s, color .1s;
}
.as-btn-creds:hover { background: var(--nav-hover); color: var(--text-1); }
/* ── Page wrapper ── */
.as-page { padding: var(--space-6); }
/* ── as-blocker-doc (no inline style) ── */
.as-blocker-doc { color: var(--text-3); }
/* ══════════════════════════════════════════
CREDENTIALS MODAL (api-status inline)
══════════════════════════════════════════ */
.as-modal-overlay {
position: fixed; inset: 0; z-index: 1000;
background: rgba(0,0,0,.45);
display: flex; align-items: center; justify-content: center;
padding: var(--space-4);
}
.as-modal {
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: var(--radius-card); width: 100%; max-width: 640px;
max-height: 88vh; display: flex; flex-direction: column;
box-shadow: 0 20px 60px rgba(0,0,0,.25);
}
html.dark .as-modal { box-shadow: 0 20px 60px rgba(0,0,0,.6); }
.as-modal-head {
display: flex; align-items: center; justify-content: space-between;
padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--border);
flex-shrink: 0;
}
.as-modal-title {
font-size: var(--fs-md); font-weight: 600; color: var(--text-1);
display: flex; align-items: center; gap: var(--space-2);
}
.as-modal-mp {
font-size: var(--fs-sm); font-weight: 400; color: var(--text-3);
background: var(--bg-muted); padding: 2px 8px; border-radius: var(--radius-xs);
}
.as-modal-close {
background: none; border: none; cursor: pointer;
font-size: var(--fs-lg); color: var(--text-3); padding: 4px 8px;
border-radius: var(--radius-xs);
}
.as-modal-close:hover { background: var(--nav-hover); color: var(--text-1); }
.as-modal-body {
overflow-y: auto; padding: var(--space-4) var(--space-5);
flex: 1;
}
.as-modal-foot {
display: flex; align-items: center; justify-content: space-between;
padding: var(--space-3) var(--space-5); border-top: 1px solid var(--border);
gap: var(--space-3); flex-shrink: 0;
}
.as-modal-foot-l { display: flex; gap: var(--space-2); }
.as-modal-foot-r { display: flex; gap: var(--space-2); }
.as-modal-loading { color: var(--text-3); font-size: var(--fs-sm); text-align: center; padding: var(--space-6) 0; }
.as-modal-error { color: var(--color-bad); font-size: var(--fs-sm); padding: var(--space-4) 0; }
.as-modal-empty { color: var(--text-3); font-size: var(--fs-sm); padding: var(--space-3) 0; }
/* Creds list */
.as-creds-list { display: flex; flex-direction: column; gap: var(--space-3); }
.as-cred-row { display: flex; flex-direction: column; gap: var(--space-1); }
.as-cred-label {
font-size: var(--fs-sm); font-weight: 600; color: var(--text-2);
display: flex; align-items: center; gap: var(--space-1);
}
.as-cred-req { color: var(--color-bad); font-size: var(--fs-xs); }
.as-cred-input-wrap { display: flex; align-items: center; gap: var(--space-2); }
.as-cred-input {
flex: 1; padding: 7px 10px; border-radius: var(--radius-badge);
border: 1px solid var(--border); background: var(--bg-muted);
color: var(--text-1); font-size: var(--fs-sm); font-family: monospace;
}
.as-cred-input:focus { outline: 2px solid var(--color-accent); border-color: var(--color-accent); }
.as-cred-hint {
font-size: var(--fs-xs); color: var(--text-4); font-family: monospace;
white-space: nowrap;
}
.as-cred-desc {
font-size: var(--fs-xs); color: var(--text-4); padding-left: 2px;
}
/* Expiry badges in creds modal */
.as-expiry-badge {
display: inline-flex; align-items: center; padding: 1px 7px;
border-radius: var(--radius-badge); font-size: var(--fs-xs); font-weight: 600;
margin-left: var(--space-2); white-space: nowrap;
}
.as-expiry-ok { background: rgba(16,185,129,.1); color: var(--color-good); border: 1px solid rgba(16,185,129,.25); }
.as-expiry-warn-soft { background: rgba(245,158,11,.1); color: var(--color-warn); border: 1px solid rgba(245,158,11,.25); }
.as-expiry-warn { background: rgba(245,158,11,.18); color: var(--color-warn); border: 1px solid rgba(245,158,11,.45); font-weight: 700; }
.as-expiry-bad { background: rgba(239,68,68,.1); color: var(--color-bad); border: 1px solid rgba(239,68,68,.3); }
/* Banner */
.as-modal-banner {
margin-top: var(--space-3); padding: var(--space-2) var(--space-3);
border-radius: var(--radius-badge); font-size: var(--fs-sm);
}
.as-banner-ok { background: rgba(16,185,129,.08); color: var(--color-good); border: 1px solid rgba(16,185,129,.25); }
.as-banner-err { background: rgba(239,68,68,.07); color: var(--color-bad); border: 1px solid rgba(239,68,68,.2); }
html.dark .as-banner-ok { background: rgba(16,185,129,.12); color: var(--color-good); }
html.dark .as-banner-err { background: rgba(239,68,68,.12); color: var(--color-bad); }
/* Modal transitions */
.as-modal-enter { transition: opacity .15s; }
.as-modal-enter-start { opacity: 0; }
.as-modal-enter-end { opacity: 1; }
.as-modal-leave { transition: opacity .1s; }
.as-modal-leave-start { opacity: 1; }
.as-modal-leave-end { opacity: 0; }
.as-inline-form { display: inline; }
/* Cred meta row: expiry date + clear checkbox (объединение vault → api-status) */
.as-cred-meta-row {
display: flex; align-items: center; gap: var(--space-4);
flex-wrap: wrap; padding-left: 2px;
}
.as-cred-exp-label, .as-cred-clear {
display: inline-flex; align-items: center; gap: var(--space-1);
font-size: var(--fs-xs); color: var(--text-4); cursor: pointer;
}
.as-cred-exp {
font-size: var(--fs-xs); padding: 2px var(--space-2);
border: 1px solid var(--border); border-radius: var(--radius-badge);
background: var(--bg-muted); color: var(--text-2);
}
.as-cred-clear input { accent-color: var(--color-bad); }
/* Page-level feedback banner (save/test/oauth результат) */
.as-feedback-banner {
margin-bottom: var(--space-3); padding: var(--space-3) var(--space-4);
border-radius: var(--radius-badge); font-size: var(--fs-sm);
background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-1);
}
.as-fb-ok { background: rgba(16,185,129,.08); color: var(--color-good); border-color: rgba(16,185,129,.25); }
.as-fb-bad { background: rgba(239,68,68,.07); color: var(--color-bad); border-color: rgba(239,68,68,.2); }
html.dark .as-fb-ok { background: rgba(16,185,129,.12); }
html.dark .as-fb-bad { background: rgba(239,68,68,.12); }
/* === PAGE: credential_health_v2_redesign === */
.ch-wrap { padding: 20px 24px; max-width: 1300px; }
.ch-page-h { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 16px; }
.ch-page-title { font-size: var(--fs-xl); font-weight: 700; color: var(--text-1); }
.ch-page-sub { font-size: var(--fs-2sm); color: var(--text-3); margin-top: 2px; }
/* KPI grid */
.ch-kpi-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 20px; }
.ch-kpi-card {
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: 10px; padding: 14px 16px; border-left-width: 3px; border-left-color: var(--border);
}
.ch-kpi-card.green { border-left-color: #10b981; }
.ch-kpi-card.yellow { border-left-color: #f59e0b; }
.ch-kpi-card.red { border-left-color: #ef4444; }
.ch-kpi-card.blue { border-left-color: #3b82f6; }
.ch-kpi-label { font-size: var(--fs-xs); color: var(--text-3); font-weight: 600; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 5px; }
.ch-kpi-val { font-size: var(--fs-2xl); font-weight: 700; color: var(--text-1); line-height: 1.1; }
.ch-kpi-sub { font-size: var(--fs-xs); color: var(--text-4); margin-top: 4px; }
/* Alert banners */
.ch-alert {
padding: 10px 14px; border-radius: 8px; margin-bottom: 8px;
font-size: var(--fs-2sm); display: flex; align-items: center; gap: 8px;
}
.ch-alert-red { background: rgba(239,68,68,.07); border: 1px solid rgba(239,68,68,.25); color: #dc2626; }
.ch-alert-ambe { background: rgba(245,158,11,.07); border: 1px solid rgba(245,158,11,.3); color: #b45309; }
.ch-alert-yell { background: rgba(234,179,8,.07); border: 1px solid rgba(234,179,8,.3); color: #854d0e; }
/* Filter chips */
.ch-chips { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.ch-chip {
padding: 4px 14px; border-radius: 999px; border: 1px solid var(--border);
font-size: var(--fs-sm); cursor: pointer; background: var(--bg-surface);
color: var(--text-3); transition: all .15s;
}
.ch-chip:hover { background: var(--nav-hover); color: var(--text-1); }
.ch-chip.active { background: #1e293b; border-color:var(--text-1); color: #fff; }
html.dark .ch-chip.active { background: #e2e8f0; border-color: #e2e8f0; color: #111827; }
/* Card */
.ch-card {
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: 10px; overflow: hidden; margin-bottom: 16px;
}
.ch-card-header {
padding: 12px 18px; border-bottom: 1px solid var(--border);
display: flex; align-items: center; justify-content: space-between;
}
.ch-card-title { font-size: var(--fs-md); font-weight: 600; color: var(--text-1); }
/* Table */
.ch-table { width: 100%; border-collapse: collapse; }
.ch-table thead tr { border-bottom: 1px solid var(--border); }
.ch-table th {
padding: 9px 14px; text-align: left; font-size: var(--fs-xs); font-weight: 600;
color: var(--text-3); text-transform: uppercase; letter-spacing: .06em;
background: var(--bg-page); white-space: nowrap;
}
.ch-table td {
padding: 10px 14px; border-bottom: 1px solid var(--border);
font-size: var(--fs-2sm); color: var(--text-1); vertical-align: middle;
}
.ch-table tbody tr:last-child td { border-bottom: none; }
.ch-table tbody tr:hover td { background: var(--nav-hover); }
.ch-table .mono { font-family: 'Courier New', monospace; font-size: var(--fs-xs); }
/* Credential status pills */
.cred-badge {
display: inline-flex; align-items: center; gap: 4px;
padding: 2px 9px; border-radius: 999px;
font-size: var(--fs-xs); font-weight: 600; white-space: nowrap;
}
.badge-ok { background: rgba(16,185,129,.12); color: #059669; }
.badge-broken { background: rgba(245,158,11,.12); color: #d97706; }
.badge-expired { background: rgba(239,68,68,.12); color: #dc2626; }
.badge-warn { background: rgba(234,179,8,.12); color: #ca8a04; }
.badge-grey { background: var(--bg-page); color: var(--text-3); border: 1px solid var(--border); }
/* Action button */
.test-btn {
padding: 3px 10px; border-radius: 5px; font-size: var(--fs-xs); font-weight: 600;
border: 1px solid var(--border); color: var(--text-2); background: var(--bg-surface);
cursor: pointer; transition: all .12s;
}
.test-btn:hover { background: #1e293b; color: #fff; border-color:var(--text-1); }
html.dark .test-btn:hover { background: #e2e8f0; color: #111827; border-color: #e2e8f0; }
.test-btn:disabled { opacity: .4; cursor: not-allowed; }
.action-link { font-size: var(--fs-xs); color: var(--text-3); text-decoration: none; }
.action-link:hover { color: var(--text-1); text-decoration: underline; }
.hint-text { font-size: var(--fs-xs); font-family: 'Courier New', monospace; color: var(--text-3); }
/* Settings btn */
.ch-settings-btn {
padding: 7px 16px; border-radius: 7px; font-size: var(--fs-2sm); font-weight: 600;
border: 1px solid var(--border); background: var(--bg-surface); color: var(--text-2);
cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 6px;
transition: all .12s;
}
.ch-settings-btn:hover { background: var(--nav-hover); color: var(--text-1); }
/* === PAGE: gls_penalties_v2_redesign === */
.gp-page { padding: 24px; max-width: 1400px; }
.gp-kpi-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
gap: 12px;
margin-bottom: 20px;
}
.gp-kpi-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
padding: 14px 16px;
border-left: 3px solid var(--border);
}
.gp-kpi-card.danger { border-left-color: #ef4444; }
.gp-kpi-card.warn { border-left-color: #f59e0b; }
.gp-kpi-card.neutral { border-left-color: var(--border); }
.gp-kpi-label { font-size: var(--fs-2xs); font-weight: 600; text-transform: uppercase; letter-spacing: .07em; color: var(--text-3); margin-bottom: 6px; }
.gp-kpi-val { font-size: var(--fs-section); font-weight: 700; color: var(--text-1); font-variant-numeric: tabular-nums; line-height: 1; }
.gp-kpi-sub { font-size: var(--fs-xs); color: var(--text-4); margin-top: 4px; }
.gp-kpi-card.danger .gp-kpi-val { color: #ef4444; }
.gp-kpi-card.warn .gp-kpi-val { color: #f59e0b; }
.gp-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
margin-bottom: 16px;
}
.gp-card-header {
padding: 12px 16px;
border-bottom: 1px solid var(--border);
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
flex-wrap: wrap;
}
.gp-filters {
padding: 12px 16px;
border-bottom: 1px solid var(--border);
display: flex;
gap: 8px;
flex-wrap: wrap;
align-items: center;
}
.gp-input {
flex: 1; min-width: 180px;
border: 1px solid var(--border); border-radius: 7px;
padding: 8px 12px; font-size: var(--fs-2sm);
background: var(--bg-page); color: var(--text-1);
outline: none; transition: border-color .15s;
}
.gp-input:focus { border-color: #3b82f6; }
.gp-select {
border: 1px solid var(--border); border-radius: 7px;
padding: 8px 12px; font-size: var(--fs-2sm);
background: var(--bg-page); color: var(--text-1);
outline: none; cursor: pointer;
}
.gp-btn {
padding: 8px 14px; font-size: var(--fs-2sm); font-weight: 500;
border: 1px solid var(--border); border-radius: 7px;
background: var(--bg-surface); color: var(--text-2);
cursor: pointer; transition: all .12s; white-space: nowrap;
}
.gp-btn:hover { background: var(--bg-page); }
.gp-btn-primary {
background: #1e293b; border-color:var(--text-1); color: #f8fafc;
}
.gp-btn-primary:hover { background: #0f172a; border-color: #0f172a; }
html.dark .gp-btn-primary { background: #334155; border-color: #475569; }
html.dark .gp-btn-primary:hover { background: #3f4f63; }
.gp-table { width: 100%; border-collapse: collapse; font-size: var(--fs-2sm); }
.gp-table thead th {
padding: 9px 13px;
text-align: left;
font-size: var(--fs-xs); font-weight: 600; text-transform: uppercase; letter-spacing: .06em;
color: var(--text-3); background: var(--bg-page);
border-bottom: 1px solid var(--border); white-space: nowrap;
}
.gp-table tbody td {
padding: 11px 13px;
border-bottom: 1px solid var(--border);
vertical-align: middle;
color: var(--text-2);
}
.gp-table tbody tr:last-child td { border-bottom: none; }
.gp-table tbody tr:hover td { background: var(--bg-page); }
.gp-table td.mono { font-family: 'SFMono-Regular', Consolas, monospace; font-size: var(--fs-xs); color: var(--text-2); }
.gp-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
/* Status pills */
.gp-pill {
display: inline-flex; align-items: center;
font-size: var(--fs-xs); font-weight: 500;
padding: 2px 8px; border-radius: 9999px;
}
.gp-pill-danger { background: #fef2f2; color: #dc2626; }
.gp-pill-warn { background: #fffbeb; color: #d97706; }
.gp-pill-neutral { background: #f9fafb; color: var(--text-3); }
html.dark .gp-pill-danger { background: rgba(220,38,38,.12); color: #f87171; }
html.dark .gp-pill-warn { background: rgba(245,158,11,.12); color: #fbbf24; }
html.dark .gp-pill-neutral { background: rgba(255,255,255,.05); color: var(--text-4); }
.gp-link { color: #3b82f6; text-decoration: none; }
.gp-link:hover { text-decoration: underline; }
html.dark .gp-link { color: #60a5fa; }
.gp-warn-banner {
margin: 0 24px 16px;
padding: 10px 14px;
background: #fffbeb; border: 1px solid #fde68a; border-radius: 8px;
font-size: var(--fs-2sm); color: #92400e;
}
html.dark .gp-warn-banner { background: rgba(245,158,11,.08); border-color: rgba(245,158,11,.25); color: #fbbf24; }
/* === PAGE: articles_v2_redesign === */
/* ── v7 page tokens ── */
.v7-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;}
.v7-section{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;margin-bottom:16px;}
/* KPI strip */
/* Two-column layout */
.art-grid{display:grid;grid-template-columns:220px 1fr;gap:14px;}
@media(max-width:900px){.art-grid{grid-template-columns:1fr;}}
/* Sidebar */
.sb-box{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;padding:12px;
max-height:calc(100vh - 140px);overflow-y:auto;position:sticky;top:60px;}
.sb-label{font-size: var(--fs-2xs);font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-4);
padding:0 8px;margin:14px 0 4px;}
.sb-label:first-child{margin-top:0;}
.sb-link{display:flex;align-items:center;justify-content:space-between;padding:5px 8px;
border-radius:6px;font-size: var(--fs-2sm);font-weight:500;color:var(--text-3);text-decoration:none;transition:background .1s,color .1s;}
.sb-link:hover{background:var(--nav-hover);color:var(--text-1);}
.sb-link.active{background:var(--nav-active-bg);color:var(--nav-active-color);font-weight:600;}
.sb-count{font-size:var(--fs-xs);color:var(--text-4);font-variant-numeric:tabular-nums;}
/* Filters */
.filter-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;}
.f-grp{display:flex;flex-direction:column;gap:3px;}
.f-lbl{font-size:var(--fs-xs);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-3);}
.f-inp,.f-sel{padding:7px 10px;border-radius:7px;border:1px solid var(--border);background:var(--bg-surface);
color:var(--text-1);font-size: var(--fs-2sm);outline:none;transition:border .12s;}
.f-inp:focus,.f-sel:focus{border-color:#94a3b8;}
html.dark .f-inp,html.dark .f-sel{background:#1e293b;border-color:#334155;}
html.dark .btn-primary{background:#334155;border-color:#475569;color:#f1f5f9;}
html.dark .btn-ghost:hover{background:#273344;}
/* Table */
.v7-tbl{width:100%;border-collapse:collapse;font-size: var(--fs-2sm);}
.v7-tbl th{background:#f8fafc;color:#94a3b8;font-size:var(--fs-xs);font-weight:700;letter-spacing:.06em;
text-transform:uppercase;padding:8px 10px;border-bottom:1px solid var(--border);white-space:nowrap;}
html.dark .v7-tbl th{background:#1e293b;color:#64748b;border-color:#334155;}
.v7-tbl td{padding:8px 10px;border-bottom:1px solid #f1f5f9;vertical-align:middle;color:var(--text-2);}
html.dark .v7-tbl td{border-color:#1e293b;}
.v7-tbl tr:last-child td{border-bottom:none;}
.v7-tbl tr:hover td{background:#f8fafc;}
html.dark .v7-tbl tr:hover td{background:#1e293b;}
.v7-tbl td.mono{font-size:var(--fs-sm);font-variant-numeric:tabular-nums;}
.v7-tbl td.num{text-align:right;font-variant-numeric:tabular-nums;}
.sort-lnk{display:inline-flex;align-items:center;gap:3px;color:#94a3b8;text-decoration:none;
font-size:var(--fs-xs);font-weight:700;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;}
.sort-lnk:hover{color:var(--text-1);}
.variant-row td{background:#fafafa;}
html.dark .variant-row td{background:#0f172a;}
/* Pager */
.pager{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;
border-top:1px solid var(--border);flex-wrap:wrap;gap:8px;}
.pager-info{font-size:var(--fs-sm);color:var(--text-4);font-variant-numeric:tabular-nums;}
.pager-btn{padding:5px 12px;border-radius:6px;border:1px solid var(--border);background:var(--bg-surface);
font-size:var(--fs-sm);color:var(--text-2);text-decoration:none;transition:background .1s;}
.pager-btn:hover{background:var(--nav-hover);}
/* === PAGE: kaufland_orders_v2_redesign === */
/* Scrollbar */
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 4px; }
/* KPI cards: inherit from /static/css/dashboard.css (canonical) */
/* Section */
/* Table */
/* Sort links */
.sort-link {
display: flex;
align-items: center;
gap: 3px;
color: #94a3b8;
text-decoration: none;
font-size: var(--fs-xs);
font-weight: 700;
letter-spacing: .06em;
text-transform: uppercase;
}
.sort-link:hover { color: #1e293b; }
.sort-arrow { font-size: var(--fs-2xs); color: #94a3b8; }
.sort-arrow.active { color: #1e293b; }
/* Filters */
.filter-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.filter-group { display: flex; flex-direction: column; gap: 4px; }
/* .filter-label — см. canonical выше (dedup) */
.filter-input, .filter-select {
background: #fff;
border: 1px solid #e2e8f0;
border-radius: 7px;
padding: 7px 11px;
font-size: var(--fs-2sm);
color: #1e293b;
min-width: 120px;
outline: none;
transition: border .12s;
}
.filter-input:focus, .filter-select:focus { border-color: #94a3b8; }
/* Buttons */
/* Pagination */
.pager {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 14px;
flex-wrap: wrap;
gap: 8px;
}
.pager-info { font-size: var(--fs-xs); color: #94a3b8; }
.pager-btns { display: flex; gap: 4px; }
.pager-btn {
padding: 5px 12px;
border: 1px solid #e2e8f0;
border-radius: 7px;
font-size: var(--fs-sm);
color: #374151;
background: #fff;
text-decoration: none;
transition: background .1s;
}
.pager-btn:hover { background: #f8fafc; }
[x-cloak] { display: none !important; }
/* Period buttons: inherit from /static/css/dashboard.css (canonical pill) */
/* === PAGE: autofill_dashboard_v2_redesign === */
/* page-specific form helpers */
.v2-label { display:block; font-size:var(--fs-xs); color:var(--text-3); margin-bottom:3px; }
.v2-input { background:var(--bg-page); border:1px solid var(--border); border-radius:6px; padding:6px 10px; font-size: var(--fs-2sm); color:var(--text-1); }
.v2-input:focus { outline:none; border-color:#3b82f6; }
.v2-form-row { display:flex; align-items:flex-end; gap:var(--space-3); flex-wrap:wrap; }
.v2-field { display:flex; flex-direction:column; gap:var(--space-1); }
.v2-hint { font-size:var(--fs-xs); color:var(--text-3); margin-top:var(--space-1); }
/* === PAGE: logistics_hub_v2_redesign === */
/* ── Carrier cards ── */
.carrier-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 20px; }
@media (max-width: 700px) { .carrier-grid { grid-template-columns: 1fr; } }
.carrier-card {
display: block; text-decoration: none;
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: 10px; padding: 20px 22px;
transition: box-shadow .14s, border-color .14s;
}
.carrier-card:hover {
box-shadow: 0 2px 12px rgba(0,0,0,.07);
border-color: #cbd5e1;
}
html.dark .carrier-card:hover { border-color:var(--text-2); }
.carrier-card.dhl { border-left: 3px solid #facc15; }
.carrier-card.gls { border-left: 3px solid #3b82f6; }
.carrier-icon {
width: 36px; height: 36px; border-radius: 8px;
display: flex; align-items: center; justify-content: center;
font-size: var(--fs-1lg); margin-bottom: 10px;
}
.carrier-icon.dhl { background: rgba(250,204,21,.12); }
.carrier-icon.gls { background: rgba(59,130,246,.10); }
.carrier-name { font-size: var(--fs-lg); font-weight: 700; color: var(--text-1); margin-bottom: 4px; }
.carrier-meta { font-size: var(--fs-sm); color: var(--text-3); line-height: 1.6; }
.carrier-meta b { color: var(--text-1); font-weight: 600; }
.carrier-tag {
display: inline-block; margin-top: 8px;
font-size: var(--fs-xs); padding: 2px 8px; border-radius: 4px; font-weight: 500;
background: rgba(59,130,246,.08); color: #3b82f6; border: 1px solid rgba(59,130,246,.2);
}
html.dark .carrier-tag { background: rgba(59,130,246,.15); }
/* ── Section card ── */
/* ── Table ── */
/* ── Status badges ── */
.badge-draft { background: var(--bg-page); color: var(--text-3); border: 1px solid var(--border); }
.badge-submitted { background: rgba(59,130,246,.08); color: #3b82f6; border: 1px solid rgba(59,130,246,.2); }
.badge-other { background: rgba(245,158,11,.08); color: #d97706; border: 1px solid rgba(245,158,11,.2); }
html.dark .badge-accepted { color: #4ade80; background: rgba(74,222,128,.1); border-color: rgba(74,222,128,.2); }
html.dark .badge-rejected { color: #f87171; background: rgba(248,113,113,.1); border-color: rgba(248,113,113,.2); }
html.dark .badge-submitted { color: #60a5fa; background: rgba(96,165,250,.1); border-color: rgba(96,165,250,.2); }
/* === PAGE: buchalteria_v2_redesign === */
/* ── Page wrapper ── */
.buch-wrap { padding: 24px; max-width: 1100px; margin: 0 auto; }
/* ── Page header ── */
.buch-header { margin-bottom: 24px; }
.buch-title { font-size: var(--fs-xl); font-weight: 700; color: var(--text-1); letter-spacing: -0.3px; }
.buch-sub { font-size: var(--fs-sm); color: var(--text-3); margin-top: 4px; text-transform: uppercase; letter-spacing: 0.4px; font-variant-numeric: tabular-nums; }
/* ── Card ── */
.buch-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
}
/* ── Table ── */
.buch-table { width: 100%; border-collapse: collapse; font-size: var(--fs-md); }
.buch-table thead th {
background: var(--bg-page);
color: var(--text-3);
font-size: var(--fs-xs);
font-weight: 700;
letter-spacing: 0.6px;
text-transform: uppercase;
padding: 10px 16px;
text-align: left;
border-bottom: 1px solid var(--border);
}
/* dark mode handled by --bg-page token */
.buch-table tbody td {
padding: 14px 16px;
border-bottom: 1px solid var(--border);
vertical-align: middle;
color: var(--text-1);
}
.buch-table tbody tr:last-child td { border-bottom: none; }
.buch-table tbody tr:hover td { background: var(--bg-page); }
/* ── Month label ── */
.month-label { font-weight: 600; color: var(--text-1); font-variant-numeric: tabular-nums; }
/* ── Badges / pills ── */
.count-pill {
display: inline-flex; align-items: center; gap: 4px;
font-size: var(--fs-sm); font-weight: 600;
padding: 3px 10px; border-radius: 20px;
font-variant-numeric: tabular-nums;
}
.count-pill.green { background: #dcfce7; color: #15803d; }
.count-pill.blue { background: #dbeafe; color: #1d4ed8; }
html.dark .count-pill.green { background: rgba(16,185,129,.15); color: #34d399; }
html.dark .count-pill.blue { background: rgba(59,130,246,.15); color: #60a5fa; }
/* ── Action buttons ── */
.buch-btn {
display: inline-flex; align-items: center; gap: 5px;
font-size: var(--fs-sm); font-weight: 500;
padding: 4px 12px; border-radius: 6px;
background: var(--bg-surface);
border: 1px solid var(--border);
color: var(--text-2);
text-decoration: none;
transition: background .12s, border-color .12s;
cursor: pointer;
margin-left: 8px;
}
.buch-btn:hover { background: var(--bg-page); border-color: var(--border); color: var(--text-1); }
.buch-btn.primary { background: var(--text-1); color: #fff; border-color: var(--text-1); }
.buch-btn.primary:hover { opacity: .88; }
/* ── Download links ── */
.dl-links { display: inline-flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.dl-link {
display: inline-flex; align-items: center; gap: 3px;
font-size: var(--fs-xs); font-weight: 500;
padding: 3px 8px; border-radius: 5px;
background: #eff6ff; color: #1d4ed8; border: 1px solid #bfdbfe;
text-decoration: none; transition: background .1s;
}
.dl-link:hover { background: #dbeafe; }
html.dark .dl-link { background: rgba(59,130,246,.12); color: #60a5fa; border-color: rgba(59,130,246,.25); }
/* ── Footer note ── */
.buch-footer { padding: 12px 16px; font-size: var(--fs-xs); color: var(--text-3); border-top: 1px solid var(--border); }
.buch-footer code { font-size: var(--fs-2xs); background: #f1f5f9; padding: 1px 5px; border-radius: 3px; }
html.dark .buch-footer code { background: #1f2937; }
/* === PAGE: mp_attrs_gaps_v2_redesign === */
.badge-amber{display:inline-block;padding:1px 8px;border-radius:99px;font-size:var(--fs-xs);
background:color-mix(in srgb,var(--warn) 15%,transparent);color:var(--warn);}
.badge-slate{display:inline-block;padding:1px 8px;border-radius:99px;font-size:var(--fs-xs);
background:var(--bg-surface);color:var(--text-3);}
.filter-row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:16px;}
.filter-row select,.filter-row input{background:var(--bg-surface);border:1px solid var(--border);
border-radius:var(--r-sm);padding:6px 10px;font-size:var(--fs-sm);color:var(--text-1);}
/* === PAGE: dhl_phantom_audit_v2_redesign === */
.dp-page { padding: 24px; max-width: 1400px; }
/* Verdict cards */
.dp-verdict-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 12px;
margin-bottom: 16px;
}
.dp-verdict-card {
border-radius: 10px;
padding: 14px 16px;
border: 1px solid var(--border);
text-decoration: none;
display: block;
transition: box-shadow .15s;
}
.dp-verdict-card:hover { box-shadow: 0 2px 12px rgba(0,0,0,.08); }
.dp-verdict-card.phantom { background: #fef2f2; border-color: #fecaca; }
.dp-verdict-card.so-nopkg { background: #fffbeb; border-color: #fde68a; }
.dp-verdict-card.return { background: #fff7ed; border-color: #fed7aa; }
html.dark .dp-verdict-card.phantom { background: rgba(220,38,38,.08); border-color: rgba(220,38,38,.25); }
html.dark .dp-verdict-card.so-nopkg { background: rgba(245,158,11,.08); border-color: rgba(245,158,11,.25); }
html.dark .dp-verdict-card.return { background: rgba(249,115,22,.08); border-color: rgba(249,115,22,.25); }
.dp-verdict-label { font-size: var(--fs-2xs); font-weight: 700; text-transform: uppercase; letter-spacing: .07em; margin-bottom: 6px; }
.dp-verdict-val { font-size: var(--fs-card-num); font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.dp-verdict-sub { font-size: var(--fs-xs); margin-top: 4px; font-variant-numeric: tabular-nums; }
.dp-verdict-card.phantom .dp-verdict-label,
.dp-verdict-card.phantom .dp-verdict-val,
.dp-verdict-card.phantom .dp-verdict-sub { color: #dc2626; }
.dp-verdict-card.so-nopkg .dp-verdict-label,
.dp-verdict-card.so-nopkg .dp-verdict-val,
.dp-verdict-card.so-nopkg .dp-verdict-sub { color: #d97706; }
.dp-verdict-card.return .dp-verdict-label,
.dp-verdict-card.return .dp-verdict-val,
.dp-verdict-card.return .dp-verdict-sub { color: #ea580c; }
html.dark .dp-verdict-card.phantom .dp-verdict-label,
html.dark .dp-verdict-card.phantom .dp-verdict-val,
html.dark .dp-verdict-card.phantom .dp-verdict-sub { color: #f87171; }
html.dark .dp-verdict-card.so-nopkg .dp-verdict-label,
html.dark .dp-verdict-card.so-nopkg .dp-verdict-val,
html.dark .dp-verdict-card.so-nopkg .dp-verdict-sub { color: #fbbf24; }
html.dark .dp-verdict-card.return .dp-verdict-label,
html.dark .dp-verdict-card.return .dp-verdict-val,
html.dark .dp-verdict-card.return .dp-verdict-sub { color: #fb923c; }
.dp-verdict-card.active { box-shadow: 0 0 0 2px currentColor; }
/* Excluded block */
.dp-excluded {
background: var(--bg-surface);
border: 1px solid #bbf7d0;
border-radius: 10px;
padding: 14px 16px;
margin-bottom: 16px;
}
html.dark .dp-excluded { border-color: rgba(16,185,129,.25); }
.dp-excluded-title {
font-size: var(--fs-2xs); font-weight: 700; text-transform: uppercase; letter-spacing: .07em;
color: #10b981; margin-bottom: 10px;
}
.dp-excluded-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(185px, 1fr));
gap: 6px;
}
.dp-excl-item {
background: var(--bg-page);
border: 1px solid #bbf7d0;
border-radius: 7px;
padding: 7px 10px;
text-decoration: none;
display: block;
transition: box-shadow .12s;
}
.dp-excl-item:hover { box-shadow: 0 1px 6px rgba(0,0,0,.06); }
html.dark .dp-excl-item { border-color: rgba(16,185,129,.2); }
.dp-excl-label { font-size: var(--fs-2xs); color: var(--text-3); margin-bottom: 2px; }
.dp-excl-val { font-size: var(--fs-2sm); font-weight: 700; color: #10b981; font-variant-numeric: tabular-nums; }
/* Main card */
.dp-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
margin-bottom: 16px;
}
.dp-filters {
padding: 12px 16px;
border-bottom: 1px solid var(--border);
display: flex; gap: 8px; flex-wrap: wrap; align-items: flex-end;
}
.dp-filter-group { display: flex; flex-direction: column; gap: 3px; }
.dp-filter-label { font-size: var(--fs-2xs); color: var(--text-4); font-weight: 500; }
.dp-input {
border: 1px solid var(--border); border-radius: 7px;
padding: 8px 12px; font-size: var(--fs-2sm);
background: var(--bg-page); color: var(--text-1);
outline: none; transition: border-color .15s;
}
.dp-input:focus { border-color: #3b82f6; }
.dp-select {
border: 1px solid var(--border); border-radius: 7px;
padding: 8px 12px; font-size: var(--fs-2sm);
background: var(--bg-page); color: var(--text-1);
outline: none; cursor: pointer;
}
.dp-btn {
padding: 8px 14px; font-size: var(--fs-2sm); font-weight: 500;
border: 1px solid var(--border); border-radius: 7px;
background: var(--bg-surface); color: var(--text-2);
cursor: pointer; transition: all .12s; white-space: nowrap;
}
.dp-btn:hover { background: var(--bg-page); }
.dp-btn-primary { background: #1e293b; border-color:var(--text-1); color: #f8fafc; }
.dp-btn-primary:hover { background: #0f172a; }
html.dark .dp-btn-primary { background: #334155; border-color: #475569; }
html.dark .dp-btn-primary:hover { background: #3f4f63; }
/* Table */
.dp-table { width: 100%; border-collapse: collapse; font-size: var(--fs-2sm); }
.dp-table thead th {
padding: 9px 13px; text-align: left;
font-size: var(--fs-xs); font-weight: 600; text-transform: uppercase; letter-spacing: .06em;
color: var(--text-3); background: var(--bg-page);
border-bottom: 1px solid var(--border); white-space: nowrap;
}
.dp-table tbody td {
padding: 10px 13px; border-bottom: 1px solid var(--border);
vertical-align: middle; color: var(--text-2);
}
.dp-table tbody tr:last-child td { border-bottom: none; }
.dp-table tbody tr.row-phantom td { background: rgba(220,38,38,.03); }
.dp-table tbody tr.row-so td { background: rgba(245,158,11,.03); }
.dp-table tbody tr.row-return td { background: rgba(249,115,22,.03); }
html.dark .dp-table tbody tr.row-phantom td { background: rgba(220,38,38,.06); }
html.dark .dp-table tbody tr.row-so td { background: rgba(245,158,11,.05); }
html.dark .dp-table tbody tr.row-return td { background: rgba(249,115,22,.05); }
.dp-table td.mono { font-family: 'SFMono-Regular', Consolas, monospace; font-size: var(--fs-xs); }
.dp-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
/* Verdict badges */
.dp-badge {
display: inline-flex; align-items: center;
font-size: var(--fs-2xs); font-weight: 600; font-family: 'SFMono-Regular', Consolas, monospace;
padding: 2px 7px; border-radius: 4px;
}
.dp-badge-phantom { background: #ef4444; color: #fff; }
.dp-badge-so { background: #f59e0b; color: #fff; }
.dp-badge-return { background: #f97316; color: #fff; }
.dp-badge-excl { background: #10b981; color: #fff; }
.dp-link { color: #3b82f6; text-decoration: none; }
.dp-link:hover { text-decoration: underline; }
html.dark .dp-link { color: #60a5fa; }
/* Dispute bar */
.dp-dispute-bar {
position: sticky; bottom: 0;
background: var(--bg-surface); border-top: 2px solid #3b82f6;
padding: 10px 16px;
display: flex; align-items: center; gap: 12px;
box-shadow: 0 -4px 16px rgba(0,0,0,.1); z-index: 50;
}
/* === PAGE: roles_list_v2_redesign === */
.pg-header {
display: flex; align-items: center; justify-content: space-between;
padding: 20px 24px 16px;
}
/* .pg-title canonical — dedup (см. глобальный) */
.pg-sub { font-size: var(--fs-2sm); color: var(--text-3); margin-top: 2px; }
.card { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.card-wrap { padding: 0 24px 24px; }
html.dark .btn-primary { background: #f1f5f9; color: #0f172a; }
.tbl { width: 100%; border-collapse: collapse; }
.tbl thead tr { background: #f8fafc; border-bottom: 1px solid var(--border); }
html.dark .tbl thead tr { background: #1e293b; }
.tbl th {
padding: 10px 14px; font-size: var(--fs-xs); font-weight: 700;
text-transform: uppercase; letter-spacing: .06em;
color: #94a3b8; text-align: left; white-space: nowrap;
}
.tbl th.num { text-align: right; }
.tbl td { padding: 11px 14px; border-bottom: 1px solid var(--border); font-size: var(--fs-2sm); vertical-align: middle; }
.tbl td.num { text-align: right; font-variant-numeric: tabular-nums; }
.tbl tbody tr:last-child td { border-bottom: none; }
.tbl tbody tr:hover td { background: #f8fafc; }
html.dark .tbl tbody tr:hover td { background: #1e293b; }
html.dark .badge-gray { background: #1e293b; }
.link-edit { font-size: var(--fs-sm); color: #3b82f6; font-weight: 500; text-decoration: none; }
.link-edit:hover { text-decoration: underline; }
.mono { font-family: ui-monospace, monospace; }
/* === PAGE: dhl_tracking_full_v2_redesign === */
/* ── Page wrapper ── */
.dt-page { padding: 24px; max-width: 1400px; }
/* ── KPI grid ── */
.dt-kpi-grid {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 12px;
margin-bottom: 20px;
}
@media (max-width: 1100px) { .dt-kpi-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 700px) { .dt-kpi-grid { grid-template-columns: repeat(2, 1fr); } }
.dt-kpi-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
padding: 14px 16px;
border-left-width: 3px;
border-left-color: var(--border);
}
.dt-kpi-card.green { border-left-color: #10b981; }
.dt-kpi-card.blue { border-left-color: #3b82f6; }
.dt-kpi-card.yellow { border-left-color: #f59e0b; }
.dt-kpi-label { font-size: var(--fs-xs); color: var(--text-3); font-weight: 500; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 6px; }
.dt-kpi-val { font-size: var(--fs-section); font-weight: 700; color: var(--text-1); line-height: 1; font-variant-numeric: tabular-nums; }
.dt-kpi-sub { font-size: var(--fs-xs); color: var(--text-4); margin-top: 4px; }
/* ── Section card ── */
.dt-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
margin-bottom: 16px;
}
.dt-card-header {
padding: 12px 16px;
border-bottom: 1px solid var(--border);
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
flex-wrap: wrap;
}
.dt-card-sub { font-size: var(--fs-sm); color: var(--text-4); }
.dt-card-body { padding: 0; }
/* ── Filter form ── */
.dt-filters {
padding: 12px 16px;
border-bottom: 1px solid var(--border);
display: flex;
gap: 8px;
flex-wrap: wrap;
align-items: center;
}
.dt-input {
flex: 1;
min-width: 180px;
border: 1px solid var(--border);
border-radius: 7px;
padding: 8px 12px;
font-size: var(--fs-2sm);
background: var(--bg-page);
color: var(--text-1);
outline: none;
transition: border-color .15s;
}
.dt-input:focus { border-color: #3b82f6; }
.dt-select {
border: 1px solid var(--border);
border-radius: 7px;
padding: 8px 12px;
font-size: var(--fs-2sm);
background: var(--bg-page);
color: var(--text-1);
outline: none;
cursor: pointer;
}
.dt-btn-primary {
padding: 8px 16px;
font-size: var(--fs-2sm);
font-weight: 500;
border: none;
border-radius: 7px;
background: #3b82f6;
color: #fff;
cursor: pointer;
transition: background .15s;
white-space: nowrap;
}
.dt-btn-primary:hover { background: #2563eb; }
/* ── Table ── */
.dt-table { width: 100%; border-collapse: collapse; font-size: var(--fs-2sm); }
.dt-table thead th {
padding: 9px 13px;
text-align: left;
font-size: var(--fs-xs);
font-weight: 600;
text-transform: uppercase;
letter-spacing: .06em;
color: var(--text-3);
background: var(--bg-page);
border-bottom: 1px solid var(--border);
white-space: nowrap;
}
.dt-table tbody td {
padding: 11px 13px;
border-bottom: 1px solid var(--border);
vertical-align: middle;
color: var(--text-2);
}
.dt-table tbody tr:last-child td { border-bottom: none; }
.dt-table tbody tr:hover td { background: var(--bg-page); }
.dt-table td.mono {
font-family: 'SFMono-Regular', Consolas, monospace;
font-size: var(--fs-xs);
color: var(--text-2);
}
.dt-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
/* ── Status pills ── */
.st-pill {
display: inline-flex; align-items: center;
font-size: var(--fs-xs); font-weight: 500;
padding: 2px 8px; border-radius: 9999px;
}
.st-delivered { background: #f0fdf4; color: #16a34a; }
.st-transit { background: #eff6ff; color: #2563eb; }
.st-notfound { background: #fffbeb; color: #d97706; }
.st-other { background: #f9fafb; color: var(--text-3); }
html.dark .st-delivered { background: rgba(16,185,129,.12); color: #34d399; }
html.dark .st-transit { background: rgba(59,130,246,.12); color: #60a5fa; }
html.dark .st-notfound { background: rgba(245,158,11,.12); color: #fbbf24; }
html.dark .st-other { background: rgba(255,255,255,.05); color: var(--text-4); }
/* ── Link ── */
.dt-link { color: #3b82f6; text-decoration: none; }
.dt-link:hover { text-decoration: underline; }
html.dark .dt-link { color: #60a5fa; }
/* === PAGE: settings_reorder_v2_redesign === */
.section-h{font-size:var(--fs-xs);font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text-3);margin-bottom:12px;}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;}
.form-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
/* === PAGE: dispute_packs_v2_redesign === */
.dpack-page { padding: 24px; max-width: 1200px; }
/* KPI row */
.dpack-kpi-row {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
gap: 12px;
margin-bottom: 20px;
}
.dpack-kpi-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
padding: 14px 16px;
border-left: 3px solid var(--border);
}
.dpack-kpi-card.danger { border-left-color: #ef4444; }
.dpack-kpi-label { font-size: var(--fs-2xs); font-weight: 600; text-transform: uppercase; letter-spacing: .07em; color: var(--text-3); margin-bottom: 6px; }
.dpack-kpi-val { font-size: var(--fs-section); font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1; color: var(--text-1); }
.dpack-kpi-sub { font-size: var(--fs-xs); color: var(--text-4); margin-top: 4px; font-variant-numeric: tabular-nums; }
.dpack-kpi-card.danger .dpack-kpi-val { color: #ef4444; }
/* Generate card */
.dpack-gen-card {
background: var(--bg-surface);
border: 1px solid #bfdbfe;
border-radius: 10px;
padding: 16px;
margin-bottom: 20px;
}
html.dark .dpack-gen-card { border-color: rgba(59,130,246,.25); }
.dpack-gen-title { font-size: var(--fs-2sm); font-weight: 600; color: #3b82f6; margin-bottom: 14px; }
/* Main card */
.dpack-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
margin-bottom: 16px;
}
/* Inputs / selects */
.dpack-select {
border: 1px solid var(--border); border-radius: 7px;
padding: 8px 12px; font-size: var(--fs-2sm);
background: var(--bg-page); color: var(--text-1);
outline: none; cursor: pointer;
}
.dpack-textarea {
border: 1px solid var(--border); border-radius: 7px;
padding: 8px 12px; font-size: var(--fs-sm); font-family: 'SFMono-Regular', Consolas, monospace;
background: var(--bg-page); color: var(--text-1);
outline: none; width: 320px; resize: vertical;
}
.dpack-field-label { font-size: var(--fs-2xs); font-weight: 700; text-transform: uppercase; color: var(--text-4); margin-bottom: 4px; }
/* Buttons */
.dpack-btn {
padding: 8px 14px; font-size: var(--fs-2sm); font-weight: 500;
border: 1px solid var(--border); border-radius: 7px;
background: var(--bg-surface); color: var(--text-2);
cursor: pointer; transition: all .12s; white-space: nowrap;
}
.dpack-btn:hover { background: var(--bg-page); }
.dpack-btn-primary {
background: #1e293b; border-color:var(--text-1); color: #f8fafc;
}
.dpack-btn-primary:hover { background: #0f172a; }
html.dark .dpack-btn-primary { background: #334155; border-color: #475569; }
html.dark .dpack-btn-primary:hover { background: #3f4f63; }
.dpack-btn-sm { padding: 4px 10px; font-size: var(--fs-sm); }
/* Table */
.dpack-table { width: 100%; border-collapse: collapse; font-size: var(--fs-2sm); }
.dpack-table thead th {
padding: 9px 13px; text-align: left;
font-size: var(--fs-xs); font-weight: 600; text-transform: uppercase; letter-spacing: .06em;
color: var(--text-3); background: var(--bg-page);
border-bottom: 1px solid var(--border); white-space: nowrap;
}
.dpack-table tbody td {
padding: 11px 13px; border-bottom: 1px solid var(--border);
vertical-align: middle; color: var(--text-2);
}
.dpack-table tbody tr:last-child td { border-bottom: none; }
.dpack-table tbody tr:hover td { background: var(--bg-page); }
.dpack-table td.mono { font-family: 'SFMono-Regular', Consolas, monospace; font-size: var(--fs-xs); }
.dpack-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
/* Status pills */
.dpack-pill {
display: inline-flex; align-items: center;
font-size: var(--fs-xs); font-weight: 600;
padding: 2px 8px; border-radius: 9999px;
}
.dpack-pill-resolved { background: #f0fdf4; color: #16a34a; }
.dpack-pill-sent { background: #fffbeb; color: #d97706; }
.dpack-pill-draft { background: #f9fafb; color: var(--text-3); }
html.dark .dpack-pill-resolved { background: rgba(16,185,129,.12); color: #34d399; }
html.dark .dpack-pill-sent { background: rgba(245,158,11,.12); color: #fbbf24; }
html.dark .dpack-pill-draft { background: rgba(255,255,255,.05); color: var(--text-4); }
/* Success result */
.dpack-result {
margin-top: 10px;
background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 8px;
padding: 10px 14px;
}
html.dark .dpack-result { background: rgba(16,185,129,.08); border-color: rgba(16,185,129,.2); }
.dpack-result-title { font-size: var(--fs-sm); font-weight: 700; color: #10b981; margin-bottom: 6px; }
.dpack-link { color: #3b82f6; text-decoration: none; }
.dpack-link:hover { text-decoration: underline; }
html.dark .dpack-link { color: #60a5fa; }
/* === PAGE: users_list_v2_redesign === */
.pg-header {
display: flex; align-items: center; justify-content: space-between;
padding: 20px 24px 16px;
}
/* .pg-title canonical — dedup (см. глобальный) */
.pg-sub { font-size: var(--fs-2sm); color: var(--text-3); margin-top: 2px; }
.card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
}
.card-wrap { padding: 0 24px 24px; }
html.dark .btn-primary { background: #f1f5f9; color: #0f172a; }
/* Table */
.tbl { width: 100%; border-collapse: collapse; }
.tbl thead tr { background: #f8fafc; border-bottom: 1px solid var(--border); }
html.dark .tbl thead tr { background: #1e293b; }
.tbl th {
padding: 10px 14px; font-size: var(--fs-xs); font-weight: 700;
text-transform: uppercase; letter-spacing: .06em;
color: #94a3b8; text-align: left; white-space: nowrap;
}
.tbl td { padding: 11px 14px; border-bottom: 1px solid var(--border); font-size: var(--fs-2sm); vertical-align: middle; }
.tbl tbody tr:last-child td { border-bottom: none; }
.tbl tbody tr:hover td { background: #f8fafc; }
html.dark .tbl tbody tr:hover td { background: #1e293b; }
html.dark .badge-gray { background: #1e293b; }
.link-edit { font-size: var(--fs-sm); color: #3b82f6; font-weight: 500; text-decoration: none; }
.link-edit:hover { text-decoration: underline; }
.mono { font-family: ui-monospace, monospace; }
/* === PAGE: agent_run_detail_v2_redesign === */
.pg-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:20px;flex-wrap:wrap;}
/* .pg-title canonical — dedup (см. глобальный) */
.pg-sub{font-size:var(--fs-sm);color:var(--text-3);margin-top:2px;}
.kpi-val{font-size: var(--fs-section);font-weight:700;color:var(--text-1);}
.card{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;padding:16px 18px;margin-bottom:12px;}
.card-header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px;}
/* canonical card-title — dedup */
.card-title{font-size:var(--fs-md);font-weight:var(--fw-bold);color:var(--text-1);}
.run-pre{font-size:var(--fs-xs);background:var(--bg-page);border:1px solid var(--border);border-radius:6px;padding:12px;overflow:auto;white-space:pre-wrap;max-height:320px;line-height:1.6;color:var(--text-2);}
html.dark .badge-green{color:#4ade80;}
html.dark .badge-red{color:#f87171;}
.badge-amber{background:rgba(245,158,11,.1);color:#d97706;}
html.dark .badge-amber{color:#fbbf24;}
.badge-indigo{background:rgba(99,102,241,.1);color:#4f46e5;}
html.dark .badge-indigo{color:#a5b4fc;}
/* running pulse */
@keyframes run-pulse{0%,100%{opacity:1}50%{opacity:.5}}
.run-indicator-active::before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:#4ade80;animation:run-pulse 1.5s infinite;margin-right:6px;vertical-align:middle;}
/* === PAGE: account_v2_redesign === */
.ac-wrap { padding: 20px 24px; max-width: 1000px; }
.ac-page-h { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 24px; }
.ac-page-title { font-size: var(--fs-xl); font-weight: 700; color: var(--text-1); }
.ac-page-sub { font-size: var(--fs-2sm); color: var(--text-3); margin-top: 2px; }
/* Card */
.ac-card {
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: 10px; overflow: hidden; margin-bottom: 16px;
}
.ac-card-header {
padding: 12px 18px; border-bottom: 1px solid var(--border);
display: flex; align-items: center; justify-content: space-between;
}
.ac-card-title { font-size: var(--fs-md); font-weight: 600; color: var(--text-1); }
.ac-card-body { padding: 18px; }
/* Grid */
.ac-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
@media (max-width: 700px) { .ac-grid { grid-template-columns: 1fr; } }
/* Profile row */
.ac-row { display: flex; gap: 12px; font-size: var(--fs-2sm); padding: 8px 0; border-bottom: 1px solid var(--border); }
.ac-row:last-child { border-bottom: none; }
.ac-row-label { color: var(--text-3); min-width: 120px; flex-shrink: 0; }
/* Role badge */
.ac-role-badge {
background: var(--bg-page); border: 1px solid var(--border);
border-radius: 5px; padding: 2px 8px; font-size: var(--fs-xs); font-weight: 500; color: var(--text-2);
}
/* Avatar */
.ac-avatar {
width: 40px; height: 40px; border-radius: 50%;
background: #e5e7eb; display: flex; align-items: center; justify-content: center;
font-size: var(--fs-lg); font-weight: 700; color: #6b7280; flex-shrink: 0;
}
html.dark .ac-avatar { background: #374151; color: #d1d5db; }
/* Table */
.ac-table { width: 100%; border-collapse: collapse; }
.ac-table thead tr { border-bottom: 1px solid var(--border); }
.ac-table th {
padding: 8px 12px; text-align: left; font-size: var(--fs-xs); font-weight: 600;
color: var(--text-3); text-transform: uppercase; letter-spacing: .06em;
background: var(--bg-page); white-space: nowrap;
}
.ac-table td {
padding: 9px 12px; border-bottom: 1px solid var(--border);
font-size: var(--fs-sm); color: var(--text-1); vertical-align: middle;
}
.ac-table tbody tr:last-child td { border-bottom: none; }
.ac-table .mono { font-size: var(--fs-xs); }
/* Form */
.ac-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ac-label { font-size: var(--fs-sm); font-weight: 600; display: block; margin-bottom: 4px; color: var(--text-2); }
.ac-input {
width: 100%; border: 1px solid var(--border); border-radius: 7px;
padding: 8px 12px; font-size: var(--fs-2sm); background: var(--bg-page); color: var(--text-1);
outline: none; transition: border .12s;
}
.ac-input:focus { border-color: #94a3b8; }
/* Buttons */
.ac-btn {
padding: 8px 18px; border-radius: 7px; font-size: var(--fs-2sm); font-weight: 600;
border: 1px solid var(--border); background: var(--bg-surface); color: var(--text-2);
cursor: pointer; transition: all .12s;
}
.ac-btn:hover { background: var(--nav-hover); color: var(--text-1); }
.ac-btn-primary { background: #1e293b; color: #fff; border-color: #1e293b; }
.ac-btn-primary:hover { background: #0f172a; }
html.dark .ac-btn-primary { background: #e2e8f0; color: #111827; border-color: #e2e8f0; }
.ac-btn-warn { background: #f59e0b; color: #fff; border-color: #f59e0b; }
.ac-btn-warn:hover { background: #d97706; }
/* Auto-resolved badge */
.ac-badge-auto {
display: inline-block; font-size: var(--fs-xs); font-weight: 600;
padding: 2px 8px; border-radius: var(--radius-pill); margin-left: 6px; vertical-align: middle;
background: color-mix(in srgb, var(--color-violet) 12%, transparent);
color: var(--color-violet);
border: 1px solid color-mix(in srgb, var(--color-violet) 25%, transparent);
cursor: help;
}
/* Alert */
.ac-alert-ok { background: rgba(16,185,129,.08); border: 1px solid rgba(16,185,129,.3); color: #059669; border-radius: 7px; padding: 10px 14px; margin-bottom: 14px; font-size: var(--fs-2sm); }
.ac-alert-err { background: rgba(239,68,68,.07); border: 1px solid rgba(239,68,68,.25); color: #dc2626; border-radius: 7px; padding: 10px 14px; margin-bottom: 14px; font-size: var(--fs-2sm); }
/* === Address-Check rewrite 2026-06-10 (BUG2 raw toggle, FEATURE3 bot settings) === */
/* Pending-enrich indicator (⏳ ort_verify ещё не обогащены Gemini) */
.ac-enrich-bar {
display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap;
padding: var(--space-2) var(--space-4); margin-bottom: var(--space-4); border-radius: var(--radius-input);
background: rgba(245,158,11,.08); border: 1px solid rgba(245,158,11,.3);
font-size: var(--fs-2sm); color: var(--text-1);
}
.ac-enrich-badge { font-weight: 700; color: var(--color-warn); }
.ac-raw-toggle { display: flex; align-items: center; gap: 6px; cursor: pointer; color: var(--text-2); }
.ac-pending-tag {
font-size: var(--fs-xs); font-weight: 600; padding: 2px 8px; border-radius: var(--radius-pill);
background: rgba(245,158,11,.12); color: var(--color-warn); border: 1px solid rgba(245,158,11,.3);
}
.ac-rev-card.is-pending { border-left-color: var(--color-warn); opacity: .92; }
/* #681: состояние контакта с клиентом (тикет в Пульте help.anro.team) */
.ac-contact-tag {
font-size: var(--fs-xs); font-weight: 600; padding: 2px 8px; border-radius: var(--radius-pill);
border: 1px solid transparent;
}
.ac-contact-tag.ct-waiting { background: rgba(245,158,11,.12); color: var(--color-warn); border-color: rgba(245,158,11,.3); }
.ac-contact-tag.ct-replied { background: rgba(16,185,129,.12); color: var(--color-good); border-color: rgba(16,185,129,.3); }
.ac-contact-tag.ct-silent { background: rgba(239,68,68,.12); color: var(--color-bad); border-color: rgba(239,68,68,.3); }
.ac-contact-tag.ct-draft { background: rgba(139,92,246,.10); color: var(--color-violet); border-color: rgba(139,92,246,.3); }
/* Gemini-suggestion applied highlight inside card (BUG1 — карточка остаётся) */
.ac-ai-applied { box-shadow: 0 0 0 2px rgba(109,40,217,.18); border-color: var(--color-violet); }
/* Bot settings form (FEATURE 3) */
.ac-set { max-width: 760px; }
.ac-set-sec { margin-bottom: 22px; border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.ac-set-h {
font-size: var(--fs-2sm); font-weight: 700; color: var(--text-1); margin: 0;
padding: 12px 16px; background: var(--bg-page); border-bottom: 1px solid var(--border);
}
.ac-set-body { padding: 14px 16px; display: flex; flex-direction: column; gap: 12px; }
.ac-set-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.ac-set-label { font-size: var(--fs-2sm); color: var(--text-1); font-weight: 600; }
.ac-set-desc { font-size: var(--fs-xs); color: var(--text-3); margin-top: 2px; max-width: 420px; }
.ac-set-ctl { display: flex; align-items: center; gap: 8px; }
.ac-set-num { width: 90px; }
.ac-set-num-lg { min-width: 240px; }
.ac-set-readonly { font-size: var(--fs-2sm); color: var(--text-3); }
.ac-set-readonly b { color: var(--text-1); }
.ac-sev-grid { display: grid; grid-template-columns: 1fr auto; gap: 6px 14px; align-items: center; }
.ac-sev-grid .ac-set-label { font-size: var(--fs-xs); font-weight: 500; }
.ac-set-actions { display: flex; gap: 10px; margin-top: 4px; }
.ac-set-switch { position: relative; width: 40px; height: 22px; flex: none; }
.ac-set-switch input { opacity: 0; width: 0; height: 0; }
.ac-set-slider {
position: absolute; inset: 0; border-radius: var(--radius-pill);
background: var(--border); transition: .15s; cursor: pointer;
}
.ac-set-slider::before {
content: ""; position: absolute; height: 16px; width: 16px; left: 3px; top: 3px;
border-radius: var(--radius-circle); background: var(--color-bg); transition: .15s;
}
.ac-set-switch input:checked + .ac-set-slider { background: var(--color-text); }
html.dark .ac-set-switch input:checked + .ac-set-slider { background: var(--color-border); }
.ac-set-switch input:checked + .ac-set-slider::before { transform: translateX(18px); }
/* === PAGE: admin_audit_v2_redesign === */
.pg-header {
display: flex; align-items: center; justify-content: space-between;
padding: 20px 24px 16px;
}
/* .pg-title canonical — dedup (см. глобальный) */
.pg-sub { font-size: var(--fs-2sm); color: var(--text-3); margin-top: 2px; }
.card { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.card-wrap { padding: 0 24px 24px; }
/* Filter bar */
.filter-bar {
display: flex; gap: 8px; flex-wrap: wrap;
padding: 14px 16px; border-bottom: 1px solid var(--border);
background:var(--bg-page);
}
html.dark .filter-bar { background: #1e293b; }
.filter-input, .filter-select {
padding: 7px 12px; border-radius: 7px;
border: 1px solid var(--border); font-size: var(--fs-2sm);
background: var(--bg-surface); color: var(--text-1);
outline: none; min-width: 160px;
transition: border .12s;
}
.filter-input:focus, .filter-select:focus { border-color: #3b82f6; }
.btn-filter {
padding: 7px 16px; border-radius: 7px;
background: #1e293b; color: #fff;
font-size: var(--fs-2sm); font-weight: 600;
border: none; cursor: pointer; transition: opacity .12s;
}
.btn-filter:hover { opacity: .85; }
html.dark .btn-filter { background: #f1f5f9; color: #0f172a; }
.btn-back {
display: inline-flex; align-items: center; gap: 5px;
padding: 7px 14px; border-radius: 7px;
border: 1px solid var(--border); background: var(--bg-surface);
font-size: var(--fs-sm); font-weight: 500; color: var(--text-2);
text-decoration: none; transition: background .1s;
}
.btn-back:hover { background: var(--nav-hover); }
/* Table */
.tbl { width: 100%; border-collapse: collapse; }
.tbl thead tr { background:var(--bg-page); border-bottom: 1px solid var(--border); }
html.dark .tbl thead tr { background: #1e293b; }
.tbl th {
padding: 10px 14px; font-size: var(--fs-xs); font-weight: 700;
text-transform: uppercase; letter-spacing: .06em;
color:var(--text-4); text-align: left; white-space: nowrap;
}
.tbl td { padding: 10px 14px; border-bottom: 1px solid var(--border); font-size: var(--fs-2sm); vertical-align: middle; }
.tbl tbody tr:last-child td { border-bottom: none; }
.tbl tbody tr:hover td { background:var(--bg-page); }
html.dark .tbl tbody tr:hover td { background: #1e293b; }
.action-tag {
display: inline-block; padding: 2px 8px; border-radius: 4px;
font-size: var(--fs-xs); font-weight: 600; font-family: ui-monospace, monospace;
background: #f1f5f9; color: var(--text-2);
}
html.dark .action-tag { background: #1e293b; }
/* Pagination */
.pagination {
display: flex; align-items: center; justify-content: space-between;
padding: 12px 16px;
font-size: var(--fs-2sm); color: var(--text-3);
}
.btn-page {
display: inline-flex; align-items: center; gap: 4px;
padding: 6px 12px; border-radius: 7px;
border: 1px solid var(--border); background: var(--bg-surface);
font-size: var(--fs-sm); font-weight: 500; color: var(--text-2);
text-decoration: none; transition: background .1s;
}
.btn-page:hover { background: var(--nav-hover); }
.mono { font-family: ui-monospace, monospace; }
/* === PAGE: admin_cron_v2_redesign === */
.cr-wrap { padding: 20px 24px; max-width: 1100px; }
.cr-page-h { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 20px; }
.cr-page-title { font-size: var(--fs-xl); font-weight: 700; color: var(--text-1); }
.cr-page-sub { font-size: var(--fs-2sm); color: var(--text-3); margin-top: 2px; }
/* KPI grid */
.cr-kpi-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 20px; }
.cr-kpi-card {
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: 10px; padding: 14px 16px; border-left-width: 3px; border-left-color: var(--border);
}
.cr-kpi-card.green { border-left-color: #10b981; }
.cr-kpi-card.yellow { border-left-color: #f59e0b; }
.cr-kpi-card.red { border-left-color: #ef4444; }
.cr-kpi-label { font-size: var(--fs-xs); color: var(--text-3); font-weight: 600; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 5px; }
.cr-kpi-val { font-size: var(--fs-2xl); font-weight: 700; color: var(--text-1); line-height: 1.1; }
/* Section card */
.cr-card {
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: 10px; overflow: hidden;
}
.cr-card-header {
padding: 12px 18px; border-bottom: 1px solid var(--border);
display: flex; align-items: center; gap: 10px;
}
.cr-card-title { font-size: var(--fs-md); font-weight: 600; color: var(--text-1); }
/* Table */
.cr-table { width: 100%; border-collapse: collapse; }
.cr-table thead tr { border-bottom: 1px solid var(--border); }
.cr-table th {
padding: 9px 14px; text-align: left; font-size: var(--fs-xs); font-weight: 600;
color: var(--text-3); text-transform: uppercase; letter-spacing: .06em;
background: var(--bg-page); white-space: nowrap;
}
.cr-table td {
padding: 10px 14px; border-bottom: 1px solid var(--border);
font-size: var(--fs-2sm); color: var(--text-1); vertical-align: middle;
}
.cr-table tbody tr:last-child td { border-bottom: none; }
.cr-table tbody tr:hover td { background: var(--nav-hover); }
.cr-table .mono { font-family: 'Courier New', monospace; font-size: var(--fs-xs); }
/* Status dots */
.cr-dot {
display: inline-block; width: 9px; height: 9px; border-radius: 50%;
flex-shrink: 0; vertical-align: middle;
}
.cr-dot.green { background: #10b981; box-shadow: 0 0 0 2px rgba(16,185,129,.2); animation: cr-pulse 1.5s infinite; }
.cr-dot.red { background: #ef4444; }
.cr-dot.gray { background: var(--text-4); }
@keyframes cr-pulse { 0%,100%{opacity:1} 50%{opacity:.4} }
/* Pills */
.cr-pill {
display: inline-flex; align-items: center; gap: 5px;
padding: 2px 9px; border-radius: 999px;
font-size: var(--fs-xs); font-weight: 600; white-space: nowrap;
}
.cr-pill-active { background: rgba(16,185,129,.12); color: #059669; }
.cr-pill-failed { background: rgba(239,68,68,.12); color: #dc2626; }
.cr-pill-neutral { background: var(--bg-page); color: var(--text-3); border: 1px solid var(--border); }
/* === PAGE: admin_jtl_sync_config_v2_redesign === */
.jsc-wrap { padding: 20px 24px; }
.jsc-desc { color: var(--text-3); font-size: var(--fs-sm); margin: 0 0 var(--sp-4) 0; }
.jsc-stats { display: flex; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.jsc-stat {
background: var(--bg-card); border: 1px solid var(--border);
border-radius: 8px; padding: 12px 16px; min-width: 140px;
}
.jsc-stat-n { font-size: var(--fs-section); font-weight: 700; color: var(--text-1); }
.jsc-stat-lbl{ font-size: var(--fs-xs); color: var(--text-3); text-transform: uppercase; letter-spacing: .04em; }
.jsc-table { width: 100%; border-collapse: collapse; font-size: var(--fs-2sm); background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
.jsc-table th { background: var(--bg-subtle); padding: 8px 10px; text-align: left; font-size: var(--fs-xs); text-transform: uppercase; color: var(--text-3); border-bottom: 1px solid var(--border); white-space: nowrap; }
.jsc-table td { padding: 8px 10px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.jsc-table tbody tr:hover { background: var(--bg-subtle); }
.jsc-sku { font-family: 'JetBrains Mono', monospace; font-weight: 700; }
.jsc-cell { cursor: pointer; user-select: none; padding: 4px 8px; border-radius: 4px; font-size: var(--fs-xs); font-weight: 600; display: inline-block; min-width: 60px; text-align: center; }
.jsc-cell-pim { background: rgba(245,158,11,.12); color: #92400e; }
.jsc-cell-jtl { background: rgba(59,130,246,.12); color: #1e40af; }
.jsc-cell-default { background: var(--bg-subtle); color: var(--text-3); }
.jsc-cell:hover { outline: 1px solid var(--border-strong); }
.jsc-unlock-btn {
padding: 4px 10px; border: 1px solid var(--border); background: var(--bg-card);
border-radius: 4px; cursor: pointer; font-size: var(--fs-xs); color: var(--text-2);
}
.jsc-unlock-btn:hover { color: #dc2626; border-color: #fca5a5; background: #fef2f2; }
.jsc-empty { padding: 60px 24px; text-align: center; color: var(--text-3); }
.jsc-title-cell { max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-2); }
/* === PAGE: admin_hub_v2_redesign === */
/* ── KPI grid ── */
.ah-kpi-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 12px;
margin-bottom: 24px;
}
.ah-kpi-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
padding: 16px 18px;
border-left-width: 3px;
}
.ah-kpi-card.green { border-left-color: #10b981; }
.ah-kpi-card.blue { border-left-color: #3b82f6; }
.ah-kpi-card.yellow { border-left-color: #f59e0b; }
.ah-kpi-card.gray { border-left-color: var(--border); }
.ah-kpi-label { font-size: var(--fs-sm); color: var(--text-3); font-weight: 500; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 6px; }
.ah-kpi-val { font-size: var(--fs-card-num); font-weight: 700; color: var(--text-1); line-height: 1; }
.ah-kpi-sub { font-size: var(--fs-sm); color: var(--text-4); margin-top: 4px; }
/* ── Section card ── */
.ah-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
}
.ah-card-header {
padding: 14px 18px;
border-bottom: 1px solid var(--border);
display: flex;
align-items: center;
justify-content: space-between;
}
.ah-card-title {
font-size: var(--fs-md);
font-weight: 600;
color: var(--text-1);
}
.ah-card-body { padding: 0; }
/* ── Row links ── */
.ah-row-link {
display: flex;
align-items: flex-start;
flex-direction: column;
padding: 12px 18px;
border-bottom: 1px solid var(--border);
text-decoration: none;
transition: background .1s;
cursor: pointer;
}
.ah-row-link:last-child { border-bottom: none; }
.ah-row-link:hover { background: var(--nav-hover); }
.ah-row-title { font-size: var(--fs-2sm); font-weight: 600; color: var(--text-1); }
.ah-row-meta { font-size: var(--fs-sm); color: var(--text-3); margin-top: 2px; }
/* ── Status pills ── */
.ah-pill {
display: inline-flex; align-items: center; gap: 5px;
font-size: var(--fs-sm); font-weight: 500;
padding: 3px 9px; border-radius: 9999px;
}
.ah-pill.ok { background: #f0fdf4; color: #16a34a; }
.ah-pill.fail { background: #fef2f2; color: #dc2626; }
.ah-pill.warn { background: #fffbeb; color: #d97706; }
.ah-pill.empty { background: #f9fafb; color: var(--text-3); }
html.dark .ah-pill.ok { background: rgba(16,185,129,.12); color: #34d399; }
html.dark .ah-pill.fail { background: rgba(239,68,68,.12); color: #f87171; }
html.dark .ah-pill.warn { background: rgba(245,158,11,.12); color: #fbbf24; }
html.dark .ah-pill.empty{ background: rgba(255,255,255,.05); color: var(--text-4); }
.ah-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.ah-dot.green { background: #10b981; }
.ah-dot.red { background: #ef4444; }
.ah-dot.pulse { animation: pulse 1.5s infinite; }
/* ── Infra table ── */
.ah-infra-table { width: 100%; border-collapse: collapse; }
.ah-infra-table td {
padding: 12px 18px;
border-bottom: 1px solid var(--border);
font-size: var(--fs-2sm);
color: var(--text-1);
vertical-align: top;
}
.ah-infra-table tr:last-child td { border-bottom: none; }
.ah-infra-table td:first-child { width: 220px; font-weight: 500; color: var(--text-2); white-space: nowrap; }
.ah-infra-meta { font-size: var(--fs-sm); color: var(--text-3); font-variant-numeric: tabular-nums; }
/* ── 2-col grid ── */
.ah-grid-2 {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
margin-bottom: 24px;
}
/* ── Page wrapper ── */
.ah-page { padding: 24px; max-width: 1200px; }
/* === PAGE: ebay_listings_v2_redesign === */
/* removed global .v3-content override — ломал скролл на всех страницах (2026-06-03) */
.pg-header { flex-shrink:0;padding:10px 20px;background:var(--bg-surface);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:14px; }
/* .pg-title canonical — dedup (см. глобальный) */
.pg-sub { font-size:var(--fs-xs);color:var(--text-3);margin-top:2px; }
.split { flex:1;display:grid;grid-template-columns:280px 5px 1fr;overflow:hidden;min-height:0; }
.split-handle { background:var(--border);cursor:col-resize;transition:background .15s;user-select:none;position:relative;z-index:5; }
.split-handle:hover, .split-handle.dragging { background:#0064D2; }
.split-handle::before { content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:2px;height:28px;background:var(--text-4);border-radius:2px;opacity:.5; }
.split-handle:hover::before { opacity:0; }
.tree-pane { border-right:1px solid var(--border);background:var(--bg-surface);display:flex;flex-direction:column;overflow:hidden; }
.tree-pane-hd { padding:8px 12px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;flex-shrink:0;gap:8px; }
.tree-pane-label { font-size: var(--fs-2xs);font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-4); }
html.dark .src-btn.active { background:#0f172a;color:#e2e8f0; }
.tree-search-box { padding:6px 8px;border-bottom:1px solid var(--border);flex-shrink:0; }
.tree-search-box input { width:100%;background:var(--bg-page);border:1px solid var(--border);border-radius:5px;padding:4px 8px;font-size:var(--fs-xs);color:var(--text-1);outline:none; }
.tree-search-box input:focus { border-color:#0064D2; }
html.dark .tree-search-box input { background:#0f172a; }
.tree-scroll { flex:1;overflow-y:auto;padding:4px; }
.tree-node { display:flex;align-items:center;gap:3px;padding:4px 6px;border-radius:5px;cursor:pointer; }
.tree-node:hover { background:var(--bg-page); }
.tree-node.selected { background:rgba(0,100,210,.10);border-left:2px solid #0064D2; }
.tree-node-toggle { width:14px;font-size: var(--fs-3xs);color:var(--text-4);flex-shrink:0;text-align:center; }
.tree-node-name { font-size:var(--fs-xs);flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;min-width:0; }
.tree-badge { font-size: var(--fs-3xs);font-weight:700;padding:0 5px;border-radius:3px;flex-shrink:0; }
.tb-count { background:var(--bg-page);color:var(--text-3);border:1px solid var(--border); }
.tb-mp { background:#fef3c7;color:#b45309; }
.art-pane { display:flex;flex-direction:column;overflow:hidden;background:var(--bg-page); }
.art-pane-hd { padding:10px 16px;background:var(--bg-surface);border-bottom:1px solid var(--border);flex-shrink:0; }
.art-scroll { flex:1;overflow-y:auto;padding:10px; }
.empty-pane { display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;color:var(--text-3);padding:40px;text-align:center; }
.spinner { width:28px;height:28px;border:3px solid var(--border);border-top-color:#0064D2;border-radius:50%;animation:spin .8s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.eb-table { width:100%;border-collapse:collapse;font-size:var(--fs-sm);background:var(--bg-surface);border-radius:8px;overflow:hidden; }
.eb-table th { background:var(--bg-surface);color:var(--text-4);font-size: var(--fs-2xs);font-weight:700;text-transform:uppercase;letter-spacing:.07em;padding:8px 10px;text-align:left;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:2; }
.eb-table td { padding:7px 10px;border-bottom:1px solid var(--border);font-size:var(--fs-sm);color:var(--text-2);vertical-align:middle; }
.eb-table tr:hover td { background:var(--bg-page); }
.eb-table td.mono { font-family:'JetBrains Mono',monospace;font-size:var(--fs-xs); }
.eb-table td.num { text-align:right;font-family:'JetBrains Mono',monospace; }
/* === PAGE: fba_reimbursements_v2_redesign === */
.badge-urgent {background:#fef2f2;color:#dc2626;}
.badge-soon {background:#fffbeb;color:#d97706;}
.badge-open {background:#eff6ff;color:#2563eb;}
.badge-expired{background:color-mix(in srgb,var(--text-3) 15%,var(--bg-surface));color:var(--text-3);}
.badge-reimb {background:#f0fdf4;color:#16a34a;}
.filter-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:16px;}
.filter-row a{padding:5px 12px;border-radius:var(--r-sm);font-size:var(--fs-sm);
border:1px solid var(--border);color:var(--text-2);text-decoration:none;}
.filter-row a.active{background:var(--text-1);color:#fff;border-color:var(--text-1);}
.action-btn{padding:3px 9px;border-radius:var(--r-sm);font-size:var(--fs-xs);cursor:pointer;
border:1px solid var(--border);background:var(--bg-surface);color:var(--text-2);}
.action-btn:hover{background:var(--text-1);color:#fff;border-color:var(--text-1);}
.days-urgent{color:#dc2626;font-weight:700;}
.days-soon {color:#d97706;font-weight:600;}
/* === PAGE: jtl_mapping_search_v2_redesign === */
.search-bar{display:flex;gap:8px;margin-bottom:12px;}
.search-bar input{flex:1;background:var(--bg-surface);border:1px solid var(--border);border-radius:6px;
padding:8px 12px;font-size:var(--fs-sm);color:#1e293b;}
.btn-search{background:#1e293b;color:#fff;border:none;border-radius:6px;padding:8px 16px;font-size:var(--fs-sm);cursor:pointer;}
.btn-apply{background:var(--success);color:#fff;border:none;border-radius:6px;padding:4px 10px;font-size:var(--fs-xs);cursor:pointer;}
.thumb{width:36px;height:36px;border-radius:4px;object-fit:cover;background:var(--bg-surface);}
/* === PAGE: invoices_v2_redesign === */
.inv-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20px;
}
.inv-header-title {
font-size: var(--fs-1lg);
font-weight: 700;
color: var(--text-1);
}
.inv-header-meta {
font-size: var(--fs-sm);
color: var(--text-3);
font-variant-numeric: tabular-nums;
}
.src-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
gap: 14px;
}
.src-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
}
.src-card-header {
padding: 12px 16px;
border-bottom: 1px solid var(--border);
display: flex;
justify-content: space-between;
align-items: center;
}
.src-card-title {
font-size: var(--fs-md);
font-weight: 600;
color: var(--text-1);
}
.src-card-count {
font-size: var(--fs-sm);
font-weight: 400;
color: var(--text-3);
margin-left: 6px;
font-variant-numeric: tabular-nums;
}
.src-card-updated {
font-size: var(--fs-xs);
color: var(--text-4);
font-variant-numeric: tabular-nums;
}
.month-link {
display: flex;
justify-content: space-between;
align-items: center;
padding: 9px 16px;
border-bottom: 1px solid var(--border);
font-size: var(--fs-2sm);
text-decoration: none;
color: var(--text-2);
transition: background .1s;
}
.month-link:last-child { border-bottom: none; }
.month-link:hover { background: var(--nav-hover); color: var(--text-1); }
.month-link-right {
display: flex;
gap: 12px;
align-items: center;
}
.month-amount {
font-size: var(--fs-sm);
font-variant-numeric: tabular-nums;
color: var(--text-3);
}
.month-count {
font-size: var(--fs-xs);
color: var(--text-4);
font-variant-numeric: tabular-nums;
background: var(--bg-page);
border: 1px solid var(--border);
border-radius: 9999px;
padding: 1px 8px;
}
/* === PAGE: kaufland_coverage_v2_redesign === */
.kpi-progress{margin-top:8px;background:var(--bg-surface);border-radius:99px;height:6px;overflow:hidden;}
.kpi-bar{height:6px;border-radius:99px;transition:width .3s;}
html.dark .v2-table th{background:#1e293b;}
.filter-form{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;}
.filter-group{display:flex;flex-direction:column;gap:4px;}
/* .filter-label canonical — dedup */
.filter-input,.filter-select{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);
padding:6px 10px;font-size:var(--fs-sm);color:var(--text-1);}
.filter-input:focus,.filter-select:focus{outline:none;border-color:var(--text-1);}
.btn-success{background:var(--success);color:#fff;border:none;border-radius:var(--r-sm);padding:7px 18px;
font-size:var(--fs-sm);font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px;text-decoration:none;}
.btn-success:hover{opacity:.88;}
.pager{display:flex;align-items:center;justify-content:space-between;margin-top:14px;flex-wrap:wrap;gap:8px;}
.pager-info{font-size:var(--fs-xs);color:var(--text-3);}
.pager-btns{display:flex;gap:6px;}
.pager-btn{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);
padding:5px 12px;font-size:var(--fs-xs);cursor:pointer;color:#374151;}
.pager-btn:hover{background:var(--bg-surface);}
.pager-btn:disabled{opacity:.35;cursor:default;}
.badge-blocked{background:color-mix(in srgb,var(--danger) 15%,transparent);color:var(--danger);}
.badge-unavail{background:color-mix(in srgb,var(--warn) 15%,transparent);color:var(--warn);}
.badge-nostatus{background:var(--bg-surface);color:var(--text-3);}
.type-badge{display:inline-flex;align-items:center;font-size:var(--fs-xs);font-weight:700;padding:2px 6px;border-radius:4px;}
/* === PAGE: kaufland_mapping_add_v2_redesign === */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
@media(max-width:640px){.two-col{grid-template-columns:1fr;}}
.search-input{width:100%;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);
padding:7px 10px;font-size:var(--fs-sm);color:var(--text-1);}
.search-input:focus{outline:none;border-color:var(--text-1);}
.btn-search{background:#1e293b;color:#fff;border:none;border-radius:var(--r-sm);
padding:7px 14px;font-size:var(--fs-sm);cursor:pointer;white-space:nowrap;}
.mini-table{width:100%;border-collapse:collapse;font-size:var(--fs-sm);}
.mini-table th{background:var(--bg-page);color:var(--text-3);font-size:var(--fs-xs);
text-transform:uppercase;letter-spacing:.5px;padding:6px 8px;border-bottom:1px solid var(--border);}
.mini-table td{padding:6px 8px;border-bottom:1px solid var(--border);color:var(--text-2);cursor:pointer;}
.mini-table tr:hover td{background:color-mix(in srgb,var(--success) 8%,var(--bg-surface));}
.mini-table tr.selected td{background:color-mix(in srgb,var(--success) 15%,var(--bg-surface));}
.scroll-box{border:1px solid var(--border);border-radius:var(--r-sm);max-height:280px;overflow-y:auto;}
.selected-badge{font-size:var(--fs-xs);color:var(--success);font-weight:600;margin-top:6px;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px;}
.form-group label{display:block;font-size:var(--fs-xs);color:var(--text-3);margin-bottom:3px;}
.form-group input{width:100%;background:var(--bg-surface);border:1px solid var(--border);
border-radius:var(--r-sm);padding:6px 10px;font-size:var(--fs-sm);color:var(--text-1);}
html.dark .btn-primary{background:#e2e8f0;color:#0f172a;}
/* === PAGE: kaufland_category_setup_v2_redesign === */
.stepper{display:flex;gap:0;margin-bottom:20px;background:var(--bg-surface);border:1px solid var(--border);
border-radius:8px;padding:14px 18px;flex-wrap:wrap;gap:8px;}
.step-item{display:flex;align-items:center;gap:8px;font-size:var(--fs-sm);}
.step-num{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;
font-size:var(--fs-xs);font-weight:700;}
.step-num.active{background:#1e293b;color:#fff;}
.step-num.done{background:var(--success);color:#fff;}
.step-num.pending{background:var(--bg-page);color:var(--text-3);border:1px solid var(--border);}
.step-label.active{color:var(--text-1);font-weight:600;}
.step-label.pending{color:var(--text-3);}
.step-label.done{color:var(--success);}
.step-sep{color:var(--border);margin:0 4px;}
html.dark .v2-table th{background:#1e293b;}
html.dark .btn-primary{background:#e2e8f0;color:#0f172a;}
input[type=text],input[type=search]{background:var(--bg-surface);border:1px solid var(--border);
border-radius:var(--r-sm);padding:7px 10px;font-size:var(--fs-sm);color:var(--text-1);}
input[type=checkbox]{accent-color:var(--text-1);}
/* ── Vendor PO bulk-select (Открыть выбранное) ── */
.bulk-bar{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;
margin-bottom:var(--space-4);padding:var(--space-3) var(--space-4);
background:var(--bg-surface);border:1px solid var(--border-strong);
border-radius:var(--radius-card);}
.bulk-bar-count{font-weight:600;color:var(--text-1);}
.bulk-bar-spacer{flex:1;}
.chk-col{width:34px;text-align:center;}
.chk-col input[type=checkbox]{cursor:pointer;width:15px;height:15px;}
/* ленивый выбор действия (без нативного select на каждой строке) */
.agg-act .act-pick{display:inline-block;cursor:pointer;background:var(--bg-surface);
border:1px solid var(--border);border-radius:var(--r-sm);padding:5px 8px;
font-size:var(--fs-sm);color:var(--text-1);min-width:150px;}
.agg-act .act-pick[data-empty]{color:var(--text-3);}
.agg-act .act-pick:hover{border-color:var(--text-3);}
.agg-search-input{min-width:240px;}
.bord-top{border-top:1px solid var(--border);}
.bord-left{border-left:1px solid var(--border);}
.cat-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);
padding:10px 12px;cursor:pointer;transition:border-color .12s;}
.cat-card:hover,.cat-card.selected{border-color:var(--text-1);}
.cat-card.selected{background:var(--bg-page);}
/* === PAGE: agent_runs_v2_redesign === */
/* v7 page helpers */
.pg-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:20px;flex-wrap:wrap;}
/* .pg-title canonical — dedup (см. глобальный) */
.pg-sub{font-size:var(--fs-sm);color:var(--text-3);margin-top:2px;}
.kpi-val{font-size: var(--fs-section);font-weight:700;color:var(--text-1);}
.card{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;padding:16px 18px;margin-bottom:14px;}
.card-header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:14px;flex-wrap:wrap;}
/* .card-title canonical — dedup (см. выше) */
/* .v2-label, .v2-input, .btn-primary, .btn-ghost — defined in layout_v3.html */
.data-table{width:100%;border-collapse:collapse;font-size:var(--fs-sm);}
.data-table th{background:var(--bg-page);color:var(--text-3);font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.4px;padding:8px 10px;border-bottom:1px solid var(--border);white-space:nowrap;font-weight:600;}
.data-table td{padding:8px 10px;border-bottom:1px solid var(--border);color:var(--text-2);vertical-align:middle;}
.data-table tr:hover td{background:var(--bg-page);}
.data-table td.num{text-align:right;font-variant-numeric:tabular-nums;}
html.dark .badge-green{color:#4ade80;}
html.dark .badge-red{color:#f87171;}
.badge-amber{background:rgba(245,158,11,.1);color:#d97706;}
html.dark .badge-amber{color:#fbbf24;}
html.dark .badge-blue{color:#60a5fa;}
/* === PAGE: kaufland_search_v2_redesign === */
html.dark .v2-table th{background:#1e293b;}
.filter-row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:16px;}
.filter-row input,.filter-row select{background:var(--bg-surface);border:1px solid var(--border);
border-radius:var(--r-sm);padding:7px 10px;font-size:var(--fs-sm);color:var(--text-1);}
html.dark .btn-primary{background:#e2e8f0;color:#0f172a;}
.expand-btn{background:none;border:none;cursor:pointer;color:var(--text-3);font-size:var(--fs-sm);padding:2px 6px;}
.variant-row{background:var(--bg-surface);}
.badge-avail{display:inline-block;padding:1px 8px;border-radius:99px;font-size:var(--fs-xs);
background:color-mix(in srgb,var(--success) 15%,transparent);color:var(--success);}
.badge-inactive{display:inline-block;padding:1px 8px;border-radius:99px;font-size:var(--fs-xs);
background:var(--bg-surface);color:var(--text-3);}
/* === PAGE: kaufland_ticket_detail_v2_redesign === */
.meta-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:16px;}
.meta-item{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);padding:10px 12px;}
.meta-label{font-size:var(--fs-xs);color:var(--text-3);margin-bottom:3px;}
.meta-val{font-size:var(--fs-sm);font-weight:600;color:var(--text-1);}
.msg-bubble{max-width:75%;padding:12px 14px;border-radius:8px;margin-bottom:10px;}
.msg-seller{background:color-mix(in srgb,var(--success) 8%,var(--bg-surface));border:1px solid color-mix(in srgb,var(--success) 25%,transparent);margin-left:auto;}
.msg-buyer{background:color-mix(in srgb,var(--text-1) 5%,var(--bg-surface));border:1px solid var(--border);}
.msg-system{background:var(--bg-surface);border:1px solid var(--border);}
.msg-author{font-size:var(--fs-xs);font-weight:600;margin-bottom:4px;}
.msg-time{font-size:var(--fs-xs);color:var(--text-3);margin-left:8px;}
.msg-text{font-size:var(--fs-sm);color:var(--text-1);white-space:pre-wrap;}
/* === PAGE: ebay_dashboard_v2_redesign === */
/* eBay account tabs */
.acc-tab { padding:10px 18px; font-size: var(--fs-2sm); font-weight:500; color:var(--text-3); cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px; background:none; border-left:none; border-right:none; border-top:none; transition:all .12s; }
.acc-tab:hover { color:var(--text-1); background:var(--bg-page); }
.acc-tab.act { color:var(--text-1); border-bottom-color:var(--text-1); font-weight:700; }
.acc-panel { display:none; }
.acc-panel.act { display:block; }
/* Status colors */
.status-ok { color:#16a34a; font-size:var(--fs-xs); }
.status-warn { color:#d97706; font-size:var(--fs-xs); }
.status-err { color:#dc2626; font-size:var(--fs-xs); }
html.dark .status-ok { color:#4ade80; }
html.dark .status-warn { color:#fbbf24; }
html.dark .status-err { color:#f87171; }
/* === PAGE: listing_kanban_v2_redesign === */
.kb-wrap { padding: 16px 20px; max-width: 1800px; margin: 0 auto; }
.kb-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-bottom: 16px; }
@media(min-width: 640px){ .kb-stats { grid-template-columns: repeat(4, 1fr); } }
.kb-stat { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 8px; padding: 12px; }
.kb-stat-label { font-size: var(--fs-xs); color: var(--text-3); margin-bottom: 4px; }
.kb-stat-val { font-size: var(--fs-section); font-weight: 700; font-variant-numeric: tabular-nums; }
.kb-filter { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 16px; padding: 12px 14px; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 8px; }
.kb-filter-select { background: var(--bg-page); border: 1px solid var(--border); color: var(--text-1); font-size: var(--fs-sm); border-radius: 6px; padding: 5px 8px; }
.kb-filter-select:focus { outline: none; border-color: #3b82f6; }
html.dark .kb-filter-select { background: #0f172a; }
.kb-filter-label { font-size: var(--fs-sm); color: var(--text-3); }
.kb-btn-apply { background: #0284c7; color: #fff; border: none; border-radius: 6px; padding: 5px 12px; font-size: var(--fs-sm); cursor: pointer; }
.kb-btn-apply:hover { background: #0369a1; }
.kb-btn-reset { background: var(--bg-page); border: 1px solid var(--border); color: var(--text-2); border-radius: 6px; padding: 5px 12px; font-size: var(--fs-sm); text-decoration: none; }
.kb-columns { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media(min-width: 640px){ .kb-columns { grid-template-columns: repeat(3, 1fr); } }
.kb-col { background: var(--bg-page); border: 1px solid var(--border); border-radius: 8px; padding: 12px; min-height: 60vh; }
.kb-col-todo { border-top: 3px solid #f59e0b; }
.kb-col-in_progress { border-top: 3px solid #0ea5e9; }
.kb-col-done { border-top: 3px solid #10b981; }
.kb-col-h { font-size: var(--fs-2sm); font-weight: 600; color: var(--text-1); margin-bottom: 8px; display: flex; align-items: center; justify-content: space-between; }
.kb-card { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 6px; padding: 8px 10px; cursor: grab; margin-bottom: 8px; transition: border-color .12s; }
.kb-card:hover { border-color: #94a3b8; }
.kb-badge-crit { background: rgba(239,68,68,.12); color: #dc2626; border-radius: 4px; font-size: var(--fs-xs); padding: 1px 5px; }
.kb-badge-warn { background: rgba(245,158,11,.12); color: #d97706; border-radius: 4px; font-size: var(--fs-xs); padding: 1px 5px; }
.kb-badge-mp { background: var(--bg-page); color: var(--text-3); border: 1px solid var(--border); border-radius: 4px; font-size: var(--fs-xs); padding: 1px 5px; }
.kb-input-sm { background: var(--bg-page); border: 1px solid var(--border); color: var(--text-1); font-size: var(--fs-xs); border-radius: 4px; padding: 2px 6px; }
.kb-btn-run { background: #059669; color: #fff; border: none; border-radius: 6px; padding: 8px 16px; font-size: var(--fs-2sm); font-weight: 500; cursor: pointer; white-space: nowrap; }
.kb-btn-run:hover:not(:disabled) { background: #047857; }
.kb-btn-run:disabled { opacity: .5; cursor: not-allowed; }
.kb-btn-analysis { background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-2); border-radius: 6px; padding: 8px 14px; font-size: var(--fs-sm); text-decoration: none; }
.kb-btn-analysis:hover { background: var(--bg-page); }
.kb-error { background: rgba(239,68,68,.06); border: 1px solid rgba(239,68,68,.3); border-radius: 8px; padding: 10px 14px; margin-bottom: 16px; font-size: var(--fs-2sm); color: #dc2626; }
/* === PAGE: amazon_coverage_v2_redesign === */
/* ── Coverage legend cells ── */
.cov-cell {
font-size: var(--fs-xs); font-weight: 700; text-align: center;
padding: 4px 8px; border-radius: 4px; min-width: 44px;
display: inline-block; font-variant-numeric: tabular-nums;
}
.cell-ok { background: rgba(16,185,129,.12); color: #15803d; border: 1px solid rgba(16,185,129,.3); }
.cell-warn { background: rgba(245,158,11,.12); color: #92400e; border: 1px solid rgba(245,158,11,.3); }
.cell-miss { background: #f8fafc; color: var(--text-4); border: 1px solid var(--border); }
html.dark .cell-ok { background: rgba(16,185,129,.12); color: #34d399; border-color: rgba(16,185,129,.25); }
html.dark .cell-warn { background: rgba(245,158,11,.12); color: #fcd34d; border-color: rgba(245,158,11,.25); }
html.dark .cell-miss { background: #111827; }
.backfill-badge { font-size: var(--fs-2xs); font-weight: 600; padding: 3px 8px; border-radius: 10px; }
.backfill-ok { background: #dcfce7; color: #15803d; }
.backfill-pending { background: #fef3c7; color: #92400e; }
html.dark .backfill-ok { background: rgba(16,185,129,.15); color: #34d399; }
html.dark .backfill-pending { background: rgba(245,158,11,.15); color: #fcd34d; }
.cov-loading { text-align: center; padding: 40px; color: var(--text-3); font-size: var(--fs-2sm); }
.cov-spinner { display: inline-block; width: 20px; height: 20px; border: 2px solid var(--border);
border-top-color: #6366f1; border-radius: 50%; animation: spin .8s linear infinite;
vertical-align: middle; margin-right: 8px; }
@keyframes spin { to { transform: rotate(360deg); } }
/* === PAGE: logistics_tracking_v2_redesign === */
/* ── Page wrapper ── */
.lt-page { padding: 24px; max-width: 960px; }
/* ── Section card ── */
.lt-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
margin-bottom: 16px;
}
.lt-card-header {
padding: 14px 18px;
border-bottom: 1px solid var(--border);
display: flex;
align-items: center;
gap: 8px;
}
.lt-card-title { font-size: var(--fs-md); font-weight: 600; color: var(--text-1); }
.lt-card-back { font-size: var(--fs-sm); color: #3b82f6; text-decoration: none; }
.lt-card-back:hover { text-decoration: underline; }
.lt-card-body { padding: 16px 18px; }
/* ── Search form ── */
.lt-search-row {
display: flex;
gap: 8px;
}
.lt-search-input {
flex: 1;
border: 1px solid var(--border);
border-radius: 7px;
padding: 9px 13px;
font-size: var(--fs-2sm);
background: var(--bg-page);
color: var(--text-1);
outline: none;
transition: border-color .15s;
}
.lt-search-input:focus { border-color: #3b82f6; }
html.dark .lt-search-input { background: var(--bg-page); }
.lt-btn-primary {
padding: 9px 18px;
font-size: var(--fs-2sm);
font-weight: 500;
border: none;
border-radius: 7px;
background: #3b82f6;
color: #fff;
cursor: pointer;
transition: background .15s;
white-space: nowrap;
}
.lt-btn-primary:hover { background: #2563eb; }
/* ── Result sections ── */
.lt-result-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
margin-bottom: 16px;
}
@media (max-width: 700px) { .lt-result-grid { grid-template-columns: 1fr; } }
.lt-result-box {
background: var(--bg-page);
border: 1px solid var(--border);
border-radius: 8px;
padding: 14px 16px;
}
.lt-result-box h3 {
font-size: var(--fs-2sm);
font-weight: 600;
color: var(--text-2);
margin-bottom: 10px;
display: flex;
align-items: center;
gap: 6px;
}
.lt-meta {
font-size: var(--fs-2sm);
color: var(--text-2);
padding: 4px 0;
border-bottom: 1px solid var(--border);
display: flex;
gap: 6px;
}
.lt-meta:last-child { border-bottom: none; }
.lt-meta-label { color: var(--text-4); min-width: 110px; flex-shrink: 0; }
.lt-meta code {
font-family: 'SFMono-Regular', Consolas, monospace;
font-size: var(--fs-sm);
background: rgba(0,0,0,.04);
border-radius: 4px;
padding: 1px 5px;
}
html.dark .lt-meta code { background: rgba(255,255,255,.07); }
/* ── Action row ── */
.lt-action-row {
display: flex;
gap: 8px;
flex-wrap: wrap;
margin-top: 14px;
padding-top: 14px;
border-top: 1px solid var(--border);
}
.lt-btn-warn {
padding: 8px 14px;
font-size: var(--fs-2sm);
font-weight: 500;
border: none;
border-radius: 7px;
background: rgba(245,158,11,.1);
color: #d97706;
cursor: pointer;
text-decoration: none;
transition: background .15s;
}
.lt-btn-warn:hover { background: rgba(245,158,11,.18); }
.lt-btn-blue {
padding: 8px 14px;
font-size: var(--fs-2sm);
font-weight: 500;
border: none;
border-radius: 7px;
background: rgba(59,130,246,.1);
color: #3b82f6;
cursor: pointer;
text-decoration: none;
transition: background .15s;
}
.lt-btn-blue:hover { background: rgba(59,130,246,.18); }
/* ── API pre block ── */
.lt-api-pre {
font-size: var(--fs-xs);
background: var(--bg-page);
border: 1px solid var(--border);
border-radius: 8px;
padding: 14px 16px;
max-height: 280px;
overflow: auto;
color: var(--text-2);
font-family: 'SFMono-Regular', Consolas, monospace;
white-space: pre-wrap;
word-break: break-all;
}
/* === PAGE: mappings_v2_redesign === */
/* ── Drop zone ── */
.map-dropzone {
border: 2px dashed var(--border);
border-radius: 10px;
padding: 28px 20px;
text-align: center;
cursor: pointer;
background: var(--bg-page);
transition: background .15s, border-color .15s;
margin-bottom: 16px;
}
.map-dropzone:hover,
.map-dropzone.drag-over {
background: rgba(59,130,246,.05);
border-color: #3b82f6;
}
.map-dropzone-title {
font-size: var(--fs-md);
font-weight: 600;
color: var(--text-1);
margin-bottom: 4px;
}
.map-dropzone-hint {
font-size: var(--fs-sm);
color: var(--text-3);
margin-top: 3px;
}
.map-log {
background: var(--bg-page);
border: 1px solid var(--border);
border-radius: 7px;
padding: 10px 14px;
font-family: 'SFMono-Regular', 'Consolas', monospace;
font-size: var(--fs-sm);
max-height: 120px;
overflow: auto;
display: none;
margin-bottom: 16px;
color: var(--text-2);
}
/* ── Section card ── */
.map-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
margin-bottom: 16px;
}
.map-card-header {
padding: 14px 18px;
border-bottom: 1px solid var(--border);
display: flex;
align-items: center;
justify-content: space-between;
}
.map-card-title {
font-size: var(--fs-md);
font-weight: 600;
color: var(--text-1);
}
/* ── Table ── */
.map-table {
width: 100%;
border-collapse: collapse;
font-size: var(--fs-2sm);
}
.map-table th {
background: var(--bg-page);
color: var(--text-3);
font-size: var(--fs-xs);
font-weight: 600;
text-transform: uppercase;
letter-spacing: .05em;
padding: 9px 14px;
border-bottom: 1px solid var(--border);
white-space: nowrap;
}
.map-table td {
padding: 9px 14px;
border-bottom: 1px solid var(--border);
color: var(--text-2);
vertical-align: middle;
}
.map-table tr:last-child td { border-bottom: none; }
.map-table tr:hover td { background: var(--nav-hover); }
.map-mono {
font-variant-numeric: tabular-nums;
font-size: var(--fs-sm);
}
.map-type-pill {
display: inline-block;
font-size: var(--fs-xs);
font-weight: 500;
padding: 2px 9px;
border-radius: 9999px;
background: var(--bg-page);
border: 1px solid var(--border);
color: var(--text-3);
}
.map-arrow {
color: var(--text-4);
font-size: var(--fs-2sm);
}
.map-empty {
text-align: center;
padding: 32px 20px;
color: var(--text-4);
font-size: var(--fs-2sm);
}
/* === PAGE: mp_attrs_canonical_v2_redesign === */
.badge-amber{display:inline-block;padding:1px 8px;border-radius:99px;font-size:var(--fs-xs);
background:color-mix(in srgb,var(--warn) 15%,transparent);color:var(--warn);}
.pill-filter{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:99px;
background:color-mix(in srgb,#1e293b 15%,transparent);color:var(--text-1);
font-size:var(--fs-xs);}
/* === PAGE: kaufland_listing_v2_redesign === */
/* ── page-level overrides ── */
/* removed global .v3-content override — ломал скролл на всех страницах (2026-06-03) */
/* ── page header bar ── */
.pg-header {
flex-shrink: 0;
padding: 12px 20px;
background: var(--bg-surface);
border-bottom: 1px solid var(--border);
display: flex; align-items: center; gap: 16px;
}
/* .pg-title canonical — dedup (см. глобальный) */
.pg-sub { font-size: var(--fs-xs); color: var(--text-3); margin-top: 2px; }
.kl-badge {
font-size: var(--fs-2xs); font-weight: 700; padding: 2px 7px;
border-radius: 4px; background: #dc2626; color: #fff;
letter-spacing: .04em;
}
/* ── global search ── */
.gs-wrap { position: relative; width: 280px; flex-shrink: 0; }
.gs-input {
width: 100%; background: var(--bg-page);
border: 1.5px solid var(--border); border-radius: 8px;
padding: 7px 32px 7px 10px; font-size: var(--fs-sm);
color: var(--text-1); outline: none;
transition: border-color .15s;
}
.gs-input:focus { border-color: #3b82f6; }
html.dark .gs-input { background: #0f172a; }
.gs-dd {
position: absolute; top: calc(100% + 4px); left: 0; right: 0;
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,.1);
z-index: 50; max-height: 320px; overflow-y: auto;
}
.gs-item {
padding: 8px 12px; cursor: pointer;
border-bottom: 1px solid var(--border);
display: flex; align-items: center; gap: 8px;
transition: background .1s;
}
.gs-item:hover { background: var(--bg-page); }
.gs-item:last-child { border-bottom: none; }
/* ── split layout ── */
.split { flex: 1; display: grid; grid-template-columns: 264px 5px 1fr; overflow: hidden; min-height: 0; }
/* ── resizable splitter handle ── */
.split-handle {
background: var(--border);
cursor: col-resize;
transition: background .15s;
user-select: none;
position: relative;
z-index: 5;
}
.split-handle:hover,
.split-handle.dragging { background: #3b82f6; }
.split-handle::before {
content: '';
position: absolute;
top: 50%; left: 50%;
transform: translate(-50%, -50%);
width: 2px; height: 28px;
background: var(--text-4);
border-radius: 2px;
opacity: .5;
transition: opacity .15s;
}
.split-handle:hover::before { opacity: 0; }
/* ── tree pane ── */
.tree-pane {
border-right: 1px solid var(--border);
background: var(--bg-surface);
display: flex; flex-direction: column; overflow: hidden;
}
.tree-pane-hd {
padding: 8px 12px; border-bottom: 1px solid var(--border);
display: flex; align-items: center; justify-content: space-between;
flex-shrink: 0;
}
.tree-pane-label { font-size: var(--fs-2xs); font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--text-4); }
.tree-scroll { flex: 1; overflow-y: auto; padding: 4px; }
.tree-node {
display: flex; align-items: center; gap: 3px;
padding: 4px 6px; border-radius: 5px; cursor: pointer;
transition: background .1s;
}
.tree-node:hover { background: var(--bg-page); }
.tree-node.selected { background: rgba(220,38,38,.08); border-left: 2px solid #dc2626; }
.tree-node-toggle { width: 14px; font-size: var(--fs-3xs); color: var(--text-4); flex-shrink: 0; text-align: center; }
.tree-node-name { font-size: var(--fs-xs); flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; min-width: 0; }
.tree-badge {
font-size: var(--fs-4xs); font-weight: 700; padding: 0 4px;
border-radius: 3px; flex-shrink: 0;
}
.tb-kl { background: #dc2626; color: #fff; }
.tb-live { background: #dcfce7; color: #16a34a; }
.tb-off { background: var(--bg-page); color: var(--text-4); }
.tb-ak { background: #fef3c7; color: #b45309; }
.tb-sale { background: #fee2e2; color: #dc2626; }
/* ── articles pane ── */
.art-pane { display: flex; flex-direction: column; overflow: hidden; background: var(--bg-page); }
.art-pane-hd {
padding: 10px 16px; background: var(--bg-surface);
border-bottom: 1px solid var(--border); flex-shrink: 0;
}
.art-chips {
display: flex; gap: 5px; align-items: center;
padding: 7px 12px; background: var(--bg-surface);
border-bottom: 1px solid var(--border); flex-shrink: 0;
}
.art-chip {
border: 1px solid var(--border); border-radius: 20px;
padding: 3px 10px; font-size: var(--fs-xs); font-weight: 500;
cursor: pointer; transition: all .12s;
background: var(--bg-page); color: var(--text-3);
}
.art-chip:hover { background: var(--border); color: var(--text-1); }
.art-chip.active { background: var(--text-1); color: var(--bg-surface); border-color: var(--text-1); }
/* warn banner */
.warn-banner {
padding: 7px 16px; background: #fef3c7;
border-bottom: 1px solid #f59e0b;
display: flex; align-items: center; justify-content: space-between;
flex-shrink: 0;
}
html.dark .warn-banner { background: rgba(245,158,11,.1); border-color: rgba(245,158,11,.3); }
.warn-banner span { font-size: var(--fs-sm); color: #b45309; font-weight: 500; }
html.dark .warn-banner span { color: #f59e0b; }
/* ── table ── */
.art-scroll { flex: 1; overflow-y: auto; }
.kl-table { width: 100%; border-collapse: collapse; }
.kl-table th {
background: var(--bg-surface); color: var(--text-4);
font-size: var(--fs-2xs); font-weight: 700; text-transform: uppercase;
letter-spacing: .07em; padding: 8px 10px; text-align: left;
border-bottom: 1px solid var(--border);
position: sticky; top: 0; z-index: 2; white-space: nowrap;
}
.kl-table td {
padding: 8px 10px; border-bottom: 1px solid var(--border);
vertical-align: middle; font-size: var(--fs-sm); color: var(--text-2);
}
.kl-table tr:last-child td { border-bottom: none; }
.kl-table tr:hover td { background: var(--bg-surface); }
.kl-table td.mono { font-family: 'JetBrains Mono', monospace; font-size: var(--fs-xs); }
.kl-table td.num { text-align: right; font-family: 'JetBrains Mono', monospace; font-size: var(--fs-xs); }
/* status pill */
.spill {
display: inline-flex; align-items: center;
font-size: var(--fs-2xs); font-weight: 600; padding: 2px 7px;
border-radius: 99px; white-space: nowrap;
}
.spill-green { background: #dcfce7; color: #16a34a; }
.spill-red { background: #fee2e2; color: #dc2626; }
.spill-amber { background: #fef3c7; color: #b45309; }
.spill-slate { background: var(--bg-page); color: var(--text-3); border: 1px solid var(--border); }
html.dark .spill-green { background: rgba(22,163,74,.15); color: #4ade80; }
html.dark .spill-red { background: rgba(220,38,38,.15); color: #f87171; }
html.dark .spill-amber { background: rgba(180,83,9,.15); color: #fbbf24; }
/* action buttons */
.act-btn {
font-size: var(--fs-2xs); font-weight: 600; padding: 2px 7px;
border-radius: 5px; cursor: pointer; border: none;
text-decoration: none; display: inline-flex; align-items: center;
transition: opacity .12s;
}
.act-btn:hover { opacity: .8; }
.act-btn-ghost { background: var(--bg-page); color: var(--text-3); border: 1px solid var(--border); }
.act-btn-primary { background: #1e293b; color: #fff; }
html.dark .act-btn-primary { background: #e2e8f0; color: #0f172a; }
.act-btn-green { background: #dcfce7; color: #16a34a; border: 1px solid #bbf7d0; }
.act-btn-red { background: #fee2e2; color: #dc2626; border: 1px solid #fecaca; }
html.dark .act-btn-green { background: rgba(22,163,74,.15); color: #4ade80; border-color: rgba(74,222,128,.2); }
html.dark .act-btn-red { background: rgba(220,38,38,.15); color: #f87171; border-color: rgba(248,113,113,.2); }
/* empty / spinner */
.empty-pane {
display: flex; flex-direction: column; align-items: center;
justify-content: center; flex: 1;
color: var(--text-3); padding: 40px; text-align: center;
}
.spinner {
width: 28px; height: 28px;
border: 3px solid var(--border);
border-top-color: #dc2626;
border-radius: 50%;
animation: spin .8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
/* btn reset */
.icon-btn {
width: 28px; height: 28px; border-radius: 6px;
border: 1px solid var(--border); background: var(--bg-page);
cursor: pointer; display: flex; align-items: center;
justify-content: center; color: var(--text-3);
transition: background .12s, color .12s;
}
.icon-btn:hover { background: var(--border); color: var(--text-1); }
/* === PAGE: kaufland_tickets_v2_redesign === */
.pg-wrap { padding: 20px 24px; max-width: 1400px; }
/* ── page header ── */
.pg-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
/* .pg-title canonical — dedup (см. глобальный) */
.pg-sub { font-size: var(--fs-sm); color: var(--text-3); margin-top: 3px; }
/* ── alert card ── */
.alert-card {
background: var(--bg-surface); border: 1px solid var(--border);
border-left: 3px solid #f59e0b; border-radius: 10px; padding: 16px 18px;
margin-bottom: 16px;
}
.alert-card-title { font-size: var(--fs-md); font-weight: 600; color: #b45309; margin-bottom: 8px; }
html.dark .alert-card-title { color: #fbbf24; }
.alert-card pre {
background: var(--bg-page); border: 1px solid var(--border);
border-radius: 7px; padding: 12px; font-size: var(--fs-xs);
overflow-x: auto; line-height: 1.6; color: var(--text-2);
}
/* ── filter row ── */
.filter-bar {
display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end;
margin-bottom: 16px;
}
.filter-select {
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: 7px; padding: 7px 10px; font-size: var(--fs-2sm);
color: var(--text-1); outline: none; min-width: 180px;
transition: border-color .15s;
}
.filter-select:focus { border-color: #3b82f6; }
html.dark .filter-select { background: #0f172a; }
html.dark .btn-primary { background: #e2e8f0; color: #0f172a; }
/* ── table card ── */
.table-card {
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: 10px; overflow: hidden;
}
.table-card-hd {
display: flex; align-items: center; justify-content: space-between;
padding: 14px 18px; border-bottom: 1px solid var(--border);
}
.table-card-title { font-size: var(--fs-md); font-weight: 600; color: var(--text-1); }
.v7-table { width: 100%; border-collapse: collapse; }
.v7-table th {
background: #f8fafc; color: #94a3b8;
font-size: var(--fs-2xs); font-weight: 700; text-transform: uppercase; letter-spacing: .07em;
padding: 10px 14px; text-align: left; border-bottom: 1px solid var(--border);
white-space: nowrap;
}
html.dark .v7-table th { background: #1e293b; color: #64748b; }
.v7-table td {
padding: 11px 14px; border-bottom: 1px solid var(--border);
vertical-align: middle; font-size: var(--fs-2sm); color: var(--text-2);
}
.v7-table tr:last-child td { border-bottom: none; }
.v7-table tr:hover td { background: #f8fafc; }
html.dark .v7-table tr:hover td { background: rgba(255,255,255,.02); }
.v7-table td.mono { font-family: 'JetBrains Mono', monospace; font-size: var(--fs-xs); }
/* ── badge ── */
.msg-badge {
display: inline-flex; align-items: center; justify-content: center;
min-width: 22px; height: 20px; padding: 0 7px;
background: #eff6ff; color: #2563eb;
border-radius: 99px; font-size: var(--fs-xs); font-weight: 600;
font-family: 'JetBrains Mono', monospace;
}
html.dark .msg-badge { background: rgba(37,99,235,.15); color: #60a5fa; }
/* ── status pill ── */
.spill {
display: inline-flex; align-items: center;
font-size: var(--fs-xs); font-weight: 500; padding: 2px 8px;
border-radius: 99px; white-space: nowrap;
}
.spill-green { background: #dcfce7; color: #16a34a; }
.spill-red { background: #fee2e2; color: #dc2626; }
.spill-amber { background: #fef3c7; color: #b45309; }
.spill-slate { background: var(--bg-page); color: var(--text-3); border: 1px solid var(--border); }
html.dark .spill-green { background: rgba(22,163,74,.15); color: #4ade80; }
html.dark .spill-red { background: rgba(220,38,38,.15); color: #f87171; }
html.dark .spill-amber { background: rgba(180,83,9,.15); color: #fbbf24; }
/* ── msg role indicator ── */
.role-buyer { color: #2563eb; }
.role-seller { color: #16a34a; }
.role-system { color: var(--text-4); }
/* ── empty state ── */
/* ── pagination ── */
.pager {
display: flex; align-items: center; justify-content: space-between;
padding: 12px 18px; border-top: 1px solid var(--border);
flex-wrap: wrap; gap: 8px;
}
.pager-info { font-size: var(--fs-sm); color: var(--text-3); }
.pager-btns { display: flex; gap: 6px; }
.pager-btn {
background: var(--bg-page); border: 1px solid var(--border);
border-radius: 6px; padding: 5px 12px; font-size: var(--fs-sm);
cursor: pointer; text-decoration: none; color: var(--text-2);
transition: background .12s;
}
.pager-btn:hover { background: var(--border); }
/* === PAGE: listing_analysis_landing_v2_redesign === */
.kpi-val{font-size:var(--fs-xl);font-weight:700;color:var(--text-1);}
.v2-page-h{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:20px;}
.v2-page-title{font-size:var(--fs-xl);font-weight:700;color:var(--text-1);letter-spacing:-0.3px;}
.v2-page-sub{margin-top:4px;font-size:var(--fs-sm);color:var(--text-3);}
.sort-link{display:flex;align-items:center;gap:4px;color:inherit;font-weight:inherit}
.sort-link:hover{color:var(--text-1)}
.sort-arrow{color:var(--text-3);font-size: var(--fs-2xs)}
.sort-arrow.active{color:var(--text-1)}
.score-bar{height:6px;border-radius:3px;background:var(--border)}
.score-fill{height:100%;border-radius:3px}
/* === PAGE: invoices_list_v2_redesign === */
.invl-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
}
.invl-card-header {
padding: 14px 18px;
border-bottom: 1px solid var(--border);
display: flex;
align-items: baseline;
justify-content: space-between;
}
.invl-card-title {
font-size: var(--fs-md);
font-weight: 700;
color: var(--text-1);
}
.invl-card-meta {
font-size: var(--fs-sm);
color: var(--text-3);
}
.invl-table {
width: 100%;
border-collapse: collapse;
font-size: var(--fs-2sm);
}
.invl-table th {
background: var(--bg-page);
color: var(--text-3);
font-size: var(--fs-xs);
font-weight: 600;
text-transform: uppercase;
letter-spacing: .05em;
padding: 9px 14px;
border-bottom: 1px solid var(--border);
white-space: nowrap;
}
.invl-table td {
padding: 9px 14px;
border-bottom: 1px solid var(--border);
color: var(--text-2);
vertical-align: middle;
}
.invl-table tr:last-child td { border-bottom: none; }
.invl-table tr:hover td { background: var(--nav-hover); }
.invl-mono {
font-variant-numeric: tabular-nums;
font-size: var(--fs-sm);
color: var(--text-3);
}
.invl-amount {
font-variant-numeric: tabular-nums;
font-weight: 500;
color: var(--text-1);
}
.invl-empty {
text-align: center;
padding: 32px 20px;
color: var(--text-4);
font-size: var(--fs-2sm);
}
.invl-dl-link {
color: #3b82f6;
font-size: var(--fs-sm);
text-decoration: none;
font-weight: 500;
}
.invl-dl-link:hover { text-decoration: underline; }
.invl-no-file {
color: var(--text-4);
font-size: var(--fs-sm);
}
/* === PAGE: mp_coverage_matrix_v2_redesign === */
.cov-wrap { padding: 24px; max-width: 1600px; margin: 0 auto; }
.cov-page-h { margin-bottom: 20px; }
.cov-page-title { font-size: var(--fs-xl); font-weight: 700; color: var(--text-1); letter-spacing: -0.3px; }
.cov-page-sub { margin-top: 4px; font-size: var(--fs-sm); color: var(--text-3); }
@media(max-width:600px){ .kpi-grid { grid-template-columns: repeat(2,1fr); } }
.sec { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 10px; padding: 20px; margin-bottom: 16px; }
.sec-h { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; flex-wrap: wrap; gap: 8px; }
.matrix-table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.matrix-table th { background: var(--bg-page); color: var(--text-3); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .4px; padding: 7px 9px; border-bottom: 1px solid var(--border); white-space: nowrap; font-weight: 600; }
.matrix-table td { padding: 7px 9px; border-bottom: 1px solid var(--border); }
.matrix-table tr:hover td { background: var(--bg-page); }
.cell-live { display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:5px;background:#10b981;color:#fff;font-size:var(--fs-sm);font-weight:700; }
.cell-partial { display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:5px;background:#f59e0b;color:#fff;font-size:var(--fs-sm); }
.cell-blocked { display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:5px;background:#ef4444;color:#fff;font-size:var(--fs-sm); }
.cell-missing { display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:5px;background:var(--bg-page);color:var(--text-3);font-size:var(--fs-sm);border:1px solid var(--border); }
/* === PAGE: listing_health_guard_v2_redesign === */
.guard-wrap { padding: 24px; max-width: 1600px; margin: 0 auto; }
.guard-page-h { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 20px; }
.guard-page-title { font-size: var(--fs-xl); font-weight: 700; color: var(--text-1); letter-spacing: -0.3px; }
.guard-page-sub { margin-top: 4px; font-size: var(--fs-sm); color: var(--text-3); }
@media(max-width:640px){ .kpi-grid { grid-template-columns: repeat(2,1fr); } }
.kpi-val { font-size: var(--fs-3xl); font-weight: 700; font-variant-numeric: tabular-nums; }
.kpi-lbl { font-size: var(--fs-xs); color: var(--text-3); margin-top: 4px; }
.filter-bar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.filter-select { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 6px; color: var(--text-1); font-size: var(--fs-sm); padding: 5px 8px; }
.filter-select:focus { outline: none; border-color: #2563eb; }
.btn-filter { background: var(--bg-page); border: 1px solid var(--border); border-radius: 6px; padding: 5px 10px; font-size: var(--fs-sm); color: var(--text-2); cursor: pointer; text-decoration: none; white-space: nowrap; }
.btn-filter:hover { border-color: #2563eb; color: var(--text-1); }
.btn-run { background: #059669; color: #fff; border: none; border-radius: 6px; padding: 8px 16px; font-size: var(--fs-2sm); font-weight: 500; cursor: pointer; white-space: nowrap; }
.btn-run:hover:not(:disabled) { background: #047857; }
.btn-run:disabled { opacity: .5; cursor: not-allowed; }
.alerts-sec { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.alerts-head { padding: 10px 16px; border-bottom: 1px solid var(--border); display: flex; align-items: center; justify-content: space-between; }
.alerts-table { width: 100%; border-collapse: collapse; font-size: var(--fs-sm); }
.alerts-table th { background: var(--bg-page); color: var(--text-3); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .4px; padding: 7px 10px; border-bottom: 1px solid var(--border); text-align: left; font-weight: 600; }
.alerts-table td { padding: 7px 10px; border-bottom: 1px solid var(--border); color: var(--text-2); }
.alerts-table tr:hover td { background: var(--bg-page); }
.alerts-table tr.resolved td { opacity: .55; }
.badge-crit { background: rgba(239,68,68,.1); color: #dc2626; border: 1px solid rgba(239,68,68,.25); }
.badge-warn { background: rgba(245,158,11,.1); color: #d97706; border: 1px solid rgba(245,158,11,.25); }
.badge-type { background: var(--bg-page); color: var(--text-3); border: 1px solid var(--border); }
.badge-ok { background: rgba(16,185,129,.1); color: #059669; }
.btn-resolve { font-size: var(--fs-xs); padding: 2px 8px; border-radius: 4px; border: 1px solid var(--border); background: var(--bg-page); color: var(--text-2); cursor: pointer; }
.btn-resolve:hover { border-color: #059669; color: #059669; }
.err-box { background: rgba(239,68,68,.06); border: 1px solid rgba(239,68,68,.3); border-radius: 8px; padding: 10px 14px; margin-bottom: 16px; font-size: var(--fs-2sm); color: #dc2626; }
/* === PAGE: marketplace_news_v2_redesign === */
.news-item{border-left:3px solid var(--border);padding:10px 14px;margin-bottom:8px;
background:var(--bg-surface);border-radius:0 6px 6px 0;}
.news-item.breaking{border-left-color:var(--danger);}
.news-item.info{border-left-color:var(--text-1);}
.news-item.unread{background:color-mix(in srgb,#1e293b 5%,var(--bg-surface));}
/* === PAGE: mp_attrs_changelog_v2_redesign === */
.badge-amber{display:inline-block;padding:1px 8px;border-radius:99px;font-size:var(--fs-xs);
background:color-mix(in srgb,var(--warn) 15%,transparent);color:var(--warn);}
.badge-slate{display:inline-block;padding:1px 8px;border-radius:99px;font-size:var(--fs-xs);background:var(--bg-surface);color:var(--text-3);}
.pill-filter{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:99px;
background:color-mix(in srgb,#1e293b 15%,transparent);color:var(--text-1);font-size:var(--fs-xs);}
/* === PAGE: orders_v2_redesign === */
/* ── v2 page tokens (additive — layout_v3 covers bg/text/border) ── */
:root {
--r-md: 8px;
--r-sm: 6px;
--shadow-md: 0 4px 16px rgba(0,0,0,.06);
--success: #10b981;
--warn: #f59e0b;
--danger: #ef4444;
--t-xs: 11px;
--t-sm: 13px;
--t-base: 14px;
--t-lg: 16px;
--t-xl: 20px;
}
.v2-page-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;flex-wrap:wrap;gap:8px;}
.v2-page-title{font-size:var(--fs-xl);font-weight:700;color:var(--text-1);letter-spacing:-0.4px;}
.v2-page-sub{font-size:var(--fs-sm);color:var(--text-3);margin-top:2px;}
.mkt-chip{display:inline-flex;align-items:center;padding:4px 10px;border-radius:6px;
border:1px solid var(--border);background:var(--bg-surface);cursor:pointer;
font-size:var(--fs-sm);color:var(--text-2);transition:all .12s;}
.mkt-chip input{display:none;}
.mkt-chip img{width:16px;height:16px;border-radius:var(--radius-xs);object-fit:contain;margin-right:var(--space-1);}
.mkt-chip.is-checked{background:rgba(59,130,246,.08);color:#2563eb;border-color:rgba(59,130,246,.4);}
.mp-icon{width:18px;height:18px;border-radius:var(--radius-xs);object-fit:contain;}
.sort-link{display:flex;align-items:center;gap:3px;color:var(--text-3);text-decoration:none;
font-size:var(--fs-xs);font-weight:700;letter-spacing:.6px;text-transform:uppercase;}
.sort-link:hover{color:var(--text-1);}
.sort-arrow{font-size: var(--fs-2xs);color:var(--text-3);}
.sort-arrow.active{color:var(--text-1);}
.filter-form{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;}
.filter-group{display:flex;flex-direction:column;gap:4px;}
/* .filter-label canonical — dedup */
.filter-input,.filter-select{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);
padding:6px 10px;font-size:var(--fs-sm);color:var(--text-1);min-width:100px;}
.filter-input:focus,.filter-select:focus{outline:none;border-color:var(--text-1);}
.period-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px;}
.period-chip{font-size:var(--fs-xs);padding:4px 10px;border-radius:100px;
border:1px solid var(--border);cursor:pointer;text-decoration:none;transition:all .12s;
color:var(--text-2);background:var(--bg-surface);}
.period-chip:hover{background:var(--bg-surface);}
.period-chip.act{background:var(--text-1);color:#fff;border-color:var(--text-1);}
.mp-chips{display:flex;flex-wrap:wrap;gap:6px;}
.mp-chip{font-size:var(--fs-xs);padding:3px 9px;border-radius:4px;
cursor:pointer;text-decoration:none;transition:all .12s;border:1px solid var(--border);
color:var(--text-2);background:var(--bg-surface);}
.mp-chip:hover{background:var(--bg-surface);}
.mp-chip.act{background:color-mix(in srgb,var(--text-1) 12%,transparent);color:var(--text-1);border-color:color-mix(in srgb,var(--text-1) 40%,transparent);}
.pager{display:flex;align-items:center;justify-content:space-between;margin-top:14px;flex-wrap:wrap;gap:8px;}
.pager-info{font-size:var(--fs-xs);color:var(--text-3);}
.pager-btns{display:flex;gap:6px;}
.pager-btn{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);
padding:5px 12px;font-size:var(--fs-xs);cursor:pointer;text-decoration:none;color:var(--text-2);}
.pager-btn:hover{background:var(--bg-surface);}
.estimate-badge{font-size: var(--fs-3xs);color:var(--warn);vertical-align:super;}
/* === PAGE: returns_full_v2_redesign === */
.filter-row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:14px;}
.filter-row input,.filter-row select{background:var(--bg-surface);border:1px solid var(--border);
border-radius:var(--r-sm);padding:6px 10px;font-size:var(--fs-sm);color:var(--text-1);}
.badge-amber{display:inline-block;padding:1px 8px;border-radius:99px;font-size:var(--fs-xs);
background:color-mix(in srgb,var(--warn) 15%,transparent);color:var(--warn);}
.sort-link{display:flex;align-items:center;gap:3px;color:var(--text-3);text-decoration:none;
font-size:var(--fs-xs);font-weight:700;letter-spacing:.6px;text-transform:uppercase;}
.sort-link:hover{color:var(--text-1);}
.sort-arrow{font-size: var(--fs-2xs);color:var(--text-3);}
.sort-arrow.active{color:var(--text-1);}
/* .filter-label canonical — dedup */
.filter-input,.filter-select{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);
padding:6px 10px;font-size:var(--fs-sm);color:var(--text-1);min-width:80px;}
.pager-btn{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);
padding:5px 12px;font-size:var(--fs-xs);cursor:pointer;text-decoration:none;color:var(--text-2);}
.pager-btn:hover{background:var(--bg-surface);}
/* === PAGE: phantom_v2_redesign === */
.v7-section{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;margin-bottom:14px;}
.v7-tbl{width:100%;border-collapse:collapse;font-size: var(--fs-2sm);}
.v7-tbl th{background:#f8fafc;color:#94a3b8;font-size:var(--fs-xs);font-weight:700;letter-spacing:.06em;
text-transform:uppercase;padding:8px 12px;border-bottom:1px solid var(--border);white-space:nowrap;}
html.dark .v7-tbl th{background:#1e293b;color:#64748b;border-color:#334155;}
.v7-tbl td{padding:8px 12px;border-bottom:1px solid #f1f5f9;color:var(--text-2);}
html.dark .v7-tbl td{border-color:#1e293b;}
.v7-tbl tr:last-child td{border-bottom:none;}
.v7-tbl tr:hover td{background:#f8fafc;}
html.dark .v7-tbl tr:hover td{background:#1e293b;}
.filter-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;}
.f-grp{display:flex;flex-direction:column;gap:3px;}
.f-lbl{font-size:var(--fs-xs);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-3);}
.f-inp,.f-sel{padding:7px 10px;border-radius:7px;border:1px solid var(--border);background:var(--bg-surface);
color:var(--text-1);font-size: var(--fs-2sm);outline:none;transition:border .12s;}
.f-inp:focus,.f-sel:focus{border-color:#94a3b8;}
html.dark .f-inp,html.dark .f-sel{background:#1e293b;border-color:#334155;}
html.dark .btn-primary{background:#334155;border-color:#475569;color:#f1f5f9;}
.quick-bar{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px;}
.quick-btn{padding:4px 12px;border-radius:99px;font-size:var(--fs-sm);text-decoration:none;
border:1px solid var(--border);color:var(--text-3);background:var(--bg-surface);transition:all .1s;}
.quick-btn:hover{border-color:#94a3b8;color:var(--text-1);}
.quick-btn.active{background:#eff6ff;border-color:#3b82f6;color:#3b82f6;}
html.dark .quick-btn.active{background:rgba(59,130,246,.12);border-color:#3b82f6;}
.pager-row{display:flex;justify-content:center;align-items:center;gap:10px;padding:12px;font-size: var(--fs-2sm);}
.pager-btn{padding:5px 14px;border:1px solid var(--border);border-radius:7px;color:var(--text-2);
text-decoration:none;background:var(--bg-surface);transition:background .1s;}
.pager-btn:hover{background:var(--nav-hover);}
/* === PAGE: kaufland_returns_v2_redesign === */
/* ── page shell ── */
.pg-wrap { padding: 20px 24px; max-width: 1400px; }
/* ── page header ── */
.pg-head {
display: flex; align-items: flex-start;
justify-content: space-between; gap: 12px;
margin-bottom: 20px;
}
/* .pg-title canonical — dedup (см. глобальный) */
.pg-sub { font-size: var(--fs-sm); color: var(--text-3); margin-top: 3px; }
.btn-back {
display: inline-flex; align-items: center; gap: 6px;
padding: 7px 14px; border-radius: 8px;
border: 1px solid var(--border); background: var(--bg-surface);
color: var(--text-2); font-size: var(--fs-2sm); font-weight: 500;
text-decoration: none; cursor: pointer;
transition: background .12s, border-color .12s;
}
.btn-back:hover { background: var(--bg-page); border-color: #94a3b8; }
/* KPI cards: canonical via /static/css/dashboard.css */
/* ── filter card ── */
.filter-card {
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: 10px; padding: 16px 18px; margin-bottom: 16px;
}
.filter-card-title { font-size: var(--fs-2sm); font-weight: 600; color: var(--text-1); margin-bottom: 12px; }
.filter-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.filter-group { display: flex; flex-direction: column; gap: 4px; }
/* .filter-label canonical — dedup */
.filter-input, .filter-select {
background: var(--bg-page); border: 1px solid var(--border); border-radius: 7px;
padding: 7px 10px; font-size: var(--fs-2sm); color: var(--text-1); min-width: 120px;
transition: border-color .15s; outline: none;
}
.filter-input:focus, .filter-select:focus { border-color: #3b82f6; }
html.dark .filter-input, html.dark .filter-select { background: #0f172a; }
html.dark .btn-primary { background: #e2e8f0; color: #0f172a; }
/* ── table card ── */
.table-card {
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: 10px; overflow: hidden; margin-bottom: 16px;
}
.table-card-hd {
display: flex; align-items: center; justify-content: space-between;
padding: 14px 18px; border-bottom: 1px solid var(--border);
}
.table-card-title { font-size: var(--fs-md); font-weight: 600; color: var(--text-1); }
.table-card-count { font-size: var(--fs-sm); color: var(--text-3); }
.v7-table { width: 100%; border-collapse: collapse; }
.v7-table th {
background: #f8fafc; color: #94a3b8;
font-size: var(--fs-2xs); font-weight: 700; text-transform: uppercase; letter-spacing: .07em;
padding: 10px 14px; text-align: left; border-bottom: 1px solid var(--border);
white-space: nowrap;
}
html.dark .v7-table th { background: #1e293b; color: #64748b; }
.v7-table td {
padding: 11px 14px; border-bottom: 1px solid var(--border);
vertical-align: middle; font-size: var(--fs-2sm); color: var(--text-2);
}
.v7-table tr:last-child td { border-bottom: none; }
.v7-table tr:hover td { background: #f8fafc; }
html.dark .v7-table tr:hover td { background: rgba(255,255,255,.02); }
.v7-table td.mono { font-family: 'JetBrains Mono', monospace; font-size: var(--fs-xs); }
.v7-table td.num { text-align: right; font-family: 'JetBrains Mono', monospace; font-size: var(--fs-sm); font-variant-numeric: tabular-nums; }
/* status pill */
.spill {
display: inline-flex; align-items: center;
font-size: var(--fs-xs); font-weight: 500; padding: 2px 8px;
border-radius: 99px; white-space: nowrap;
}
.spill-green { background: #dcfce7; color: #16a34a; }
.spill-red { background: #fee2e2; color: #dc2626; }
.spill-amber { background: #fef3c7; color: #b45309; }
.spill-slate { background: var(--bg-page); color: var(--text-3); border: 1px solid var(--border); }
html.dark .spill-green { background: rgba(22,163,74,.15); color: #4ade80; }
html.dark .spill-red { background: rgba(220,38,38,.15); color: #f87171; }
html.dark .spill-amber { background: rgba(180,83,9,.15); color: #fbbf24; }
/* ── pagination ── */
.pager {
display: flex; align-items: center; justify-content: space-between;
padding: 12px 18px; border-top: 1px solid var(--border); flex-wrap: wrap; gap: 8px;
}
.pager-info { font-size: var(--fs-sm); color: var(--text-3); }
.pager-btns { display: flex; gap: 6px; }
.pager-btn {
background: var(--bg-page); border: 1px solid var(--border);
border-radius: 6px; padding: 5px 12px; font-size: var(--fs-sm);
cursor: pointer; text-decoration: none; color: var(--text-2);
transition: background .12s;
}
.pager-btn:hover { background: var(--border); }
/* === PAGE: kaufland_order_detail_v2_redesign === */
.meta-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:16px;}
.meta-item{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);padding:10px 12px;}
.meta-label{font-size:var(--fs-xs);color:var(--text-3);margin-bottom:3px;}
.meta-val{font-size:var(--fs-sm);font-weight:600;color:var(--text-1);}
.badge-amber{padding:1px 8px;border-radius:99px;font-size:var(--fs-xs);
background:color-mix(in srgb,var(--warn) 15%,transparent);color:var(--warn);}
.ext-link{display:inline-flex;align-items:center;gap:4px;font-size:var(--fs-xs);
color:var(--text-1);border:1px solid var(--border);border-radius:var(--r-sm);
padding:4px 10px;text-decoration:none;}
/* === PAGE: kaufland_mapping_category_v2_redesign === */
/* page-specific: full-height split panel */
body { overflow: hidden; }
/* ── page-local theme tokens (additive over layout_v3) ── */
:root {
--bg-hover: #f1f5f9;
--border-strong:#cbd5e1;
--accent-soft: rgba(30,41,59,.08);
--success:#1B7A3E;--success-soft:rgba(27,122,62,.08);
--warn:#B45309;--warn-soft:rgba(180,83,9,.08);
--danger:#E01C1C;--danger-soft:rgba(224,28,28,.08);
--kl-red:#E01C1C;--shadow:0 8px 24px rgba(0,0,0,.08);
}
html.dark {
--bg-hover: #1f2937;
--border-strong:#374151;
--accent-soft: rgba(245,158,11,.12);
--success:#10B981;--success-soft:rgba(16,185,129,.12);
--warn:#F59E0B;--warn-soft:rgba(245,158,11,.12);
--danger:#EF4444;--danger-soft:rgba(239,68,68,.12);
--kl-red:#EF4444;--shadow:0 8px 24px rgba(0,0,0,.4);
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;background:var(--bg-page);color:#1e293b;font-size: var(--fs-md);overflow:hidden;transition:background .25s,color .25s;}
button,input,textarea,select{font-family:inherit;font-size:inherit;color:inherit;}
.mh{height:52px;flex-shrink:0;display:flex;align-items:center;padding:0 20px;gap:16px;background:var(--bg-surface);border-bottom:1px solid var(--border);}
.brand{font-weight:700;font-size:var(--fs-lg);letter-spacing:-0.3px;}
.brand .v{font-family:'Inter', sans-serif;font-size: var(--fs-2xs);color:#6b7280;margin-left:5px;}
.mh-sep{width:1px;height:18px;background:var(--border);}
.mh-nav{display:flex;align-items:stretch;gap:0;flex:1;}
.mh-nav-a{display:flex;align-items:center;gap:5px;padding:0 12px;cursor:pointer;font-size:var(--fs-sm);font-weight:500;color:#374151;border-bottom:2px solid transparent;margin-bottom:-1px;transition:all .12s;font-family:'Inter', sans-serif;text-decoration:none;}
.mh-nav-a:hover{color:#1e293b;}
.mh-nav-a.act{color:var(--kl-red);border-bottom-color:var(--kl-red);font-weight:700;}
.mh-right{margin-left:auto;display:flex;align-items:center;gap:10px;}
.lang-sw{display:flex;border:1px solid var(--border);border-radius:5px;overflow:hidden;}
.lang-sw button{background:var(--bg-surface);color:#374151;border:none;padding:5px 10px;font-family:'Inter', sans-serif;font-size: var(--fs-2xs);cursor:pointer;transition:all .12s;font-weight:500;}
.lang-sw button+button{border-left:1px solid var(--border);}
.lang-sw button:hover{background:var(--bg-hover);color:#1e293b;}
.lang-sw button.act{background:#1e293b;color:var(--bg-page);}
.theme-tg{width:30px;height:30px;background:var(--bg-surface);border:1px solid var(--border);border-radius:5px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:var(--fs-md);transition:all .12s;}
.btn{background:var(--bg-surface);color:#1e293b;border:1px solid var(--border);padding:6px 12px;border-radius:5px;cursor:pointer;font-family:'Inter', sans-serif;font-size: var(--fs-2xs);font-weight:600;letter-spacing:.3px;transition:all .12s;text-transform:uppercase;text-decoration:none;display:inline-flex;align-items:center;gap:5px;}
.btn:hover{background:var(--bg-hover);border-color:var(--border-strong);}
.btn.primary{background:var(--kl-red);color:white;border-color:var(--kl-red);}
.btn.primary:hover{filter:brightness(1.1);}
.btn.magic{background:linear-gradient(135deg,#7C3AED,#6D28D9);color:white;border-color:#7C3AED;}
.btn.magic:hover{filter:brightness(1.1);}
.btn:disabled{opacity:.4;cursor:not-allowed;}
.sh{padding:12px 20px;background:var(--bg-surface);border-bottom:1px solid var(--border);display:flex;gap:16px;align-items:center;}
.sh-meta{flex:1;}
.sh-bc{font-family:'Inter', sans-serif;font-size: var(--fs-2xs);color:#6b7280;margin-bottom:4px;display:flex;gap:6px;align-items:center;}
.sh-title{font-size: var(--fs-1lg);font-weight:700;letter-spacing:-0.3px;display:flex;align-items:center;gap:8px;}
.sh-sub{font-family:'Inter', sans-serif;font-size: var(--fs-2xs);color:#6b7280;margin-top:4px;display:flex;gap:12px;}
.sh-right{display:flex;flex-direction:column;align-items:flex-end;gap:8px;min-width:200px;}
.prog{height:6px;background:var(--bg-surface);border-radius:3px;overflow:hidden;width:100%;}
.prog-fill{height:100%;border-radius:3px;transition:width .3s;}
.prog-green{background:var(--success);}
.prog-amber{background:var(--warn);}
.prog-slate{background:#6b7280;}
.shell{height:100vh;display:flex;flex-direction:column;}
.body{flex:1;overflow-y:auto;background:var(--bg-page);padding:14px 20px;}
.body::-webkit-scrollbar{width:5px;}
.body::-webkit-scrollbar-thumb{background:var(--border);}
.filter-bar{background:var(--bg-surface);border:1px solid var(--border);border-radius:7px;padding:10px 14px;margin-bottom:12px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.filter-bar input,.filter-bar select{background:var(--bg-page);border:1.5px solid var(--border);border-radius:4px;padding:5px 10px;font-size:var(--fs-sm);outline:none;transition:border-color .15s;}
.filter-bar input:focus,.filter-bar select:focus{border-color:#1e293b;}
.pill{display:inline-flex;align-items:center;font-family:'Inter', sans-serif;font-size: var(--fs-2xs);font-weight:700;padding:2px 7px;border-radius:3px;text-transform:uppercase;white-space:nowrap;}
.pill-red{background:var(--danger-soft);color:var(--danger);}
.pill-green{background:var(--success-soft);color:var(--success);}
.pill-amber{background:var(--warn-soft);color:var(--warn);}
.pill-blue{background:var(--accent-soft);color:#1e293b;}
.pill-slate{background:var(--bg-surface);color:#6b7280;}
.pill-violet{background:rgba(139,92,246,.1);color:#7C3AED;}
/* Group accordion */
.group-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:7px;overflow:hidden;margin-bottom:10px;}
.group-head{padding:10px 14px;background:var(--bg-surface);display:flex;align-items:center;justify-content:space-between;cursor:pointer;transition:background .1s;user-select:none;}
.group-head:hover{background:var(--bg-hover);}
.group-name{font-family:'Inter', sans-serif;font-size:var(--fs-xs);font-weight:700;letter-spacing:.5px;}
.group-stats{font-family:'Inter', sans-serif;font-size: var(--fs-2xs);color:#6b7280;display:flex;align-items:center;gap:10px;}
.group-chevron{font-size: var(--fs-2xs);color:#6b7280;transition:transform .15s;}
/* Table */
.tbl-wrap{overflow-x:auto;}
table.tbl{width:100%;border-collapse:collapse;}
table.tbl th{background:var(--bg-surface);color:#6b7280;font-family:'Inter', sans-serif;font-size: var(--fs-3xs);font-weight:700;letter-spacing:.8px;text-transform:uppercase;padding:7px 10px;text-align:left;border-bottom:1px solid var(--border);white-space:nowrap;}
table.tbl td{padding:7px 10px;border-bottom:1px solid var(--border);vertical-align:middle;font-size:var(--fs-sm);}
table.tbl tr:last-child td{border-bottom:none;}
table.tbl tr:hover td{background:var(--bg-hover);}
.td-mono{font-family:'Inter', sans-serif;font-size: var(--fs-2xs);color:#6b7280;}
.row-actions{opacity:0;transition:opacity .12s;}
tr:hover .row-actions{opacity:1;}
/* Magic modal */
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.5);display:none;align-items:center;justify-content:center;z-index:200;backdrop-filter:blur(4px);}
.modal-bg.open{display:flex;}
.modal{background:var(--bg-surface);border:1px solid var(--border-strong);border-radius:8px;max-width:640px;width:90vw;max-height:85vh;box-shadow:var(--shadow);display:flex;flex-direction:column;}
.modal-head{padding:14px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;}
.modal-h{font-size: var(--fs-md);font-weight:700;flex:1;}
.modal-close{background:none;border:1px solid var(--border);padding:4px 8px;border-radius:4px;cursor:pointer;font-size:var(--fs-md);color:#374151;}
.modal-close:hover{background:var(--bg-hover);color:#1e293b;}
.modal-body{flex:1;overflow-y:auto;padding:16px 18px;}
.modal-foot{padding:12px 18px;border-top:1px solid var(--border);display:flex;align-items:center;gap:10px;justify-content:flex-end;}
.sb{height:22px;background:#1e293b;color:rgba(255,255,255,.5);display:flex;align-items:center;padding:0 16px;gap:18px;font-family:'Inter', sans-serif;font-size: var(--fs-3xs);flex-shrink:0;letter-spacing:.3px;}
html.dark .sb{background:var(--bg-surface);color:#6b7280;border-top:1px solid var(--border);}
.sb-dot{display:inline-block;width:4px;height:4px;border-radius:50%;margin-right:5px;vertical-align:middle;background:#4ADE80;}
.sb-r{margin-left:auto;}
[x-cloak]{display:none !important;}
/* === PAGE: marketplace_pnl_v2_redesign === */
/* ── Gap alerts ── */
.gap-list { display: flex; flex-direction: column; gap: 8px; }
.gap-item {
display: flex; align-items: flex-start; gap: 12px; padding: 12px 14px;
border-radius: 8px; border: 1px solid var(--border);
}
.gap-item.critical { background: rgba(239,68,68,.05); border-color: rgba(239,68,68,.25); }
.gap-item.warning { background: rgba(245,158,11,.05); border-color: rgba(245,158,11,.25); }
.gap-item.info { background: rgba(99,102,241,.05); border-color: rgba(99,102,241,.2); }
.gap-icon { font-size: var(--fs-lg); flex-shrink: 0; margin-top: 1px; }
.gap-body { flex: 1; }
.gap-type { font-size: var(--fs-2xs); font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-3); margin-bottom: 2px; }
.gap-mp { font-weight: 700; font-size: var(--fs-2sm); color: var(--text-1); }
.gap-desc { font-size: var(--fs-2sm); color: var(--text-2); }
.gap-diff { font-size: var(--fs-sm); font-weight: 700; margin-top: 4px; font-variant-numeric: tabular-nums; }
.gap-diff.neg { color: #ef4444; }
.gap-diff.pos { color: #10b981; }
.gap-period { font-size: var(--fs-xs); color: var(--text-3); flex-shrink: 0; }
/* ── Waterfall chart ── */
.wf-chart-wrap { position: relative; height: 280px; width: 100%; }
/* ── Marketplace cards grid ── */
.mp-cards-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 16px; margin-bottom: 24px; }
.mp-card {
background: var(--bg-surface); border: 1px solid var(--border); border-radius: 10px; padding: 18px;
}
.mp-card-header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 14px; }
.mp-card-name { font-weight: 700; font-size: var(--fs-md); color: var(--text-1); }
.mp-card-net { font-weight: 700; font-size: var(--fs-lg); font-variant-numeric: tabular-nums; }
.mp-card-net.good { color: #10b981; }
.mp-card-net.bad { color: #ef4444; }
/* ── Waterfall rows ── */
.wf-row { display: flex; align-items: center; margin-bottom: 7px; gap: 8px; }
.wf-label { font-size: var(--fs-sm); color: var(--text-3); width: 130px; flex-shrink: 0; text-align: right; }
.wf-bar-track { flex: 1; height: 18px; background: var(--bg-page); border-radius: 4px; overflow: hidden; position: relative; }
.wf-bar { height: 100%; border-radius: 4px; transition: width .3s ease; }
.wf-bar.revenue { background: #10b981; }
.wf-bar.cost { background: #ef4444; opacity: .75; }
.wf-bar.net { background: #6366f1; }
.wf-amount { font-size: var(--fs-sm); color: var(--text-2); width: 90px; flex-shrink: 0; text-align: right; font-variant-numeric: tabular-nums; }
.wf-pct { font-size: var(--fs-xs); color: var(--text-3); width: 40px; flex-shrink: 0; text-align: right; }
.wf-divider { border: none; border-top: 1px dashed var(--border); margin: 8px 0; }
/* ── Badges ── */
.badge-src {
font-size: var(--fs-2xs); font-weight: 700; text-transform: uppercase;
padding: 2px 6px; border-radius: 10px; letter-spacing: 0.4px;
}
.badge-src.amazon { background: rgba(245,158,11,.15); color: #b45309; }
.badge-src.kaufland { background: rgba(239,68,68,.12); color: #b91c1c; }
.badge-src.otto { background: rgba(99,102,241,.12); color: #4338ca; }
/* ── Detail table ── */
.pnl-table { width: 100%; border-collapse: collapse; font-size: var(--fs-2sm); }
.pnl-table thead th {
background: var(--bg-page); color: var(--text-3); font-size: var(--fs-xs); font-weight: 700;
letter-spacing: 0.6px; text-transform: uppercase; padding: 10px 12px;
text-align: left; border-bottom: 1px solid var(--border);
}
.pnl-table td { padding: 13px 12px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.pnl-table tr:last-child td { border-bottom: none; }
.pnl-table tr:hover td { background: var(--bg-page); }
.pnl-table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.pnl-table tfoot td { font-weight: 700; background: var(--bg-page); border-top: 2px solid var(--border); }
@media(max-width:640px){
.mp-cards-grid { grid-template-columns: 1fr; }
.wf-label { width: 80px; }
}
/* === PAGE: missing_v2_redesign === */
.v7-section{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;margin-bottom:14px;}
.v7-tbl{width:100%;border-collapse:collapse;font-size: var(--fs-2sm);}
.v7-tbl th{background:var(--bg-page);color:var(--text-3);font-size:var(--fs-xs);font-weight:700;letter-spacing:.06em;
text-transform:uppercase;padding:8px 12px;border-bottom:1px solid var(--border);white-space:nowrap;}
.v7-tbl td{padding:8px 12px;border-bottom:1px solid var(--border);color:var(--text-2);}
.v7-tbl tr:last-child td{border-bottom:none;}
.v7-tbl tr:hover td{background:var(--bg-page);}
.filter-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end;}
.f-grp{display:flex;flex-direction:column;gap:3px;}
.f-lbl{font-size:var(--fs-xs);font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-3);}
.f-inp,.f-sel{padding:7px 10px;border-radius:7px;border:1px solid var(--border);background:var(--bg-surface);
color:var(--text-1);font-size: var(--fs-2sm);outline:none;transition:border .12s;}
.f-inp:focus,.f-sel:focus{border-color:var(--text-3);}
.quick-bar{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px;}
.quick-btn{padding:4px 12px;border-radius:99px;font-size:var(--fs-sm);text-decoration:none;
border:1px solid var(--border);color:var(--text-3);background:var(--bg-surface);transition:all .1s;}
.quick-btn:hover{border-color:var(--text-3);color:var(--text-1);}
.quick-btn.active{background:#eff6ff;border-color:#3b82f6;color:#3b82f6;}
html.dark .quick-btn.active{background:rgba(59,130,246,.12);border-color:#3b82f6;}
.pager-row{display:flex;justify-content:center;align-items:center;gap:10px;padding:12px;font-size: var(--fs-2sm);}
.pager-btn{padding:5px 14px;border:1px solid var(--border);border-radius:7px;color:var(--text-2);
text-decoration:none;background:var(--bg-surface);transition:background .1s;}
.pager-btn:hover{background:var(--nav-hover);}
/* === PAGE: pim_settings_v2_redesign === */
.ps-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;padding:20px;margin-bottom:16px;}
.ps-card.gpsr-err{outline:2px solid #ef4444;outline-offset:2px;}
.ps-label{display:block;font-size:var(--fs-sm);font-weight:600;color:var(--text-2);margin-bottom:5px;}
.ps-key{font-size: var(--fs-2xs);color:var(--text-4);font-family:monospace;margin-left:6px;}
.ps-input{width:100%;background:var(--bg-page);border:1px solid var(--border);border-radius:7px;padding:8px 12px;font-size: var(--fs-2sm);color:var(--text-1);outline:none;transition:border-color .12s;font-family:inherit;}
.ps-input:focus{border-color:#94a3b8;}
.ps-input:read-only,.ps-input:disabled{background:var(--bg-page);color:var(--text-4);cursor:default;}
html.dark .ps-input{background:var(--bg-sidebar);}
html.dark .ps-input:read-only,html.dark .ps-input:disabled{background:#0f172a;}
.ps-btn-primary{display:inline-flex;align-items:center;gap:6px;padding:8px 18px;border-radius:7px;font-size: var(--fs-2sm);font-weight:600;cursor:pointer;border:1px solid #334155;background:#1e293b;color:#f8fafc;transition:background .12s;}
.ps-btn-primary:hover{background:#0f172a;}
html.dark .ps-btn-primary{background:#334155;border-color:#475569;color:#f1f5f9;}
html.dark .ps-btn-primary:hover{background:#3f4f63;}
.ps-btn-ghost{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:7px;font-size: var(--fs-2sm);font-weight:500;cursor:pointer;border:1px solid var(--border);background:var(--bg-surface);color:var(--text-2);transition:background .12s;text-decoration:none;}
.ps-btn-ghost:hover{background:var(--bg-page);}
.ps-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;}
.ps-badge-ok{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:5px;font-size:var(--fs-xs);font-weight:600;background:rgba(16,185,129,.1);color:#10b981;border:1px solid #10b981;}
.ps-badge-err{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:5px;font-size:var(--fs-xs);font-weight:600;background:rgba(239,68,68,.1);color:#ef4444;border:1px solid #ef4444;}
.ps-badge-warn{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:5px;font-size:var(--fs-xs);font-weight:600;background:rgba(245,158,11,.1);color:#f59e0b;border:1px solid #f59e0b;}
/* Заголовок read-only секции внутри ps-card (ставки НДС, 13.08.2026) */
.ps-sec-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-3);}
.ps-sec-title{font-size:var(--fs-md);font-weight:700;color:var(--text-1);}
.ps-sec-icon{margin-right:var(--space-2);}
.ps-sec-blurb{font-size:var(--fs-sm);color:var(--text-3);margin-top:var(--space-1);}
.v3-tbl td.ta-right,.v3-tbl th.ta-right{text-align:right;font-variant-numeric:tabular-nums;}
/* === PAGE: returns_v2_redesign === */
/* ── KPI category cards ── */
.ret-kpi-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
gap: 10px;
margin-bottom: 18px;
}
.ret-kpi-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
padding: 12px 14px;
text-decoration: none;
transition: border-color .12s;
display: block;
}
.ret-kpi-card:hover { border-color: #3b82f6; }
.ret-kpi-card.active {
border-color: #3b82f6;
background: rgba(59,130,246,.05);
}
.ret-kpi-label {
font-size: var(--fs-xs);
color: var(--text-3);
margin-bottom: 5px;
font-weight: 500;
text-transform: uppercase;
letter-spacing: .04em;
}
.ret-kpi-count {
font-size: var(--fs-section);
font-weight: 700;
color: var(--text-1);
line-height: 1;
font-variant-numeric: tabular-nums;
}
.ret-kpi-count.danger { color: #dc2626; }
.ret-kpi-eur {
font-size: var(--fs-sm);
font-variant-numeric: tabular-nums;
color: var(--text-3);
margin-top: 4px;
}
/* ── Filter card ── */
.ret-filter-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
padding: 14px 18px;
margin-bottom: 16px;
}
.quick-bar {
display: flex;
gap: 6px;
flex-wrap: wrap;
margin-bottom: 12px;
}
.quick-btn {
padding: 4px 12px;
border-radius: 9999px;
font-size: var(--fs-sm);
text-decoration: none;
border: 1px solid var(--border);
color: var(--text-2);
background: var(--bg-page);
transition: border-color .1s, color .1s;
}
.quick-btn:hover { border-color: #3b82f6; color: #3b82f6; }
.quick-btn.active {
background: rgba(59,130,246,.1);
border-color: #3b82f6;
color: #3b82f6;
font-weight: 500;
}
.filter-row {
display: flex;
gap: 10px;
flex-wrap: wrap;
align-items: flex-end;
}
.filter-row input,
.filter-row select {
background: var(--bg-page);
border: 1px solid var(--border);
border-radius: 7px;
padding: 7px 10px;
font-size: var(--fs-2sm);
color: var(--text-1);
}
.filter-row input:focus,
.filter-row select:focus {
outline: none;
border-color: #3b82f6;
}
/* ── Table card ── */
.ret-table-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
}
.ret-table-card-header {
padding: 14px 18px;
border-bottom: 1px solid var(--border);
display: flex;
align-items: baseline;
justify-content: space-between;
}
.ret-table-card-title {
font-size: var(--fs-md);
font-weight: 600;
color: var(--text-1);
}
.ret-full-link {
font-size: var(--fs-sm);
color: #3b82f6;
text-decoration: none;
}
.ret-full-link:hover { text-decoration: underline; }
.ret-table {
width: 100%;
border-collapse: collapse;
font-size: var(--fs-2sm);
}
.ret-table th {
background: var(--bg-page);
color: var(--text-3);
font-size: var(--fs-xs);
font-weight: 600;
text-transform: uppercase;
letter-spacing: .05em;
padding: 9px 14px;
border-bottom: 1px solid var(--border);
white-space: nowrap;
}
.ret-table td {
padding: 9px 14px;
border-bottom: 1px solid var(--border);
color: var(--text-2);
}
.ret-table tr:last-child td { border-bottom: none; }
.ret-table tr:hover td { background: var(--nav-hover); }
.ret-mono {
font-variant-numeric: tabular-nums;
font-size: var(--fs-sm);
color: var(--text-3);
}
.ret-order-link {
color: #3b82f6;
font-variant-numeric: tabular-nums;
font-size: var(--fs-sm);
text-decoration: none;
}
.ret-order-link:hover { text-decoration: underline; }
.badge-warn {
display: inline-block;
padding: 2px 9px;
border-radius: 9999px;
font-size: var(--fs-xs);
font-weight: 600;
background: rgba(220,38,38,.1);
color: #dc2626;
}
html.dark .badge-warn { background: rgba(220,38,38,.2); }
.ret-empty {
text-align: center;
padding: 32px 20px;
color: var(--text-4);
font-size: var(--fs-2sm);
}
/* === PAGE: listing_analysis_v2_redesign === */
/* ── wrap ── */
.la-wrap { padding: 24px; max-width: 1600px; margin: 0 auto; }
.kpi-val{font-size:var(--fs-xl);font-weight:700;color:var(--text-1);}
.v2-page-h{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:20px;}
.v2-page-title{font-size:var(--fs-xl);font-weight:700;color:var(--text-1);letter-spacing:-0.3px;}
.v2-page-sub{margin-top:4px;font-size:var(--fs-sm);color:var(--text-3);}
.main-grid{display:grid;grid-template-columns:1fr 280px;gap:14px;}
@media(max-width:900px){.main-grid{grid-template-columns:1fr;}}
/* Field cards */
.field-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px;padding:12px;}
.field-card{border-radius:6px;padding:10px 12px;border:1px solid var(--border);font-size:var(--fs-sm);}
.field-card.ok{background:rgba(16,185,129,.05);border-color:rgba(16,185,129,.3);}
.field-card.inh{background:rgba(139,92,246,.05);border-color:rgba(139,92,246,.3);}
.field-card.miss{background:rgba(239,68,68,.05);border-color:rgba(239,68,68,.3);}
.field-card.sl-miss{background:var(--bg-page);}
.field-card.parent-scope{border-left:3px solid #2563eb;}
.field-name{font-family:monospace;font-weight:600;color:var(--text-2);}
.field-val{color:var(--text-1);word-break:break-word;margin-top:3px;}
.field-meta{font-family:monospace;color:var(--text-3);margin-top:4px;display:flex;flex-wrap:wrap;gap:4px;}
.scope-badge{font-size: var(--fs-3xs);padding:1px 5px;border-radius:3px;}
.scope-parent{background:rgba(37,99,235,.1);color:#1d4ed8;}
.scope-variant{background:rgba(139,92,246,.1);color:#6d28d9;}
.src-badge{font-size: var(--fs-3xs);padding:1px 5px;border-radius:3px;}
.src-spec{background:rgba(16,185,129,.1);color:#166534;}
.src-heur{background:rgba(245,158,11,.1);color:#92400e;}
.src-gpsr{background:rgba(37,99,235,.1);color:#1e40af;}
.fill-link{display:inline-block;margin-top:6px;font-size: var(--fs-2xs);color:#2563eb;font-weight:600;}
/* Sidebar */
.sidebar-sticky{position:sticky;top:80px;}
.recs-box{background:linear-gradient(135deg,rgba(139,92,246,.05),rgba(217,70,239,.03));border:1px solid rgba(139,92,246,.2);border-radius:10px;padding:16px;}
.rec-item{background:var(--bg-surface);border:1px solid rgba(139,92,246,.15);border-radius:5px;padding:8px 10px;font-size:var(--fs-sm);display:flex;gap:6px;align-items:flex-start;margin-bottom:6px;}
.ai-btn{width:100%;margin-bottom:10px;padding:9px;background:rgba(139,92,246,.85);color:#fff;border:none;border-radius:6px;font-size: var(--fs-2sm);font-weight:600;cursor:pointer;transition:opacity .12s;}
.ai-btn:hover{opacity:.88;}
.fix-btn{font-size: var(--fs-3xs);padding:2px 7px;border-radius:4px;border:1px solid rgba(139,92,246,.4);background:rgba(139,92,246,.1);color:#7c3aed;cursor:pointer;flex-shrink:0;white-space:nowrap;transition:all .1s;}
.fix-btn:hover:not(:disabled){background:rgba(139,92,246,.2);}
.fix-btn:disabled{opacity:.4;cursor:not-allowed;}
.fix-preview{margin-top:6px;padding:6px 8px;background:rgba(16,185,129,.07);border:1px solid rgba(16,185,129,.25);border-radius:4px;font-size: var(--fs-2xs);color:var(--text-1);word-break:break-word;}
.fix-preview-label{font-size: var(--fs-3xs);color:var(--text-3);margin-bottom:3px;font-family:monospace;}
.fix-actions{display:flex;gap:4px;margin-top:4px;}
.fix-save-btn{font-size: var(--fs-3xs);padding:2px 8px;border-radius:4px;border:none;background:#10b981;color:#fff;cursor:pointer;}
.fix-discard-btn{font-size: var(--fs-3xs);padding:2px 8px;border-radius:4px;border:1px solid var(--border);background:transparent;color:var(--text-2);cursor:pointer;}
/* Status badges */
.st-active{background:rgba(16,185,129,.1);color:#059669;border:1px solid rgba(16,185,129,.3);padding:3px 10px;border-radius:99px;font-size:var(--fs-sm);}
.st-warn{background:rgba(245,158,11,.1);color:#d97706;border:1px solid rgba(245,158,11,.3);padding:3px 10px;border-radius:99px;font-size:var(--fs-sm);}
.st-other{background:var(--bg-page);color:var(--text-2);border:1px solid var(--border);padding:3px 10px;border-radius:99px;font-size:var(--fs-sm);}
.section-header{padding:10px 14px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;}
.group-title{font-size: var(--fs-2sm);font-weight:700;}
.group-count{font-family:monospace;font-size:var(--fs-sm);color:var(--text-3);}
/* === PAGE: pim_products_v2_redesign === */
/* ── PIM Products page — v3 styles ── */
/* Page header strip */
.pim-page-hdr {
padding: 20px 24px 16px;
display: flex; align-items: flex-start; gap: 12px;
}
.pim-page-hdr h1 {
font-size: var(--fs-1lg); font-weight: 700; color: var(--text-1);
letter-spacing: -.3px;
}
.pim-page-hdr .sub {
font-size: var(--fs-2sm); color: var(--text-3); margin-top: 2px;
}
.pim-page-hdr-right { margin-left: auto; display: flex; align-items: center; gap: 8px; }
/* Buttons */
.btn-ghost-v3 {
display: inline-flex; align-items: center; gap: 6px;
padding: 7px 12px; border-radius: 7px;
font-size: var(--fs-2sm); font-weight: 500; cursor: pointer;
border: 1px solid var(--border); background: var(--bg-surface); color: var(--text-2);
transition: background .12s, border-color .12s;
text-decoration: none;
}
.btn-ghost-v3:hover { background: #f8fafc; border-color: #cbd5e1; }
html.dark .btn-ghost-v3:hover { background: #1e293b; }
.btn-primary-v3 {
display: inline-flex; align-items: center; gap: 6px;
padding: 7px 14px; border-radius: 7px;
font-size: var(--fs-2sm); font-weight: 600; cursor: pointer;
border: 1px solid #334155; background: #1e293b; color: #f8fafc;
transition: background .12s;
}
.btn-primary-v3:hover { background: #0f172a; }
html.dark .btn-primary-v3 { background: #334155; border-color: #475569; color: #f1f5f9; }
html.dark .btn-primary-v3:hover { background: #3f4f63; }
/* Filter bar */
.pim-filters {
padding: 0 24px 16px;
display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.pim-filter-inp {
padding: 8px 12px; border-radius: 7px;
border: 1px solid var(--border); font-size: var(--fs-2sm);
background: var(--bg-surface); color: var(--text-1);
outline: none; transition: border-color .12s;
}
.pim-filter-inp:focus { border-color: #94a3b8; }
html.dark .pim-filter-inp { background: #1e293b; border-color: #334155; color: #e2e8f0; }
html.dark .pim-filter-inp:focus { border-color: #64748b; }
.pim-search-wrap { position: relative; }
.pim-search-wrap svg { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); color: var(--text-4); pointer-events: none; }
.pim-search-wrap .pim-filter-inp { padding-left: 34px; width: 280px; }
/* View toggle */
.view-toggle { display: flex; align-items: center; gap: 2px; background: #f3f4f6; border-radius: 8px; padding: 2px; }
html.dark .view-toggle { background: #1f2937; }
.view-btn-v3 { padding: 6px; border-radius: 6px; color: var(--text-4); cursor: pointer; background: transparent; border: none; transition: background .1s, color .1s; }
.view-btn-v3:hover { background: #e5e7eb; color: var(--text-2); }
html.dark .view-btn-v3:hover { background: #374151; color: var(--text-3); }
.view-btn-v3.active { background: var(--bg-surface); color: var(--text-1); box-shadow: 0 1px 3px rgba(0,0,0,.1); }
html.dark .view-btn-v3.active { background: #374151; }
/* Submit button */
.pim-search-btn {
padding: 8px 16px; border-radius: 7px;
border: 1px solid #334155; background: #1e293b; color: #f8fafc;
font-size: var(--fs-2sm); font-weight: 600; cursor: pointer;
transition: background .12s;
}
.pim-search-btn:hover { background: #0f172a; }
html.dark .pim-search-btn { background: #334155; border-color: #475569; }
html.dark .pim-search-btn:hover { background: #3f4f63; }
.pim-reset-link { font-size: var(--fs-sm); color: var(--text-4); cursor: pointer; text-decoration: none; }
.pim-reset-link:hover { color: #ef4444; }
/* ── TABLE VIEW ── */
.pim-table-wrap {
padding: 0 24px 24px;
}
.pim-table-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 12px;
overflow: hidden;
}
/* Table toolbar */
.pim-tbl-toolbar {
display: flex; align-items: center; gap: 10px;
padding: 10px 16px;
border-bottom: 1px solid var(--border);
}
.pim-tbl-count { font-size: var(--fs-sm); color: var(--text-4); }
/* Column headers */
.pim-tbl-head {
display: grid;
grid-template-columns: 48px 1fr 120px 56px;
gap: 12px; padding: 0 16px;
height: 36px; align-items: center;
background: #f8fafc;
border-bottom: 1px solid var(--border);
font-size: var(--fs-xs); font-weight: 700; color: #94a3b8;
text-transform: uppercase; letter-spacing: .06em;
}
html.dark .pim-tbl-head { background: #1e293b; color: #64748b; }
/* Table rows */
.pim-tbl-row {
display: grid;
grid-template-columns: 48px 1fr 120px 56px;
gap: 12px; padding: 0 16px;
height: 60px; align-items: center;
border-bottom: 1px solid #f8fafc;
cursor: pointer;
transition: background .1s;
text-decoration: none; color: inherit;
}
.pim-tbl-row:last-child { border-bottom: none; }
.pim-tbl-row:hover { background: #f8fafc; }
html.dark .pim-tbl-row { border-bottom-color: #1e293b; }
html.dark .pim-tbl-row:hover { background: #1e293b; }
/* Photo cell */
.pim-photo {
width: 40px; height: 40px; border-radius: 8px;
overflow: hidden; flex-shrink: 0;
background: #f1f5f9;
display: flex; align-items: center; justify-content: center;
}
html.dark .pim-photo { background: #1e293b; }
.pim-photo img { width: 100%; height: 100%; object-fit: contain; }
/* Product info cell */
.pim-product-cell { min-width: 0; }
.pim-product-name {
font-size: var(--fs-2sm); font-weight: 500; color: var(--text-1);
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pim-product-sku {
font-size: var(--fs-xs); color: var(--text-4);
font-family: 'Courier New', monospace;
margin-top: 2px;
}
/* MP icons cell */
.pim-mp-cell { display: flex; align-items: center; gap: 6px; }
/* MP icon */
.mp-icon-v3 {
width: 26px; height: 26px; border-radius: 6px;
display: inline-flex; align-items: center; justify-content: center;
position: relative; text-decoration: none; flex-shrink: 0;
overflow: visible;
transition: opacity .15s, transform .1s;
}
.mp-icon-v3:hover { transform: scale(1.12); }
.mp-icon-v3.off { opacity: .18; filter: grayscale(1); }
html.dark .mp-icon-v3.off { opacity: .15; }
.mp-icon-v3.err { opacity: 1; filter: none; }
.mp-err-dot {
position: absolute; top: -2px; right: -2px;
width: 7px; height: 7px; border-radius: 50%;
background: #ef4444; border: 1.5px solid #fff;
z-index: 2;
}
html.dark .mp-err-dot { border-color: var(--bg-surface); }
/* Actions cell */
.pim-row-actions { display: flex; align-items: center; justify-content: flex-end; }
.pim-edit-btn {
padding: 6px; border-radius: 6px; background: transparent; border: none;
color: var(--text-4); cursor: pointer;
transition: color .12s, background .12s;
}
.pim-edit-btn:hover { color: var(--text-2); background: #f1f5f9; }
html.dark .pim-edit-btn:hover { background: #1e293b; }
/* Pagination */
.pim-pagination {
display: flex; align-items: center; justify-content: space-between;
padding: 12px 16px;
border-top: 1px solid var(--border);
}
.pim-pg-info { font-size: var(--fs-sm); color: var(--text-4); }
.pim-pg-nav { display: flex; align-items: center; gap: 4px; }
.pim-pg-btn {
padding: 5px 10px; border-radius: 6px;
border: 1px solid var(--border);
background: var(--bg-surface); color: var(--text-3);
font-size: var(--fs-sm); cursor: pointer;
text-decoration: none;
display: inline-flex; align-items: center;
transition: background .1s, color .1s;
}
.pim-pg-btn:hover { background: #f8fafc; color: var(--text-1); }
html.dark .pim-pg-btn:hover { background: #1e293b; color: var(--text-2); }
.pim-pg-btn.active { background: #1e293b; color: #f8fafc; border-color: #334155; font-weight: 600; }
html.dark .pim-pg-btn.active { background: #e2e8f0; color: #1e293b; border-color: #e2e8f0; }
.pim-pg-btn.disabled { opacity: .3; pointer-events: none; }
.pim-pg-ellipsis { font-size: var(--fs-sm); color: var(--text-4); padding: 0 4px; }
/* Per page select */
.pim-perpage-wrap { display: flex; align-items: center; gap: 6px; font-size: var(--fs-sm); color: var(--text-4); }
.pim-perpage-sel {
padding: 4px 8px; border-radius: 6px;
border: 1px solid var(--border); background: var(--bg-surface);
font-size: var(--fs-sm); color: var(--text-2); cursor: pointer;
}
/* Empty state */
.pim-empty {
padding: 64px 24px; text-align: center; color: var(--text-4);
font-size: var(--fs-md);
}
/* ── GRID VIEW ── */
.pim-grid-wrap { padding: 0 24px 24px; }
.pim-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
gap: 12px;
}
.pim-grid-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px; overflow: hidden;
cursor: pointer; text-decoration: none; color: inherit;
transition: box-shadow .15s;
display: block;
}
.pim-grid-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.07); }
html.dark .pim-grid-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.3); }
.pim-grid-img {
aspect-ratio: 1; background: #f8fafc;
display: flex; align-items: center; justify-content: center;
overflow: hidden;
}
html.dark .pim-grid-img { background: #1e293b; }
.pim-grid-img img { width: 100%; height: 100%; object-fit: contain; }
.pim-grid-body { padding: 10px 12px 12px; }
.pim-grid-sku { font-size: var(--fs-xs); color: var(--text-4); font-family: 'Courier New', monospace; margin-bottom: 4px; }
.pim-grid-name { font-size: var(--fs-2sm); font-weight: 500; color: var(--text-1); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pim-grid-mp { display: flex; align-items: center; gap: 4px; margin-top: 8px; }
/* Add product card */
.pim-add-card {
background: var(--bg-surface);
border: 1.5px dashed var(--border);
border-radius: 10px;
display: flex; flex-direction: column;
align-items: center; justify-content: center;
padding: 32px 16px; gap: 6px;
color: var(--text-4); cursor: not-allowed;
transition: color .12s, border-color .12s;
}
.pim-add-card:hover { color: var(--text-3); border-color: #94a3b8; }
/* === PAGE: settings_mp_vault_v2_redesign === */
/* ── Vault card ── */
.vault-mp {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
margin-bottom: 10px;
overflow: hidden;
}
.vault-mp-hd {
display: flex; align-items: center; justify-content: space-between;
padding: 14px 18px; cursor: pointer; gap: 12px;
transition: background .1s;
}
.vault-mp-hd:hover { background: var(--nav-hover); }
.vault-mp-title { font-size: var(--fs-md); font-weight: 600; color: var(--text-1); }
.vault-mp-code { font-family: 'JetBrains Mono', 'Fira Code', monospace; font-size: var(--fs-xs); color: var(--text-3); margin-top: 2px; }
.vault-badge { padding: 2px 9px; border-radius: 20px; font-size: var(--fs-xs); font-weight: 600; }
.vault-badge.ok { background: #f0fdf4; color: #16a34a; }
.vault-badge.fail { background: #fef2f2; color: #dc2626; }
.vault-badge.partial { background: #fffbeb; color: #d97706; }
.vault-badge.empty { background: #f9fafb; color: var(--text-3); }
html.dark .vault-badge.ok { background: rgba(16,185,129,.12); color: #34d399; }
html.dark .vault-badge.fail { background: rgba(239,68,68,.12); color: #f87171; }
html.dark .vault-badge.partial { background: rgba(245,158,11,.12); color: #fbbf24; }
html.dark .vault-badge.empty { background: rgba(255,255,255,.04); color: var(--text-4); }
.vault-body { padding: 18px; border-top: 1px solid var(--border); }
/* ── Credential rows ── */
.cred-row {
display: grid;
grid-template-columns: 200px 1fr 130px;
gap: 12px; align-items: start;
padding: 10px 0; border-bottom: 1px solid var(--border);
}
.cred-row:last-child { border-bottom: none; }
.cred-label { font-size: var(--fs-2sm); font-weight: 500; color: var(--text-1); }
.cred-ts { font-size: var(--fs-2xs); color: var(--text-3); font-family: monospace; line-height: 1.7; }
/* ── v7 input ── */
.v7-input {
width: 100%; padding: 8px 12px; border-radius: 7px;
border: 1px solid var(--border); font-size: var(--fs-2sm);
background: var(--bg-surface); color: var(--text-1);
outline: none; transition: border .12s;
font-family: 'JetBrains Mono', 'Fira Code', monospace;
}
.v7-input:focus { border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99,102,241,.08); }
.v7-input.has-val { background: rgba(245,158,11,.06); border-color: rgba(245,158,11,.4); }
/* ── v7 btn ── */
.v7-btn {
padding: 8px 16px; border-radius: 7px; font-size: var(--fs-2sm);
font-weight: 500; cursor: pointer; border: none;
transition: opacity .12s, transform .08s;
white-space: nowrap;
}
.v7-btn:hover { opacity: .88; }
.v7-btn:active { transform: scale(.98); }
.v7-btn-primary { background: #1e293b; color: #fff; }
html.dark .v7-btn-primary { background: #e2e8f0; color: #111; }
.v7-btn-success { background: #10b981; color: #fff; }
.v7-btn-warn { background: #f59e0b; color: #fff; }
.v7-btn-outline {
background: transparent; color: var(--text-2);
border: 1px solid var(--border);
}
/* ── Info hint ── */
.vault-hint {
background:var(--bg-page); border: 1px solid #e2e8f0; border-radius: 7px;
padding: 9px 13px; font-size: var(--fs-sm); color: var(--text-3);
margin-bottom: 16px;
}
html.dark .vault-hint { background: rgba(255,255,255,.03); border-color: var(--border); }
/* ── OAuth / ECDSA section ── */
.vault-sub-section {
margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--border);
}
.vault-sub-title { font-size: var(--fs-2sm); font-weight: 600; color: var(--text-1); margin-bottom: 8px; }
.vault-alert-warn {
background: #fffbeb; border: 1px solid #fde68a; border-radius: 7px;
padding: 10px 13px; font-size: var(--fs-2sm); color: #92400e;
}
html.dark .vault-alert-warn { background: rgba(245,158,11,.08); border-color: rgba(245,158,11,.25); color: #fbbf24; }
.vault-alert-ok {
background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 7px;
padding: 4px 11px; font-size: var(--fs-sm); color: #166534; display: inline-flex; align-items: center; gap: 5px;
}
html.dark .vault-alert-ok { background: rgba(16,185,129,.1); border-color: rgba(16,185,129,.25); color: #34d399; }
/* ── page header ── */
.pg-hd {
display: flex; align-items: flex-start; justify-content: space-between;
gap: 16px; padding: 20px 24px 16px;
}
/* .pg-title canonical — dedup (см. глобальный) */
.pg-sub { font-size: var(--fs-2sm); color: var(--text-3); margin-top: 2px; }
/* === PAGE: mp_coverage_detail_v2_redesign === */
.badge-amber{padding:1px 8px;border-radius:99px;font-size:var(--fs-xs);background:color-mix(in srgb,var(--warn) 15%,transparent);color:var(--warn);}
.badge-slate{padding:1px 8px;border-radius:99px;font-size:var(--fs-xs);background:var(--bg-surface);color:var(--text-3);}
input[type=text]{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);
padding:4px 8px;font-size:var(--fs-xs);color:var(--text-1);}
.btn-save{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);
padding:4px 8px;font-size:var(--fs-xs);cursor:pointer;color:var(--text-2);}
/* === PAGE: mp_attrs_enum_v2_redesign === */
.ic-ok{color:var(--success);}
.ic-fuzzy{color:var(--warn);}
.ic-err{color:var(--danger);}
.ic-lock{color:var(--text-1);}
/* === PAGE: settings_attributes_v2_redesign === */
.pg-hd {
display: flex; align-items: flex-start; justify-content: space-between;
gap: 16px; padding: 20px 0 16px;
}
/* .pg-title canonical — dedup (см. глобальный) */
.pg-sub { font-size: var(--fs-2sm); color: var(--text-3); margin-top: 2px; }
.v7-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
}
.v7-table { width: 100%; border-collapse: collapse; font-size: var(--fs-2sm); }
.v7-table thead th {
padding: 10px 14px; text-align: left;
background:var(--bg-page); border-bottom: 1px solid var(--border);
font-size: var(--fs-xs); font-weight: 700; color:var(--text-4);
text-transform: uppercase; letter-spacing: .06em;
white-space: nowrap;
}
html.dark .v7-table thead th { background: #1e293b; color: #64748b; }
.v7-table tbody td {
padding: 10px 14px; border-bottom: 1px solid var(--border);
color: var(--text-1); vertical-align: middle;
font-family: 'JetBrains Mono', 'Fira Code', monospace;
font-size: var(--fs-sm);
}
.v7-table tbody tr:last-child td { border-bottom: none; }
.v7-table tbody tr:hover td { background: var(--nav-hover); }
.v7-empty {
text-align: center; padding: 48px 24px;
color: var(--text-3); font-size: var(--fs-md);
}
/* === PAGE: otto_listing_v2_redesign === */
/* removed global .v3-content override — ломал скролл на всех страницах (2026-06-03) */
.pg-header { flex-shrink:0;padding:10px 20px;background:var(--bg-surface);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:14px; }
/* .pg-title canonical — dedup (см. глобальный) */
.pg-sub { font-size:var(--fs-xs);color:var(--text-3);margin-top:2px; }
.split { flex:1;display:grid;grid-template-columns:280px 5px 1fr;overflow:hidden;min-height:0; }
.split-handle { background:var(--border);cursor:col-resize;transition:background .15s;user-select:none;position:relative;z-index:5; }
.split-handle:hover, .split-handle.dragging { background:#e2001a; }
.split-handle::before { content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:2px;height:28px;background:var(--text-4);border-radius:2px;opacity:.5; }
.split-handle:hover::before { opacity:0; }
.tree-pane { border-right:1px solid var(--border);background:var(--bg-surface);display:flex;flex-direction:column;overflow:hidden; }
.tree-pane-hd { padding:8px 12px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;flex-shrink:0;gap:8px; }
.tree-pane-label { font-size: var(--fs-2xs);font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-4); }
html.dark .src-btn.active { background:#0f172a;color:#e2e8f0; }
.tree-search-box { padding:6px 8px;border-bottom:1px solid var(--border);flex-shrink:0; }
.tree-search-box input { width:100%;background:var(--bg-page);border:1px solid var(--border);border-radius:5px;padding:4px 8px;font-size:var(--fs-xs);color:var(--text-1);outline:none; }
.tree-search-box input:focus { border-color:#e2001a; }
html.dark .tree-search-box input { background:#0f172a; }
.tree-scroll { flex:1;overflow-y:auto;padding:4px; }
.tree-node { display:flex;align-items:center;gap:3px;padding:4px 6px;border-radius:5px;cursor:pointer; }
.tree-node:hover { background:var(--bg-page); }
.tree-node.selected { background:rgba(226,0,26,.10);border-left:2px solid #e2001a; }
.tree-node-toggle { width:14px;font-size: var(--fs-3xs);color:var(--text-4);flex-shrink:0;text-align:center; }
.tree-node-name { font-size:var(--fs-xs);flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;min-width:0; }
.tree-badge { font-size: var(--fs-3xs);font-weight:700;padding:0 5px;border-radius:3px;flex-shrink:0; }
.tb-count { background:var(--bg-page);color:var(--text-3);border:1px solid var(--border); }
.tb-mp { background:#fef3c7;color:#b45309; }
.art-pane { display:flex;flex-direction:column;overflow:hidden;background:var(--bg-page); }
.art-pane-hd { padding:10px 16px;background:var(--bg-surface);border-bottom:1px solid var(--border);flex-shrink:0; }
.art-scroll { flex:1;overflow-y:auto;padding:10px; }
.empty-pane { display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;color:var(--text-3);padding:40px;text-align:center; }
.spinner { width:28px;height:28px;border:3px solid var(--border);border-top-color:#e2001a;border-radius:50%;animation:spin .8s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.ot-table { width:100%;border-collapse:collapse;font-size:var(--fs-sm);background:var(--bg-surface);border-radius:8px;overflow:hidden; }
.ot-table th { background:var(--bg-surface);color:var(--text-4);font-size: var(--fs-2xs);font-weight:700;text-transform:uppercase;letter-spacing:.07em;padding:8px 10px;text-align:left;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:2; }
.ot-table td { padding:7px 10px;border-bottom:1px solid var(--border);font-size:var(--fs-sm);color:var(--text-2);vertical-align:middle; }
.ot-table tr:hover td { background:var(--bg-page); }
.ot-table td.mono { font-family:'JetBrains Mono',monospace;font-size:var(--fs-xs); }
.ot-table td.num { text-align:right;font-family:'JetBrains Mono',monospace; }
.spill { display:inline-flex;font-size: var(--fs-2xs);font-weight:600;padding:2px 7px;border-radius:99px; }
.spill-green { background:#dcfce7;color:#16a34a; }
.spill-red { background:#fee2e2;color:#dc2626; }
.spill-slate { background:var(--bg-page);color:var(--text-3);border:1px solid var(--border); }
/* === PAGE: otto_orphans_v2_redesign === */
.filter-row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:12px;}
.filter-row select{background:var(--bg-surface);border:1px solid var(--border);
border-radius:var(--r-sm);padding:6px 10px;font-size:var(--fs-sm);color:var(--text-1);}
.btn-resolve{background:none;border:1px solid var(--success);border-radius:var(--r-sm);
padding:3px 8px;font-size:var(--fs-xs);cursor:pointer;color:var(--success);}
.badge-arrived{display:inline-block;padding:1px 8px;border-radius:99px;font-size:var(--fs-xs);
background:color-mix(in srgb,var(--danger) 15%,transparent);color:var(--danger);}
.badge-transit{display:inline-block;padding:1px 8px;border-radius:99px;font-size:var(--fs-xs);
background:color-mix(in srgb,var(--warn) 15%,transparent);color:var(--warn);}
/* === PAGE: merkmale_mapping_v2_redesign === */
.filter-row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin-bottom:16px;}
.filter-row input,.filter-row select{background:var(--bg-surface);border:1px solid var(--border);
border-radius:6px;padding:6px 10px;font-size:var(--fs-sm);color:#1e293b;}
.sub-tabs{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:14px;}
.sub-tab{padding:5px 12px;border-radius:6px;font-size:var(--fs-xs);
text-decoration:none;color:#374151;background:var(--bg-surface);border:1px solid var(--border);}
.sub-tab.active{background:#1e293b;color:#fff;border-color:#1e293b;}
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:200;
display:flex;align-items:center;justify-content:center;padding:16px;}
.modal-box{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;
max-width:500px;width:100%;max-height:80vh;display:flex;flex-direction:column;}
select.assign-sel{background:var(--bg-surface);border:1px solid var(--border);border-radius:6px;
padding:4px 8px;font-size:var(--fs-xs);color:#1e293b;max-width:180px;}
/* === PAGE: search_results_v2_redesign === */
/* ── page-local tokens (additive — layout_v3 covers bg/text/border/fonts) ── */
.search-bar{display:flex;gap:8px;margin-bottom:16px;}
.search-bar input{flex:1;background:var(--bg-surface);border:1px solid var(--border);border-radius:8px;
padding:10px 14px;font-size: var(--fs-2sm);color:var(--text-1);}
.search-bar input:focus{outline:none;border-color:#1e293b;}
.btn-search{background:#1e293b;color:#fff;border:none;border-radius:8px;
padding:10px 20px;font-size:var(--fs-sm);cursor:pointer;font-weight:600;}
.cat-badge{display:inline-block;padding:2px 8px;border-radius:99px;font-size:var(--fs-xs);
background:var(--bg-surface);border:1px solid var(--border);color:var(--text-2);}
.mp-badge{display:inline-block;padding:2px 6px;border-radius:4px;font-size:var(--fs-xs);font-weight:600;}
.pager-row{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;
border-top:1px solid var(--border);font-size:var(--fs-sm);}
.pager-btn{border:1px solid var(--border);border-radius:6px;padding:5px 12px;
color:var(--text-2);text-decoration:none;font-size:var(--fs-xs);}
.pager-btn:hover{background:var(--bg-surface);}
.pager-btn.disabled{opacity:.35;pointer-events:none;}
/* === PAGE: role_perms_v2_redesign === */
.perm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px}
.perm-item{display:flex;align-items:flex-start;gap:8px;padding:8px 10px;border-radius:6px;cursor:pointer;border:1px solid var(--border);background:var(--bg-surface)}
.perm-item:hover{background:var(--bg-surface)}
.perm-item input[type=checkbox]{margin-top:2px;flex-shrink:0;accent-color:#1e293b}
.perm-name{font-size: var(--fs-2sm);font-weight:500}
.perm-code{font-size: var(--fs-2xs);color:#6b7280}
.perm-desc{font-size:var(--fs-xs);color:#374151;margin-top:2px}
/* === PAGE: summary_v2_redesign === */
/* KPI grid */
/* Section / table */
.v7-section{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;margin-bottom:14px;}
.v7-tbl{width:100%;border-collapse:collapse;font-size: var(--fs-2sm);}
.v7-tbl th{background:var(--bg-page);color:var(--text-3);font-size:var(--fs-xs);font-weight:700;letter-spacing:.06em;
text-transform:uppercase;padding:8px 12px;border-bottom:1px solid var(--border);white-space:nowrap;}
.v7-tbl td{padding:8px 12px;border-bottom:1px solid var(--border);color:var(--text-2);}
.v7-tbl tr:last-child td{border-bottom:none;}
.v7-tbl tr:hover td{background:var(--bg-page);}
/* === PAGE: settings_categories_v2_redesign === */
.pg-hd {
display: flex; align-items: flex-start; justify-content: space-between;
gap: 16px; padding: 20px 0 16px;
}
/* .pg-title canonical — dedup (см. глобальный) */
.pg-sub { font-size: var(--fs-2sm); color: var(--text-3); margin-top: 2px; }
/* v7 table */
.v7-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
}
.v7-table { width: 100%; border-collapse: collapse; font-size: var(--fs-2sm); }
.v7-table thead th {
padding: 10px 14px; text-align: left;
background:var(--bg-page); border-bottom: 1px solid var(--border);
font-size: var(--fs-xs); font-weight: 700; color:var(--text-4);
text-transform: uppercase; letter-spacing: .06em;
white-space: nowrap;
}
html.dark .v7-table thead th { background: #1e293b; color: #64748b; }
.v7-table tbody td {
padding: 10px 14px; border-bottom: 1px solid var(--border);
color: var(--text-1); vertical-align: middle;
}
.v7-table tbody tr:last-child td { border-bottom: none; }
.v7-table tbody tr:hover td { background: var(--nav-hover); }
.v7-mono { font-family: 'JetBrains Mono', 'Fira Code', monospace; font-size: var(--fs-sm); }
.mp-chip {
display: inline-block;
background: #f1f5f9; border: 1px solid var(--border);
border-radius: 5px; padding: 2px 8px;
font-size: var(--fs-xs); font-weight: 500; color: var(--text-2);
}
html.dark .mp-chip { background: rgba(255,255,255,.06); }
.v7-empty {
text-align: center; padding: 48px 24px;
color: var(--text-3); font-size: var(--fs-md);
}
/* === PAGE: translate_v2_redesign === */
.tr-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:10px;padding:20px;}
.tr-label{display:block;font-size:var(--fs-sm);font-weight:600;color:var(--text-3);margin-bottom:6px;text-transform:uppercase;letter-spacing:.04em;}
.tr-input{width:100%;background:var(--bg-page);border:1px solid var(--border);border-radius:7px;padding:8px 12px;font-size: var(--fs-2sm);color:var(--text-1);outline:none;transition:border-color .12s;}
.tr-input:focus{border-color:#94a3b8;}
html.dark .tr-input{background:var(--bg-sidebar);border-color:var(--border);}
.tr-locale-chip{display:flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid var(--border);border-radius:7px;cursor:pointer;font-size: var(--fs-2sm);transition:border-color .12s,background .12s;}
.tr-locale-chip:has(input:checked){border-color:#334155;background:var(--bg-page);}
html.dark .tr-locale-chip:has(input:checked){border-color:#475569;background:#1e293b;}
.tr-btn-primary{display:inline-flex;align-items:center;gap:6px;padding:8px 18px;border-radius:7px;font-size: var(--fs-2sm);font-weight:600;cursor:pointer;border:1px solid #334155;background:#1e293b;color:#f8fafc;transition:background .12s;}
.tr-btn-primary:hover{background:#0f172a;}
html.dark .tr-btn-primary{background:#334155;border-color:#475569;color:#f1f5f9;}
html.dark .tr-btn-primary:hover{background:#3f4f63;}
.tr-btn-ghost{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:7px;font-size: var(--fs-2sm);font-weight:500;cursor:pointer;border:1px solid var(--border);background:var(--bg-surface);color:var(--text-2);transition:background .12s,border-color .12s;text-decoration:none;}
.tr-btn-ghost:hover{background:var(--bg-page);border-color:#cbd5e1;}
/* === PAGE: repricing_cockpit_v2_redesign === */
/* ── page-local helpers (additive — layout_v3 covers bg/text/border/fonts/colors) ── */
.rp-wrap{display:flex;flex-direction:column;gap:14px;}
/* KPI bar */
/* signal badges */
.sig-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;
border-radius:99px;font-size:var(--fs-xs);font-weight:600;white-space:nowrap;}
.sig-raise{background:#dcfce7;color:#15803d;}
.sig-lower{background:#fef9c3;color:#92400e;}
.sig-stale{background:#fee2e2;color:#b91c1c;}
.sig-ok {background:var(--bg-surface);color:var(--text-3);}
/* filter row */
.filter-row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;}
.filter-row select,
.filter-row input{background:var(--bg-surface);border:1px solid var(--border);
border-radius:6px;padding:6px 10px;font-size:var(--fs-sm);color:var(--text-1);}
.filter-row label{display:block;font-size:var(--fs-xs);color:var(--text-3);margin-bottom:3px;}
/* section */
/* table */
/* velocity bar */
.vel-bar{height:6px;border-radius:3px;background:var(--border);min-width:60px;position:relative;}
.vel-bar-fill{height:100%;border-radius:3px;background:#1e293b;transition:width .3s;}
/* price input */
.price-inp{width:80px;background:var(--bg-surface);border:1px solid var(--border);
border-radius:6px;padding:4px 7px;font-size:var(--fs-sm);color:var(--text-1);
text-align:right;}
.price-inp:focus{outline:none;border-color:#1e293b;}
/* buttons */
.btn-xs{padding:3px 10px;border-radius:6px;font-size:var(--fs-xs);
font-weight:600;cursor:pointer;border:none;transition:opacity .15s;}
.btn-xs:hover{opacity:.85;}
.btn-apply{background:#1e293b;color:#fff;}
.btn-skip{background:var(--bg-surface);color:var(--text-3);border:1px solid var(--border);}
.btn-bulk{background:#1e293b;color:#fff;padding:6px 14px;border-radius:6px;
font-size:var(--fs-sm);font-weight:600;cursor:pointer;border:none;}
.btn-bulk:disabled{opacity:.4;cursor:not-allowed;}
.btn-export{background:var(--bg-surface);color:var(--text-2);padding:6px 12px;
border-radius:6px;font-size:var(--fs-sm);font-weight:500;cursor:pointer;
border:1px solid var(--border);}
/* chart */
/* pagination */
.pager{display:flex;gap:6px;align-items:center;flex-wrap:wrap;}
.pager-btn{padding:4px 10px;border-radius:6px;border:1px solid var(--border);
background:var(--bg-surface);color:var(--text-2);cursor:pointer;font-size:var(--fs-xs);}
.pager-btn.active,.pager-btn:hover{background:#1e293b;color:#fff;border-color:#1e293b;}
.per-page-sel{background:var(--bg-surface);border:1px solid var(--border);
border-radius:6px;padding:4px 8px;font-size:var(--fs-xs);color:var(--text-2);}
/* toast */
.toast{position:fixed;bottom:24px;right:24px;z-index:9999;display:flex;flex-direction:column;gap:8px;}
.toast-item{padding:10px 16px;border-radius:8px;font-size:var(--fs-sm);font-weight:500;
box-shadow:0 4px 16px rgba(0,0,0,.18);animation:slideUp .2s ease;}
.toast-ok{background:#22c55e;color:#fff;}
.toast-err{background:#ef4444;color:#fff;}
@keyframes slideUp{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
[x-cloak]{display:none!important;}
/* === PAGE: returns_central_v2_redesign === */
/* ── Page wrapper ── */
.rc-page { padding: 24px; max-width: 1400px; }
/* ── Page heading ── */
.rc-heading { margin-bottom: 24px; }
.rc-heading h1 { font-size: var(--fs-xl); font-weight: 700; color: var(--text-1); margin-bottom: 4px; }
.rc-heading p { font-size: var(--fs-2sm); color: var(--text-3); }
/* ── KPI grid ── */
.rc-kpi-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 12px;
margin-bottom: 24px;
}
.rc-kpi-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
padding: 16px 18px;
border-left-width: 3px;
border-left-color: var(--border);
transition: box-shadow .15s;
}
.rc-kpi-card:hover { box-shadow: 0 2px 8px rgba(0,0,0,.07); }
.rc-kpi-card.blue { border-left-color: #3b82f6; }
.rc-kpi-card.green { border-left-color: #10b981; }
.rc-kpi-card.yellow { border-left-color: #f59e0b; }
.rc-kpi-label { font-size: var(--fs-sm); color: var(--text-3); font-weight: 500; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 6px; }
.rc-kpi-val { font-size: var(--fs-card-num); font-weight: 700; color: var(--text-1); line-height: 1; font-variant-numeric: tabular-nums; }
.rc-kpi-sub { font-size: var(--fs-sm); color: var(--text-4); margin-top: 4px; }
/* ── 2-column grid ── */
.rc-grid-2 {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 16px;
margin-bottom: 16px;
}
@media (max-width: 900px) { .rc-grid-2 { grid-template-columns: 1fr; } }
/* ── Section card ── */
.rc-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
margin-bottom: 16px;
}
.rc-card-header {
padding: 14px 18px;
border-bottom: 1px solid var(--border);
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
}
.rc-card-title { font-size: var(--fs-md); font-weight: 600; color: var(--text-1); }
.rc-card-sub { font-size: var(--fs-sm); color: var(--text-3); font-variant-numeric: tabular-nums; }
.rc-card-body { padding: 0; overflow-x: auto; }
/* ── Table ── */
.rc-table { width: 100%; border-collapse: collapse; font-size: var(--fs-2sm); }
.rc-table thead th {
padding: 10px 14px;
text-align: left;
font-size: var(--fs-sm);
font-weight: 600;
text-transform: uppercase;
letter-spacing: .05em;
color: var(--text-3);
background: var(--bg-page);
border-bottom: 1px solid var(--border);
white-space: nowrap;
}
.rc-table tbody td {
padding: 12px 14px;
border-bottom: 1px solid var(--border);
vertical-align: middle;
color: var(--text-2);
}
.rc-table tbody tr:last-child td { border-bottom: none; }
.rc-table tbody tr:hover td { background: var(--bg-page); }
.rc-table td.mono { font-family: 'SFMono-Regular', Consolas, monospace; font-size: var(--fs-sm); color: var(--text-2); }
.rc-table td.num { text-align: right; font-variant-numeric: tabular-nums; font-size: var(--fs-2sm); }
.rc-table .empty-row td { text-align: center; padding: 24px; color: var(--text-4); font-size: var(--fs-2sm); }
/* ── Verdict badges ── */
.verdict-pill {
display: inline-flex; align-items: center;
font-size: var(--fs-sm); font-weight: 500;
padding: 2px 8px; border-radius: 9999px;
}
.verdict-ok { background: #f0fdf4; color: #16a34a; }
.verdict-warn { background: #fffbeb; color: #d97706; }
.verdict-bad { background: #fef2f2; color: #dc2626; }
html.dark .verdict-ok { background: rgba(16,185,129,.12); color: #34d399; }
html.dark .verdict-warn { background: rgba(245,158,11,.12); color: #fbbf24; }
html.dark .verdict-bad { background: rgba(239,68,68,.12); color: #f87171; }
/* ── Link style ── */
.rc-link { color: #3b82f6; text-decoration: none; }
.rc-link:hover { text-decoration: underline; }
html.dark .rc-link { color: #60a5fa; }
/* === PAGE: pim_matrix_v2_redesign === */
/* Matrix table base */
.matrix-table { border-collapse: collapse; width: 100%; font-size: var(--fs-sm); }
.matrix-table th {
padding: var(--space-2) var(--space-3); text-align: left;
font-size: var(--fs-xs); font-weight: var(--fw-bold); color: var(--text-3);
text-transform: uppercase; letter-spacing: .06em;
background: var(--bg-page); border-bottom: 1px solid var(--border);
white-space: nowrap;
}
html.dark .matrix-table th { background: var(--color-text); }
.matrix-table td {
padding: var(--space-2) var(--space-3); border-bottom: 1px solid var(--border);
vertical-align: middle;
}
.matrix-table tbody tr:hover td { background: var(--bg-page); }
html.dark .matrix-table tbody tr:hover td { background: var(--color-text); }
.matrix-th-mp { text-align: center !important; padding: var(--space-2) var(--space-1) !important; min-width: var(--space-10); }
/* Matrix status cells */
.mx-cell {
display: inline-flex; align-items: center; justify-content: center;
width: 32px; height: 22px;
border-radius: var(--radius-xs);
font-size: var(--fs-xs); font-weight: var(--fw-bold);
line-height: 1; white-space: nowrap;
}
.mx-cell-online { background: color-mix(in srgb, var(--color-good) 15%, transparent); color: var(--color-good); }
.mx-cell-recent { background: color-mix(in srgb, var(--color-warn) 15%, transparent); color: var(--color-warn); }
.mx-cell-draft { background: color-mix(in srgb, var(--color-accent) 12%, transparent); color: var(--color-accent); }
.mx-cell-error { background: color-mix(in srgb, var(--color-bad) 12%, transparent); color: var(--color-bad); }
.mx-cell-neu { background: color-mix(in srgb, var(--color-neu) 10%, transparent); color: var(--color-neu); }
.mx-cell-violet { background: color-mix(in srgb, var(--color-violet) 12%, transparent); color: var(--color-violet); }
.mx-cell-empty { color: var(--text-4); }
/* Matrix thumbnail */
.mx-thumb {
width: 28px; height: 28px; object-fit: contain;
border-radius: var(--radius-xs);
border: 1px solid var(--border); flex-shrink: 0;
}
/* Matrix SKU sticky cell */
.mx-sku-cell {
position: sticky; left: 0; background: var(--bg-surface); z-index: 1;
}
.mx-sku-cell-head {
position: sticky; left: 0; background: var(--bg-page); z-index: 2;
}
/* Matrix legend */
.mx-legend {
display: flex; flex-wrap: wrap; gap: var(--space-3);
margin-top: var(--space-3); font-size: var(--fs-xs); color: var(--text-3);
align-items: center;
}
.mx-legend-item {
display: inline-flex; align-items: center; gap: var(--space-1);
}
/* ── Переключатель колонок матрицы (JS: static/js/matrix_cols.js) ── */
.mx-col-off { display: none; }
.mx-cols { margin-top: var(--space-3); font-size: var(--fs-2sm); }
.mx-cols > summary {
cursor: pointer; color: var(--text-2); font-weight: var(--fw-medium);
display: inline-flex; align-items: center; gap: var(--space-2); user-select: none;
}
.mx-cols > summary:hover { color: var(--text-1); }
.mx-cols-count {
font-size: var(--fs-xs); color: var(--text-4); background: var(--bg-page);
border: 1px solid var(--border); border-radius: var(--radius-pill);
padding: 0 var(--space-2);
}
.mx-cols-count.is-filtered {
color: var(--color-accent); border-color: var(--color-accent);
background: color-mix(in srgb, var(--color-accent) 10%, var(--bg-surface));
}
.mx-cols-body {
margin-top: var(--space-3); padding: var(--space-3);
background: var(--bg-page); border: 1px solid var(--border);
border-radius: var(--radius-card);
}
.mx-cols-actions { display: flex; gap: var(--space-2); margin-bottom: var(--space-3); }
.mx-cols-groups { display: grid; grid-template-columns: 1fr; gap: var(--space-4); }
@media (min-width: 768px) { .mx-cols-groups { grid-template-columns: 2fr 1fr; } }
.mx-cols-group-h {
font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em;
color: var(--text-4); font-weight: var(--fw-semibold); margin-bottom: var(--space-2);
}
.mx-cols-item {
display: inline-flex; align-items: center; gap: var(--space-1);
margin-right: var(--space-4); margin-bottom: var(--space-1);
cursor: pointer; color: var(--text-2); white-space: nowrap;
}
.mx-cols-item:hover { color: var(--text-1); }
.mx-colhint { margin-top: var(--space-3); font-size: var(--fs-xs); color: var(--text-3); }
/* Matrix page wrapper */
.mx-page { padding: var(--space-5) var(--space-6); max-width: 1600px; }
/* Matrix filter card */
.mx-filters {
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: var(--radius-card); padding: var(--space-4); margin-bottom: var(--space-4);
}
/* Matrix table card */
.mx-table-card {
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: var(--radius-card); overflow: hidden; margin-bottom: var(--space-4);
}
/* Matrix summary count */
.mx-count-good { color: var(--color-good); font-weight: var(--fw-semibold); }
.mx-count-neu { color: var(--text-3); font-weight: var(--fw-semibold); }
/* Matrix label (filter labels) */
.mx-label {
display: block; font-size: var(--fs-xs); font-weight: var(--fw-semibold);
color: var(--text-3); text-transform: uppercase; letter-spacing: .04em;
margin-bottom: var(--space-1);
}
/* Matrix geometry helpers (вынос magic-numbers из inline) */
.mx-search-inp { width: 220px; }
.mx-sku-cell { min-width: 140px; }
.mx-sku-cell-head { min-width: 150px; }
.mx-title-head { min-width: 240px; }
.mx-child-sku { padding-left: var(--space-8); }
.mx-title-cell {
max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
font-size: var(--fs-sm); color: var(--text-2);
padding: var(--space-2) var(--space-3);
}
.mx-mp-cell { text-align: center; padding: var(--space-2) var(--space-1); }
.mx-num-cell { text-align: right; padding: var(--space-2) var(--space-3); }
.mx-cell-dormant { opacity: .7; }
.mx-cell-vparent { width: auto; padding: 0 var(--space-1); margin-left: var(--space-1); }
.mx-arrow { color: var(--text-4); }
.mx-num-cell-muted { color: var(--text-3); }
.mx-fs-xs { font-size: var(--fs-xs); }
.mx-fs-sm { font-size: var(--fs-sm); }
/* Matrix identity expander (внешние ID листингов по каналам) */
.mx-idbtn {
display: inline-flex; align-items: center; justify-content: center;
width: var(--space-5); height: var(--space-5); flex-shrink: 0;
border: none; background: none; cursor: pointer;
color: var(--text-3); border-radius: var(--radius-xs); font-size: var(--fs-sm);
}
.mx-idbtn:hover { background: var(--bg-page); color: var(--color-accent); }
.mx-id-panel { background: var(--bg-page); padding: var(--space-3) var(--space-4); }
.mx-id-title { font-size: var(--fs-xs); font-weight: var(--fw-semibold); color: var(--text-3);
text-transform: uppercase; letter-spacing: .04em; margin-bottom: var(--space-2); }
.mx-id-grid { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.mx-id-chip {
display: inline-flex; align-items: center; gap: var(--space-2);
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: var(--radius-badge); padding: var(--space-1) var(--space-3); font-size: var(--fs-xs);
}
.mx-id-chip-label { font-weight: var(--fw-semibold); color: var(--text-2); }
.mx-id-chip-val { color: var(--text-3); font-family: monospace; }
.mx-id-none { color: var(--text-4); font-size: var(--fs-xs); }
/* === PAGE: settings_permissions_v2_redesign === */
.pg-hd {
display: flex; align-items: flex-start; justify-content: space-between;
gap: 16px; padding: 20px 0 16px;
}
/* .pg-title canonical — dedup (см. глобальный) */
.pg-sub { font-size: var(--fs-2sm); color: var(--text-3); margin-top: 2px; }
.v7-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
}
/* Matrix table — sticky first col + header */
.perm-table { width: 100%; border-collapse: collapse; font-size: var(--fs-2sm); }
.perm-table thead th {
padding: 10px 12px; text-align: center;
background:var(--bg-page); border-bottom: 1px solid var(--border);
font-size: var(--fs-xs); font-weight: 700; color:var(--text-4);
text-transform: uppercase; letter-spacing: .06em;
white-space: nowrap;
}
html.dark .perm-table thead th { background: #1e293b; color: #64748b; }
.perm-table thead th:first-child,
.perm-table thead th:nth-child(2) { text-align: left; }
.perm-table thead th:first-child {
position: sticky; left: 0; z-index: 3;
background:var(--bg-page); min-width: 200px;
}
html.dark .perm-table thead th:first-child { background: #1e293b; }
.perm-table tbody td {
padding: 9px 12px; border-bottom: 1px solid var(--border);
text-align: center; vertical-align: middle; color: var(--text-1);
}
.perm-table tbody tr:last-child td { border-bottom: none; }
.perm-table tbody tr:hover td { background: var(--nav-hover); }
.perm-table tbody tr:hover td:first-child { background: var(--nav-hover); }
/* Sticky permission column */
.perm-table tbody td:first-child {
position: sticky; left: 0; z-index: 1;
background: var(--bg-surface);
text-align: left;
font-family: 'JetBrains Mono', 'Fira Code', monospace;
font-size: var(--fs-sm); color: var(--text-2); font-weight: 500;
min-width: 200px;
}
.perm-table tbody td:nth-child(2) {
text-align: left; color: var(--text-3); font-size: var(--fs-sm);
}
/* Check / empty */
.perm-check { font-size: var(--fs-md); }
.perm-empty { color: var(--border); font-size: var(--fs-md); }
/* === PAGE: settings_page_access_v2_redesign (per-user page visibility matrix) === */
.pa-toolbar { display:flex; align-items:center; gap: var(--space-3);
flex-wrap: wrap; margin-bottom: var(--space-4); }
.pa-toolbar .pa-hint { font-size: var(--fs-sm); color: var(--text-3); }
.pa-section-row td {
text-align: left !important;
background: var(--bg-page) !important;
font-weight: 700; font-size: var(--fs-xs);
text-transform: uppercase; letter-spacing: .06em;
color: var(--text-4);
}
.pa-col-actions { display:flex; flex-direction:column; gap: var(--space-1);
align-items:center; }
.pa-mini { font-size: var(--fs-xs); color: var(--accent);
background: none; border: none; cursor: pointer; padding: 0; }
.pa-mini:hover { text-decoration: underline; }
.pa-row-actions { display:inline-flex; gap: var(--space-2); }
.pa-cell-always { color: var(--good); font-size: var(--fs-sm); font-weight: 600; }
.pa-check { width: var(--space-4); height: var(--space-4); cursor: pointer; accent-color: var(--accent); }
/* === PAGE: search_v2_redesign === */
/* ── page-local helpers (additive — layout_v3 covers bg/text/border/fonts) ── */
/* Search input */
.search-wrap{max-width:680px;margin:0 auto 24px;}
.search-form{display:flex;gap:8px;}
.search-input{flex:1;border:1px solid var(--border);border-radius:8px;
padding:12px 16px;font-size: var(--fs-md);background:var(--bg-surface);color:var(--text-1);
transition:border-color .15s;}
.search-input:focus{outline:none;border-color:#1e293b;box-shadow:0 0 0 2px #1e293b22;}
.search-btn{padding:12px 24px;background:#1e293b;color:#fff;border:none;border-radius:8px;
font-size: var(--fs-2sm);font-weight:600;cursor:pointer;transition:opacity .12s;}
.search-btn:hover{opacity:.9;}
/* Order info grid */
.order-info{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;}
.oi-field label{font-size:var(--fs-xs);color:var(--text-3);text-transform:uppercase;
letter-spacing:.5px;display:block;margin-bottom:4px;}
.oi-field .val{font-size: var(--fs-2sm);font-weight:600;color:var(--text-1);}
.oi-field .val.mono{}
/* KPI profit row */
.profit-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;}
.profit-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:6px;padding:10px 12px;}
.profit-label{font-size:var(--fs-xs);color:var(--text-3);text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px;}
.profit-val{font-size: var(--fs-md);font-weight:700;font-variant-numeric:tabular-nums;}
.profit-val.good{color:var(--success);}
.profit-val.bad{color:var(--danger);}
.profit-val.warn{color:var(--warn);}
/* Brutto/Netto toggle */
.price-toggle{display:inline-flex;border:1px solid var(--border);border-radius:5px;overflow:hidden;}
.price-toggle button{background:var(--bg-surface);color:var(--text-2);border:none;
padding:5px 12px;font-size:var(--fs-xs);cursor:pointer;transition:all .12s;}
.price-toggle button.act{background:var(--text-1);color:var(--color-bg);}
/* Suggestion table */
.suggest-tbl{font-size:var(--fs-xs);}
.suggest-tbl td{padding:4px 8px;border-bottom:1px solid var(--border);}
/* Warning box */
.warn-box{border:1px solid var(--warn);border-radius:8px;padding:12px 16px;margin-bottom:12px;
border-left:4px solid var(--warn);background:var(--bg-surface);}
.warn-box.danger{border-color:var(--danger);border-left-color:var(--danger);}
/* Tracking status colors */
.ts-delivered{color:var(--success);}
.ts-transit{color:#1e293b;}
.ts-returned{color:var(--warn);}
.ts-unknown{color:var(--text-3);}
/* === PAGE: system_health_v2_redesign === */
.pg-header {
display: flex; align-items: flex-start; justify-content: space-between;
padding: 20px 24px 16px; gap: 16px;
}
/* .pg-title canonical — dedup (см. глобальный) */
.pg-sub { font-size: var(--fs-2sm); color: var(--text-3); margin-top: 4px; max-width: 540px; }
.pg-meta { font-size: var(--fs-xs); color: var(--text-4); text-align: right; flex-shrink: 0; }
/* KPI grid */
.kpi-val { font-size: var(--fs-card-num); font-weight: 700; color: var(--text-1); line-height: 1; }
/* Section */
.section-wrap { padding: 0 24px 20px; }
.section-card {
background: var(--bg-surface);
border: 1px solid var(--border);
border-radius: 10px;
overflow: hidden;
margin-bottom: 16px;
}
.section-head {
display: flex; align-items: center; justify-content: space-between;
padding: 12px 16px; border-bottom: 1px solid var(--border);
background:var(--bg-page);
}
html.dark .section-head { background: #1e293b; }
.section-title { font-size: var(--fs-md); font-weight: 700; color: var(--text-1); }
.section-badges { display: flex; gap: 6px; }
html.dark .badge-gray { background: #1e293b; }
/* Table */
.tbl { width: 100%; border-collapse: collapse; }
.tbl thead tr { background:var(--bg-page); border-bottom: 1px solid var(--border); }
html.dark .tbl thead tr { background: #1e293b; }
.tbl th {
padding: 8px 14px; font-size: var(--fs-xs); font-weight: 700;
text-transform: uppercase; letter-spacing: .06em;
color:var(--text-4); text-align: left; white-space: nowrap;
}
.tbl th.num { text-align: right; }
.tbl td { padding: 9px 14px; border-bottom: 1px solid var(--border); font-size: var(--fs-sm); vertical-align: middle; }
.tbl td.num { text-align: right; font-variant-numeric: tabular-nums; }
.tbl tbody tr:last-child td { border-bottom: none; }
.tbl tbody tr:hover td { background:var(--bg-page); }
html.dark .tbl tbody tr:hover td { background: #1e293b; }
.st-ok { color: #10b981; font-weight: 600; }
.st-warn { color: #f59e0b; font-weight: 600; }
.st-crit { color: #ef4444; font-weight: 700; }
.st-gray { color: var(--text-4); }
html.dark .empty-state code { background: #1e293b; }
.link-nav { color: #3b82f6; font-size: var(--fs-2sm); font-weight: 500; text-decoration: none; display: block; padding: 3px 0; }
.link-nav:hover { text-decoration: underline; }
.mono { font-family: ui-monospace, monospace; }
/* === PAGE: sales_anomalies_v2_redesign === */
.an-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:99px;font-size:var(--fs-xs);font-weight:700}
.an-critical{background:#fee2e2;color:#b91c1c}
.an-major {background:#ffedd5;color:#c2410c}
.an-minor {background:#fef9c3;color:#92400e}
.an-spike {background:#dcfce7;color:#15803d}
.an-normal {background:#f1f5f9;color:#64748b}
.an-insuf {background:#f1f5f9;color:#94a3b8}
.chart-wrap{background:var(--bg-surface);border:1px solid var(--border);border-radius:8px;padding:16px}
.mp-tab{display:inline-flex;align-items:center;gap:6px;padding:5px 14px;border-radius:6px;cursor:pointer;font-size:var(--fs-sm);font-weight:600;background:var(--bg-surface);border:1px solid var(--border);transition:all .15s}
.mp-tab.act{background:#1e293b;color:#fff;border-color:#1e293b}
/* === PAGE: sla_cockpit_v2_redesign === */
/* ── Score ring ── */
.score-ring-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;
background:var(--bg-surface);border:1px solid var(--border);border-radius:8px;
padding:24px 32px;margin-bottom:20px;gap:6px;}
.score-ring-num{font-size: var(--fs-display);font-weight:800;font-variant-numeric:tabular-nums;line-height:1;}
.score-ring-num.green{color:var(--success);}
.score-ring-num.yellow{color:var(--warn);}
.score-ring-num.red{color:var(--danger);}
.score-ring-label{font-size:var(--fs-xs);color:#6b7280;
text-transform:uppercase;letter-spacing:.6px;}
.score-ring-sub{font-size:var(--fs-sm);color:#374151;}
/* ── Section cards ── */
.v2-grid-3{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:16px;margin-bottom:20px;}
@media(max-width:1100px){.v2-grid-3{grid-template-columns:1fr 1fr;}}
@media(max-width:700px){.v2-grid-3{grid-template-columns:1fr;}}
.sla-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:8px;
padding:18px;display:flex;flex-direction:column;gap:10px;}
.sla-card-hd{display:flex;align-items:baseline;justify-content:space-between;}
.sla-card-title{font-size: var(--fs-2sm);font-weight:700;color:#1e293b;}
.sla-card-count{font-size:var(--t-2xl,28px);font-weight:800;font-variant-numeric:tabular-nums;}
.sla-card-count.zero{color:var(--success);}
.sla-card-count.has{color:var(--danger);}
.sla-card-badges{display:flex;gap:6px;flex-wrap:wrap;}
.badge-critical{background:rgba(220,38,38,.12);color:var(--danger);font-size:var(--fs-xs);
padding:2px 8px;border-radius:100px;font-weight:600;}
.badge-warning{background:rgba(234,179,8,.12);color:var(--warn);font-size:var(--fs-xs);
padding:2px 8px;border-radius:100px;font-weight:600;}
.badge-ok{background:rgba(34,197,94,.12);color:var(--success);font-size:var(--fs-xs);
padding:2px 8px;border-radius:100px;font-weight:600;}
/* ── Tables ── */
.pill-crit{display:inline-block;background:rgba(220,38,38,.12);color:var(--danger);
padding:1px 7px;border-radius:100px;font-size:var(--fs-xs);}
.pill-warn{display:inline-block;background:rgba(234,179,8,.12);color:var(--warn);
padding:1px 7px;border-radius:100px;font-size:var(--fs-xs);}
.pill-ok{display:inline-block;background:rgba(34,197,94,.12);color:var(--success);
padding:1px 7px;border-radius:100px;font-size:var(--fs-xs);}
.pill-broken{display:inline-block;background:rgba(220,38,38,.12);color:var(--danger);
padding:1px 7px;border-radius:100px;font-size:var(--fs-xs);}
.pill-partial{display:inline-block;background:rgba(234,179,8,.12);color:var(--warn);
padding:1px 7px;border-radius:100px;font-size:var(--fs-xs);}
/* ── Detail tables ── */
.v2-detail-section{background:var(--bg-surface);border:1px solid var(--border);
border-radius:8px;padding:18px;margin-bottom:20px;}
.v2-detail-hd{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:14px;}
.v2-detail-title{font-size: var(--fs-md);font-weight:700;color:#1e293b;}
.error-note{color:var(--danger);font-size:var(--fs-xs);
padding:8px 12px;background:rgba(220,38,38,.06);border-radius:6px;margin-top:6px;}
.empty-note{color:#6b7280;font-size:var(--fs-sm);padding:16px 0;text-align:center;}
/* === PAGE: pim_product_detail_v2_redesign === */
/* ─── PIM product detail v7 — scoped styles ─── */
.pim-pd { --bg: var(--bg-page); --bg-surface: var(--bg-surface); --bg-elevated: #f1f5f9; --bg-hover: #f8fafc;
--text-1: var(--text-1); --text-2: var(--text-2); --text-3: var(--text-3);
--border: var(--border); --border-strong: #cbd5e1;
--accent: #334155; --accent-soft: rgba(51,65,85,.08);
--success: #16a34a; --success-soft: rgba(22,163,74,.08);
--warn: #d97706; --warn-soft: rgba(217,119,6,.08);
--danger: #dc2626; --danger-soft: rgba(220,38,38,.08);
--shadow: 0 4px 16px rgba(0,0,0,.06);
}
html.dark .pim-pd {
--bg-elevated: #273344; --bg-hover: #273344;
--border-strong: #475569;
--accent: #94a3b8; --accent-soft: rgba(148,163,184,.1);
--success: #4ade80; --success-soft: rgba(74,222,128,.1);
--warn: #fbbf24; --warn-soft: rgba(251,191,36,.1);
--danger: #f87171; --danger-soft: rgba(248,113,113,.1);
--shadow: 0 4px 16px rgba(0,0,0,.3);
}
.pim-pd { display: flex; flex-direction: column; height: 100%; }
/* Buttons */
.pim-pd .btn-ghost { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 7px; font-size: var(--fs-sm); font-weight: 500; cursor: pointer; border: 1px solid var(--border); background: var(--bg-surface); color: var(--text-2); transition: background .12s; text-decoration: none; }
.pim-pd .btn-ghost:hover { background: var(--nav-hover); border-color: var(--border-strong); }
.pim-pd .btn-primary { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border-radius: 7px; font-size: var(--fs-sm); font-weight: 600; cursor: pointer; border: 1px solid #334155; background: #1e293b; color: #f8fafc; transition: background .12s; text-decoration: none; }
.pim-pd .btn-primary:hover { background: #0f172a; }
.pim-pd .btn { display:inline-flex; align-items:center; gap:4px; padding:6px 12px; border-radius:7px; font-size:var(--fs-sm); font-weight:500; cursor:pointer; border:1px solid var(--border); background:var(--bg-surface); color:var(--text-1); text-decoration:none; transition:background .12s; }
.pim-pd .btn:hover { background: var(--nav-hover); }
.pim-pd .btn.primary { background:#1e293b; border-color:#334155; color:#f8fafc; }
.pim-pd .btn.primary:hover { background:#0f172a; }
.pim-pd .btn.danger { color:var(--danger); border-color:var(--danger); }
.pim-pd .btn.danger:hover { background:var(--danger); color:white; }
/* Sub-header */
.pim-pd .sh { padding: 12px 16px; background: var(--bg-surface); border-bottom: 1px solid var(--border); display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: center; flex-shrink: 0; }
.pim-pd .sh-left { display: flex; gap: 12px; align-items: center; }
.pim-pd .sh-thumb { width: 44px; height: 44px; border: 1px solid var(--border); position: relative; border-radius: 8px; overflow: hidden; flex-shrink: 0; background: #f1f5f9; }
.pim-pd .sh-thumb img { width: 100%; height: 100%; object-fit: cover; }
.pim-pd .sh-thumb-count { position: absolute; bottom: 2px; right: 2px; background: #1e293b; color: #fff; font-size: var(--fs-4xs); padding: 1px 4px; border-radius: 2px; }
.pim-pd .sh-meta { flex: 1; }
.pim-pd .sh-bc { font-size: var(--fs-xs); color: var(--text-3); margin-bottom: 2px; display: flex; gap: 5px; }
.pim-pd .sh-bc b { color: var(--text-1); font-weight: 700; }
.pim-pd .sh-h { font-size: var(--fs-lg); font-weight: 700; letter-spacing: -0.3px; line-height: 1.2; display: flex; align-items: center; gap: 6px; }
.pim-pd .sh-ids { display: flex; gap: 12px; margin-top: 3px; font-size: var(--fs-xs); color: var(--text-3); }
.pim-pd .sh-ids b { color: var(--text-1); font-weight: 600; margin-left: 2px; }
.pim-pd .sh-right { display: flex; gap: 6px; flex-wrap: wrap; }
.pim-pd .stat-pill { display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-2xs); font-weight: 600; letter-spacing: .2px; padding: 3px 8px; border-radius: 20px; }
.pim-pd .stat-pill::before { content: ''; width: 5px; height: 5px; border-radius: 50%; }
.pim-pd .sp-ready { color: var(--success); background: var(--success-soft); }
.pim-pd .sp-ready::before { background: var(--success); }
.pim-pd .sp-draft { color: var(--warn); background: var(--warn-soft); }
.pim-pd .sp-draft::before { background: var(--warn); }
.pim-pd .sp-archived { color: var(--text-3); background: var(--bg-surface); }
.pim-pd .sp-archived::before { background: var(--text-3); }
/* 3-pane body */
.pim-pd .body { flex: 1; overflow: hidden; display: grid; grid-template-columns: 220px 1fr 260px; min-height: 0; }
@media (max-width: 1100px) { .pim-pd .body { grid-template-columns: 200px 1fr; } .pim-pd .rrail { display:none; } }
@media (max-width: 800px) { .pim-pd .body { grid-template-columns: 1fr; } .pim-pd .lrail { display:none; } }
/* Left rail */
.pim-pd .lrail { border-right: 1px solid var(--border); background: var(--bg-surface); display: flex; flex-direction: column; overflow: hidden; }
.pim-pd .lr-sec { padding: 12px 14px; border-bottom: 1px solid var(--border); flex-shrink: 0; }
.pim-pd .lr-h { font-size: var(--fs-2xs); font-weight: 700; letter-spacing: .8px; text-transform: uppercase; color: var(--text-3); margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
.pim-pd .lr-h::after { content: ''; flex: 1; height: 1px; background: var(--border); }
.pim-pd .comp { display: flex; align-items: center; gap: 10px; }
.pim-pd .ring { position: relative; width: 52px; height: 52px; flex-shrink: 0; }
.pim-pd .ring svg { transform: rotate(-90deg); }
.pim-pd .ring-pct { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: var(--fs-md); font-weight: 700; }
.pim-pd .comp-l { font-size: var(--fs-sm); font-weight: 700; }
.pim-pd .comp-d { font-size: var(--fs-2xs); color: var(--text-3); margin-top: 2px; line-height: 1.4; }
.pim-pd .iss { display: flex; gap: 8px; padding: 6px 0; border-bottom: 1px dotted var(--border); cursor: pointer; transition: opacity .1s; }
.pim-pd .iss:hover { opacity: .7; }
.pim-pd .iss:last-child { border-bottom: none; }
.pim-pd .iss-d { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; margin-top: 5px; }
.pim-pd .iss.red .iss-d { background: var(--danger); }
.pim-pd .iss.yel .iss-d { background: var(--warn); }
.pim-pd .iss.blu .iss-d { background: #64748b; }
.pim-pd .iss-tx { font-size: var(--fs-xs); line-height: 1.3; color: var(--text-2); }
.pim-pd .iss-tx b { color: var(--text-1); font-weight: 600; }
.pim-pd .iss-tag { font-size: var(--fs-3xs); color: var(--text-3); margin-top: 1px; }
.pim-pd .lr-tree { flex: 1; overflow-y: auto; padding: 10px 14px; }
.pim-pd .tree-p { font-size: var(--fs-sm); font-weight: 700; padding: 5px 0; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 6px; cursor: pointer; }
.pim-pd .tree-p::before { content: '▾'; font-size: var(--fs-2xs); color: var(--text-3); }
.pim-pd .tree-pn { color: var(--text-3); font-size: var(--fs-2xs); margin-left: auto; }
.pim-pd .tree-c { padding: 4px 0 4px 12px; display: flex; align-items: center; gap: 6px; cursor: pointer; font-size: var(--fs-xs); color: var(--text-2); border-left: 2px solid transparent; transition: background .1s; text-decoration: none; }
.pim-pd .tree-c:hover { background: var(--nav-hover); }
.pim-pd .tree-c.act { background: var(--accent-soft); color: var(--text-1); font-weight: 700; border-left-color: #1e293b; }
.pim-pd .tree-c-sz { flex: 1; }
.pim-pd .tree-c-st { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
.pim-pd .tree-c-st.on { background: var(--success); }
.pim-pd .tree-c-st.off { background: var(--border-strong); }
.pim-pd .tree-c-st.wn { background: var(--warn); }
/* Main content */
.pim-pd .main { overflow-y: auto; background: var(--bg-page); }
.pim-pd .tabs { display: flex; align-items: stretch; border-bottom: 1px solid var(--border); padding: 0 16px; background: var(--bg-surface); position: sticky; top: 0; z-index: 5; flex-wrap: wrap; }
.pim-pd .tab { display: flex; align-items: center; gap: 6px; padding: 11px 12px; cursor: pointer; font-size: var(--fs-xs); font-weight: 600; color: var(--text-2); border-bottom: 2px solid transparent; margin-bottom: -1px; text-transform: uppercase; letter-spacing: .4px; transition: all .12s; }
.pim-pd .tab:hover { color: var(--text-1); }
.pim-pd .tab.act { color: var(--text-1); border-bottom-color: #1e293b; font-weight: 700; }
html.dark .pim-pd .tab.act { border-bottom-color: #e2e8f0; }
.pim-pd .tab-bd { font-size: var(--fs-3xs); background: var(--text-1); color: var(--bg-surface); padding: 1px 5px; border-radius: 3px; font-weight: 700; }
.pim-pd .tab-bd.warn { background: var(--warn); color: white; }
.pim-pd .tab-bd.err { background: var(--danger); color: white; }
.pim-pd .tab-bd.ok { background: var(--success); color: white; }
.pim-pd .fields { padding: 18px 20px 60px; max-width: 1000px; }
.pim-pd .divider { border-top: 1px solid var(--border); margin: 24px 0 12px; padding-top: 6px; font-size: var(--fs-2xs); letter-spacing: 1px; text-transform: uppercase; font-weight: 700; color: var(--text-3); }
.pim-pd .field { margin-bottom: 16px; display: grid; grid-template-columns: 120px 1fr; gap: 16px; align-items: start; }
.pim-pd .field.full { grid-template-columns: 1fr; gap: 6px; }
.pim-pd .f-label { padding-top: 8px; }
.pim-pd .f-name { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .3px; text-transform: uppercase; color: var(--text-1); display: flex; align-items: center; gap: 4px; }
.pim-pd .f-name .req { color: var(--danger); }
.pim-pd .f-hint { font-size: var(--fs-2xs); color: var(--text-3); margin-top: 2px; line-height: 1.4; }
.pim-pd .f-attr-id { font-size: var(--fs-3xs); color: var(--text-3); margin-top: 2px; }
/* Input with gear */
.pim-pd .input-w { position: relative; }
.pim-pd .input-w input, .pim-pd .input-w textarea { width: 100%; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 7px; padding: 8px 36px 8px 11px; font-size: var(--fs-2sm); color: var(--text-1); outline: none; transition: border-color .12s; }
.pim-pd .input-w textarea { padding: 9px 36px 9px 11px; min-height: 88px; resize: vertical; line-height: 1.5; }
.pim-pd .input-w input:focus, .pim-pd .input-w textarea:focus { border-color: #94a3b8; }
.pim-pd .gear-btn { position: absolute; right: 4px; top: 4px; width: 26px; height: 26px; background: transparent; border: none; border-radius: 5px; cursor: pointer; color: var(--text-3); display: flex; align-items: center; justify-content: center; font-size: var(--fs-2sm); transition: all .12s; }
.pim-pd .gear-btn:hover { background: var(--nav-hover); color: var(--text-1); }
.pim-pd .gear-btn.act { background: #1e293b; color: white; }
.pim-pd .gear-menu { position: absolute; right: 0; top: 36px; z-index: 100; min-width: 210px; padding: 4px 0; background: var(--bg-surface); border: 1px solid var(--border-strong); border-radius: 8px; box-shadow: var(--shadow); display: none; }
.pim-pd .gear-menu.open { display: block; }
.pim-pd .gear-menu-item { padding: 8px 14px; cursor: pointer; font-size: var(--fs-sm); display: flex; align-items: center; gap: 8px; transition: background .1s; color: var(--text-1); }
.pim-pd .gear-menu-item:hover { background: var(--nav-hover); }
.pim-pd .gear-menu-item .ic { font-size: var(--fs-2sm); width: 18px; text-align: center; }
.pim-pd .gear-menu-sep { height: 1px; background: var(--border); margin: 4px 0; }
.pim-pd .gear-menu-h { padding: 5px 14px 3px; font-size: var(--fs-3xs); letter-spacing: .8px; text-transform: uppercase; color: var(--text-3); }
.pim-pd .f-meta { display: flex; align-items: center; gap: 8px; margin-top: 4px; font-size: var(--fs-2xs); color: var(--text-3); }
.pim-pd .f-counter.ok { color: var(--success); }
.pim-pd .f-counter.warn { color: var(--warn); }
.pim-pd .f-counter.err { color: var(--danger); }
.pim-pd .f-src { display: inline-flex; align-items: center; gap: 3px; border: 1px solid var(--border); padding: 1px 6px; font-size: var(--fs-3xs); letter-spacing: .2px; text-transform: uppercase; border-radius: 3px; }
.pim-pd .f-src.ai { color: #334155; border-color: #94a3b8; }
.pim-pd .f-src.jtl { color: var(--text-2); }
.pim-pd .f-src.man { color: var(--success); border-color: rgba(22,163,74,.3); }
/* Attr grid */
.pim-pd .attr-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.pim-pd .attr-cell { padding: 8px 10px; border: 1px solid var(--border); background: var(--bg-surface); border-radius: 7px; position: relative; }
.pim-pd .attr-cell-l { font-size: var(--fs-3xs); letter-spacing: .3px; text-transform: uppercase; color: var(--text-3); margin-bottom: 3px; }
.pim-pd .attr-cell-v { font-size: var(--fs-sm); font-weight: 500; color: var(--text-1); }
.pim-pd .attr-cell.miss .attr-cell-v { color: var(--danger); }
.pim-pd .attr-cell.warn .attr-cell-v { color: var(--warn); }
.pim-pd .attr-cell-gear { position: absolute; top: 4px; right: 4px; width: 20px; height: 20px; background: transparent; border: none; border-radius: 3px; cursor: pointer; color: var(--text-3); font-size: var(--fs-2xs); display: flex; align-items: center; justify-content: center; }
.pim-pd .attr-cell-gear:hover { background: var(--nav-hover); color: var(--text-1); }
/* Right rail */
.pim-pd .rrail { border-left: 1px solid var(--border); background: var(--bg-surface); overflow-y: auto; display: flex; flex-direction: column; }
.pim-pd .rr-sec { padding: 11px 14px; border-bottom: 1px solid var(--border); }
.pim-pd .rr-h { font-size: var(--fs-2xs); font-weight: 700; letter-spacing: .8px; text-transform: uppercase; color: var(--text-3); margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
.pim-pd .rr-h-tag { font-size: var(--fs-3xs); color: var(--text-3); margin-left: auto; font-weight: 400; }
.pim-pd .pub-row { display: flex; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px solid var(--border); }
.pim-pd .pub-row:last-child { border-bottom: none; }
.pim-pd .pub-mp { flex: 1; }
.pim-pd .pub-mp-n { font-size: var(--fs-sm); font-weight: 600; }
.pim-pd .pub-mp-sub { font-size: var(--fs-2xs); color: var(--text-3); margin-top: 1px; }
.pim-pd .pub-st { font-size: var(--fs-2xs); font-weight: 700; letter-spacing: .3px; text-transform: uppercase; }
.pim-pd .pub-st.live { color: var(--success); }
.pim-pd .pub-st.draft { color: var(--warn); }
.pim-pd .pub-st.off { color: var(--text-3); }
.pim-pd .pub-act { font-size: var(--fs-2xs); color: #475569; cursor: pointer; margin-top: 1px; text-decoration: none; }
.pim-pd .pub-act:hover { text-decoration: underline; }
.pim-pd .src-row { display: flex; align-items: center; justify-content: space-between; padding: 4px 0; border-bottom: 1px dotted var(--border); font-size: var(--fs-xs); }
.pim-pd .src-row:last-child { border-bottom: none; }
.pim-pd .src-l { color: var(--text-3); text-transform: uppercase; letter-spacing: .3px; font-size: var(--fs-3xs); }
.pim-pd .src-v { color: var(--text-1); font-weight: 600; font-size: var(--fs-xs); }
.pim-pd .src-v a { color: #475569; text-decoration: none; }
.pim-pd .src-v a:hover { text-decoration: underline; }
.pim-pd .act-row { display: flex; gap: 8px; padding: 7px 0; border-bottom: 1px dotted var(--border); }
.pim-pd .act-row:last-child { border-bottom: none; }
.pim-pd .act-i { width: 20px; height: 20px; flex-shrink: 0; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 4px; display: flex; align-items: center; justify-content: center; font-size: var(--fs-2xs); }
.pim-pd .act-i.ai { background: #f1f5f9; border-color: #94a3b8; }
.pim-pd .act-tx { font-size: var(--fs-xs); line-height: 1.3; color: var(--text-2); flex: 1; }
.pim-pd .act-tx b { color: var(--text-1); font-weight: 600; }
.pim-pd .act-t { font-size: var(--fs-3xs); color: var(--text-3); margin-top: 2px; }
/* Status bar */
.pim-pd .sb { height: 22px; background: #1e293b; color: rgba(255,255,255,.5); display: flex; align-items: center; padding: 0 14px; gap: 14px; font-size: var(--fs-3xs); flex-shrink: 0; letter-spacing: .3px; }
html.dark .pim-pd .sb { background: var(--bg-surface); color: var(--text-3); border-top: 1px solid var(--border); }
.pim-pd .sb-d { display: inline-block; width: 4px; height: 4px; border-radius: 50%; margin-right: 4px; vertical-align: middle; }
.pim-pd .sb-ok { color: #4ade80; }
.pim-pd .sb-ok .sb-d { background: #4ade80; }
.pim-pd .sb-er { color: #f87171; }
.pim-pd .sb-er .sb-d { background: #f87171; }
.pim-pd .sb-wn { color: #fbbf24; }
.pim-pd .sb-wn .sb-d { background: #fbbf24; }
.pim-pd .sb-r { margin-left: auto; }
/* Modals */
.pim-pd-modal-bg { position: fixed; inset: 0; background: rgba(0,0,0,.45); display: none; align-items: center; justify-content: center; z-index: 200; backdrop-filter: blur(3px); }
.pim-pd-modal-bg.open { display: flex; }
.pim-pd-modal-bg .modal { background: var(--bg-surface); border: 1px solid #cbd5e1; border-radius: 10px; max-width: 720px; width: 90vw; max-height: 85vh; box-shadow: 0 20px 60px rgba(0,0,0,.12); display: flex; flex-direction: column; }
.pim-pd-modal-bg .modal-md { max-width: 540px; }
.pim-pd-modal-bg .modal-head { padding: 14px 18px; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 10px; }
.pim-pd-modal-bg .modal-h { font-size: var(--fs-md); font-weight: 700; flex: 1; }
.pim-pd-modal-bg .modal-sub { font-size: var(--fs-2xs); color: var(--text-3); }
.pim-pd-modal-bg .modal-close { background: none; border: 1px solid var(--border); padding: 3px 8px; border-radius: 5px; cursor: pointer; font-size: var(--fs-2sm); color: var(--text-2); }
.pim-pd-modal-bg .modal-close:hover { background: var(--nav-hover); }
.pim-pd-modal-bg .modal-body { flex: 1; padding: 16px 18px; overflow-y: auto; }
.pim-pd-modal-bg .modal-foot { padding: 12px 18px; border-top: 1px solid var(--border); display: flex; align-items: center; gap: 8px; }
.pim-pd-modal-bg .spacer { flex: 1; }
.pim-pd-modal-bg .btn { display:inline-flex; align-items:center; gap:4px; padding:6px 12px; border-radius:7px; font-size:var(--fs-sm); font-weight:500; cursor:pointer; border:1px solid var(--border); background:var(--bg-surface); color:var(--text-1); text-decoration:none; }
.pim-pd-modal-bg .btn.primary { background:#1e293b; border-color:#334155; color:#f8fafc; }
.pim-pd-modal-bg .mb-label { font-size: var(--fs-2xs); letter-spacing: .7px; text-transform: uppercase; color: var(--text-3); margin-bottom: 6px; margin-top: 12px; }
.pim-pd-modal-bg .mb-label:first-child { margin-top: 0; }
.pim-pd-modal-bg .mb-current { background: var(--bg-surface); border: 1px solid var(--border); border-radius: 6px; padding: 9px 11px; font-size: var(--fs-sm); color: var(--text-2); line-height: 1.5; margin-bottom: 12px; }
.pim-pd-modal-bg .mb-textarea { width: 100%; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 7px; padding: 9px 11px; font-size: var(--fs-2sm); color: var(--text-1); outline: none; min-height: 78px; resize: vertical; line-height: 1.5; }
.pim-pd-modal-bg .mb-textarea:focus { border-color: #94a3b8; }
.pim-pd-modal-bg .diff { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 8px; }
.pim-pd-modal-bg .diff-pane { padding: 10px; border-radius: 6px; font-size: var(--fs-sm); line-height: 1.5; }
.pim-pd-modal-bg .diff-pane.before { background: rgba(220,38,38,.08); border: 1px solid #dc2626; }
.pim-pd-modal-bg .diff-pane.after { background: rgba(22,163,74,.08); border: 1px solid #16a34a; }
.pim-pd-modal-bg .diff-pane-l { font-size: var(--fs-3xs); letter-spacing: .8px; text-transform: uppercase; margin-bottom: 6px; }
.pim-pd-modal-bg .diff-pane.before .diff-pane-l { color: #dc2626; }
.pim-pd-modal-bg .diff-pane.after .diff-pane-l { color: #16a34a; }
.pim-pd-modal-bg .loc-cb-row { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; margin-top: 6px; }
.pim-pd-modal-bg .loc-cb { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border: 1px solid var(--border); border-radius: 20px; cursor: pointer; font-size: var(--fs-xs); font-weight: 600; transition: all .12s; }
.pim-pd-modal-bg .loc-cb:hover { border-color: #94a3b8; }
.pim-pd-modal-bg .loc-cb.act { border-color: #334155; background: #f1f5f9; color: #1e293b; }
html.dark .pim-pd-modal-bg .loc-cb.act { border-color: #64748b; background: #1e293b; color: #e2e8f0; }
.pim-pd-modal-bg .toggle-row { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-bottom: 1px dotted var(--border); }
.pim-pd-modal-bg .toggle-row:last-child { border-bottom: none; }
.pim-pd-modal-bg .toggle-sw { width: 30px; height: 17px; background: #cbd5e1; border-radius: 9px; position: relative; cursor: pointer; flex-shrink: 0; transition: background .15s; }
.pim-pd-modal-bg .toggle-sw.on { background: #334155; }
.pim-pd-modal-bg .toggle-sw::after { content: ''; position: absolute; top: 2.5px; left: 2.5px; width: 12px; height: 12px; background: white; border-radius: 50%; transition: transform .15s; }
.pim-pd-modal-bg .toggle-sw.on::after { transform: translateX(13px); }
.pim-pd-modal-bg .toggle-l { font-size: var(--fs-xs); font-weight: 600; }
.pim-pd-modal-bg .toggle-sub { font-size: var(--fs-2xs); color: var(--text-3); margin-top: 1px; }
.pim-pd-modal-bg .mp-pick { display: flex; gap: 10px; padding: 9px; border: 1px solid var(--border); border-radius: 7px; cursor: pointer; margin-bottom: 7px; transition: all .12s; }
.pim-pd-modal-bg .mp-pick:hover { border-color: #94a3b8; }
.pim-pd-modal-bg .mp-pick.act { border-color: #334155; background: #f1f5f9; }
html.dark .pim-pd-modal-bg .mp-pick.act { border-color: #64748b; background: #1e293b; }
.pim-pd-modal-bg .mp-pick-radio { width: 13px; height: 13px; border-radius: 50%; border: 2px solid #cbd5e1; flex-shrink: 0; margin-top: 3px; transition: all .12s; }
.pim-pd-modal-bg .mp-pick.act .mp-pick-radio { border-color: #1e293b; background: #1e293b; }
.pim-pd-modal-bg .mp-pick-meta { flex: 1; }
.pim-pd-modal-bg .mp-pick-n { font-size: var(--fs-xs); font-weight: 600; margin-bottom: 3px; }
.pim-pd-modal-bg .mp-pick-d { font-size: var(--fs-xs); color: var(--text-2); line-height: 1.4; }
.pim-pd-modal-bg .mp-pill { display: inline-flex; align-items: center; gap: 3px; font-size: var(--fs-3xs); font-weight: 700; padding: 2px 6px; border-radius: 3px; }
.pim-pd-modal-bg .mp-pill.kl { color: white; background: #F07800; }
/* Toast */
.pim-pd-toast-container { position: fixed; bottom: 28px; right: 18px; z-index: 999; display: flex; flex-direction: column; gap: 7px; }
.pim-pd-toast-container .toast { background: var(--bg-surface); border: 1px solid #cbd5e1; border-radius: 8px; padding: 9px 14px; font-size: var(--fs-sm); box-shadow: 0 4px 16px rgba(0,0,0,.08); max-width: 320px; animation: pdToastIn .2s ease; display: flex; align-items: center; gap: 9px; }
.pim-pd-toast-container .toast.ok { border-left: 3px solid #16a34a; }
.pim-pd-toast-container .toast.err { border-left: 3px solid #dc2626; }
.pim-pd-toast-container .toast.wip { border-left: 3px solid #d97706; }
@keyframes pdToastIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
/* Images */
.pim-pd .img-grid { display: grid; grid-template-columns: repeat(6,1fr); gap: 8px; }
.pim-pd .img-cell { aspect-ratio:1; background: var(--bg-surface); border: 1px solid var(--border); border-radius: 7px; position: relative; cursor: pointer; overflow: hidden; }
.pim-pd .img-cell img { width: 100%; height: 100%; object-fit: cover; }
.pim-pd .img-cell-badge { position: absolute; top: 3px; left: 3px; background: #1e293b; color: white; font-size: var(--fs-4xs); padding: 1px 5px; border-radius: 2px; }
.pim-pd .img-cell-add { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; border: 1px dashed #cbd5e1; cursor: pointer; }
.pim-pd .img-cell-add span.ic { font-size: var(--fs-xl); color: var(--text-3); }
.pim-pd .img-cell-add span.lbl { font-size: var(--fs-3xs); color: var(--text-3); text-align: center; line-height: 1.2; }
/* override layout_v3 .v3-content so this page fills it fully without max-width */
.v3-content:has(.pim-pd) { padding: 0; }
/* === PAGE: settings_shipping_groups_v2_redesign === */
.v2-input-inline{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-input);padding:var(--space-1) var(--space-2);font-size:var(--fs-xs);color:var(--text-1);width:100%;}
.v2-input-inline:focus{outline:none;border-color:var(--text-1);}
/* === CANONICAL FILTERS SECTION (IRON LAW #12) ===
* Единый layout для всех marketplace-страниц.
* Используется в orders/returns/tickets/orphans/coverage/listing.
* Структура:
*
*/
.filters-section {
background: var(--color-bg, #fff);
border: 1px solid var(--color-border, #e2e8f0);
border-radius: var(--radius-card);
padding: var(--space-4);
margin-bottom: var(--space-4);
}
.filters-title {
font-size: var(--fs-sm);
font-weight: var(--fw-semibold);
color: var(--color-text-muted, #64748b);
text-transform: uppercase;
letter-spacing: .04em;
margin: 0 0 var(--space-3) 0;
}
.filters-section .filter-form {
display: flex;
flex-wrap: wrap;
gap: var(--space-3);
align-items: flex-end;
justify-content: flex-start;
}
.filters-section .filter-form > .btn-primary,
.filters-section .filter-form > .btn-ghost {
height: 34px;
align-self: flex-end;
}
.btn-icon { width: 14px; height: 14px; flex-shrink: 0; }
.filter-input-cc { min-width: 60px; max-width: 80px; text-transform: uppercase; }
.filter-input-wide { min-width: 240px; }
.filters-section-info { margin-left: auto; font-size: var(--fs-xs); color: var(--color-text-muted); }
.filters-section-info-num { font-weight: var(--fw-bold); color: var(--color-text, #1e293b); }
/* AI Models settings — modal + form-actions (2026-05-28) */
.filter-actions { display: flex; flex-direction: row; flex-wrap: wrap; gap: var(--space-2); align-items: center; margin-top: var(--space-2); }
.modal-backdrop { position: fixed; inset: 0; background: rgba(15, 23, 42, 0.5); display: flex; align-items: center; justify-content: center; z-index: 1000; padding: var(--space-4); }
.modal-panel { background: var(--color-bg); border-radius: var(--radius-card); padding: var(--space-6); max-width: 480px; width: 100%; box-shadow: var(--shadow-lg); }
[x-cloak] { display: none !important; }
/* AI Agents Builder Phase 2 — form helpers (2026-05-28) */
.v2-full { flex-basis: 100%; display: block; }
.v2-textarea { width: 100%; min-height: 120px; font-family: var(--font-mono, monospace); font-size: var(--fs-sm); line-height: 1.5; resize: vertical; }
.v2-fieldset { border: 1px solid var(--color-border); border-radius: var(--radius-card); padding: var(--space-3); margin-top: var(--space-2); flex-basis: 100%; }
.v2-fieldset legend { font-weight: 600; padding: 0 var(--space-2); color: var(--color-text); }
.v2-checkgroup { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-3); margin: var(--space-2) 0; align-items: center; }
.v2-check { display: inline-flex; align-items: center; gap: var(--space-1); cursor: pointer; font-size: var(--fs-sm); }
.v2-check input { margin: 0; }
.v2-alert-bad { background: var(--color-bg-bad, #fef2f2); border-left: 3px solid var(--color-bad, #dc2626); color: var(--color-bad, #991b1b); padding: var(--space-3); border-radius: var(--radius-input); margin: var(--space-3) 0; }
.v2-output-box { background: var(--color-bg-subtle, #f8fafc); border: 1px solid var(--color-border); border-radius: var(--radius-card); padding: var(--space-3); margin-top: var(--space-3); }
.v2-output-meta { display: flex; gap: var(--space-2); align-items: baseline; margin-bottom: var(--space-2); font-size: var(--fs-sm); }
.v2-output-pre { background: var(--color-bg); border: 1px solid var(--color-border); border-radius: var(--radius-input); padding: var(--space-3); white-space: pre-wrap; word-wrap: break-word; font-family: var(--font-mono, monospace); font-size: var(--fs-sm); max-height: 500px; overflow-y: auto; }
/* === Sidebar marketplace icons (canonical, replaces inline style="...") === */
.v3-mp-icon {
flex-shrink: 0;
vertical-align: middle;
margin-right: var(--space-1);
}
/* === Sidebar main-dashboard nav highlight (canonical) === */
.v3-nav-item.main-highlight {
margin-top: var(--space-1);
background: linear-gradient(90deg, rgba(59,130,246,.08), transparent);
border-left: 3px solid var(--color-accent);
}
.ac-text-muted { color: var(--color-text-muted); font-size: var(--fs-sm); }
/* === Address check: full address comparison cells === */
.ac-cell-bold { font-weight: var(--fw-bold); }
.ac-cell-sub { font-size: var(--fs-xs); color: var(--color-text-muted); }
.ac-addr-block { display: flex; flex-direction: column; gap: var(--space-1); min-width: 200px; }
.ac-addr-line { font-size: var(--fs-sm); line-height: 1.35; }
.ac-addr-line.ac-addr-diff { color: var(--color-bad); font-weight: var(--fw-semibold); }
.ac-addr-country { font-size: var(--fs-xs); color: var(--color-text-muted); text-transform: uppercase; }
.ac-btn-sm { padding: var(--space-1) var(--space-2); font-size: var(--fs-xs); text-decoration: none; }
/* ═══════════════════════════════════════════════════════════════════════
PAGE CONTRACT — единый скелет страницы (templates/_partials/page.html)
list_page / detail_page / dashboard_page. IRON LAW 2026-05-29.
Только var(--*), без magic numbers.
═══════════════════════════════════════════════════════════════════════ */
.page-container {
display: flex;
flex-direction: column;
gap: var(--space-4);
width: 100%;
}
/* period chips — слева, сразу под breadcrumb, без обёрток-отступов */
.page-period { display: flex; }
/* KPI row — отступ снизу управляется gap контейнера, обнуляем родной margin */
.page-kpi-row { margin-bottom: 0; }
/* секция таблицы/контента */
.page-section { margin: 0; }
.page-section-meta {
display: flex;
align-items: center;
gap: var(--space-3);
flex-wrap: wrap;
}
.page-table-scroll { overflow-x: auto; }
/* detail + dashboard тела — единая колоночная раскладка с canonical gap */
.page-detail-body,
.page-dashboard-body {
display: flex;
flex-direction: column;
gap: var(--space-4);
}
/* ── kaufland_orders golden-reference cell helpers (page-contract migration) ──
Replace per-cell inline styles so the template stays guard-clean.
Token-only — zero numeric literals (passes check_css_drift.sh). */
.ko-rows-form { display: inline-flex; align-items: center; gap: var(--space-2); }
.ko-rows-label { font-size: var(--fs-xs); color: var(--color-text-muted); font-weight: var(--fw-semibold); }
.ko-id-link { color: var(--color-text); font-weight: var(--fw-semibold); text-decoration: underline; text-decoration-color: var(--color-border); }
.ko-jtl-link { color: var(--color-accent); font-weight: var(--fw-medium); }
.ko-cell-strong { font-weight: var(--fw-semibold); color: var(--color-text); }
.ko-muted { color: var(--color-text-muted); }
.ko-email { max-width: var(--space-10); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fs-xs); color: var(--color-text-muted); }
/* ── dashboard/detail caller helpers (page-contract batch C migration) ──
Token-only — replaces removed inline styles in amazon/ebay dashboards.
Zero numeric literals → passes check_css_drift.sh. */
.amz-mp-filter { display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; }
.amz-mp-back { font-size: var(--fs-xs); color: var(--color-text-muted); }
.amz-mp-chip { font-size: var(--fs-xs); font-weight: var(--fw-medium); color: var(--color-warn); padding: var(--space-1) var(--space-2); background: var(--color-bg-soft); border-radius: var(--radius-badge); }
.ebay-orders-btn { margin-left: var(--space-2); }
/* ===================================================================
layout_v3 migration (2026-06-03) — scoped page styles moved out of
templates head_extra to satisfy check_ui_drift Rule 3 (no canonical
class redefinition inside templates/*.html). Selectors unchanged —
scoped under .pnl-v3 / .pic-v3 / .cat-live, behavior identical.
=================================================================== */
/* --- admin/pnl/dashboard.html --- */
/* v3 canon — scoped to .pnl-v3 */
.pnl-v3 {
--pv-border: #e5e7eb;
--pv-border-strong: #d1d5db;
--pv-text-1: #0f172a;
--pv-text-2: #334155;
--pv-text-3: #64748b;
--pv-text-4: #94a3b8;
--pv-bg-surface: #ffffff;
--pv-bg-subtle: #f8fafc;
--pv-shadow-sm: 0 1px 2px rgba(0,0,0,.04);
font-family: 'Inter', system-ui, -apple-system, sans-serif;
color: var(--pv-text-1);
padding: 20px 24px 60px;
max-width: 1800px;
margin: 0 auto;
}
html.dark .pnl-v3 {
--pv-border: #334155;
--pv-border-strong: #475569;
--pv-text-1: #f1f5f9;
--pv-text-2: #cbd5e1;
--pv-text-3: #94a3b8;
--pv-text-4: #64748b;
--pv-bg-surface: #1e293b;
--pv-bg-subtle: #273344;
}
.pnl-v3 .sec-card {
background: var(--pv-bg-surface);
border: 1px solid var(--pv-border);
border-radius: 12px;
box-shadow: var(--pv-shadow-sm);
padding: 16px 18px;
margin-bottom: 14px;
}
.pnl-v3 .sec-head {
display: flex; align-items: baseline; justify-content: space-between;
flex-wrap: wrap; gap: 8px; margin-bottom: 12px;
}
.pnl-v3 .sec-title {
font-size: var(--fs-xs); font-weight: 700; color: var(--pv-text-3);
text-transform: uppercase; letter-spacing: .08em;
}
.pnl-v3 h1 {
font-size: var(--fs-section); font-weight: 700; color: var(--pv-text-1);
margin: 0; letter-spacing: -0.4px; display: flex; align-items: center; gap: 10px;
}
.pnl-v3 .sec-sub { font-size: var(--fs-sm); color: var(--pv-text-3); }
.pnl-v3 .muted { color: var(--pv-text-4); }
/* Buttons — same as v3 product detail */
.pnl-v3 .tb-btn {
display: inline-flex; align-items: center; gap: 6px;
padding: 6px 12px; border-radius: 8px; font-size: var(--fs-2sm); font-weight: 500;
border: 1px solid var(--pv-border); background: var(--pv-bg-surface); color: var(--pv-text-2);
transition: all .15s; text-decoration: none; cursor: pointer;
}
.pnl-v3 .tb-btn:hover { background: var(--pv-bg-subtle); border-color: var(--pv-border-strong); color: var(--pv-text-1); }
.pnl-v3 .tb-btn.primary { background: var(--pv-text-1); color: var(--pv-bg-surface); border-color: var(--pv-text-1); }
.pnl-v3 .tb-btn.primary:hover { opacity: .85; }
.pnl-v3 .tb-btn.active { background: var(--pv-text-1); color: var(--pv-bg-surface); border-color: var(--pv-text-1); }
.pnl-v3 .tb-btn.compact { padding: 4px 8px; font-size: var(--fs-sm); }
/* Selects + inputs */
.pnl-v3 select.tb-input, .pnl-v3 input.tb-input {
padding: 6px 10px; border-radius: 8px; font-size: var(--fs-2sm);
border: 1px solid var(--pv-border); background: var(--pv-bg-surface); color: var(--pv-text-1);
font-family: inherit;
}
.pnl-v3 select.tb-input:hover, .pnl-v3 input.tb-input:hover { border-color: var(--pv-border-strong); }
/* KPI cards */
.pnl-v3 .kpi-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 14px; }
@media (max-width: 880px) { .pnl-v3 .kpi-grid { grid-template-columns: repeat(2, 1fr); } }
.pnl-v3 .kpi {
background: var(--pv-bg-surface);
border: 1px solid var(--pv-border);
border-radius: 12px; padding: 14px 16px;
box-shadow: var(--pv-shadow-sm);
}
.pnl-v3 .kpi-label {
font-size: var(--fs-xs); font-weight: 700; color: var(--pv-text-3);
text-transform: uppercase; letter-spacing: .08em; margin-bottom: 6px;
display: flex; align-items: center; gap: 6px;
}
.pnl-v3 .kpi-value {
font-size: var(--fs-2xl); font-weight: 700; color: var(--pv-text-1);
font-feature-settings: 'tnum'; letter-spacing: -0.5px;
line-height: 1.15;
}
.pnl-v3 .kpi-value.pos { color: #047857; }
.pnl-v3 .kpi-value.neg { color: #b91c1c; }
.pnl-v3 .kpi-sub { font-size: var(--fs-sm); color: var(--pv-text-3); margin-top: 4px; }
html.dark .pnl-v3 .kpi-value.pos { color: #4ade80; }
html.dark .pnl-v3 .kpi-value.neg { color: #f87171; }
/* Cost stack — inline rows in single sec-card */
.pnl-v3 .cost-stack { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px 18px; font-size: var(--fs-2sm); }
@media (max-width: 880px) { .pnl-v3 .cost-stack { grid-template-columns: repeat(2, 1fr); } }
.pnl-v3 .cost-stack .row { display: flex; justify-content: space-between; align-items: baseline; padding: 4px 0; border-bottom: 1px dashed var(--pv-border); }
.pnl-v3 .cost-stack .row:last-child { border-bottom: none; }
.pnl-v3 .cost-stack .row .lbl { color: var(--pv-text-3); font-size: var(--fs-sm); }
.pnl-v3 .cost-stack .row .val { font-weight: 600; color: var(--pv-text-1); font-feature-settings: 'tnum'; }
/* Tables */
.pnl-v3 .tbl-wrap { overflow-x: auto; border-radius: 12px; }
.pnl-v3 table.pnl-tbl { width: 100%; font-size: var(--fs-2sm); border-collapse: collapse; }
.pnl-v3 table.pnl-tbl thead th {
font-size: var(--fs-2xs); font-weight: 700; text-transform: uppercase; letter-spacing: .08em;
color: var(--pv-text-3); background: var(--pv-bg-subtle);
padding: 8px 10px; text-align: left; border-bottom: 1px solid var(--pv-border);
position: sticky; top: 0;
}
.pnl-v3 table.pnl-tbl thead th.r { text-align: right; }
.pnl-v3 table.pnl-tbl tbody td {
padding: 7px 10px; border-bottom: 1px solid var(--pv-border);
color: var(--pv-text-2); font-feature-settings: 'tnum';
}
.pnl-v3 table.pnl-tbl tbody td.r { text-align: right; font-variant-numeric: tabular-nums; }
.pnl-v3 table.pnl-tbl tbody td.sku { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: var(--fs-sm); color: var(--pv-text-1); }
.pnl-v3 table.pnl-tbl tbody tr:nth-child(even) { background: var(--pv-bg-subtle); }
.pnl-v3 table.pnl-tbl tbody tr:hover { background: rgba(15,23,42,.04); }
html.dark .pnl-v3 table.pnl-tbl tbody tr:hover { background: rgba(255,255,255,.04); }
.pnl-v3 table.pnl-tbl a { color: var(--pv-text-1); text-decoration: none; border-bottom: 1px dotted var(--pv-text-4); }
.pnl-v3 table.pnl-tbl a:hover { border-bottom-color: var(--pv-text-1); }
.pnl-v3 .pnl-pos { color: #047857; font-weight: 600; }
.pnl-v3 .pnl-neg { color: #b91c1c; font-weight: 600; }
html.dark .pnl-v3 .pnl-pos { color: #4ade80; }
html.dark .pnl-v3 .pnl-neg { color: #f87171; }
/* Margin badges */
.pnl-v3 .pn-badge {
display: inline-block; padding: 1px 7px; border-radius: 4px;
font-size: var(--fs-xs); font-weight: 600; font-feature-settings: 'tnum';
}
.pnl-v3 .pn-badge.ok { background: rgba(16,185,129,.15); color: #047857; }
.pnl-v3 .pn-badge.warn { background: rgba(234,179,8,.18); color: #854d0e; }
.pnl-v3 .pn-badge.low { background: rgba(249,115,22,.18); color: #9a3412; }
.pnl-v3 .pn-badge.bad { background: rgba(220,38,38,.18); color: #991b1b; }
html.dark .pnl-v3 .pn-badge.ok { color: #4ade80; }
html.dark .pnl-v3 .pn-badge.warn { color: #fde047; }
html.dark .pnl-v3 .pn-badge.low { color: #fdba74; }
html.dark .pnl-v3 .pn-badge.bad { color: #f87171; }
/* Two-table grid */
.pnl-v3 .duo { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 1100px) { .pnl-v3 .duo { grid-template-columns: 1fr; } }
/* Provisional banner */
.pnl-v3 .alert-prov {
display: flex; align-items: center; gap: 8px;
padding: 8px 12px; border-radius: 8px;
background: rgba(234,179,8,.12); color: #854d0e;
border: 1px solid rgba(234,179,8,.3);
font-size: var(--fs-sm); margin-top: 10px;
}
html.dark .pnl-v3 .alert-prov { color: #fde047; }
/* Filters row */
.pnl-v3 .filt-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.pnl-v3 .filt-sep { width: 1px; height: 24px; background: var(--pv-border); margin: 0 4px; }
.pnl-v3 .filt-lbl { font-size: var(--fs-xs); font-weight: 600; color: var(--pv-text-3); text-transform: uppercase; letter-spacing: .05em; margin-right: 4px; }
/* Section heading inside grid */
.pnl-v3 .duo-head {
padding: 10px 14px; border-bottom: 1px solid var(--pv-border);
display: flex; align-items: center; gap: 8px;
font-size: var(--fs-sm); font-weight: 600; color: var(--pv-text-1);
}
.pnl-v3 .duo-head.losers { color: #b91c1c; }
.pnl-v3 .duo-head.winners { color: #047857; }
html.dark .pnl-v3 .duo-head.losers { color: #f87171; }
html.dark .pnl-v3 .duo-head.winners { color: #4ade80; }
/* Sources footer */
.pnl-v3 .sources {
font-size: var(--fs-xs); color: var(--pv-text-3); line-height: 1.7;
}
.pnl-v3 .sources code {
font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: var(--fs-xs);
background: var(--pv-bg-subtle); padding: 1px 5px; border-radius: 3px;
color: var(--pv-text-2);
}
.pnl-v3 .sources strong { color: var(--pv-text-1); }
/* --- admin/pnl/drilldown.html (extra .pnl-v3 rules) --- */
.pnl-v3 {
--pv-border: #e5e7eb;
--pv-border-strong: #d1d5db;
--pv-text-1: #0f172a;
--pv-text-2: #334155;
--pv-text-3: #64748b;
--pv-text-4: #94a3b8;
--pv-bg-surface: #ffffff;
--pv-bg-subtle: #f8fafc;
--pv-shadow-sm: 0 1px 2px rgba(0,0,0,.04);
font-family: 'Inter', system-ui, -apple-system, sans-serif;
color: var(--pv-text-1);
padding: 20px 24px 60px;
max-width: 1800px;
margin: 0 auto;
}
html.dark .pnl-v3 {
--pv-border: #334155;
--pv-border-strong: #475569;
--pv-text-1: #f1f5f9;
--pv-text-2: #cbd5e1;
--pv-text-3: #94a3b8;
--pv-text-4: #64748b;
--pv-bg-surface: #1e293b;
--pv-bg-subtle: #273344;
}
.pnl-v3 .sec-card { background: var(--pv-bg-surface); border: 1px solid var(--pv-border); border-radius: 12px; box-shadow: var(--pv-shadow-sm); padding: 16px 18px; margin-bottom: 14px; }
.pnl-v3 .sec-head { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.pnl-v3 .sec-title { font-size:var(--fs-xs); font-weight:700; color:var(--pv-text-3); text-transform:uppercase; letter-spacing:.08em; }
.pnl-v3 h1 { font-size: var(--fs-section); font-weight:700; color:var(--pv-text-1); margin:0; letter-spacing:-0.4px; display:flex; align-items:center; gap:10px; }
.pnl-v3 .sku-mono { font-family:'JetBrains Mono', ui-monospace, monospace; font-size:var(--fs-lg); color:var(--pv-text-2); background:var(--pv-bg-subtle); padding:2px 8px; border-radius:6px; }
.pnl-v3 .sec-sub { font-size:var(--fs-sm); color:var(--pv-text-3); }
.pnl-v3 .muted { color:var(--pv-text-4); }
/* .pnl-v3 .tb-btn — см. canonical выше (dedup, был дубль) */
.pnl-v3 .kpi-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:14px; }
@media (max-width: 880px) { .pnl-v3 .kpi-grid { grid-template-columns:repeat(2,1fr); } }
.pnl-v3 .kpi { background:var(--pv-bg-surface); border:1px solid var(--pv-border); border-radius:12px; padding:14px 16px; box-shadow:var(--pv-shadow-sm); }
.pnl-v3 .kpi-label { font-size:var(--fs-xs); font-weight:700; color:var(--pv-text-3); text-transform:uppercase; letter-spacing:.08em; margin-bottom:6px; }
.pnl-v3 .kpi-value { font-size:var(--fs-2xl); font-weight:700; color:var(--pv-text-1); font-feature-settings:'tnum'; letter-spacing:-0.5px; line-height:1.15; }
.pnl-v3 .kpi-value.pos { color:#047857; }
.pnl-v3 .kpi-value.neg { color:#b91c1c; }
.pnl-v3 .kpi-sub { font-size:var(--fs-sm); color:var(--pv-text-3); margin-top:4px; }
html.dark .pnl-v3 .kpi-value.pos { color:#4ade80; }
html.dark .pnl-v3 .kpi-value.neg { color:#f87171; }
.pnl-v3 .tbl-wrap { overflow-x:auto; border-radius:12px; }
.pnl-v3 table.pnl-tbl { width:100%; font-size: var(--fs-2sm); border-collapse:collapse; }
.pnl-v3 table.pnl-tbl thead th { font-size: var(--fs-2xs); font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--pv-text-3); background:var(--pv-bg-subtle); padding:8px 10px; text-align:left; border-bottom:1px solid var(--pv-border); position:sticky; top:0; }
.pnl-v3 table.pnl-tbl thead th.r { text-align:right; }
.pnl-v3 table.pnl-tbl tbody td { padding:7px 10px; border-bottom:1px solid var(--pv-border); color:var(--pv-text-2); font-feature-settings:'tnum'; }
.pnl-v3 table.pnl-tbl tbody td.r { text-align:right; font-variant-numeric:tabular-nums; }
.pnl-v3 table.pnl-tbl tbody tr:nth-child(even) { background:var(--pv-bg-subtle); }
.pnl-v3 .pnl-pos { color:#047857; font-weight:600; }
.pnl-v3 .pnl-neg { color:#b91c1c; font-weight:600; }
html.dark .pnl-v3 .pnl-pos { color:#4ade80; }
html.dark .pnl-v3 .pnl-neg { color:#f87171; }
.pnl-v3 .pn-badge { display:inline-block; padding:1px 7px; border-radius:4px; font-size:var(--fs-xs); font-weight:600; font-feature-settings:'tnum'; }
.pnl-v3 .pn-badge.ok { background:rgba(16,185,129,.15); color:#047857; }
.pnl-v3 .pn-badge.warn { background:rgba(234,179,8,.18); color:#854d0e; }
.pnl-v3 .pn-badge.low { background:rgba(249,115,22,.18); color:#9a3412; }
.pnl-v3 .pn-badge.bad { background:rgba(220,38,38,.18); color:#991b1b; }
.pnl-v3 .filt-row { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.pnl-v3 .filt-lbl { font-size:var(--fs-xs); font-weight:600; color:var(--pv-text-3); text-transform:uppercase; letter-spacing:.05em; margin-right:4px; }
/* --- admin/pictures.html --- */
.pic-v3 {
--pv-border:#e5e7eb; --pv-border-strong:#d1d5db;
--pv-text-1:#0f172a; --pv-text-2:#334155; --pv-text-3:#64748b; --pv-text-4:#94a3b8;
--pv-bg-surface:#ffffff; --pv-bg-subtle:#f8fafc;
--pv-shadow-sm:0 1px 2px rgba(0,0,0,.04);
font-family:'Inter',system-ui,sans-serif; color:var(--pv-text-1);
padding:20px 24px 60px; max-width:1800px; margin:0 auto;
}
html.dark .pic-v3 { --pv-border:#334155; --pv-text-1:#f1f5f9; --pv-text-2:#cbd5e1; --pv-text-3:#94a3b8; --pv-text-4:#64748b; --pv-bg-surface:#1e293b; --pv-bg-subtle:#273344; }
.pic-v3 .sec-card { background:var(--pv-bg-surface); border:1px solid var(--pv-border); border-radius:12px; box-shadow:var(--pv-shadow-sm); padding:16px 18px; margin-bottom:14px; }
.pic-v3 h1 { font-size: var(--fs-section); font-weight:700; margin:0 0 8px; letter-spacing:-0.4px; display:flex; align-items:center; gap:10px; }
.pic-v3 h2 { font-size:var(--fs-md); font-weight:600; margin:0 0 8px; color:var(--pv-text-1); }
.pic-v3 .sec-sub, .pic-v3 p { font-size:var(--fs-sm); color:var(--pv-text-3); margin:4px 0; line-height:1.5; }
.pic-v3 code { font-family:'JetBrains Mono', ui-monospace, monospace; font-size:var(--fs-xs); background:var(--pv-bg-subtle); padding:1px 5px; border-radius:3px; color:var(--pv-text-2); }
.pic-v3 .tb-btn { display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:8px; font-size: var(--fs-2sm); font-weight:500; border:1px solid var(--pv-border); background:var(--pv-bg-surface); color:var(--pv-text-2); transition:all .15s; text-decoration:none; cursor:pointer; }
.pic-v3 .tb-btn:hover { background:var(--pv-bg-subtle); border-color:var(--pv-border-strong); color:var(--pv-text-1); }
.pic-v3 .tb-btn.primary { background:var(--pv-text-1); color:var(--pv-bg-surface); border-color:var(--pv-text-1); }
.pic-v3 .tb-btn.primary:hover { opacity:.85; }
.pic-v3 .tb-btn.compact { padding:4px 8px; font-size:var(--fs-sm); }
.pic-v3 .tb-btn:disabled { opacity:.5; cursor:not-allowed; }
.pic-v3 .tb-input { padding:6px 10px; border-radius:8px; font-size: var(--fs-2sm); border:1px solid var(--pv-border); background:var(--pv-bg-surface); color:var(--pv-text-1); font-family:inherit; width:100%; }
.pic-v3 .tb-input.mono { font-family:'JetBrains Mono', ui-monospace, monospace; }
.pic-v3 .lbl-xs { display:block; font-size:var(--fs-xs); font-weight:600; color:var(--pv-text-3); text-transform:uppercase; letter-spacing:.05em; margin-bottom:4px; }
.pic-v3 .stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:14px; }
@media (max-width:880px) { .pic-v3 .stats-grid { grid-template-columns:repeat(2,1fr); } }
.pic-v3 .kpi { background:var(--pv-bg-surface); border:1px solid var(--pv-border); border-radius:12px; padding:14px 16px; box-shadow:var(--pv-shadow-sm); }
.pic-v3 .kpi-label { font-size:var(--fs-xs); font-weight:700; color:var(--pv-text-3); text-transform:uppercase; letter-spacing:.08em; margin-bottom:6px; }
.pic-v3 .kpi-value { font-size:var(--fs-2xl); font-weight:700; font-feature-settings:'tnum'; letter-spacing:-0.5px; }
.pic-v3 .kpi-value.pos { color:#047857; }
.pic-v3 .kpi-value.warn { color:#a16207; }
.pic-v3 .kpi-value.neg { color:#b91c1c; }
.pic-v3 .kpi-sub { font-size:var(--fs-xs); color:var(--pv-text-3); margin-top:4px; }
.pic-v3 .tbl-wrap { overflow-x:auto; }
.pic-v3 table.pic-tbl { width:100%; font-size: var(--fs-2sm); border-collapse:collapse; }
.pic-v3 table.pic-tbl thead th { font-size: var(--fs-2xs); font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--pv-text-3); background:var(--pv-bg-subtle); padding:8px 10px; text-align:left; border-bottom:1px solid var(--pv-border); }
.pic-v3 table.pic-tbl thead th.r { text-align:right; }
.pic-v3 table.pic-tbl tbody td { padding:7px 10px; border-bottom:1px solid var(--pv-border); color:var(--pv-text-2); vertical-align:top; }
.pic-v3 table.pic-tbl tbody td.r { text-align:right; font-variant-numeric:tabular-nums; }
.pic-v3 table.pic-tbl tbody td.mono { font-family:'JetBrains Mono', ui-monospace, monospace; font-size:var(--fs-xs); word-break:break-all; }
.pic-v3 .badge { display:inline-block; padding:1px 7px; border-radius:4px; font-size:var(--fs-xs); font-weight:600; }
.pic-v3 .badge.pending { background:var(--pv-bg-subtle); color:var(--pv-text-2); }
.pic-v3 .badge.applied { background:rgba(16,185,129,.15); color:#047857; }
.pic-v3 .badge.failed { background:rgba(220,38,38,.18); color:#991b1b; }
.pic-v3 .grid-form { display:grid; grid-template-columns:5fr 5fr 1fr 1fr; gap:8px; align-items:end; }
@media (max-width:880px) { .pic-v3 .grid-form { grid-template-columns:1fr; } }
.pic-v3 .toast { position:fixed; bottom:16px; right:16px; z-index:50; padding:10px 16px; border-radius:8px; font-size: var(--fs-2sm); box-shadow:0 4px 12px rgba(0,0,0,.15); color:#fff; }
.pic-v3 .toast.ok { background:#047857; }
.pic-v3 .toast.error { background:#b91c1c; }
[x-cloak] { display:none !important; }
/* --- admin/catalog_live.html --- */
.cat-live .tb-btn { display:inline-flex; align-items:center; gap:6px; padding:6px 12px; border-radius:8px; font-size: var(--fs-2sm); font-weight:500; border:1px solid #e5e7eb; background:#fff; color:#334155; transition:all .15s; cursor:pointer; }
.cat-live .tb-btn:hover { background:#f8fafc; border-color:#d1d5db; color:#0f172a; }
.cat-live .tb-btn.primary { background:#0f172a; color:#fff; border-color:#0f172a; }
.cat-live .tb-btn.primary:hover { opacity:.85; }
html.dark .cat-live .tb-btn { background:#1e293b; color:#cbd5e1; border-color:#334155; }
html.dark .cat-live .tb-btn.primary { background:#f1f5f9; color:#0f172a; border-color:#f1f5f9; }
/* --- Каталожная тройка: catalog_live / catalog_trash / catalog_proposal.
Миграция на layout_v3 (dbef352, 2026-06-03) перевела шаблоны с layout.html,
но разметка осталась на Tailwind-утилитах, а layout_v3 tailwind.css не грузит
→ страницы рендерились без стилей. Здесь — те же визуальные примитивы на
токенах. Scope .cat-live / .cat-trash / .cat-prop, чтобы не конфликтовать с
двумя существующими определениями .tree-node. (2026-07-15) --- */
/* Скелет страницы даёт page-контракт (.page-container), здесь — только внутренности.
.cat-card НЕ заводим: имя уже занято другой страницей (см. ~2665) — правило
«один атом = одно имя». Карточки-секции берём канонические .v2-section. */
.cat-meta { display:flex; align-items:center; gap:var(--space-3); font-size:var(--fs-xs); color:var(--text-3); }
.cat-intro { font-size:var(--fs-sm); color:var(--text-2); }
.cat-note { margin-top:var(--space-3); font-size:var(--fs-xs); color:var(--text-4); }
.cat-hint { font-size:var(--fs-2xs); color:var(--text-4); margin-top:var(--space-3); }
.cat-mono { font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.cat-empty { font-size:var(--fs-md); color:var(--text-3); }
/* две панели: дерево | SKU — .cat-pane это canonical .v2-section в гриде */
.cat-panes { display:grid; grid-template-columns:1fr; gap:var(--space-4); align-items:start; }
@media (min-width:1024px) { .cat-panes { grid-template-columns:5fr 7fr; } }
.cat-pane { margin:0; }
.cat-pane .cat-tree { max-height:var(--cat-pane-h); overflow-y:auto; }
.cat-pane .cat-sku-grid { max-height:var(--cat-pane-h); overflow-y:auto; padding-right:var(--space-1); }
/* шапка панели */
.cat-pane-label { font-size:var(--fs-xs); text-transform:uppercase; letter-spacing:.08em; color:var(--text-3);
font-weight:var(--fw-semibold); margin-bottom:var(--space-2); }
.cat-pane-acts { display:flex; align-items:center; gap:var(--space-2); }
.cat-hint-top { margin-top:0; margin-bottom:var(--space-3); }
/* блок фильтров внутри панели — плотнее канонического .filters-section */
.cat-filters-section { padding:var(--space-3); margin-bottom:var(--space-3); background:var(--bg-page); }
.cat-fld { display:flex; flex-direction:column; gap:var(--space-1); min-width:0; }
/* дерево */
.cat-tree { display:flex; flex-direction:column; }
.cat-row { display:flex; align-items:center; gap:var(--space-1); padding:var(--space-px) var(--space-1);
border-radius:var(--radius-badge); }
.cat-row:hover { background:var(--bg-page); }
.cat-row.is-sel { background:var(--warn-bg); }
.cat-toggle { width:var(--space-4); flex-shrink:0; text-align:center; font-size:var(--fs-xs);
color:var(--text-4); cursor:pointer; }
.cat-label { display:flex; align-items:center; gap:var(--space-1); flex:1; min-width:0; cursor:pointer;
font-size:var(--fs-md); color:var(--text-1); }
.cat-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cat-name.is-root { font-weight:var(--fw-medium); }
.cat-count { margin-left:auto; flex-shrink:0; font-size:var(--fs-xs); color:var(--text-3);
font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
/* бейджи маркетплейсов на узле */
.cat-mp { display:flex; align-items:center; gap:var(--space-px); flex-shrink:0; }
.cat-mp-tag { font-size:var(--fs-3xs); font-weight:var(--fw-semibold); padding:0 var(--space-1);
border-radius:var(--radius-xs); }
.cat-mp-tag.kl { color:var(--brand-kaufland); background:color-mix(in srgb, var(--brand-kaufland) 14%, var(--bg-surface)); }
.cat-mp-tag.am { color:var(--brand-amazon); background:color-mix(in srgb, var(--brand-amazon) 14%, var(--bg-surface)); }
.cat-mp-tag.ot { color:var(--brand-otto); background:color-mix(in srgb, var(--brand-otto) 14%, var(--bg-surface)); }
.cat-mp-tag.eb { color:var(--brand-ebay); background:color-mix(in srgb, var(--brand-ebay) 14%, var(--bg-surface)); }
/* кнопки действий на узле — появляются по hover строки */
.cat-acts { display:flex; align-items:center; gap:var(--space-px); flex-shrink:0; opacity:0; transition:opacity .15s; }
.cat-row:hover .cat-acts, .cat-row:focus-within .cat-acts { opacity:1; }
.cat-act { display:inline-flex; align-items:center; padding:0 var(--space-1); border:0; background:none;
border-radius:var(--radius-xs); color:var(--text-3); cursor:pointer; }
.cat-act:hover { background:var(--bg-page); color:var(--text-1); }
.cat-act.add { color:var(--color-good); }
/* правая панель: SKU */
.cat-agg { margin-left:var(--space-2); font-size:var(--fs-xs); font-weight:var(--fw-normal);
color:var(--warn); background:var(--warn-bg); border:1px solid transparent;
padding:var(--space-px) var(--space-1); border-radius:var(--radius-badge); }
/* фильтры */
.cat-filters { display:grid; grid-template-columns:1fr; gap:var(--space-3); align-items:end; }
@media (min-width:768px) { .cat-filters { grid-template-columns:5fr 3fr 3fr 2fr; } }
.cat-field { width:100%; background:var(--bg-surface); border:1px solid var(--border);
border-radius:var(--radius-input); padding:var(--space-1) var(--space-2);
font-size:var(--fs-sm); color:var(--text-1); outline:none; }
.cat-field:focus { border-color:var(--color-accent); }
.cat-check { display:inline-flex; align-items:center; gap:var(--space-1); font-size:var(--fs-xs); color:var(--text-2); }
/* карточки SKU */
.cat-sku-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--space-2); }
@media (min-width:768px) { .cat-sku-grid { grid-template-columns:repeat(3, minmax(0,1fr)); } }
.cat-sku { border:1px solid var(--border); border-radius:var(--radius-card); padding:var(--space-2);
background:var(--bg-surface); cursor:grab; }
.cat-sku:hover { box-shadow:var(--shadow-md); }
.cat-sku.is-primary { border-color:var(--warn); }
.cat-sku-body { display:flex; align-items:flex-start; gap:var(--space-2); }
.cat-thumb { width:var(--cat-thumb); height:var(--cat-thumb); flex-shrink:0; border-radius:var(--radius-badge);
object-fit:cover; background:var(--bg-page); }
.cat-thumb-ph { display:flex; align-items:center; justify-content:center; font-size:var(--fs-2xl);
color:var(--text-4); }
.cat-sku-main { flex:1; min-width:0; }
.cat-sku-top { display:flex; align-items:center; gap:var(--space-1); font-size:var(--fs-xs);
font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.cat-sku-link { color:var(--color-accent); text-decoration:none; }
.cat-sku-link:hover { text-decoration:underline; }
.cat-star { color:var(--warn); }
.cat-price { margin-left:auto; color:var(--color-good); }
.cat-sku-name { font-size:var(--fs-xs); color:var(--text-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cat-sku-acts { display:flex; gap:var(--space-1); margin-top:var(--space-1); }
.cat-chip-btn { font-size:var(--fs-xs); padding:0 var(--space-1); border:0; border-radius:var(--radius-xs);
background:var(--bg-page); color:var(--text-2); cursor:pointer; }
.cat-chip-btn:hover { background:var(--border); color:var(--text-1); }
.cat-chip-btn.star { background:var(--warn-bg); color:var(--warn); }
/* пагинация */
.cat-pager { display:flex; align-items:center; justify-content:space-between; margin-top:var(--space-3); }
.cat-pager-info { font-size:var(--fs-xs); color:var(--text-3); }
.cat-pager-btns { display:flex; gap:var(--space-2); }
/* модалки — поверх canonical .modal-overlay/.modal-box */
.cat-modal-hd { display:flex; align-items:baseline; justify-content:space-between; gap:var(--space-2);
margin-bottom:var(--space-2); }
.cat-modal-title { font-weight:var(--fw-semibold); color:var(--text-1); }
.cat-modal-x { border:0; background:none; color:var(--text-4); cursor:pointer; font-size:var(--fs-md); }
.cat-modal-x:hover { color:var(--text-1); }
.cat-modal-sub { font-size:var(--fs-sm); color:var(--text-2); margin-bottom:var(--space-3); }
.cat-form { display:flex; flex-direction:column; gap:var(--space-3); font-size:var(--fs-sm); }
.cat-form-row { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--space-2); }
.cat-lbl { display:block; font-size:var(--fs-xs); color:var(--text-3); margin-bottom:var(--space-1); }
.cat-radio { display:flex; align-items:center; gap:var(--space-2); font-size:var(--fs-sm);
padding:var(--space-1) var(--space-2); border-radius:var(--radius-badge); cursor:pointer; }
.cat-radio:hover { background:var(--bg-page); }
.cat-modal-foot { display:flex; justify-content:flex-end; gap:var(--space-2); margin-top:var(--space-3); }
.cat-warn-text { font-size:var(--fs-xs); color:var(--warn); }
.cat-attach { display:flex; flex-direction:column; gap:var(--space-1); font-size:var(--fs-sm); }
.cat-attach-row { display:flex; align-items:center; gap:var(--space-2); padding:var(--space-1) 0;
border-bottom:1px solid var(--border); }
.cat-attach-row .is-primary { font-weight:var(--fw-semibold); }
.cat-attach-via { margin-left:auto; font-size:var(--fs-2xs); color:var(--text-4); }
/* drag-n-drop — имена классов .sku-card/.dragging/.drop-target/.drop-over
служат JS-хуками (см. catalog_live.html), не переименовывать. */
.cat-live .sku-card.dragging { opacity:.4; }
.cat-live .drop-over { outline:var(--space-px) dashed var(--color-accent); outline-offset:var(--space-px);
border-radius:var(--radius-xs);
background:color-mix(in srgb, var(--color-accent) 10%, var(--bg-surface)); }
.cat-live kbd { font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
font-size:var(--fs-xs); background:var(--bg-page); border:1px solid var(--border);
border-radius:var(--radius-xs); padding:0 var(--space-1); }
/* тост */
.cat-toast { position:fixed; bottom:var(--space-4); right:var(--space-4); z-index:50;
padding:var(--space-2) var(--space-4); border-radius:var(--radius-button);
font-size:var(--fs-sm); color:var(--color-bg); box-shadow:var(--shadow-lg); }
.cat-toast.ok { background:var(--good); }
.cat-toast.error { background:var(--bad); }
/* корзина каталога */
.cat-chips { display:flex; flex-wrap:wrap; gap:var(--space-2); }
.cat-chip-count { opacity:.6; font-size:var(--fs-xs); margin-left:var(--space-1); }
.cat-trash-acts { display:flex; justify-content:flex-end; gap:var(--space-2); margin-top:var(--space-3); }
.cat-trash .tb-btn.danger { color:var(--bad); border-color:color-mix(in srgb, var(--bad) 40%, var(--border)); }
.cat-trash .tb-btn.danger:hover { background:var(--bad-bg); }
.cat-trash .tb-btn.danger:disabled { opacity:.5; cursor:default; }
.cat-reason { padding:0 var(--space-1); border-radius:var(--radius-xs); font-size:var(--fs-2xs);
color:var(--bad); background:var(--bad-bg); }
.cat-cell-sub { font-size:var(--fs-2xs); color:var(--text-4); }
.cat-cell-name { max-width:var(--col-title-max); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cat-empty-row { text-align:center; color:var(--text-3); padding:var(--space-3) 0; }
/* proposal: вложенная ветка + две колонки списков */
.cat-branch { margin-left:var(--space-5); padding-left:var(--space-2); border-left:1px solid var(--border); }
.cat-2col { display:grid; grid-template-columns:1fr; gap:var(--space-3); }
@media (min-width:768px) { .cat-2col { grid-template-columns:repeat(2, minmax(0,1fr)); } }
.cat-bad-text { color:var(--bad); }
/* === Global .tb-btn (canonical toolbar button) — раньше был только под .pnl-v3
scope, из-за чего на /?q= и др. страницах кнопки рендерились без стиля.
Алиас на btn-ghost-стиль через токены. (2026-06-03) === */
.tb-btn {
display: inline-flex; align-items: center; gap: var(--space-1);
padding: var(--space-1) var(--space-2); border-radius: var(--radius-input);
font-size: var(--fs-sm); font-weight: var(--fw-medium); cursor: pointer;
border: 1px solid var(--border); background: var(--bg-surface);
color: var(--text-2); transition: background .12s, border .12s; text-decoration: none;
}
.tb-btn:hover { background: var(--bg-page); border-color: var(--color-border-strong); }
.tb-btn.primary { background: var(--text-1); color: var(--bg-surface); border-color: var(--text-1); }
.tb-btn.active { background: var(--text-1); color: var(--bg-surface); border-color: var(--text-1); }
.tb-btn.compact { padding: var(--space-1) var(--space-2); font-size: var(--fs-xs); }
/* === admin/reorder — index + sku_detail (migrated to layout_v3 contract, 2026-06-04)
Scoped helpers only; layout/cards/tables come from canonical contract classes. === */
/* urgency filter chips */
.ro-urgency-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-3); }
.ro-chip-count { opacity: .6; }
.ro-dot { display: inline-block; width: var(--space-2); height: var(--space-2); border-radius: 50%; }
.ro-dot.critical { background: var(--color-bad); }
.ro-dot.warning { background: var(--color-warn); }
.ro-dot.monitor { background: var(--color-accent); }
.ro-dot.ok { background: var(--color-good); }
.ro-dot.all { background: var(--text-4); }
/* header actions on the right of the table section header */
.ro-head-actions { display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; }
.ro-inline-form { display: inline; }
/* table cells */
.ro-tbl .ro-urg { display: inline-flex; align-items: center; gap: var(--space-2); }
.ro-urg-days { font-size: var(--fs-xs); }
.ro-cell-strong { font-weight: var(--fw-semibold); color: var(--text-1); }
.ro-low-data { color: var(--text-4); margin-left: var(--space-1); }
.ro-urg-critical { color: var(--color-bad); font-weight: var(--fw-semibold); }
.ro-urg-warning { color: var(--color-warn); font-weight: var(--fw-semibold); }
.ro-urg-monitor { color: var(--color-accent); font-weight: var(--fw-semibold); }
.ro-urg-ok { color: var(--text-3); }
.ro-tbl-foot { padding: var(--space-3) var(--space-4); font-size: var(--fs-xs); color: var(--text-3); border-top: 1px solid var(--border); }
/* sku_detail — header */
.ro-detail-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-3); }
.ro-detail-sku { font-size: var(--fs-xl); font-weight: var(--fw-bold); color: var(--text-1); }
.ro-detail-name { font-size: var(--fs-sm); color: var(--text-3); margin-left: var(--space-3); }
/* velocity breakdown */
.ro-vel-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-3); }
.ro-vel-cell { border: 1px solid var(--border); border-radius: var(--radius-input); padding: var(--space-3); text-align: center; }
.ro-vel-window { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .06em; color: var(--text-3); }
.ro-vel-val { font-size: var(--fs-xl); font-weight: var(--fw-semibold); margin-top: var(--space-1); }
.ro-vel-weight { font-size: var(--fs-xs); color: var(--text-4); }
.ro-vel-eff { margin-top: var(--space-3); font-size: var(--fs-2sm); color: var(--text-2); }
.ro-warn-pill { display: inline-block; margin-left: var(--space-2); font-size: var(--fs-xs); background: rgba(245,158,11,.15); color: var(--color-warn); padding: var(--space-1) var(--space-2); border-radius: var(--radius-badge); }
/* sales chart */
.ro-chart-scroll { overflow-x: auto; }
.ro-chart-bars { display: flex; align-items: flex-end; gap: 2px; height: 96px; }
.ro-chart-bar { flex: 1; min-width: 3px; height: var(--ro-bar-h, 4%); background: var(--color-accent); border-radius: var(--radius-xs) var(--radius-xs) 0 0; transition: background .12s; }
.ro-chart-bar:hover { background: var(--text-1); }
.ro-chart-axis { display: flex; justify-content: space-between; font-size: var(--fs-xs); color: var(--text-4); margin-top: var(--space-1); }
.ro-empty-line { font-size: var(--fs-sm); color: var(--text-4); }
/* override block */
.ro-ov-info { font-size: var(--fs-2sm); color: var(--text-2); display: flex; flex-direction: column; gap: var(--space-1); }
.ro-ov-notes { color: var(--text-4); font-style: italic; }
.ro-ov-excluded { font-size: var(--fs-2sm); color: var(--color-bad); }
.ro-ov-defaults { font-size: var(--fs-xs); color: var(--text-4); }
.ro-ov-form { margin-top: var(--space-3); border-top: 1px solid var(--border); padding-top: var(--space-3); display: flex; flex-direction: column; gap: var(--space-2); }
.ro-ov-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-3); }
.ro-ov-check { display: flex; align-items: center; gap: var(--space-2); font-size: var(--fs-2sm); align-self: flex-end; }
.ro-ov-actions { display: flex; gap: var(--space-2); margin-top: var(--space-2); }
.ro-btn-danger { color: var(--color-bad); border-color: var(--color-bad); }
.ro-save-ok { font-size: var(--fs-xs); color: var(--color-good); }
.ro-save-err { font-size: var(--fs-xs); color: var(--color-bad); }
/* ── FBA Products pages ──────────────────────────────────────────────── */
/* Utility text/color helpers shared across FBA templates */
.text-bad { color: var(--color-bad); }
.text-warn { color: var(--color-warn); }
.text-good { color: var(--color-good); }
.text-muted { color: var(--text-4); }
.c-text1 { color: var(--text-1); }
.c-text2 { color: var(--text-2); }
.c-text3 { color: var(--text-3); }
.fw-bold { font-weight: var(--fw-bold); }
.fw-semibold { font-weight: var(--fw-semibold, 600); }
.fs-xs { font-size: var(--fs-xs); }
.fs-sm { font-size: var(--fs-sm); }
.fs-lg { font-size: var(--fs-lg); }
.mono { font-family: 'JetBrains Mono', ui-monospace, monospace; }
.link-primary { color: var(--color-accent); text-decoration: none; }
.link-primary:hover { text-decoration: underline; }
.link-mono { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: var(--fs-xs); color: var(--text-2); }
.tbl-foot-hint { padding: var(--space-2) var(--space-3); }
.tbl-scroll { overflow-x: auto; }
/* sec-card sub-components */
.sec-card-header { display: flex; align-items: center; justify-content: space-between; padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--border); }
.sec-card-title { font-size: var(--fs-2sm, 13px); font-weight: var(--fw-semibold, 600); color: var(--text-1); }
.sec-card-body { padding: var(--space-3) var(--space-4); }
.sec-card.notice-warn { border-left: var(--space-1) solid var(--color-warn); background: rgba(245,158,11,.04); }
/* FBA product detail grid */
.detail-grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-4); margin-top: var(--space-4); }
/* Product header */
.product-header-grid { display: flex; gap: var(--space-5); align-items: flex-start; }
.product-header-img { flex-shrink: 0; }
.product-header-meta { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.product-main-img { width: 120px; height: 120px; object-fit: contain; border: 1px solid var(--border); border-radius: var(--radius-input); background: var(--bg-page); }
.product-img-placeholder { width: 120px; height: 120px; display: flex; align-items: center; justify-content: center; font-size: var(--fs-3xl, 28px); background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-input); }
/* Key-value grid */
.kv-grid { display: flex; flex-direction: column; gap: var(--space-2); }
.kv-row { display: flex; align-items: baseline; gap: var(--space-2); min-height: var(--space-5); }
.kv-label { font-size: var(--fs-xs); color: var(--text-3); flex-shrink: 0; min-width: 140px; }
.kv-value { font-size: var(--fs-sm); color: var(--text-1); }
/* Button row */
.btn-row { display: flex; gap: var(--space-2); flex-wrap: wrap; margin-top: var(--space-2); }
/* Separator line */
.sep-line { height: 1px; background: var(--border); margin: var(--space-3) 0; }
/* Inline empty state */
.empty-inline { padding: var(--space-3) 0; }
/* Table thumbnail */
.tbl-img-cell { width: 44px; padding: var(--space-1) !important; }
.tbl-thumb { width: 36px; height: 36px; object-fit: contain; border-radius: var(--radius-xs); border: 1px solid var(--border); }
.tbl-thumb-placeholder { width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; font-size: var(--fs-lg); }
.v3-tbl-compact td, .v3-tbl-compact th { padding: var(--space-1) var(--space-2) !important; font-size: var(--fs-xs) !important; }
/* ── Profit Breakdown widget (collapsible P&L on order card) ── */
.pbk-grp { font-size: var(--fs-xs); font-weight: var(--fw-bold); text-transform: uppercase; letter-spacing: .06em; color: var(--text-3); margin: var(--space-3) 0 var(--space-1); }
.pbk-row { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-2); padding: var(--space-1) 0; font-size: var(--fs-2sm); }
.pbk-lbl { color: var(--text-2); }
.pbk-val { font-variant-numeric: tabular-nums; font-weight: var(--fw-semibold); white-space: nowrap; }
.pbk-val.pos { color: var(--success); }
.pbk-val.neg { color: var(--danger); }
.pbk-val.muted { color: var(--text-3); font-weight: var(--fw-normal); }
.pbk-head { cursor: pointer; user-select: none; }
.pbk-head:hover .pbk-lbl { color: var(--text-1); }
.pbk-caret { display: inline-block; color: var(--text-3); transition: transform .12s ease; }
.pbk-caret.open { transform: rotate(90deg); }
.pbk-detail { margin: var(--space-1) 0; }
.pbk-sub .pbk-lbl { color: var(--text-3); font-size: var(--fs-sm); padding-left: var(--space-4); }
.pbk-sub .pbk-val { font-weight: var(--fw-medium); font-size: var(--fs-sm); }
.pbk-warnrow .pbk-lbl, .pbk-warnrow .pbk-val { color: var(--warn); }
.pbk-line { border: none; border-top: 1px solid var(--border); margin: var(--space-2) 0; }
.pbk-line.acc { border-top-width: 2px; border-top-color: var(--text-3); }
.pbk-total { display: flex; justify-content: space-between; font-size: var(--fs-lg); font-weight: var(--fw-bold); padding: var(--space-1) 0; }
.pbk-total .pos { color: var(--success); }
.pbk-total .neg { color: var(--danger); }
.pbk-pill { display: inline-block; font-size: var(--fs-xs); font-weight: var(--fw-bold); padding: 2px var(--space-2); border-radius: var(--radius-pill); }
.pbk-pill.good { background: var(--success-soft); color: var(--success); }
.pbk-pill.warn { background: var(--warn-soft); color: var(--warn); }
.pbk-pill.bad { background: var(--danger-soft); color: var(--danger); }
.pbk-badge { font-size: var(--fs-xs); padding: 1px var(--space-1); border-radius: var(--radius-badge); margin-left: var(--space-1); }
.pbk-badge.info { background: var(--accent-soft); color: var(--accent); }
.pbk-badge.ok { background: var(--success-soft); color: var(--success); }
.pbk-badge.warn { background: var(--warn-soft); color: var(--warn); }
.pbk-note { font-size: var(--fs-xs); color: var(--warn); margin-top: var(--space-2); padding-top: var(--space-2); border-top: 1px solid var(--border); }
.pbk-tag { display: inline-block; font-size: var(--fs-xs); font-weight: var(--fw-bold); background: var(--accent-soft); color: var(--accent); border-radius: var(--radius-badge); padding: 1px var(--space-1); margin-left: var(--space-1); vertical-align: middle; }
.pbk-muted { color: var(--text-4); font-size: var(--fs-xs); margin-left: var(--space-1); }
.pbk-sub { font-size: var(--fs-xs); color: var(--text-3); padding-left: var(--space-4); margin-top: calc(-1 * var(--space-1)); padding-bottom: var(--space-1); }
/* Packaging params form helpers */
.v2-section--spaced { margin-top: var(--space-6); }
.v2-form-row--wrap { gap: var(--space-4); align-items: flex-end; flex-wrap: wrap; }
.v2-input--narrow { width: var(--space-20, 80px); }
.pbk-ek-btn { background: none; border: none; cursor: pointer; font-size: var(--fs-md); padding: 0 var(--space-1); color: var(--accent); }
.pbk-ek-btn:hover { color: var(--accent-strong, var(--color-accent)); }
/* EK modal */
.pbk-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.4); display: flex; align-items: center; justify-content: center; z-index: 1000; }
.pbk-modal { background: var(--bg-surface); border-radius: var(--radius-card); padding: var(--space-6); width: 360px; max-width: 92vw; box-shadow: var(--shadow-lg); display: flex; flex-direction: column; gap: var(--space-3); }
.pbk-modal-title { font-size: var(--fs-lg); font-weight: var(--fw-bold); color: var(--text-1); }
.pbk-modal-sub { font-size: var(--fs-sm); color: var(--text-3); }
.pbk-modal-lbl { font-size: var(--fs-sm); color: var(--text-2); font-weight: var(--fw-medium); }
.pbk-modal-input { width: 100%; padding: var(--space-2) var(--space-3); border: 1px solid var(--border); border-radius: var(--radius-input); font-size: var(--fs-md); font-variant-numeric: tabular-nums; }
.pbk-modal-scope { display: flex; flex-direction: column; gap: var(--space-2); font-size: var(--fs-sm); color: var(--text-2); }
.pbk-modal-actions { display: flex; justify-content: flex-end; gap: var(--space-2); margin-top: var(--space-2); }
/* EK hub — purchase prices input widths (2026-06-04) */
.ek-input-m2 { width: 7rem; text-align: right; font-variant-numeric: tabular-nums; }
.ek-input-fix { width: 6rem; text-align: right; font-variant-numeric: tabular-nums; }
.ek-input-note { width: 12rem; }
.ek-input-flat { width: 7rem; text-align: right; font-variant-numeric: tabular-nums; }
/* import preview row states */
.row-new td { background: color-mix(in srgb, var(--color-good) 6%, transparent); }
.row-changed td { background: color-mix(in srgb, var(--color-warn) 6%, transparent); }
.row-same td { opacity: 0.6; }
/* ── API Status: heading row + гармошка (accordion) ───────────────────── */
.as-head-row { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--space-4); margin-bottom:var(--space-5); }
.as-acc { display:flex; flex-direction:column; gap:var(--space-2); margin-top:var(--space-4); }
.as-acc-item { border:1px solid var(--color-border); border-radius:var(--radius-card); background:var(--color-bg); overflow:hidden; }
.as-acc-head { width:100%; display:flex; align-items:center; justify-content:space-between; gap:var(--space-3);
padding:var(--space-3) var(--space-4); background:none; border:none; cursor:pointer; font:inherit; text-align:left; }
.as-acc-head:hover { background:var(--color-bg-soft); }
.as-acc-l { display:flex; align-items:center; gap:var(--space-3); min-width:0; }
.as-acc-name { font-weight:600; font-size:var(--fs-md); color:var(--text-1); }
.as-acc-counts { display:flex; align-items:center; gap:var(--space-2); font-size:var(--fs-sm); }
.as-acc-total { color:var(--text-4); font-size:var(--fs-xs); }
.as-acc-r { display:flex; align-items:center; gap:var(--space-3); flex-shrink:0; }
.as-acc-time { font-size:var(--fs-xs); color:var(--text-4); }
.as-acc-slow { font-size:var(--fs-xs); color:var(--text-3); }
.as-acc-chev { font-size:var(--fs-xl); color:var(--text-4); line-height:1; transition:transform .15s; }
.as-acc-chev-open { transform:rotate(90deg); }
.as-acc-body { border-top:1px solid var(--color-border); }
.as-acc-actions { padding:var(--space-3) var(--space-4) 0; display:flex; gap:var(--space-2); align-items:center; flex-wrap:wrap; }
.as-acc-scroll { overflow-x:auto; padding:var(--space-2) var(--space-2) var(--space-3); }
/* ── API Status: компактная сводка + колонки таблицы коннектов ────────── */
.as-sub { font-size:var(--fs-2sm); color:var(--text-3); }
.as-meta { font-size:var(--fs-xs); color:var(--text-4); margin-top:var(--space-1); }
.as-tot-strip { display:flex; align-items:center; gap:var(--space-4); flex-wrap:wrap;
padding:var(--space-3) var(--space-4); border:1px solid var(--color-border);
border-radius:var(--radius-card); background:var(--color-bg-soft); font-size:var(--fs-sm); }
.as-tot-strip .as-tot-item { display:flex; align-items:center; gap:var(--space-1); font-weight:600; }
.as-tot-strip .as-tot-total { margin-left:auto; color:var(--text-3); font-weight:500; }
.as-conn .st-dot { margin-right:var(--space-1); }
.as-conn td.as-cell-desc { font-size:var(--fs-sm); }
.as-conn td.as-cell-meta { font-size:var(--fs-xs); color:var(--text-4); }
.as-conn td.as-cell-fix { font-size:var(--fs-xs); }
.as-conn th:nth-child(1){ width:130px; }
.as-conn th:nth-child(2){ width:180px; }
.as-conn th:nth-child(4){ width:64px; text-align:right; }
.as-conn th:nth-child(5){ width:84px; text-align:right; }
.as-conn th:nth-child(6){ width:92px; }
.as-conn th:nth-child(7){ width:120px; }
.as-conn td:nth-child(4),.as-conn td:nth-child(5){ text-align:right; }
/* ── Amazon Listings: accordion + chip atoms (2026-06-04) ──────────────── */
.al-parent-row { background:var(--color-bg-soft); }
.al-parent-row:hover { background:var(--color-bg); }
.al-child-row { background:var(--color-bg); }
.al-child-row:hover { background:var(--color-bg-soft); }
.al-expand-icon { display:inline-block; font-size:var(--fs-xs); margin-right:var(--space-1);
color:var(--text-3); transition:transform .15s; width:var(--space-3); }
.al-child-badge { display:inline-block; font-size:var(--fs-xs); font-weight:var(--fw-semibold);
background:var(--color-bg); color:var(--text-3);
border:1px solid var(--color-border); border-radius:var(--radius-badge);
padding:1px var(--space-2); margin-left:var(--space-1); }
.al-online-badge { display:inline-block; font-size:var(--fs-xs); font-weight:var(--fw-semibold);
background:color-mix(in srgb, var(--color-good) 12%, transparent);
color:var(--color-good); border-radius:var(--radius-badge);
padding:1px var(--space-2); }
.al-issues-badge { display:inline-block; font-size:var(--fs-xs); font-weight:var(--fw-semibold);
background:color-mix(in srgb, var(--color-warn) 14%, transparent);
color:var(--color-warn); border-radius:var(--radius-badge);
padding:1px var(--space-2); }
.al-mp-chip { display:inline-block; font-size:var(--fs-xs); font-weight:var(--fw-semibold);
background:var(--color-bg-soft); color:var(--text-3);
border-radius:var(--radius-badge); padding:1px var(--space-2); }
.al-type-chip { display:inline-block; font-size:var(--fs-xs);
background:var(--color-bg-soft); color:var(--text-3);
border-radius:var(--radius-badge); padding:1px var(--space-2); }
.al-fba-chip { display:inline-block; font-size:var(--fs-xs); font-weight:var(--fw-semibold);
background:color-mix(in srgb, var(--color-warn) 14%, transparent);
color:var(--color-warn); border-radius:var(--radius-badge); padding:1px var(--space-2); }
.al-mfn-chip { display:inline-block; font-size:var(--fs-xs);
background:var(--color-bg-soft); color:var(--text-3);
border-radius:var(--radius-badge); padding:1px var(--space-2); }
.al-status-chip { display:inline-block; font-size:var(--fs-xs); font-weight:var(--fw-semibold);
border-radius:var(--radius-badge); padding:2px var(--space-2); }
.al-status-good { background:color-mix(in srgb, var(--color-good) 12%, transparent); color:var(--color-good); }
.al-status-warn { background:color-mix(in srgb, var(--color-warn) 12%, transparent); color:var(--color-warn); }
.al-status-bad { background:color-mix(in srgb, var(--color-bad) 10%, transparent); color:var(--color-bad); }
.al-status-neu { background:var(--color-bg-soft); color:var(--text-3); }
.al-status-accent { background:color-mix(in srgb, var(--color-accent) 12%, transparent); color:var(--color-accent); }
.al-fill-good { color:var(--color-good); font-weight:var(--fw-medium); }
.al-fill-warn { color:var(--color-warn); }
.al-fill-bad { color:var(--color-bad); }
.al-bar-good { height:6px; border-radius:var(--radius-badge); background:var(--color-good); }
.al-bar-warn { height:6px; border-radius:var(--radius-badge); background:var(--color-warn); }
.al-bar-bad { height:6px; border-radius:var(--radius-badge); background:var(--color-bad); }
.al-title-cell { max-width:var(--col-title-max); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.al-pager-btn { padding:var(--space-1) var(--space-3); }
/* ── pkg-cost: packaging-costs form helpers ────────────────────────── */
.pkg-hint { font-size:var(--fs-xs); color:var(--text-3); margin-top:var(--space-1); }
.pkg-mode-row { display:flex; gap:var(--space-2); margin-top:var(--space-1); }
.pkg-mode-opt { display:flex; align-items:center; gap:var(--space-2); cursor:pointer;
padding:var(--space-2) var(--space-3);
border:1px solid var(--border); border-radius:var(--radius-badge); background:var(--bg-2); }
.pkg-form-wrap { max-width:720px; }
.pkg-actions { display:flex; justify-content:flex-end; gap:var(--space-2);
padding-top:var(--space-2); border-top:1px solid var(--border); grid-column:1/-1; }
.pkg-channel-info { padding:var(--space-2) var(--space-3);
background:var(--bg-2); border-radius:var(--radius-badge);
border-left:var(--border-accent-w) solid var(--accent);
color:var(--text-2); font-size:var(--fs-sm); margin-top:var(--space-1); }
/* ── admin/cron ─────────────────────────────────────────────────────── */
.cron-modal-overlay { display:none; position:fixed; inset:0; z-index:9999;
background:rgba(0,0,0,.55);
align-items:center; justify-content:center; }
.cron-modal-overlay.open { display:flex; }
.cron-modal-box { background:var(--surface-1); border:1px solid var(--border);
border-radius:var(--radius-card); padding:var(--space-6);
min-width:400px; max-width:520px; box-shadow:var(--shadow-lg); }
.cron-modal-title { margin:0 0 var(--space-4); font-size:var(--fs-1lg);
font-weight:var(--fw-semibold); color:var(--text-1); }
.cron-modal-sub { color:var(--text-3); font-size:var(--fs-sm);
margin:0 0 var(--space-3); }
.cron-modal-label { display:block; font-size:var(--fs-sm); color:var(--text-2);
margin-bottom:var(--space-1); }
.cron-modal-input { width:100%; padding:var(--space-2) var(--space-3);
border:1px solid var(--border); border-radius:var(--radius-input);
background:var(--bg-0); color:var(--text-1);
font-family:monospace; font-size:var(--fs-sm); box-sizing:border-box; }
.cron-modal-hint { font-size:var(--fs-xs); color:var(--text-3);
margin:var(--space-1) 0 var(--space-4); }
.cron-modal-footer { display:flex; gap:var(--space-3); justify-content:flex-end; }
.cron-action-btns { display:flex; gap:var(--space-1); align-items:center; flex-wrap:nowrap; }
.cron-btn-sm { padding:var(--space-1) var(--space-2); font-size:var(--fs-xs); }
.cron-btn-enable { color:var(--color-good); }
.cron-btn-disable { color:var(--color-warn); }
.cron-cell-mono { font-size:var(--fs-xs); white-space:nowrap; color:var(--text-2); }
.cron-cell-sm { font-size:var(--fs-sm); white-space:nowrap; color:var(--text-2); }
.cron-cell-name { font-size:var(--fs-sm); white-space:nowrap; }
.cron-desc-main { color:var(--text-1); }
.cron-desc-sub { color:var(--text-3); font-size:var(--fs-xs); }
/* ── Vendor product new/submissions ─────────────────────────────────── */
.payload-preview {
background: var(--bg-card-alt, var(--bg));
border: var(--border-w, thin) solid var(--border);
border-radius: var(--radius-md);
padding: var(--space-4);
overflow-x: auto;
overflow-y: auto;
max-height: var(--payload-max-h, 25rem);
font-size: var(--fs-xs);
white-space: pre-wrap;
}
.btn-xs {
font-size: var(--fs-xs);
padding: var(--space-1) var(--space-2);
}
.btn-danger { background: var(--c-bad, var(--color-bad)); }
.notice-info {
border-left: var(--space-1) solid var(--border);
border-radius: var(--radius-md);
background: var(--bg-card-alt, var(--bg));
padding: var(--space-3);
}
/* Vendor cartons drag & drop */
.vdnd-drag-cell { width: var(--vdnd-drag-cell-w, 1.5rem); }
.vdnd-grab-btn { cursor: grab; font-size: var(--fs-md); line-height: 1; padding: var(--space-px, 2px) var(--space-1); }
.vdnd-grab-btn:hover { color: var(--color-accent); }
/* Vendor cartons — меню «Переместить в коробку» */
.vmove-menu {
position: absolute;
top: 100%;
left: 0;
margin-top: var(--space-1);
min-width: var(--vmove-menu-w, 13rem);
background: var(--color-bg);
border: 1px solid var(--color-border);
border-radius: var(--radius-card);
box-shadow: var(--shadow-lg);
padding: var(--space-1);
z-index: 40;
}
.vmove-menu--right { left: auto; right: 0; }
.vmove-menu-head {
display: flex;
align-items: center;
gap: var(--space-1);
font-size: var(--fs-xs);
font-weight: var(--fw-semibold);
letter-spacing: 0.02em;
text-transform: uppercase;
color: var(--color-text-muted);
padding: var(--space-1) var(--space-2) var(--space-2);
}
.vmove-item {
display: flex;
align-items: center;
gap: var(--space-2);
width: 100%;
text-align: left;
padding: var(--space-2);
border: 0;
border-radius: var(--radius-input);
background: transparent;
cursor: pointer;
font-size: var(--fs-sm);
color: var(--color-text);
transition: background 0.12s ease;
}
.vmove-item:hover { background: var(--color-bg-soft); }
.vmove-item:hover .vmove-box { border-color: var(--color-accent); color: var(--color-accent); }
.vmove-box {
display: inline-flex;
align-items: center;
gap: var(--space-1);
padding: var(--space-px) var(--space-2);
border: 1px solid var(--color-border);
border-radius: var(--radius-badge);
font-family: monospace;
font-size: var(--fs-xs);
font-weight: var(--fw-semibold);
white-space: nowrap;
transition: border-color 0.12s ease, color 0.12s ease;
}
.vmove-weight { margin-left: auto; font-size: var(--fs-xs); color: var(--color-text-muted); white-space: nowrap; }
.vmove-empty { padding: var(--space-2); font-size: var(--fs-xs); color: var(--color-text-muted); }
.vmove-trigger { display: inline-flex; align-items: center; gap: var(--space-1); }
/* Vendor cartons — шапка карточки коробки */
.vcarton-head {
display: flex;
align-items: center;
gap: var(--space-4);
flex-wrap: wrap;
margin-bottom: var(--space-4);
}
.vcarton-head-actions {
margin-left: auto;
display: flex;
align-items: center;
gap: var(--space-1);
flex-wrap: wrap;
}
/* Кнопка-номер коробки (открывает меню перемещения) */
.vcarton-box-btn {
display: inline-flex;
align-items: center;
gap: var(--space-2);
padding: var(--space-1) var(--space-3);
border: 1px solid var(--color-border);
border-radius: var(--radius-pill);
background: var(--color-bg);
font-family: monospace;
font-weight: var(--fw-semibold);
font-size: var(--fs-sm);
color: var(--color-text);
cursor: pointer;
transition: border-color 0.12s ease, background 0.12s ease;
}
.vcarton-box-btn:hover { border-color: var(--color-accent); background: var(--color-bg-soft); }
.vcarton-box-btn.is-static { cursor: default; }
.vcarton-box-btn.is-static:hover { border-color: var(--color-border); background: var(--color-bg); }
.vcarton-chev { font-size: var(--fs-xs); color: var(--color-text-muted); }
/* Индикатор заполнения коробки (вес / макс) */
.vcarton-fill { display: flex; flex-direction: column; gap: var(--space-1); min-width: var(--vcarton-fill-min-w); }
.vcarton-fill-top { display: flex; align-items: baseline; gap: var(--space-2); }
.vcarton-fill-kg { font-weight: var(--fw-semibold); color: var(--color-text); font-size: var(--fs-sm); }
.vcarton-fill-max { font-size: var(--fs-xs); color: var(--color-text-muted); }
.vcarton-bar {
height: var(--vcarton-bar-h);
border-radius: var(--radius-pill);
background: var(--color-bg-soft);
border: 1px solid var(--color-border);
overflow: hidden;
}
.vcarton-bar-fill {
height: 100%;
border-radius: var(--radius-pill);
background: var(--color-good);
transition: width 0.25s ease, background 0.2s ease;
}
.vcarton-bar-fill.is-warn { background: var(--color-warn); }
.vcarton-bar-fill.is-over { background: var(--color-bad); }
/* Тонкая подсказка drag&drop вместо пустой карточки */
.vcarton-hint {
display: flex;
align-items: center;
gap: var(--space-2);
padding: var(--space-2) var(--space-3);
margin-bottom: var(--space-4);
border-left: var(--border-accent-w) solid var(--color-accent);
background: var(--color-bg-soft);
border-radius: var(--radius-badge);
font-size: var(--fs-sm);
color: var(--color-text-muted);
}
/* ASN-номер: компактное поле ввода в шапке коробок */
.vasn-field {
display: inline-flex;
align-items: center;
gap: var(--space-2);
padding: var(--space-1) var(--space-2);
border: 1px solid var(--border);
border-radius: var(--radius-badge);
background: var(--color-bg-soft);
}
.vasn-input {
width: 9rem;
padding: var(--space-1) var(--space-2);
border: 1px solid var(--border);
border-radius: var(--radius-badge);
font-size: var(--fs-sm);
font-variant-numeric: tabular-nums;
background: var(--bg-surface);
color: var(--color-text);
}
.vasn-locked {
display: inline-flex;
align-items: center;
gap: var(--space-1);
font-variant-numeric: tabular-nums;
}
/* Гармошка коробки: кнопка свернуть/развернуть */
.vcarton-collapse-btn {
border: none;
background: transparent;
cursor: pointer;
padding: 0 var(--space-2) 0 0;
color: var(--color-text-muted);
font-size: var(--fs-md);
line-height: 1;
}
.vcarton-collapse-btn:hover { color: var(--color-text); }
.vcarton-collapsed { opacity: 0.92; }
/* Vendor cartons — мультиселект позиций (выбор кликом по строке) */
.vsel-cell { display: flex; align-items: center; gap: var(--space-1); }
.vdnd-items tr { cursor: pointer; }
.vdnd-items tr.is-selected { background: var(--color-bg-soft); }
.vdnd-items tr.is-selected td { box-shadow: inset var(--border-accent-w) 0 0 0 var(--color-accent); }
/* Меню, открывающееся вверх (для нижней плавающей панели) */
.vmove-menu--up { top: auto; bottom: 100%; margin-top: 0; margin-bottom: var(--space-1); }
/* Плавающая панель массового действия */
.vsel-bar {
position: fixed;
left: 50%;
bottom: var(--space-6);
transform: translateX(-50%);
display: flex;
align-items: center;
gap: var(--space-4);
padding: var(--space-2) var(--space-5);
background: var(--color-text);
color: var(--color-bg);
border-radius: var(--radius-pill);
box-shadow: var(--shadow-lg);
z-index: 60;
}
.vsel-bar-count { font-weight: var(--fw-semibold); font-size: var(--fs-sm); white-space: nowrap; }
.vsel-move-btn {
display: inline-flex;
align-items: center;
gap: var(--space-1);
padding: var(--space-1) var(--space-3);
border: 0;
border-radius: var(--radius-pill);
background: var(--color-accent);
color: var(--color-bg);
font-size: var(--fs-sm);
font-weight: var(--fw-semibold);
cursor: pointer;
}
.vsel-move-btn:hover { filter: brightness(1.08); }
.vsel-move-btn .vcarton-chev { color: var(--color-bg); }
.vsel-clear {
background: none;
border: 0;
color: var(--color-bg);
opacity: 0.7;
cursor: pointer;
font-size: var(--fs-sm);
}
.vsel-clear:hover { opacity: 1; }
/* Vendor cartons — фиксированный тост + спиннер */
.vtoast {
position: fixed;
right: var(--space-5);
bottom: var(--space-5);
z-index: 70;
min-width: var(--vtoast-min-w, 13rem);
max-width: var(--vtoast-max-w, 24rem);
display: flex;
align-items: center;
gap: var(--space-2);
padding: var(--space-3) var(--space-4);
border-radius: var(--radius-card);
box-shadow: var(--shadow-lg);
}
.vspin {
display: inline-block;
width: 1em;
height: 1em;
border: var(--space-px) solid var(--color-border);
border-top-color: var(--color-accent);
border-radius: var(--radius-circle);
animation: vspin 0.7s linear infinite;
flex: none;
}
@keyframes vspin { to { transform: rotate(360deg); } }
/* ── JTL Reserve modal + степпер ─────────────────────────────── */
.jtlr-backdrop { display: none; position: fixed; inset: 0; z-index: 998; background: rgba(15, 23, 42, 0.5); }
.jtlr-backdrop.is-open { display: block; }
.jtlr-wrap {
display: none; position: fixed; inset: 0; z-index: 999;
align-items: center; justify-content: center;
padding: var(--space-4); pointer-events: none;
}
.jtlr-wrap.is-open { display: flex; }
.jtlr-card {
pointer-events: auto;
background: var(--color-bg);
border: 1px solid var(--color-border);
border-radius: var(--radius-card);
box-shadow: var(--shadow-lg);
width: min(40rem, 96vw);
max-height: 90vh; overflow-y: auto;
padding: var(--space-6);
}
.jtlr-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--space-4); font-size: var(--fs-lg); }
.jtlr-foot { display: flex; gap: var(--space-2); justify-content: flex-end; margin-top: var(--space-5); }
.jtlr-pad { padding: var(--space-3); border-radius: var(--radius-badge); margin-top: var(--space-3); }
.jtlr-loading { display: flex; align-items: center; justify-content: center; gap: var(--space-2); padding: var(--space-8) 0; color: var(--color-text-muted); }
.jtlr-summary { margin-bottom: var(--space-3); }
.jtlr-comment { font-size: var(--fs-xs); }
.jtlr-payload { margin-top: var(--space-3); }
.jtlr-payload summary { cursor: pointer; color: var(--color-accent); font-size: var(--fs-sm); }
.jtlr-payload pre {
font-size: var(--fs-xs);
background: var(--color-bg-soft);
padding: var(--space-3);
border-radius: var(--radius-badge);
overflow-x: auto; white-space: pre-wrap; word-break: break-all;
margin-top: var(--space-2);
}
/* Степпер */
.jtlr-steps {
display: flex; flex-direction: column; gap: var(--space-2);
margin: var(--space-4) 0;
padding: var(--space-4);
background: var(--color-bg-soft);
border-radius: var(--radius-card);
}
.jtlr-step { display: flex; align-items: center; gap: var(--space-2); font-size: var(--fs-sm); color: var(--color-text-muted); }
.jtlr-step.is-active { color: var(--color-text); font-weight: var(--fw-semibold); }
.jtlr-step.is-done { color: var(--color-good); }
.jtlr-step-ico { width: 1.5em; text-align: center; }
/* Иконка штрих-кода для кнопок EAN-наклеек */
.ic-bars { vertical-align: middle; margin-right: var(--space-1); }
/* Компактный виджет печати документов вендора */
.vdocs-row { display: flex; gap: var(--space-5); flex-wrap: wrap; align-items: center; }
.vdocs-grp { display: inline-flex; gap: var(--space-1); align-items: center; }
.vdocs-ord {
cursor: pointer;
padding: var(--space-px) var(--space-2);
border: 1px solid var(--color-border);
border-radius: var(--radius-badge);
font-size: var(--fs-sm);
line-height: 1.4;
}
.vdocs-ord.is-on { border-color: var(--color-accent); color: var(--color-accent); background: var(--color-bg-soft); }
/* Vendor edit-content form helpers */
.vendor-wide-input { width: 100%; max-width: var(--vendor-input-max-w, 38rem); }
.vendor-textarea { resize: vertical; }
.vendor-price-disabled { opacity: 0.6; cursor: not-allowed; max-width: var(--vendor-price-max-w, 20rem); }
.vendor-note-small { font-size: var(--fs-xs); margin-top: var(--space-1); }
.vendor-payload-pre {
background: var(--bg-code, #1e293b);
color: var(--text-code, #e2e8f0);
padding: var(--space-4);
border-radius: var(--radius-md);
overflow-x: auto;
overflow-y: auto;
max-height: var(--vendor-payload-max-h, 25rem);
font-size: var(--fs-xs);
white-space: pre-wrap;
}
.vendor-asin-info-body { flex: 1; min-width: var(--vendor-info-min-w, 14rem); }
/* ─────────────────────────────────────────────────────────────────
Amazon A+ Content preview (Brand Registry Stage 4, 2026-06-06)
Renders standard A+ modules visually (~970px canvas like Amazon).
───────────────────────────────────────────────────────────────── */
.aplus-preview {
--aplus-max-w: 970px;
--aplus-img-min: 200px;
max-width: var(--aplus-max-w);
margin: 0 auto;
display: flex;
flex-direction: column;
gap: var(--space-6);
}
.aplus-module {
border: 1px solid var(--border);
border-radius: var(--radius-card);
overflow: hidden;
background: var(--bg-surface);
}
.aplus-module-label {
font-size: var(--fs-2xs);
color: var(--text-3);
text-transform: uppercase;
letter-spacing: .04em;
padding: var(--space-2) var(--space-3);
border-bottom: 1px solid var(--border);
}
.aplus-module-body {
padding: var(--space-4);
display: flex;
flex-direction: column;
gap: var(--space-3);
}
.aplus-img { width: 100%; height: auto; display: block; border-radius: var(--r-sm); }
.aplus-img-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(var(--aplus-img-min), 1fr));
gap: var(--space-3);
}
.aplus-headline { font-size: var(--fs-md); font-weight: var(--fw-semibold); color: var(--text-1); }
.aplus-body-text { font-size: var(--fs-sm); color: var(--text-2); line-height: 1.55; white-space: pre-line; }
.aplus-meta-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
gap: var(--space-3);
margin-bottom: var(--space-4);
}
.aplus-asins { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.aplus-badges { margin-top: var(--space-3); }
/* ── Amazon Vendor cost-change manager (/admin/amazon-vendor/cost-changes) ── */
.av-cost-banner {
border: 1px solid var(--color-warn);
border-left: var(--border-accent-w) solid var(--color-warn);
border-radius: var(--radius-input);
padding: var(--space-4) var(--space-5);
margin-bottom: var(--space-5);
background: rgba(240,136,62,.06);
}
.av-cost-banner strong { color: var(--text-1); }
.av-cost-banner p { color: var(--text-3); margin: var(--space-1) 0 0; font-size: var(--fs-2sm); }
.av-cost-draft-queue {
background: var(--bg-page);
border: 1px solid var(--border);
border-radius: var(--radius-card);
margin-bottom: var(--space-6);
}
.av-cost-draft-header {
padding: var(--space-3) var(--space-5);
border-bottom: 1px solid var(--border);
display: flex;
align-items: center;
justify-content: space-between;
gap: var(--space-3);
}
.av-cost-draft-header h3 { color: var(--text-1); font-size: var(--fs-md); font-weight: var(--fw-bold); margin: 0; }
.av-cost-draft-item {
display: flex;
align-items: center;
gap: var(--space-3);
padding: var(--space-3) var(--space-5);
border-bottom: 1px solid var(--bg-surface);
}
.av-cost-draft-item:last-child { border-bottom: none; }
.av-cost-asin-pill {
font-family: monospace;
font-size: var(--fs-xs);
color: var(--color-accent);
background: var(--bg-surface);
padding: var(--space-1) var(--space-2);
border-radius: var(--radius-xs);
white-space: nowrap;
}
.av-cost-arrow { color: var(--color-warn); margin: 0 var(--space-1); }
.av-cost-reason-tag {
font-size: var(--fs-xs);
color: var(--text-3);
background: var(--border);
padding: var(--space-1) var(--space-2);
border-radius: var(--radius-xs);
}
.av-cost-tbl { width: 100%; border-collapse: collapse; font-size: var(--fs-2sm); }
.av-cost-tbl th {
background: var(--bg-surface);
color: var(--text-1);
font-weight: var(--fw-bold);
padding: var(--space-2) var(--space-3);
text-align: left;
border-bottom: 2px solid var(--border);
}
.av-cost-tbl td {
padding: var(--space-2) var(--space-3);
border-bottom: 1px solid var(--border);
vertical-align: middle;
}
.av-cost-tbl tr:hover td { background: var(--bg-surface); }
.av-cost-thumb {
width: var(--space-10);
height: var(--space-10);
object-fit: contain;
border-radius: var(--radius-badge);
background: var(--border);
}
.av-cost-thumb-ph {
width: var(--space-10);
height: var(--space-10);
background: var(--border);
border-radius: var(--radius-badge);
display: inline-flex;
align-items: center;
justify-content: center;
color: var(--text-3);
}
.av-cost-val { font-weight: var(--fw-bold); color: var(--color-good); }
.av-cost-val-none { color: var(--text-3); }
.av-cost-form { display: flex; gap: var(--space-2); align-items: center; flex-wrap: wrap; }
.av-cost-form input[type=number] {
width: var(--space-10);
min-width: var(--space-10);
padding: var(--space-1) var(--space-2);
background: var(--bg-surface);
border: 1px solid var(--border);
color: var(--text-1);
border-radius: var(--radius-badge);
font-size: var(--fs-2sm);
}
.av-cost-form select {
background: var(--bg-surface);
border: 1px solid var(--border);
color: var(--text-1);
border-radius: var(--radius-badge);
font-size: var(--fs-2sm);
padding: var(--space-1) var(--space-2);
}
.av-cost-kpi-num { font-size: var(--fs-card-num); font-weight: var(--fw-bold); color: var(--text-1); }
.av-cost-kpi-num-good { color: var(--color-good); }
.av-cost-kpi-num-acc { color: var(--color-accent); }
.av-cost-kpi-num-warn { color: var(--color-warn); }
.av-cost-kpi-lbl { font-size: var(--fs-sm); color: var(--text-3); margin-top: var(--space-1); }
.av-cost-footer {
margin-top: var(--space-6);
padding: var(--space-3) var(--space-4);
background: var(--bg-page);
border: 1px solid var(--border);
border-radius: var(--radius-input);
font-size: var(--fs-sm);
color: var(--text-3);
}
.av-cost-badge-draft {
display: inline-block;
background: var(--bg-surface);
color: var(--color-accent);
border: 1px solid var(--color-accent);
border-radius: var(--radius-pill);
font-size: var(--fs-xs);
padding: var(--space-1) var(--space-2);
}
.av-cost-title { font-weight: var(--fw-semibold); color: var(--text-1); font-size: var(--fs-2sm); }
.av-cost-brand { font-size: var(--fs-xs); color: var(--text-3); }
.av-cost-note { font-size: var(--fs-sm); color: var(--text-3); padding: var(--space-3) var(--space-5); border-top: 1px solid var(--border); }
.av-cost-cost-bold { font-weight: var(--fw-bold); font-size: var(--fs-md); color: var(--color-good); }
/* ── Калькулятор доставки (/logistics/calculator) ── */
.calc-wrap{max-width:1000px;padding:8px 4px}
.calc-grid{display:grid;grid-template-columns:340px 1fr;gap:24px;align-items:start}
.calc-form{display:flex;flex-direction:column;gap:10px}
.calc-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.calc-field label{display:block;font-size:12px;color:var(--text-3);margin-bottom:3px}
.calc-input{width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:var(--radius-input);font-size:14px;background:var(--bg-surface);color:var(--text-1)}
.calc-btn{padding:9px 16px;border:none;border-radius:var(--radius-input);background:var(--color-accent);color:var(--color-bg);font-size:14px;font-weight:600;cursor:pointer}
.calc-btn:disabled{opacity:.5}
.calc-meta{font-size:12px;color:var(--text-3);margin-top:6px;line-height:1.6}
.calc-cards{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.calc-card{border:1px solid var(--border);border-radius:var(--radius-card);padding:16px;background:var(--bg-surface)}
.calc-card.dhl{border-top:3px solid #FFCC00}
.calc-card.gls{border-top:3px solid #0a4a9e}
.calc-card-best{border-color:var(--success);box-shadow:0 0 0 2px var(--success-soft)}
.calc-best-badge{margin-left:8px;font-size:11px;font-weight:700;color:#fff;background:var(--success);border-radius:999px;padding:2px 8px;letter-spacing:0}
.calc-carrier{font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--text-2);margin-bottom:10px}
.calc-line{display:flex;justify-content:space-between;font-size:13px;padding:4px 0;color:var(--text-2)}
.calc-line.total{border-top:1px solid var(--border);margin-top:6px;padding-top:8px;font-weight:700;font-size:15px;color:var(--text-1)}
.calc-na{color:var(--color-bad);font-size:13px}
.calc-warn{color:var(--color-warn);background:var(--color-bg-soft);border-radius:var(--radius-badge);padding:6px 9px;font-size:12px;margin-top:8px}
.calc-h2{margin:0 0 14px;font-size:18px}
.calc-foot{margin-top:18px}
/* ── Калькулятор: табы + прайс-таблицы ── */
.calc-tabs{display:flex;gap:6px;margin-bottom:16px}
.calc-tab{padding:7px 14px;border:1px solid var(--border);background:var(--bg-surface);border-radius:var(--radius-input);cursor:pointer;font-size:13px;color:var(--text-2)}
.calc-tab.active{background:var(--color-accent);color:var(--color-bg);border-color:var(--color-accent)}
.calc-h3{font-size:14px;margin:18px 0 8px}
.calc-tbl{width:100%;border-collapse:collapse;font-size:13px;margin-top:4px}
.calc-tbl th{text-align:left;color:var(--text-3);font-weight:600;padding:6px 8px;border-bottom:1px solid var(--border)}
.calc-tbl td{padding:5px 8px;border-bottom:1px solid var(--border);color:var(--text-2)}
.calc-sm{width:auto;padding:5px 10px;font-size:12px}
.calc-xs{width:64px;padding:3px 5px;font-size:12px;display:inline-block}
.calc-co{color:var(--text-3);font-size:12px}
.calc-row3{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
/* Vendor PO line decision form — кнопки в одну строку, без переноса */
.po-decide-form{display:flex;gap:var(--space-1);margin-top:var(--space-1);flex-wrap:nowrap;align-items:center;}
.po-decide-qty{width:calc(var(--space-10) * 1.5);flex-shrink:0;}
.po-decide-form .btn-xs{flex-shrink:0;}
/* Фильтр решений на странице PO */
.po-dec-filter{margin-bottom:var(--space-4);}
/* ── Ads AI-agent: recommendation queue cards (2026-06-09) ──────────── */
.ag-card{border:1px solid var(--border);border-radius:var(--radius-card);
background:var(--bg-surface);margin-bottom:var(--space-3);overflow:hidden;}
.ag-card-high{border-left:var(--border-accent-w) solid var(--color-bad);}
.ag-card-head{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;
padding:var(--space-2) var(--space-4);border-bottom:1px solid var(--border);
font-size:var(--fs-2sm);}
.ag-card-cc{font-weight:var(--fw-semibold);color:var(--text-1);}
.ag-card-camp{color:var(--text-2);}
.ag-card-link{text-decoration:none;font-size:var(--fs-2sm);opacity:0.75;margin-left:var(--space-1);}
.ag-card-link:hover{opacity:1;}
.ag-card-prod{font-size:var(--fs-xs);color:var(--text-3);}
.ag-card-spacer{flex:1;}
.ag-card-src{font-size:var(--fs-xs);color:var(--text-3);}
.ag-card-sel{width:16px;height:16px;cursor:pointer;accent-color:var(--accent);}
.ag-bulkbar{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;
padding:var(--space-2) var(--space-4);margin-bottom:var(--space-3);
background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);}
.ag-bulk-all{display:flex;align-items:center;gap:var(--space-2);cursor:pointer;
font-size:var(--fs-2sm);color:var(--text-2);}
.ag-bulk-all input{width:16px;height:16px;cursor:pointer;accent-color:var(--accent);}
.ag-bulk-count{font-size:var(--fs-2sm);font-weight:var(--fw-semibold);color:var(--text-1);}
.ag-rules-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
gap:var(--space-3);margin-bottom:var(--space-3);}
.ag-rule{display:flex;flex-direction:column;gap:var(--space-1);}
.ag-rule label{font-size:var(--fs-xs);color:var(--text-2);}
.ag-rule input,.ag-rule select{padding:var(--space-1) var(--space-2);
border:1px solid var(--border);border-radius:var(--radius-sm);
background:var(--surface-1);color:var(--text-1);font-size:var(--fs-2sm);}
.ag-rule small{font-size:var(--fs-xs);color:var(--text-3);}
.ag-card-body{padding:var(--space-3) var(--space-4);}
.ag-target{margin-bottom:var(--space-2);font-size:var(--fs-2sm);}
.ag-target-l{color:var(--text-3);text-transform:uppercase;font-size:var(--fs-xs);
font-weight:var(--fw-semibold);letter-spacing:.04em;margin-right:var(--space-2);}
.ag-rationale{color:var(--text-1);font-size:var(--fs-md);line-height:1.5;
margin-bottom:var(--space-3);}
.ag-metrics{display:flex;align-items:center;justify-content:space-between;
flex-wrap:wrap;gap:var(--space-3);}
.ag-metrics-row{display:flex;flex-wrap:wrap;gap:var(--space-5);}
.ag-metric{display:flex;flex-direction:column;gap:var(--space-1);}
.ag-metric-l{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.04em;
color:var(--text-3);font-weight:var(--fw-semibold);}
.ag-metric-v{font-size:var(--fs-2sm);font-weight:var(--fw-semibold);color:var(--text-1);}
.ag-impact{display:flex;flex-direction:column;gap:var(--space-1);text-align:right;}
.ag-impact-v{font-size:var(--fs-lg);font-weight:var(--fw-bold);}
.ag-card-actions{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;
padding:var(--space-2) var(--space-4);border-top:1px solid var(--border);
background:var(--bg-base);}
/* ─── Sidebar page search «Найти» (2026-06-09) ─────────────────────────── */
.v3-search { position: relative; padding: 8px 12px 4px; }
.v3-search-input {
width: 100%; box-sizing: border-box;
background: var(--bg-page, #0f1117);
border: 1px solid var(--border-sidebar, #1f2937);
border-radius: var(--radius-input, 8px); padding: 7px 10px;
font-size: 13px; color: var(--text-1, #e6edf3);
}
.v3-search-input::placeholder { color: var(--text-4, #8b949e); }
.v3-search-input:focus { outline: none; border-color: var(--color-accent, #2563eb); }
.v3-search-results {
position: absolute; left: 12px; right: 12px; top: 100%; z-index: 60;
background: var(--bg-surface, #161b22);
border: 1px solid var(--border-sidebar, #1f2937);
border-radius: var(--radius-input, 8px); box-shadow: 0 10px 30px rgba(0,0,0,.35);
max-height: 360px; overflow-y: auto; display: none; margin-top: 4px;
}
.v3-search-results.open { display: block; }
.v3-search-item {
display: block; padding: 8px 12px; text-decoration: none;
font-size: 13px; color: var(--text-1, #e6edf3);
border-bottom: 1px solid var(--border-sidebar, #1f2937); cursor: pointer;
}
.v3-search-item:last-child { border-bottom: none; }
.v3-search-item:hover, .v3-search-item.active { background: var(--bg-hover, #1e2530); color: var(--color-accent, #60a5fa); }
.v3-search-item .v3-search-grp { display: block; color: var(--text-4, #8b949e); font-size: 11px; margin-top: 1px; }
.v3-search-empty { padding: 10px 12px; color: var(--text-4, #8b949e); font-size: 13px; }
.v3-sidebar.collapsed .v3-search { display: none; }
/* ─── Sidebar: единый раздел «Маркетплейсы» — переключатель канала (2026-06-10, Фаза 1) ─── */
.v3-mp-channels {
display: flex; flex-wrap: wrap; gap: var(--space-1, 4px);
padding: 6px 10px 8px;
}
.v3-ch-chip {
font-size: var(--fs-xs, 11px); font-weight: var(--fw-semibold, 600);
line-height: 1; padding: 5px 8px;
border-radius: var(--radius-badge, 6px);
border: 1px solid var(--border-sidebar, #f1f5f9);
background: var(--bg-page, #f8fafc);
color: var(--text-3, #6b7280);
cursor: pointer; transition: background .12s, color .12s, border-color .12s;
white-space: nowrap;
}
.v3-ch-chip:hover { color: var(--text-1, #111827); border-color: var(--border, #e2e8f0); }
.v3-ch-chip.active {
background: var(--nav-active-bg, #f1f5f9);
color: var(--nav-active-color, #1e293b);
border-color: var(--color-border-strong, #94a3b8);
}
/* brand-accent для активного чипа канала (border only — не триггерит css-drift) */
.v3-ch-chip.active.ch-kaufland { border-color: var(--brand-kaufland); }
.v3-ch-chip.active.ch-amazon { border-color: var(--brand-amazon); }
.v3-ch-chip.active.ch-fba { border-color: var(--brand-amazon); }
.v3-ch-chip.active.ch-vendor { border-color: var(--brand-amazon); }
.v3-ch-chip.active.ch-ebay { border-color: var(--brand-ebay); }
.v3-ch-chip.active.ch-otto { border-color: var(--brand-otto); }
/* блоки канала: показываем только выбранный */
.v3-ch-block { display: none; }
.v3-ch-block.active { display: block; }
/* в свёрнутом сайдбаре переключатель прячем (как и тело аккордеона) */
.v3-sidebar.collapsed .v3-mp-channels { display: none; }
/* ─── Полоса канала на страницах (2026-06-10, Фаза 2) — единый контракт /marketplaces/ ─── */
.mp-ch-bar {
display: flex; align-items: center; flex-wrap: wrap;
gap: var(--space-3, 12px);
margin-bottom: var(--space-4, 16px);
}
.mp-ch-select-wrap {
display: inline-flex; align-items: center; gap: var(--space-2, 8px);
}
.mp-ch-select-label {
font-size: var(--fs-xs, 11px); font-weight: var(--fw-semibold, 600);
text-transform: uppercase; letter-spacing: .04em;
color: var(--text-4, #9ca3af);
}
.mp-ch-select {
font-size: var(--fs-sm, 13px); font-weight: var(--fw-semibold, 600);
line-height: 1; padding: var(--space-2, 8px) var(--space-3, 12px);
border-radius: var(--radius-badge, 6px);
border: 1px solid var(--border, #e2e8f0);
background: var(--bg-card, #ffffff);
color: var(--text-1, #111827);
cursor: pointer;
}
.mp-ch-tabs {
display: inline-flex; flex-wrap: wrap; gap: var(--space-1, 4px);
}
.mp-ch-tab {
font-size: var(--fs-sm, 13px); font-weight: var(--fw-semibold, 600);
line-height: 1; padding: var(--space-2, 8px) var(--space-3, 12px);
border-radius: var(--radius-badge, 6px);
border: 1px solid var(--border-sidebar, #f1f5f9);
background: var(--bg-page, #f8fafc);
color: var(--text-3, #6b7280);
text-decoration: none;
transition: background .12s, color .12s, border-color .12s;
white-space: nowrap;
}
.mp-ch-tab:hover { color: var(--text-1, #111827); border-color: var(--border, #e2e8f0); }
.mp-ch-tab.active {
background: var(--nav-active-bg, #f1f5f9);
color: var(--nav-active-color, #1e293b);
border-color: var(--color-border-strong, #94a3b8);
}
/* ─── Sidebar: некликабельные подзаголовки внутри группы (Логистика, AI-платформа) ─── */
.v3-nav-subhead {
font-size: var(--fs-2xs, 10px); font-weight: var(--fw-bold, 700);
text-transform: uppercase; letter-spacing: .06em;
color: var(--text-4, #9ca3af);
padding: 8px 10px 3px; margin-top: 2px;
user-select: none;
}
.v3-nav-subhead:first-child { margin-top: 0; }
.v3-sidebar.collapsed .v3-nav-subhead { display: none; }
/* ─────────────────────────────────────────────────────────────────
Глобальный кружок-лаунчер агентов (заменяет always-on ИИ-маркетолог)
Partial: _partials/agent_launcher.html · JS: agent-launcher.js
───────────────────────────────────────────────────────────────── */
.agent-launcher { position: fixed; right: 24px; bottom: 24px; z-index: 2147482000; }
.agent-fab {
width: 56px; height: 56px; border-radius: var(--radius-circle); border: none; cursor: pointer;
background: var(--color-accent); color: var(--color-bg); font-size: 26px; line-height: 1;
box-shadow: var(--shadow-lg); display: flex; align-items: center; justify-content: center;
transition: transform .12s ease, filter .12s ease;
}
.agent-fab:hover { transform: scale(1.06); }
.agent-launcher.open .agent-fab { filter: brightness(.92); }
.agent-menu {
position: absolute; right: 0; bottom: 68px; min-width: 256px;
background: var(--bg-surface); border: 1px solid var(--border);
border-radius: var(--radius-card); box-shadow: var(--shadow-lg);
padding: var(--space-2); display: flex; flex-direction: column; gap: 2px;
}
.agent-menu[hidden] { display: none; }
.agent-menu-head {
font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .04em;
color: var(--text-3); font-weight: var(--fw-semibold);
padding: var(--space-2) var(--space-2) var(--space-1);
}
.agent-menu-item {
display: flex; align-items: center; gap: var(--space-2); width: 100%;
padding: var(--space-2); border: none; background: none; cursor: pointer;
border-radius: var(--radius-input); text-align: left;
color: var(--text-1); font-size: var(--fs-sm); text-decoration: none;
}
.agent-menu-item:hover { background: var(--bg-page); }
.agent-menu-ic { font-size: 18px; flex: 0 0 auto; }
.agent-menu-tx { display: flex; flex-direction: column; line-height: 1.3; }
.agent-menu-tx small { color: var(--text-3); font-size: var(--fs-2xs); }
/* Vendor finance — гармошка удержаний (нативный details/summary) */
.av-acc-sum { display:flex; gap:var(--space-3); align-items:center; cursor:pointer; padding:var(--space-2) 0; font-weight:500; }
.av-acc-name { flex:1; }
.av-acc[open] > .av-acc-sum { color: var(--text-1); }
.av-acc table { margin: var(--space-2) 0 var(--space-3); }
/* Подчёркнутые табы (страница пользователя и т.п.) — плоские, без рамки кнопки */
.utab-bar { display:flex; gap:0; border-bottom:1px solid var(--border); margin-bottom:16px; overflow-x:auto; }
.utab { padding:10px 16px; background:none; border:none; border-bottom:2px solid transparent; font-size:13px; cursor:pointer; white-space:nowrap; color:var(--text-2); transition:color .12s, border-color .12s; }
.utab:hover { color:var(--text-1); }
.utab.active { border-bottom-color:var(--text-1); color:var(--text-1); font-weight:600; }
.utab-count { font-size:10px; padding:1px 5px; border-radius:3px; background:var(--bg-surface); color:var(--text-2); margin-left:4px; }
/* === DHL Create Label page (dhl_create_label_v2_redesign.html) === */
.v2-section-body { display: flex; flex-direction: column; gap: var(--space-3); }
/* Alert blocks — status banners */
.alert-block { padding: var(--space-3) var(--space-4); border-radius: var(--radius-input); font-size: var(--fs-sm); line-height: 1.5; }
.alert-block + .alert-block { margin-top: var(--space-2); }
.alert-good { background: color-mix(in srgb, var(--color-good) 12%, var(--color-bg)); border-left: var(--space-1) solid var(--color-good); color: var(--color-text); }
.alert-warn { background: color-mix(in srgb, var(--color-warn) 12%, var(--color-bg)); border-left: var(--space-1) solid var(--color-warn); color: var(--color-text); }
.alert-bad { background: color-mix(in srgb, var(--color-bad) 12%, var(--color-bg)); border-left: var(--space-1) solid var(--color-bad); color: var(--color-text); }
.alert-info { background: color-mix(in srgb, var(--color-accent) 10%, var(--color-bg)); border-left: var(--space-1) solid var(--color-accent); color: var(--color-text); }
/* Form layout helpers */
.form-group { display: flex; flex-direction: column; gap: var(--space-1); }
.form-label { font-size: var(--fs-xs); color: var(--color-text-muted); font-weight: var(--fw-medium); text-transform: uppercase; letter-spacing: .04em; }
.form-input { width: 100%; background: var(--color-bg-soft); border: 1px solid var(--color-border); border-radius: var(--radius-input); padding: var(--space-2) var(--space-3); font-size: var(--fs-md); color: var(--color-text); transition: border-color .12s; }
.form-input:focus { outline: none; border-color: var(--color-accent); }
.form-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); }
.form-actions { display: flex; gap: var(--space-3); align-items: center; flex-wrap: wrap; padding: var(--space-2) 0; }
.form-hint { font-size: var(--fs-sm); color: var(--color-text-muted); }
/* 4-column grid for dimensions + weight */
.v2-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-3); margin-top: var(--space-3); }
@media (max-width: 900px) { .v2-grid-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .v2-grid-4 { grid-template-columns: 1fr; } .form-row-2 { grid-template-columns: 1fr; } }
/* Result panel helpers */
.error-list { margin: var(--space-2) 0 0 var(--space-4); padding: 0; list-style: disc; font-size: var(--fs-sm); }
.error-list li { margin-bottom: var(--space-1); }
.v2-details { margin-top: var(--space-3); font-size: var(--fs-sm); }
.v2-details summary { cursor: pointer; color: var(--color-text-muted); }
.raw-pre { background: var(--color-bg-soft); border: 1px solid var(--color-border); border-radius: var(--radius-input); padding: var(--space-3); white-space: pre-wrap; word-break: break-word; font-family: monospace; font-size: var(--fs-xs); max-height: 300px; overflow-y: auto; margin-top: var(--space-2); }
/* ── Shop CMS (2026-06-14) ── */
.shop-cms-rail { min-width: var(--sp-cms-rail, 140px); flex-shrink: 0; }
.shop-cms-main { flex: 1; min-width: 0; }
.shop-cms-rail-list { list-style: none; padding: 0; margin: 0; border-right: var(--border-width, 1px) solid var(--border); }
/* ── Vendor планировщик: подсветка строк того же FC при выборе (2026-06-15) ── */
.v2-table tbody tr.fc-suggest { background: rgba(59,130,246,.10); }
.v2-table tbody tr.fc-suggest td:first-child { box-shadow: inset 3px 0 0 var(--color-accent); }
html.dark .v2-table tbody tr.fc-suggest { background: rgba(59,130,246,.16); }
/* ── Vendor настройки упаковки (2026-06-15) ── */
.vendor-settings-card { max-width: 560px; }
/* ── Vendor «В пути» — статус доставки коробок (2026-06-15) ── */
.box-row { display:inline-flex; gap:3px; flex-wrap:wrap; align-items:center; vertical-align:middle; margin-right:6px; }
.box-dot { width:13px; height:13px; border-radius:var(--radius-xs); display:inline-block; border:1px solid var(--border); }
.box-dot.box-delivered { background:var(--color-good); } /* зелёная = доставлено */
.box-dot.box-transit { background:var(--color-warn); animation:boxpulse 1.6s ease-in-out infinite; } /* жёлтая = в пути */
.box-dot.box-unknown { background:var(--border); } /* серая = нет данных */
@keyframes boxpulse { 0%,100%{opacity:1;} 50%{opacity:.4;} }
.v2-table tbody tr.row-all-delivered { background:var(--accent-soft); }
/* ── Vendor Phase 2: коробки + ASN payload preview (2026-06-15) ── */
.vendor-json-pre { background:var(--bg-code,#1e293b); color:var(--text-code,#e2e8f0); padding:var(--space-4); border-radius:var(--radius-md); overflow-x:auto; overflow-y:auto; max-height:var(--vendor-payload-max-h,25rem); font-size:var(--fs-xs); white-space:pre-wrap; }
/* ── Vendor confirm-модал (узкий) 2026-06-15 ── */
.modal-confirm { max-width: 440px; }
.modal-confirm .modal-body { display: block; line-height: 1.5; }
/* ── JTL App-Registrierung page (2026-06-15) ── */
.jtl-reg-page { padding: 0 var(--space-6) var(--space-10); }
.jtl-reg-status-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: var(--space-4); margin-bottom: var(--space-7); }
.jtl-reg-status-card { background: var(--bg-surface); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: var(--space-4) var(--space-5); }
.jtl-reg-status-card.write-ready { border-color: var(--color-good); }
.jtl-reg-status-label { font-size: var(--fs-xs); font-weight: 600; color: var(--text-3); text-transform: uppercase; letter-spacing: .05em; margin-bottom: var(--space-2); }
.jtl-reg-status-val { font-size: var(--fs-sm); font-weight: 600; color: var(--text-1); font-family: var(--ff-mono, monospace); }
.jtl-reg-status-sub { font-size: var(--fs-xs); color: var(--color-good); }
.jtl-reg-status-sub.warn { color: var(--color-warn); }
.jtl-reg-status-sub.bad { color: var(--color-bad); }
.jtl-reg-info-card { background: var(--bg-surface); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: var(--space-5) var(--space-6); margin-bottom: var(--space-7); }
.jtl-reg-info-title { font-size: var(--fs-sm); font-weight: 600; color: var(--text-1); margin-bottom: var(--space-4); }
.jtl-reg-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-5); font-size: var(--fs-2sm); }
.jtl-reg-step-card { background: var(--bg-surface); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: var(--space-5) var(--space-6); margin-bottom: var(--space-4); }
.jtl-reg-step-card.step-done { border-color: var(--color-good); }
.jtl-reg-step-inner { display: flex; align-items: flex-start; gap: var(--space-4); }
.jtl-reg-step-num { width: 28px; height: 28px; border-radius: 50%; background: var(--accent); color: #fff; font-size: var(--fs-sm); font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.jtl-reg-step-num.inactive { background: var(--text-4); }
.jtl-reg-step-body { flex: 1; }
.jtl-reg-step-title { font-size: var(--fs-sm); font-weight: 600; color: var(--text-1); margin-bottom: var(--space-1); }
.jtl-reg-step-desc { font-size: var(--fs-2sm); color: var(--text-3); margin-bottom: var(--space-4); line-height: 1.7; }
.jtl-reg-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); margin-bottom: var(--space-4); }
.jtl-reg-label { font-size: var(--fs-xs); font-weight: 500; color: var(--text-2); display: block; margin-bottom: var(--space-1); }
.jtl-reg-input { width: 100%; padding: var(--space-2) var(--space-3); border: 1px solid var(--border); border-radius: var(--radius-md); font-size: var(--fs-sm); background: var(--bg-input, var(--bg-surface)); color: var(--text-1); font-family: var(--ff-mono, monospace); }
.jtl-reg-scopes { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-4); }
.jtl-reg-scope-chip { background: var(--bg-muted, var(--bg-page)); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: var(--space-1) var(--space-2); font-size: var(--fs-xs); font-family: var(--ff-mono, monospace); color: var(--text-2); }
.jtl-reg-alert { padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); font-size: var(--fs-xs); margin-bottom: var(--space-4); border: 1px solid; }
.jtl-reg-alert.warn { background: var(--warn-soft); border-color: var(--warn); color: var(--warn); }
.jtl-reg-alert.info { background: var(--success-soft, var(--bg-surface)); border-color: var(--color-blue, var(--accent)); color: var(--color-blue, var(--accent)); }
.jtl-reg-alert.ok { background: var(--success-soft); border-color: var(--success); color: var(--success); }
.jtl-reg-step-id { margin-top: var(--space-3); padding: var(--space-2) var(--space-3); background: var(--bg-muted, var(--bg-page)); border-radius: var(--radius-md); font-size: var(--fs-xs); color: var(--text-2); }
.jtl-reg-key-row { display: flex; gap: var(--space-2); align-items: flex-end; }
.jtl-reg-key-row > div { flex: 1; }
.jtl-reg-cmd-pre { background: var(--success-soft); border: 1px solid var(--success); border-radius: var(--radius-md); padding: var(--space-3) var(--space-4); font-size: var(--fs-2sm); color: var(--success); font-family: var(--ff-mono, monospace); white-space: pre-wrap; }
.jtl-reg-tech-box { background: var(--bg-muted, var(--bg-page)); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: var(--space-4) var(--space-5); }
.jtl-reg-tech-title { font-size: var(--fs-xs); font-weight: 600; color: var(--text-3); text-transform: uppercase; letter-spacing: .05em; margin-bottom: var(--space-2); }
.jtl-reg-tech-body { font-size: var(--fs-xs); color: var(--text-3); line-height: 1.8; }
.jtl-reg-flash { border-radius: var(--radius-md); padding: var(--space-3) var(--space-4); margin-bottom: var(--space-3); border: 1px solid; font-size: var(--fs-sm); }
.jtl-reg-flash.ok { background: var(--success-soft); border-color: var(--success); color: var(--success); }
.jtl-reg-flash.err { background: var(--danger-soft); border-color: var(--danger); color: var(--danger); }
.jtl-reg-flash.warn { background: var(--warn-soft); border-color: var(--warn); color: var(--warn); }
.jtl-reg-step-disabled { opacity: .55; }
/* Product Intelligence (/admin/product-intel) */
.pi-thumb { width: 80px; height: 80px; object-fit: contain; border-radius: var(--radius-sm); border: 1px solid var(--border-1); }
.pi-chart-sm { max-height: 160px; }
.pi-chart-xs { max-height: 140px; }
.pi-name-cell { max-width: 200px; }
/* ── #171 Price Policy (admin_price_policy.html) ───────────────────── */
.pp-thumb { width: var(--space-8); height: var(--space-8); object-fit: contain;
border-radius: var(--radius-sm); background: var(--surface-2); }
.pp-actions { white-space: nowrap; }
.pp-actions .btn-xs { margin-right: var(--space-1); }
.pp-bounds-input { width: 8.75rem; } /* модалка границ цены min/max */
.pp-fresh-bar { padding: var(--space-2) var(--space-3); background: var(--surface-2);
border-radius: var(--radius-sm); margin-bottom: var(--space-3); }
.search-input-wide { min-width: 17.5rem; } /* строка поиска (matching/общая) */
.link-u { color: var(--accent); text-decoration: underline; }
.chip-count { display: inline-block; margin-left: var(--space-1);
padding: 0 var(--space-1); border-radius: var(--radius-pill);
background: var(--surface-3); color: var(--text-3); font-size: var(--fs-xs); }
.form-select { padding: var(--space-1) var(--space-2); border: 1px solid var(--border);
border-radius: var(--radius-input); background: var(--surface-1); color: var(--text-1);
font-size: var(--fs-sm); }
/* ── #171 Price Policy — причины исключения/проблем ─────────────────── */
.pp-state { min-width: 18rem; max-width: 26rem; vertical-align: top; }
.pp-reasons { margin-top: var(--space-1); display: flex; flex-direction: column; gap: var(--space-1); }
.pp-reason { display: flex; gap: var(--space-2); align-items: baseline; font-size: var(--fs-xs);
line-height: 1.35; cursor: help; }
.pp-reason-tag { flex-shrink: 0; padding: 0 var(--space-1); border-radius: var(--radius-xs);
background: var(--surface-3); color: var(--text-3); font-size: 0.65rem; letter-spacing: .02em;
white-space: nowrap; }
.pp-reason-tag.is-err { background: var(--bad-bg, #fde8e8); color: var(--bad, #c0392b); }
.pp-reason-msg { color: var(--text-2); white-space: normal; overflow-wrap: anywhere; }
.pp-state .status-badge { vertical-align: middle; }
/* ── #17 Bulk select — подсветка выбранной строки ─────────────────── */
.v2-table tr.row-sel > td { background: var(--accent-soft, rgba(37,99,235,.08)); }
.bulk-bar { margin-bottom: var(--space-3); }
.bulk-bar .filter-actions { margin-top: 0; }
.v2-table tbody tr.row-pick { cursor: pointer; }
.v2-table tbody tr.row-pick:hover > td { background: var(--surface-2, rgba(148,163,184,.06)); }
/* Ревью ключей: принятая строка зелёная («принято · ждёт применения»), отклонённая — тусклая. row-sel (выделение) перебивает. */
.v2-table tr.kw-accepted:not(.row-sel) > td { background: var(--good-bg); }
.v2-table tr.kw-rejected:not(.row-sel) > td { opacity: .5; }
/* Ревью ключей — family-view (Hermes #2): пакет на семью, 1 title-слот */
.fam-viewbar { display: flex; gap: var(--space-2, 8px); margin-bottom: var(--space-3, 16px); }
.fam-card { border: 1px solid var(--border, #e2e8f0); border-radius: 12px; padding: 14px; margin-bottom: 12px; background: var(--surface, #fff); }
.fam-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.fam-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 8px; }
.fam-col { background: var(--surface-2, #f8fafc); border-radius: 8px; padding: 8px 10px; }
.fam-col-h { font-size: var(--fs-xs, 11px); color: var(--text-muted, #94a3b8); margin-bottom: 6px; text-transform: uppercase; letter-spacing: .02em; }
.fam-col .status-badge, .fam-flags .status-badge { margin: 2px 3px 2px 0; }
.fam-flags { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 4px; }
.dhl-live-state { font-size: var(--fs-xs); color: var(--accent); }
/* Подсветка дропдауна «Действие» по уже принятому решению (vendor aggregate) */
.agg-action.dec-accept { border-color: var(--color-good); background: color-mix(in srgb, var(--color-good) 12%, transparent); font-weight: 600; }
.agg-action.dec-reject,
.agg-action.dec-obsolete { border-color: var(--color-bad); background: color-mix(in srgb, var(--color-bad) 12%, transparent); font-weight: 600; }
.agg-action.dec-backorder,
.agg-action.dec-partial,
.agg-action.dec-mixed { border-color: var(--color-warn); background: color-mix(in srgb, var(--color-warn) 14%, transparent); font-weight: 600; }
/* ── SEO-чат (Вебсайты → SEO-чат) 2026-06-18 ── */
.seochat-wrap { display: flex; flex-direction: column; gap: var(--space-4); }
.seochat-scope { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-2); }
.seochat-log { display: flex; flex-direction: column; gap: var(--space-3); min-height: 320px; max-height: 60vh; overflow-y: auto; padding: var(--space-4); background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-card); }
.seochat-msg { max-width: 80%; padding: var(--space-3); border-radius: var(--radius-card); font-size: var(--fs-md); line-height: 1.5; white-space: pre-wrap; word-break: break-word; }
.seochat-msg.is-user { align-self: flex-end; background: var(--accent); color: var(--bg-surface); }
.seochat-msg.is-bot { align-self: flex-start; background: var(--bg-surface); border: 1px solid var(--border); color: var(--text-1); }
.seochat-msg.is-tool { align-self: flex-start; background: transparent; color: var(--text-2); font-size: var(--fs-sm); padding-top: 0; padding-bottom: 0; }
.seochat-typing { color: var(--text-2); font-style: italic; }
.seochat-bar { display: flex; gap: var(--space-2); align-items: flex-end; }
.seochat-input { flex: 1; min-height: var(--space-10); max-height: 160px; resize: vertical; background: var(--bg-page); border: 1px solid var(--border); border-radius: var(--radius-input); padding: var(--space-3); font-size: var(--fs-md); color: var(--text-1); font-family: inherit; }
.seochat-input:focus { outline: none; border-color: var(--accent); }
.seochat-examples { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.seochat-example { cursor: pointer; }
.seochat-hint { font-size: var(--fs-sm); margin-bottom: var(--space-2); }
/* ── Parcel ops dashboard (/logistics) — карточки статусов + таблица-селект ── */
.parcel-carrier { margin-bottom: var(--space-5); }
.parcel-carrier-h { display:flex; align-items:center; gap:var(--space-2); margin-bottom:var(--space-3); font-size:var(--fs-sm); font-weight:600; color:var(--color-text); }
.parcel-carrier-sub { font-size:var(--fs-xs); color:var(--color-text-muted); font-weight:400; }
.parcel-tiles { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:var(--space-3); }
.parcel-tile { text-align:left; cursor:pointer; background:var(--bg-surface); border:1px solid var(--color-border); border-left:3px solid var(--color-neu); border-radius:var(--radius-card); padding:var(--space-3) var(--space-4); transition:border-color .15s, background .15s, box-shadow .15s; }
.parcel-tile:hover { background:var(--bg-hover); }
.parcel-tile.active { box-shadow:0 0 0 2px var(--color-accent); }
.parcel-tile.t-good { border-left-color:var(--color-good); }
.parcel-tile.t-accent { border-left-color:var(--color-accent); }
.parcel-tile.t-bad { border-left-color:var(--color-bad); }
.parcel-tile.t-neu { border-left-color:var(--color-neu); }
.parcel-tile-val { font-size:var(--fs-xl); font-weight:700; color:var(--color-text); }
.parcel-tile-lbl { font-size:var(--fs-xs); color:var(--color-text-muted); text-transform:uppercase; letter-spacing:.4px; margin-top:var(--space-1); }
.parcel-pager { display:flex; align-items:center; justify-content:space-between; gap:var(--space-3); flex-wrap:wrap; margin-top:var(--space-3); padding-top:var(--space-3); border-top:1px solid var(--color-border); }
.parcel-pager-info { font-size:var(--fs-xs); color:var(--color-text-muted); }
.parcel-pager-ctl { display:flex; align-items:center; gap:var(--space-2); }
.parcel-pp { background:var(--bg-input); color:var(--color-text); border:1px solid var(--color-border); border-radius:var(--radius-input); padding:var(--space-1) var(--space-2); font-size:var(--fs-xs); }
.parcel-sec { margin-bottom: var(--space-5); }
.parcel-kpis { margin-bottom: var(--space-4); }
.parcel-table-wrap { margin-top: var(--space-2); }
.parcel-loading { padding: var(--space-4) 0; }
.parcel-empty { text-align:center; color:var(--color-text-muted); padding:var(--space-6); font-size:var(--fs-sm); }
.parcel-cell { font-size:var(--fs-xs); }
.parcel-link { color:var(--color-accent); text-decoration:underline; }
.parcel-link-muted { color:var(--color-text-muted); }
.parcel-ret { color:var(--color-bad); }
/* ── /admin/address-auto-review — ревью авто-правок адреса (IRON LAW: стили тут, не в шаблоне) ── */
.aar-bc-sec{color:var(--text-3)}
.aar-intro{color:var(--text-2);font-size:13px;margin:4px 0 14px;max-width:880px}
.aar-kpi{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.aar-kpi .b{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--radius-card);padding:10px 14px;min-width:104px}
.aar-kpi .n{font-size:22px;font-weight:700;line-height:1.1}
.aar-kpi .l{font-size:11px;color:var(--text-3);text-transform:uppercase;letter-spacing:.03em}
.aar-c-good{color:var(--color-good)}
.aar-c-bad{color:var(--color-bad)}
.aar-count{font-size:12px;color:var(--text-3)}
.aar-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.aar-sel{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--radius-input);padding:6px 10px;font-size:13px;color:var(--text-1)}
.aar-tbl{width:100%;border-collapse:collapse;font-size:13px;background:var(--surface-1);border:1px solid var(--border);border-radius:var(--radius-card);overflow:hidden}
.aar-tbl th,.aar-tbl td{padding:8px 10px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}
.aar-tbl th{background:var(--surface-2);color:var(--text-2);font-size:11px;text-transform:uppercase;letter-spacing:.03em;cursor:pointer;white-space:nowrap}
.aar-tbl tr.is-return{background:rgba(248,113,113,.08)}
.aar-tbl tr.v-ok{background:rgba(52,211,153,.07)}
.aar-tbl tr.v-fail{background:rgba(248,113,113,.10)}
.aar-mono{font-variant-numeric:tabular-nums;white-space:nowrap}
.aar-chg{font-size:12px;line-height:1.45}
.aar-chg b{color:var(--text-1)}
.aar-chg .old{color:var(--text-3);text-decoration:line-through}
.aar-arrow{color:var(--color-bad);font-weight:700;margin:0 3px}
/* риск/трекинг — переиспользуем канонические badge-классы (good/warn/bad/neu/accent-badge) */
.aar-vbtns{display:flex;gap:4px}
.aar-vbtn{border:1px solid var(--border);background:var(--surface-1);border-radius:var(--radius-button);padding:4px 9px;font-size:12px;font-weight:600;cursor:pointer;color:var(--text-2)}
.aar-vbtn:hover{border-color:var(--text-3)}
.aar-vbtn.on-ok{background:var(--color-good);border-color:var(--color-good);color:#fff}
.aar-vbtn.on-fail{background:var(--color-bad);border-color:var(--color-bad);color:#fff}
.aar-vbtn.on-skip{background:var(--text-3);border-color:var(--text-3);color:#fff}
.aar-note{margin-top:5px;width:100%;max-width:220px;border:1px solid var(--border);border-radius:var(--radius-input);padding:3px 7px;font-size:12px;background:var(--surface-1);color:var(--text-1)}
.aar-link{color:var(--brand);text-decoration:underline}
.aar-tlink{font-size:10px}
.aar-meta{font-size:10px;color:var(--text-3);margin-top:3px}
.aar-sortarr{font-size:9px;opacity:.5;margin-left:3px}
/* ── /ads/builder — ИИ-конструктор кампаний (стили тут, не в шаблоне) ── */
.adsb-bc-sec{color:var(--text-3)}
.adsb-grow{flex:1;min-width:280px}
.adsb-hint{font-size:var(--fs-sm);margin-top:6px}
.adsb-err{color:var(--color-bad);margin-top:8px}
.adsb-head{margin-bottom:10px}
.adsb-kpis{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}
.adsb-proposal{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-card);padding:14px 16px}
.adsb-prop-grid{display:flex;gap:24px;flex-wrap:wrap;margin-bottom:10px;align-items:flex-end}
.adsb-prop-lbl{display:block;font-size:var(--fs-sm);color:var(--text-3)}
.adsb-prop-big{font-size:20px;font-weight:700;color:var(--text-1)}
.adsb-type{margin-right:4px}
.adsb-rationale{margin:8px 0;font-size:var(--fs-sm)}
.adsb-soon{font-size:var(--fs-sm);margin-left:8px}
.adsb-mono{font-variant-numeric:tabular-nums;white-space:nowrap}
.adsb-link{color:var(--brand);text-decoration:underline}
.adsb-reasons{font-size:var(--fs-sm)}
.adsb-kpi{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--radius-card);padding:10px 14px;min-width:100px}
.adsb-kpi-val{font-size:20px;font-weight:700;color:var(--text-1);line-height:1.1}
.adsb-kpi-lbl{font-size:var(--fs-sm);color:var(--text-3)}
.adsb-ac{position:relative}
.adsb-dd{position:absolute;top:100%;left:0;right:0;z-index:30;background:var(--surface-1);border:1px solid var(--border);border-radius:var(--radius-input);box-shadow:var(--shadow-lg);max-height:320px;overflow:auto;margin-top:2px}
.adsb-dd-item{display:flex;gap:8px;align-items:center;padding:7px 12px;cursor:pointer;border-bottom:1px solid var(--border)}
.adsb-dd-item:hover{background:var(--surface-2)}
.adsb-dd-name{flex:1;font-size:var(--fs-sm);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.adsb-dd-kids{font-size:var(--fs-sm)}
.adsb-scan-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:12px}
.adsb-scan-kw{min-width:240px;flex:0 1 320px}
/* ── /ads/builder — Launcher (модалка запуска) ── */
.adsb-launch-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:12px}
.adsb-budget-wrap{position:relative;display:inline-flex;align-items:center}
.adsb-budget-cur{position:absolute;left:9px;color:var(--text-3);font-size:var(--fs-sm)}
.adsb-budget-inp{width:90px;padding-left:20px}
.adsb-num{width:78px}
.adsb-ok{color:var(--color-good)}
.adsb-bad{color:var(--color-bad)}
.adsb-modal-bg{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.45);display:flex;align-items:flex-start;justify-content:center;padding:40px 16px;overflow:auto}
.adsb-modal{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--radius-card);box-shadow:var(--shadow-lg);width:100%;max-width:760px}
.adsb-modal-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--border)}
.adsb-modal-x{background:none;border:none;font-size:18px;cursor:pointer;color:var(--text-3);line-height:1}
.adsb-modal-body{padding:16px 18px}
.adsb-modal-foot{display:flex;gap:10px;justify-content:flex-end;margin-top:16px;padding-top:14px;border-top:1px solid var(--border)}
.adsb-state-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:12px 0}
.adsb-state-opt{display:inline-flex;gap:6px;align-items:center;padding:6px 12px;border:1px solid var(--border);border-radius:var(--radius-input);cursor:pointer;font-size:var(--fs-sm)}
.adsb-state-opt.on{border-color:var(--brand);background:var(--surface-2)}
.adsb-camp-tbl{margin-top:8px}
.adsb-camp-tbl input[type=number]{font-variant-numeric:tabular-nums}
.adsb-camp-name{min-width:200px}
.adsb-camp-off{opacity:.55}
.adsb-kw-det{margin-top:14px}
.adsb-kw-area{width:100%;font-family:var(--font-mono,monospace);font-size:12px;margin-top:6px}
.adsb-launch-res{margin-top:14px;border-top:1px solid var(--border);padding-top:12px}
.adsb-res-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:var(--fs-sm);margin:4px 0}
.adsb-seo{margin-top:16px;border-top:1px solid var(--border);padding-top:14px}
.adsb-seo-row{margin:10px 0}
.adsb-seo-chk{display:inline-flex;gap:6px;align-items:center;cursor:pointer}
.adsb-seo-prop{margin-top:8px}
.adsb-seo-btn{margin-top:6px}
.adsb-child-title{margin:8px 0;padding:8px 10px;background:var(--surface-2);border-radius:var(--radius-input)}
.adsb-title-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:8px 0}
.adsb-lp-child{border-left:3px solid var(--brand)}
.adsb-lp-field{margin:8px 0}
.adsb-recent-row:hover{background:var(--surface-2)}
/* История анализов — карточки */
.adsb-hist-sum{cursor:pointer;font-weight:600;font-size:var(--fs-md);list-style:none;display:flex;align-items:center;gap:8px}
.adsb-hist-cnt{background:var(--surface-2);border-radius:var(--radius-pill);padding:1px 9px;font-size:var(--fs-sm);color:var(--text-3)}
.adsb-hist-list{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.adsb-hist-card{display:flex;align-items:center;gap:14px;padding:10px 14px;border:1px solid var(--border);border-radius:var(--radius-card);background:var(--surface-1);transition:background .12s,border-color .12s}
.adsb-hist-card:hover{background:var(--surface-2);border-color:var(--brand)}
.adsb-hist-main{flex:1;min-width:0;cursor:pointer;display:flex;flex-direction:column;gap:2px}
.adsb-hist-name{font-weight:600;color:var(--brand)}
.adsb-hist-sku{font-size:var(--fs-2xs,10px);color:var(--text-3);font-variant-numeric:tabular-nums}
.adsb-hist-stats{display:flex;align-items:center;gap:14px;font-size:var(--fs-sm);color:var(--text-2);white-space:nowrap}
.adsb-hist-when{color:var(--text-3);font-variant-numeric:tabular-nums}
.adsb-hist-acts{display:flex;gap:4px}
.adsb-icon-btn{background:none;border:none;cursor:pointer;opacity:.5;font-size:14px;padding:4px;border-radius:var(--radius-input)}
.adsb-icon-btn:hover{opacity:1;background:var(--surface-2)}
.adsb-del:hover{background:color-mix(in srgb,var(--color-bad) 14%,transparent)}
.adsb-name{cursor:pointer}
.adsb-name-sub{font-size:var(--fs-2xs,10px);margin-left:8px;font-variant-numeric:tabular-nums}
.adsb-rename-btn{background:none;border:none;cursor:pointer;margin-left:8px;opacity:.45;font-size:13px}
.adsb-rename-btn:hover{opacity:1}
/* /admin/fba-fee-audit */
.ffa-bc-sec{color:var(--text-3)}
.ffa-intro{color:var(--text-2);font-size:13px;margin:4px 0 14px;max-width:880px}
.ffa-kpis{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.ffa-mono{font-variant-numeric:tabular-nums;white-space:nowrap}
.ffa-link{color:var(--brand);text-decoration:underline}
.ffa-prod{font-size:12px;color:var(--text-2)}
.ffa-muted{font-size:11px;color:var(--text-3)}
.ffa-note{font-size:12px;color:var(--text-3);margin-top:12px}
/* /admin/returns-portal — Phase 1+2 modals */
.rp-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);display:none;align-items:center;justify-content:center;z-index:9999}
.rp-modal-overlay.rp-open{display:flex}
.rp-modal{background:var(--surface-1);border:1px solid var(--border);border-radius:var(--radius-card);padding:28px 32px;min-width:380px;max-width:520px;width:100%;box-shadow:var(--shadow-lg)}
.rp-modal h3{margin:0 0 4px;font-size:1.1rem;font-weight:600}
.rp-modal-sub{color:var(--text-3);margin-bottom:16px;font-size:.875rem}
.rp-modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:20px}
.rp-modal-error{color:var(--c-bad,#ef4444);font-size:.85rem;margin-top:8px}
.rp-notice{padding:10px 14px;border-radius:var(--radius-sm);font-size:.875rem;margin-bottom:14px}
.rp-notice-warn{background:var(--warn-bg,#fef3c7);border:1px solid var(--warn,#f59e0b);color:var(--warn-text,#92400e)}
.rp-notice-info{background:var(--brand-tint,#eff6ff);border:1px solid var(--brand,#3b82f6);color:var(--brand-dark,#1d4ed8)}
.rp-deduct-block{margin:12px 0}
.rp-checkbox-label{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:.9rem}
.rp-total-row{margin:12px 0;font-size:.95rem}
.rp-confirm-step{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 14px;margin-top:12px;font-size:.9rem}
.btn-sm{font-size:.8rem;padding:4px 10px}
.btn-sm-placeholder{display:inline-block;width:60px}
.actions-cell{white-space:nowrap}
.rp-hidden{display:none!important}
.rp-mt{margin-top:var(--sp-3)}
/* ===== Алекс — страница разметки SKU→станция (#207) ===== */
.alex-filters{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.alex-inp{height:34px;border:1px solid var(--border,#d8dee9);border-radius:8px;padding:0 10px;font-size:13px;background:var(--surface,#fff);color:var(--text-1,#1e293b)}
.alex-chk{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text-muted,#64748b)}
.alex-sp{flex:1}
.alex-bulkbar{display:flex;align-items:center;gap:8px;font-size:13px}
.alex-ghost{background:none;border:none;color:var(--text-muted,#64748b);cursor:pointer;font-size:13px;text-decoration:underline}
.alex-table td,.alex-table th{font-size:13px;vertical-align:middle}
.alex-srt{cursor:pointer;user-select:none;white-space:nowrap}
.alex-mono{font-family:ui-monospace,Menlo,monospace;font-size:12px;white-space:nowrap}
.alex-name{max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-muted,#64748b)}
.alex-st{min-width:170px}
.alex-st-edited{border-color:var(--accent,#3b82f6);box-shadow:0 0 0 2px rgba(59,130,246,.15)}
.alex-note{width:120px}
.alex-ok{background:color-mix(in srgb,var(--color-good) 6%,transparent)}
.alex-edit{background:rgba(59,130,246,.05)}
.alex-saved{color:var(--color-good);font-weight:700}
.alex-empty{padding:24px;text-align:center;color:var(--text-muted,#64748b)}
.alex-c-chk{width:28px}
.alex-c-save{width:34px}
.alex-r{text-align:right}
.alex-c{text-align:center}
/* Алекс: кнопка сохранить в строке (#207) */
.alex-c-save{width:104px;text-align:center}
.alex-savebtn{min-width:88px;height:30px;padding:0 12px;border-radius:8px;border:1px solid var(--border,#d8dee9);background:var(--surface,#fff);color:var(--text-muted,#64748b);font-size:12px;font-weight:600;cursor:pointer;transition:all .12s}
.alex-savebtn:hover{border-color:var(--accent,#3b82f6)}
.alex-savebtn.is-dirty{background:var(--accent,#3b82f6);border-color:var(--accent,#3b82f6);color:#fff}
.alex-savebtn.is-saved{background:color-mix(in srgb,var(--color-good) 12%,transparent);border-color:color-mix(in srgb,var(--color-good) 50%,transparent);color:var(--color-good)}
/* Алекс: CRUD станций/обработки (#207) */
.alex-hint{margin:0 0 14px;color:var(--text-muted,#64748b);font-size:13px}
.alex-ico{width:54px;text-align:center;font-size:16px}
.alex-mono2{font-family:ui-monospace,Menlo,monospace;width:90px;text-transform:uppercase}
.alex-nm{width:100%;min-width:120px}
.alex-num{width:70px;text-align:right}
.alex-del{margin-left:6px;border:none;background:none;color:var(--color-bad);cursor:pointer;font-size:14px;font-weight:700}
.alex-del:hover{color:color-mix(in srgb,var(--color-bad) 80%,black)}
.alex-newrow{background:rgba(59,130,246,.04)}
.alex-newrow td{border-top:2px solid var(--accent,#3b82f6)}
/* Алекс: живой счётчик разметки (#207) */
.alex-stats{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 12px;padding:8px 12px;background:var(--surface-2,#f8fafc);border:1px solid var(--border,#e2e8f0);border-radius:8px;font-size:13px;color:var(--text-2,#475569)}
.alex-stats b{color:var(--text-1,#1e293b)}
.alex-stats-sep{color:var(--text-muted,#94a3b8)}
.alex-stats-shown{margin-left:auto;color:var(--text-muted,#64748b)}
/* Алекс: выбор строки кликом (#207) */
.alex-rowclick{cursor:pointer}
.alex-row-sel{background:rgba(59,130,246,.14)!important;box-shadow:inset 3px 0 0 var(--accent,#3b82f6)}
.alex-rowclick:hover{background:rgba(59,130,246,.05)}
/* Алекс: пагинатор (#207) */
.alex-pager{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:14px;font-size:13px;color:var(--text-2,#475569)}
.alex-pgbtn{height:30px;padding:0 12px;border:1px solid var(--border,#d8dee9);border-radius:8px;background:var(--surface,#fff);cursor:pointer;font-size:13px;color:var(--text-1,#1e293b)}
.alex-pgbtn:hover:not(:disabled){border-color:var(--accent,#3b82f6)}
.alex-pgbtn:disabled{opacity:.4;cursor:default}
.alex-pginfo{padding:0 6px}
/* Алекс: сегмент-фильтр присвоения (#207) */
.alex-seg{display:inline-flex;border:1px solid var(--border,#d8dee9);border-radius:8px;overflow:hidden}
.alex-seg button{border:none;background:var(--surface,#fff);padding:0 12px;height:34px;font-size:13px;cursor:pointer;color:var(--text-2,#475569);border-left:1px solid var(--border,#e2e8f0)}
.alex-seg button:first-child{border-left:none}
.alex-seg button:hover{background:var(--surface-2,#f1f5f9)}
.alex-seg button.on{background:var(--accent,#3b82f6);color:#fff}
/* ── Listing Control (/admin/listing-control, 2026-06-23) ── */
.chip{display:inline-block;padding:2px var(--space-2,7px);border-radius:var(--radius-sm,6px);font-weight:600;font-size:var(--fs-xs,11px);white-space:nowrap;line-height:1.4}
.lc-markets-cell{white-space:nowrap}
.lc-mk{display:inline-block;width:24px;text-align:center;border-radius:var(--radius-sm,4px);font-size:var(--fs-xs,10px);font-weight:600;margin:1px;padding:1px 0;line-height:1.5}
.lc-mk-on{background:var(--accent,#2563eb);color:#fff}
.lc-mk-off{background:var(--surface-2,#e2e8f0);color:var(--text-muted,#cbd5e1)}
.lc-smk{display:inline-block;background:var(--surface-2,#f1f5f9);border-radius:var(--radius-sm,4px);padding:0 var(--space-1,4px);margin:1px;font-size:var(--fs-xs,10px);color:var(--text-2,#475569);white-space:nowrap}
.lc-health-cell{min-width:90px}
.lc-issues-sub{font-size:var(--fs-xs,11px)}
.lc-sales-cell{min-width:150px}
.lc-co-row{font-size:var(--fs-xs,11px)}
.lc-acos-cell{min-width:60px;text-align:center}
.lc-ts-cell{font-size:var(--fs-xs,11px);min-width:110px}
.chip-ok{background:var(--color-good-bg,#dcfce7);color:var(--color-good,#166534)}
.chip-warn{background:var(--color-warn-bg,#fef9c3);color:var(--color-warn,#854d0e)}
.chip-bad{background:var(--color-bad-bg,#fee2e2);color:var(--color-bad,#991b1b)}
/* ETL Health — мелкие подписи/таймстемпы (2026-06-24) */
.etlh-sub { font-size: var(--fs-xs); }
.etlh-ts { font-size: var(--fs-xs); }
/* ── ИИ-аудит рекламы Amazon (/ads/amazon-audit) — ширина колонок ── */
.aud-col-product { max-width: 280px; }
.aud-col-product div { white-space: normal; }
.aud-col-verdict { max-width: 440px; }
/* Amazon Ads Audit — компактные подписи/чипы (2026-06-24) */
.aaud-sub { font-size: var(--fs-xs); }
.aaud-note { font-size: var(--fs-xs); margin-top: var(--sp-2); }
.aaud-chip { margin: var(--sp-1) var(--sp-1) 0 0; display: inline-block; }
.aaud-kw { max-width: 260px; }
.aaud-listing { max-width: 280px; }
/* Category Audit — аудит категорий Amazon (2026-06-27) */
.ca-sub { font-size: var(--fs-xs); }
.ca-chip { margin: var(--sp-1) var(--sp-1) 0 0; display: inline-block; }
.ca-cats { max-width: 360px; }
.ca-flagged { max-width: 420px; }
.ca-flag-row { display: flex; flex-wrap: wrap; gap: var(--sp-2); align-items: baseline;
padding: var(--sp-1) 0; border-bottom: 1px solid var(--border); font-size: var(--fs-sm); }
.ca-flag-row:last-child { border-bottom: none; }
.ca-sku { font-size: var(--fs-xs); }
.ca-empty { text-align: center; padding: var(--sp-4); }
.ca-note { background: rgba(245,158,11,.06); border: 1px solid var(--color-warn);
border-radius: var(--radius-input); padding: var(--sp-3) var(--sp-4);
margin: var(--sp-4) 0; font-size: var(--fs-sm); color: var(--text-2); }
.ca-note-drift { margin-top: var(--sp-3); }
/* ── Category Audit: рынок-селектор + гармошка + вердикт (2026-06-28) ── */
[x-cloak] { display: none !important; }
.ca-market-bar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2);
margin: var(--sp-3) 0; }
.ca-market-cur { font-weight: 700; font-size: var(--fs-md); }
.ca-market-sep { color: var(--text-3); }
.ca-market-empty { opacity: .45; cursor: not-allowed; }
.ca-fam-table tbody.ca-fam { border-bottom: 1px solid var(--border); }
.ca-fam-row { cursor: pointer; }
.ca-fam-row:hover { background: var(--bg-subtle); }
.ca-cell-toggle { width: 28px; text-align: center; }
.ca-caret { display: inline-block; transition: transform .15s; color: var(--text-3);
font-size: var(--fs-xs); }
.ca-caret-open { transform: rotate(90deg); }
.ca-detail-row > td { background: var(--bg-subtle); padding: 0; }
.ca-detail { padding: var(--sp-3) var(--sp-4) var(--sp-4) 40px; }
.ca-verdict-explain { display: flex; flex-wrap: wrap; gap: var(--sp-2); align-items: center;
margin-bottom: var(--sp-3); font-size: var(--fs-sm); }
.ca-children { margin: 0; background: var(--bg-surface); }
.ca-children th { font-size: var(--fs-xs); }
.ca-child-bad td { background: rgba(239,68,68,.05); }
.ca-child-odd td { background: rgba(245,158,11,.04); }
.ca-asin-link { color: var(--accent,#2563eb); text-decoration: underline; }
.ca-drift-tag { margin-left: var(--sp-1); }
/* ── Per-page help docs — topbar ℹ icon + doc panel (2026-06-24) ───────── */
.v3-help-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;
margin-right:8px;border:1px solid var(--border);border-radius:8px;background:var(--bg-surface);
color:var(--text-3);cursor:pointer;transition:all .15s;flex-shrink:0;}
.v3-help-btn:hover{color:var(--accent,#2563eb);border-color:var(--accent,#2563eb);background:var(--bg-subtle);}
.v3-help-btn svg{width:17px;height:17px;}
.pagedoc-meta{font-size:12px;color:var(--text-3);margin-bottom:10px;}
.pagedoc-body{font-size:13.5px;line-height:1.6;color:var(--text-1);}
.pagedoc-body h3{font-size:16px;font-weight:700;margin:16px 0 6px;}
.pagedoc-body h4{font-size:14px;font-weight:700;margin:14px 0 4px;color:var(--text-2);}
.pagedoc-body h5{font-size:13px;font-weight:600;margin:10px 0 4px;color:var(--text-2);}
.pagedoc-body p{margin:6px 0;}
.pagedoc-body ul,.pagedoc-body ol{margin:6px 0 6px 20px;}
.pagedoc-body li{margin:3px 0;}
.pagedoc-body code{background:var(--bg-subtle);padding:1px 5px;border-radius:4px;font-size:12px;
font-family:'JetBrains Mono',ui-monospace,monospace;}
.pagedoc-body a{color:var(--accent,#2563eb);text-decoration:underline;}
.pagedoc-empty{font-size:13px;color:var(--text-3);font-style:italic;padding:8px 0;}
.pagedoc-edit textarea{width:100%;min-height:280px;font-family:'JetBrains Mono',ui-monospace,monospace;
font-size:12.5px;line-height:1.5;padding:10px;border:1px solid var(--border);border-radius:8px;
background:var(--bg-surface);color:var(--text-1);resize:vertical;}
.pagedoc-edit input[type=text]{width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:8px;
background:var(--bg-surface);color:var(--text-1);margin-bottom:8px;font-size:13px;}
.pagedoc-hint{font-size:11px;color:var(--text-3);margin-top:6px;}
/* ── Idea tracker (💡) — 2026-06-24 ─────────────────────────────────────── */
.idea-stat-row{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 14px;}
.idea-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:var(--radius-pill);
border:1px solid var(--border);background:var(--bg-surface);color:var(--text-2);font-size:13px;
font-weight:500;cursor:pointer;text-decoration:none;transition:all .15s;}
.idea-chip:hover{border-color:var(--accent,#2563eb);}
.idea-chip.active{background:var(--accent,#2563eb);color:#fff;border-color:var(--accent,#2563eb);}
.idea-chip-n{font-size:11px;opacity:.8;background:rgba(0,0,0,.08);padding:0 6px;border-radius:var(--radius-card);}
.idea-chip.active .idea-chip-n{background:rgba(255,255,255,.25);}
.status-badge.idea-st-new{background:var(--accent-soft);color:var(--text-1);}
.status-badge.idea-st-in_progress{background:var(--warn-soft);color:var(--warn);}
.status-badge.idea-st-done{background:var(--success-soft);color:var(--success);}
.status-badge.idea-st-rejected{background:var(--surface-2);color:var(--text-3);}
.idea-detail .ko-card{margin-bottom:14px;}
.idea-head{display:flex;align-items:center;gap:12px;justify-content:space-between;}
.idea-h3{font-size:18px;font-weight:700;margin:0;color:var(--text-1);}
.idea-h4{font-size:14px;font-weight:700;margin:0 0 10px;color:var(--text-2);}
.idea-files{display:flex;flex-wrap:wrap;gap:10px;}
.idea-thumb img{max-width:180px;max-height:180px;border:1px solid var(--border);border-radius:var(--radius-input);object-fit:cover;}
.idea-fileitem{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border:1px solid var(--border);
border-radius:var(--radius-input);background:var(--bg-subtle);color:var(--text-1);text-decoration:none;font-size:13px;}
.idea-comment{padding:8px 0;border-bottom:1px solid var(--border);font-size:13.5px;line-height:1.5;}
.ko-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-card);padding:16px 18px;}
.idea-addcomment{margin-top:10px;}
.idea-comment-actions{margin-top:8px;}
.adsb-effect-head{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap}
.adsb-effect-head .adsb-hint{margin:0}
.adsb-period{display:flex;gap:var(--space-2);flex-wrap:wrap;margin-bottom:var(--space-3)}
/* ── ИИ-аудит рекламы Amazon — колонка «Действие» ── */
.aud-col-action { white-space: nowrap; }
.aud-action-cell { display: flex; flex-direction: column; gap: var(--space-1); align-items: flex-start; }
.aud-action-btns { display: flex; gap: var(--space-2); }
.aud-btn-sm { padding: var(--space-1) var(--space-2); font-size: var(--text-xs); }
.aud-action-by { font-size: var(--text-xs); }
.aud-row-done { opacity: .62; }
.aud-btn-push { background: var(--color-violet, #8b5cf6); border-color: var(--color-violet, #8b5cf6); }
.aud-budget-hint { font-variant-numeric: tabular-nums; opacity: .85; }
.aud-kw-action{display:flex;align-items:center;gap:var(--space-2);margin-top:var(--space-1);flex-wrap:wrap}
.aud-kw-msg{font-size:var(--text-xs)}
.aud-comp{margin-bottom:var(--space-1);padding-left:var(--space-2);border-left:2px solid var(--border)}
.aud-comp-line{font-size:var(--text-xs);margin-top:var(--space-px)}
/* ── Amazon.nl Launch Dashboard (/admin/nl-launch) ───────────────────────── */
.nll-scroll { overflow-x: auto; }
.nll-notdone-tbl td.text-muted { color: var(--color-text-muted); }
.nll-perpage { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-3) var(--space-4); }
/* Amazon dashboard — переключатель языковых маркетплейсов */
.amz-mp-switch { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-3); }
.nll-toolbar { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-3); flex-wrap: wrap; }
/* Amazon shipping templates page */
.shptpl-note { margin-bottom: var(--space-3); }
.shptpl-grp { margin-bottom: var(--space-4); }
.shptpl-scroll { overflow-x: auto; }
.shptpl-limit { padding: var(--space-4); }
.shptpl-tabs { margin-bottom: var(--space-3); }
.shptpl-act-desc { margin-bottom: var(--space-3); }
.shptpl-act-prefixes { margin-bottom: var(--space-3); display: flex; flex-wrap: wrap; gap: var(--space-1); }
.shptpl-act-btns { display: flex; flex-wrap: wrap; gap: var(--space-2); }
/* Флажок страны (inline SVG) — единый размер, рамка как у реальных флагов */
.flag-ico { width: 1.15em; height: 0.8em; vertical-align: -0.08em; border-radius: var(--radius-xs, 2px); box-shadow: 0 0 0 1px rgba(0,0,0,.12); display: inline-block; }
.flag-na { font-size: .7em; font-weight: 700; text-align: center; line-height: 1.1em; background: var(--color-border); color: var(--color-text-muted); }
.shptpl-zero td { opacity: .5; }
/* ── Рекатегоризация Amazon (/admin/category-audit) ── */
.ca-cell-pick{width:34px;text-align:center}
.ca-fix-bar{align-items:flex-end;gap:var(--space-3);flex-wrap:wrap}
.ca-fix-manual{max-width:170px}
.ca-fix-actions{display:flex;align-items:center;gap:var(--space-2)}
.ca-fix-queue{align-items:center;gap:var(--space-3);margin-top:var(--space-2)}
.chip.ca-staged{background:var(--color-good-bg,#dcfce7);color:var(--color-good-ink,#166534)}
tr.row-pick{cursor:pointer}
tr.row-sel>td{background:var(--color-accent-bg,#fff7ed)}
.ca-rank{font-weight:600;opacity:.7}
/* FBA plan wizard — stepbar + action grid */
.stepbar{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin:var(--sp-2) 0}
.step{display:flex;align-items:center;gap:var(--sp-1);padding:var(--sp-1) var(--sp-3);border-radius:var(--radius-badge);border:1px solid var(--border);font-size:var(--text-xs)}
.step-num{display:inline-flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;border-radius:var(--radius-circle);background:var(--bg-muted);font-weight:600}
.step-done{border-color:var(--good);color:var(--good)}
.step-done .step-num{background:var(--good);color:var(--bg-surface)}
.step-cur{border-color:var(--accent);color:var(--accent);font-weight:600}
.step-cur .step-num{background:var(--accent);color:var(--bg-surface)}
.step-todo{opacity:.55}
.act-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:var(--sp-3)}
.act-cell{border:1px solid var(--border);border-radius:var(--radius-card);padding:var(--sp-3);background:var(--bg-card)}
.act-h{display:flex;align-items:center;gap:var(--sp-2);margin-bottom:var(--sp-1)}
.act-ok{border-color:var(--good)}
.act-cur{border-color:var(--accent);box-shadow:0 0 0 var(--border-accent-w) var(--accent-soft)}
.act-off{opacity:.5}
.inp-sm{padding:var(--sp-1) var(--sp-2);border:1px solid var(--border);border-radius:var(--radius-input);background:var(--bg-input);font-size:var(--text-xs)}
/* FBA boxes — ручная сортировка между коробками */
.fba-box-items .col-grip{width:var(--sp-5,1.5rem)}
.fba-box-items .fba-drag{cursor:grab;text-align:center;color:var(--text-3);user-select:none}
.fba-box-items .fba-drag:active{cursor:grabbing}
.fba-box-items tr.sortable-ghost{opacity:.4;background:var(--accent-soft)}
.fba-box-items .inp-qty{width:var(--sp-9,4rem);text-align:right;padding:var(--sp-1) var(--sp-2);border:1px solid var(--border);border-radius:var(--radius-input);background:var(--bg-input)}
/* === PAGE: inventur_operator (Fase 1 2026-06-29) === */
.inv-qty-input{width:var(--sp-9,4rem);padding:var(--sp-1) var(--sp-2);border:1px solid var(--border);border-radius:var(--radius-input);background:var(--bg-input);font-size:var(--fs-sm)}
.inv-result{display:none;margin-left:var(--sp-2);font-size:var(--fs-sm);font-weight:600}
.inv-result.visible{display:inline}
.inv-barcode{font-family:monospace;font-size:var(--fs-xs,0.75rem);color:var(--text-3)}
.inv-row.inv-done{opacity:.45}
.inv-due-hint{font-size:var(--fs-sm);color:var(--text-3);margin-left:var(--sp-2)}
.inv-empty-cell{text-align:center;padding:var(--space-6);color:var(--text-3)}
/* ── Amazon Review — живой обзор листингов (2026-07-02) ───────────────── */
.amzrev-grid { display: grid; grid-template-columns: 340px 1fr; gap: var(--space-3); align-items: start; }
@media (max-width: 1000px) { .amzrev-grid { grid-template-columns: 1fr; } }
.amzrev-card { background: var(--bg-surface); border: 1px solid var(--border); border-radius: var(--radius-card); }
.amzrev-list { max-height: 74vh; overflow-y: auto; }
.amzrev-hd { padding: var(--space-2) var(--space-3); border-bottom: 1px solid var(--border);
color: var(--text-3); font-size: var(--fs-xs); text-transform: uppercase; }
.amzrev-tile { display: block; width: 100%; text-align: left; padding: var(--space-2) var(--space-3);
border: 0; border-bottom: 1px solid var(--border); background: transparent;
color: var(--text-1); cursor: pointer; }
.amzrev-tile:hover { background: var(--bg-page); }
.amzrev-tile.sel { background: var(--surface-2); }
.amzrev-tile .sku { font-family: ui-monospace, monospace; font-size: var(--fs-sm); font-weight: var(--fw-bold); }
.amzrev-tile .nm { font-size: var(--fs-xs); color: var(--text-3); white-space: nowrap;
overflow: hidden; text-overflow: ellipsis; }
.amzrev-detail { min-height: 320px; padding: var(--space-3); }
.amzrev-scroll-x { overflow-x: auto; }
.amzrev-tbl { width: 100%; border-collapse: collapse; font-size: var(--fs-xs); }
.amzrev-tbl th { text-align: left; color: var(--text-3); text-transform: uppercase;
padding: var(--space-1) var(--space-2); border-bottom: 1px solid var(--border);
position: sticky; top: 0; background: var(--bg-surface); white-space: nowrap; }
.amzrev-tbl td { padding: var(--space-1) var(--space-2); border-bottom: 1px solid var(--border); vertical-align: top; }
.amzrev-tbl tr.r-bad { background: var(--bad-bg); }
.amzrev-tbl tr.r-warn { background: var(--warn-bg); }
.amzrev-fbad { color: var(--bad); }
.amzrev-fwarn { color: var(--warn); }
.amzrev-summary { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin-bottom: var(--space-3); }
/* ── Разведка цен · price-scout (#374) ── */
.ps-input{display:flex;flex-direction:column;gap:var(--space-3)}
.ps-textarea{width:100%;resize:vertical;font-family:inherit;font-size:var(--fs-sm);padding:var(--space-3);border:var(--space-px) solid var(--surface-2);border-radius:var(--radius-input);background:var(--surface-1);color:var(--text-1)}
.ps-textarea:focus{outline:none;border-color:var(--good)}
.ps-actions{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap}
.ps-hint{font-size:var(--fs-xs);color:var(--text-3)}
.ps-hint.ps-err{color:var(--bad)}
.ps-hint.ps-mut{color:var(--text-4);margin-left:auto}
.ps-toolbar{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3)}
.ps-count{font-size:var(--fs-xs);color:var(--text-3)}
.ps-spacer{flex:1}
.ps-num{text-align:right;font-variant-numeric:tabular-nums}
.ps-mut{color:var(--text-4)}
.ps-empty{text-align:center;padding:var(--space-8) var(--space-4);color:var(--text-3)}
.ps-empty-icon{font-size:var(--fs-2xl);margin-bottom:var(--space-3)}
.ps-empty-title{font-size:var(--fs-lg);color:var(--text-2);margin-bottom:var(--space-1)}
.ps-empty-sub{font-size:var(--fs-xs);color:var(--text-4)}
/* ── Разведка цен · история/attach (#374 Ф2/Ф3) ── */
.ps-good{color:var(--good)}
.ps-mini{font-size:var(--fs-xs);padding:var(--space-1) var(--space-2)}
.ps-attach{display:inline-flex;align-items:center;gap:var(--space-1)}
.ps-sku-input{font-size:var(--fs-sm);padding:var(--space-1) var(--space-2);border:var(--space-px) solid var(--surface-2);border-radius:var(--radius-input);background:var(--surface-1);color:var(--text-1);width:8rem}
.ps-sku-input:focus{outline:none;border-color:var(--good)}
/* ── Разведка цен · Ф4 скан сайта (#377) ── */
.ps-domain-input{width:20rem;max-width:100%}
.ps-scan-progress{flex:1;display:flex;flex-direction:column;gap:var(--space-1)}
/* === PAGE: claude_inbox — центральный drag-drop инбокс для файлов Claude === */
.inbox-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(13rem,1fr));gap:var(--space-3)}
.inbox-card{border:var(--space-px) solid var(--surface-2);border-radius:var(--radius-card);background:var(--surface-1);overflow:hidden;display:flex;flex-direction:column}
.inbox-thumb{height:7rem;display:flex;align-items:center;justify-content:center;background:var(--surface-2);overflow:hidden}
.inbox-thumb img{width:100%;height:100%;object-fit:cover}
.inbox-ext{font-size:var(--fs-lg);font-weight:700;color:var(--text-3);letter-spacing:.05em}
.inbox-body{padding:var(--space-2) var(--space-3);display:flex;flex-direction:column;gap:var(--space-1);flex:1}
.inbox-name{font-size:var(--fs-sm);font-weight:600;color:var(--text-1);word-break:break-all}
.inbox-meta{font-size:var(--fs-xs);color:var(--text-3)}
.inbox-actions{display:flex;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-top:var(--space-px) solid var(--surface-2)}
.inbox-empty{padding:var(--space-6);text-align:center;color:var(--text-3)}
.inbox-progress{font-size:var(--fs-sm);color:var(--text-2);margin-top:var(--space-2);display:none}
.inbox-note-input{width:100%;margin-bottom:var(--space-3)}
.inbox-up{border:var(--space-px) solid var(--surface-2);border-radius:var(--radius-card);background:var(--surface-1);padding:var(--space-3);margin-bottom:var(--space-3)}
.inbox-up-head{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;margin-bottom:var(--space-2)}
.inbox-up-spacer{flex:1}
.inbox-id{font-family:'SFMono-Regular','Consolas',monospace;font-size:var(--fs-md);font-weight:700;color:var(--accent);letter-spacing:.05em;background:var(--surface-2);padding:var(--space-1) var(--space-2);border-radius:var(--radius-badge)}
.inbox-copy{cursor:pointer;border:none;background:transparent;font-size:var(--fs-md);padding:0 var(--space-1);line-height:1}
.inbox-note{font-size:var(--fs-sm);color:var(--text-2);margin-bottom:var(--space-2)}
.inbox-result{display:none;align-items:center;gap:var(--space-2);flex-wrap:wrap;margin-top:var(--space-3);padding:var(--space-2) var(--space-3);background:var(--good-bg);border-radius:var(--radius-card)}
.inbox-result-lbl{font-size:var(--fs-sm);color:var(--text-2)}
/* ── eBay Drafts (/admin/ebay-drafts) — page atoms ───────────────────────── */
.ebay-draft-thumb{width:96px;height:96px;object-fit:cover;border-radius:var(--radius-md);border:1px solid var(--border);}
.ebay-desc-frame{width:100%;height:70vh;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg-surface);}
/* ── eBay Carousel Manager (/admin/ebay-carousel) ──────────────────────────── */
.ebc-layout{display:flex;gap:var(--space-5);flex-wrap:wrap;align-items:flex-start;}
.ebc-designs{flex:0 0 260px;max-height:70vh;overflow-y:auto;border:1px solid var(--color-border);border-radius:var(--radius-md);}
.ebc-panel{flex:1;min-width:340px;}
.ebc-cards{display:flex;gap:var(--space-3);flex-wrap:wrap;}
.ebc-card{width:150px;border:1px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden;}
.ebc-card img{width:100%;height:150px;object-fit:cover;display:block;}
.ebc-card-body{padding:var(--space-2) var(--space-3);}
.ebc-card-title{font-size:11px;line-height:1.3;margin:var(--space-1) 0 var(--space-2);}
.ebc-card-actions{display:flex;gap:var(--space-2);align-items:center;}
.ebc-toolbar{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4);}
.ebc-repl{width:100%;margin-top:var(--space-2);font-size:11px;}
.ebc-add{display:flex;align-items:center;justify-content:center;background:var(--color-bg-subtle);}
.ebc-add-inner{padding:var(--space-3);width:100%;text-align:center;}
/* ── Foto-Etalon (/admin/photo-etalon) ─────────────────────────────────────── */
.pet-layout{display:flex;gap:var(--space-5);flex-wrap:wrap;align-items:flex-start;}
.pet-designs{flex:0 0 220px;max-height:75vh;overflow-y:auto;border:1px solid var(--color-border);border-radius:var(--radius-md);}
.pet-panel{flex:1;min-width:360px;}
.pet-group{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3);margin-bottom:var(--space-4);}
.pet-group-head{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;margin-bottom:var(--space-3);}
.pet-slots{display:flex;gap:var(--space-2);flex-wrap:wrap;}
.pet-slot{width:104px;}
.pet-slot img{width:104px;height:104px;object-fit:cover;border-radius:var(--radius-sm);border:1px solid var(--color-border);display:block;}
.pet-slot-pos{font-size:11px;font-weight:600;color:var(--color-text-muted);margin:var(--space-1) 0;}
.pet-slot-file{font-size:10px;width:100%;}
/* ── marketplace-attributes: редактор маппинга + справочник ограничений ── */
.mp-map-hint { margin: var(--space-2) 0 var(--space-3); }
.mp-attr-id { font-weight: var(--fw-semibold); color: var(--color-text); }
.mp-con-title { font-weight: var(--fw-semibold); color: var(--color-text); }
.mp-con-detail { max-width: 640px; white-space: normal; }
.mp-con-src { font-size: var(--fs-xs); }
.ql-title { font-size: 14px; font-weight: 600; color: var(--text-1); margin-bottom: 4px; }
.ql-sub { font-size: 12px; color: var(--text-3); }
/* ── Amazon Title-75 · Item Highlight · Backend (task #469, /admin/amazon-title75) ── */
.t75-intro { font-size: var(--fs-sm); margin-bottom: var(--space-3); }
.t75-filters { margin-top: var(--space-3); }
.t75-pager { margin-top: var(--space-3); align-items: center; }
.t75-sub { font-size: var(--fs-xs); }
.t75-num { font-variant-numeric: tabular-nums; text-align: right; }
.t75-old { max-width: 320px; color: var(--text-3); text-decoration: line-through; }
.t75-new { font-weight: var(--fw-semibold); max-width: 380px; }
.t75-be { max-width: 230px; font-size: var(--fs-xs); }
.t75-hl { max-width: 250px; }
.t75-act { white-space: nowrap; }
.t75-empty { text-align: center; padding: var(--space-6); }
.t75-hint { font-size: var(--fs-xs); }
.t75-field { margin-bottom: var(--space-3); }
.t75-modal { position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 200;
display: flex; align-items: center; justify-content: center; padding: var(--space-4); }
.t75-modal-box { background: var(--bg-surface); border: 1px solid var(--border-strong);
border-radius: var(--radius-card); box-shadow: var(--shadow-lg);
width: var(--modal-md-w); max-width: 100%; max-height: 85vh;
overflow-y: auto; padding: var(--space-4); }
.t75-modal-wide { width: min(1280px, 96vw); }
.t75-tabs { margin-bottom: var(--space-3); }
.t75-tplbox { margin-bottom: var(--space-3); }
.t75-famfoot { margin-top: var(--space-4); }
.t75-tpl { max-width: 320px; }
.t75-btns { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.t75-det > td { background: var(--bg); padding: var(--space-3) var(--space-4); }
.t75-detbar { align-items: center; margin-bottom: var(--space-2); }
.t75-act { white-space: nowrap; }
tr.row-open { background: var(--chip, var(--bg-surface)); }
/* ── Видеостена /cctv — 32 камеры Lupus (task #771) ── */
.cctv-bar { align-items: center; gap: var(--space-2); }
.cctv-select { min-width: 140px; }
.cctv-status { margin-left: auto; font-size: var(--fs-xs); color: var(--text-3);
white-space: nowrap; }
.cctv-grid { display: grid; gap: var(--space-3); margin-top: var(--space-3);
grid-template-columns: repeat(auto-fill, minmax(var(--cctv-tile-m), 1fr)); }
.cctv-grid.sz-s { grid-template-columns: repeat(auto-fill, minmax(var(--cctv-tile-s), 1fr)); }
.cctv-grid.sz-l { grid-template-columns: repeat(auto-fill, minmax(var(--cctv-tile-l), 1fr)); }
.cctv-grid:fullscreen { background: var(--bg-page); padding: var(--space-4);
overflow-y: auto; align-content: start; }
.cctv-tile { background: var(--bg-surface); border: 1px solid var(--border);
border-radius: var(--radius-card); overflow: hidden; cursor: pointer;
transition: box-shadow .15s, border-color .15s; }
.cctv-tile:hover { box-shadow: var(--shadow-md); border-color: var(--color-accent); }
.cctv-tile.is-off { border-color: var(--color-bad); }
.cctv-frame { position: relative; aspect-ratio: 16 / 9; background: var(--surface-2);
display: flex; align-items: center; justify-content: center; }
.cctv-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cctv-tile.is-off .cctv-img { opacity: .35; filter: grayscale(1); }
.cctv-ph { font-size: var(--fs-sm); color: var(--text-4); }
.cctv-dot { position: absolute; top: var(--space-2); right: var(--space-2);
width: var(--space-2); height: var(--space-2);
border-radius: var(--radius-circle); background: var(--color-neu);
box-shadow: var(--shadow-sm); }
.cctv-dot.on { background: var(--color-good); }
.cctv-dot.off { background: var(--color-bad); }
.cctv-dot.wait { background: var(--color-warn); }
.cctv-off { position: absolute; bottom: var(--space-2); left: var(--space-2);
padding: var(--space-px) var(--space-2); border-radius: var(--radius-badge);
background: var(--color-bad); color: var(--color-bg);
font-size: var(--fs-xs); font-weight: var(--fw-semibold); }
.cctv-cap { padding: var(--space-2) var(--space-3); }
.cctv-name { display: block; font-size: var(--fs-sm); font-weight: var(--fw-semibold);
color: var(--text-1); white-space: nowrap; overflow: hidden;
text-overflow: ellipsis; }
.cctv-meta { display: block; font-size: var(--fs-xs); color: var(--text-3);
white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cctv-lb { position: fixed; inset: 0; z-index: 200; background: rgba(0,0,0,.82);
display: flex; align-items: center; justify-content: center;
padding: var(--space-4); }
.cctv-lb-box { display: flex; flex-direction: column; gap: var(--space-2);
max-width: 96vw; max-height: 92vh; }
.cctv-lb-img { max-width: 100%; max-height: 84vh; object-fit: contain;
border-radius: var(--radius-card); background: var(--surface-2); }
.cctv-lb-cap { display: flex; align-items: center; justify-content: space-between;
gap: var(--space-4); color: var(--color-bg); font-size: var(--fs-md); }
/* ═══ /pim/matrix — категории, каналы, свежесть, ссылки (2026-09-14) ═══ */
.mx-bc-link { color: var(--text-3); }
/* Мультиселект каналов — форма вокруг details */
.mx-chan { margin-top: var(--space-3); }
.mx-cols-apply {
display: flex; align-items: center; gap: var(--space-3);
margin-top: var(--space-3); padding-top: var(--space-3);
border-top: 1px solid var(--border);
}
.mx-hint { font-size: var(--fs-xs); color: var(--text-4); }
/* Плитки категорий */
.mx-cats {
display: flex; flex-wrap: wrap; gap: var(--space-2);
margin-top: var(--space-3);
}
.mx-cat-chip {
display: inline-flex; align-items: center; gap: var(--space-2);
padding: var(--space-1) var(--space-3);
border: 1px solid var(--border); border-radius: var(--radius-pill);
background: var(--bg-surface); color: var(--text-2);
font-size: var(--fs-2sm); white-space: nowrap; text-decoration: none;
}
.mx-cat-chip:hover { border-color: var(--color-accent); color: var(--text-1); }
.mx-cat-chip.is-on {
border-color: var(--color-accent); color: var(--color-accent);
background: color-mix(in srgb, var(--color-accent) 10%, var(--bg-surface));
}
.mx-cat-n { font-size: var(--fs-xs); color: var(--text-4); font-weight: var(--fw-semibold); }
.mx-cat-chip.is-on .mx-cat-n { color: var(--color-accent); }
/* Полоса свежести данных по каналам */
.mx-fresh {
display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2);
margin-top: var(--space-3); font-size: var(--fs-xs); color: var(--text-3);
}
.mx-fresh-item {
display: inline-flex; align-items: center; gap: var(--space-1);
padding: 0 var(--space-2); border-radius: var(--radius-badge);
border: 1px solid var(--border); white-space: nowrap;
}
.mx-fresh-item.is-fresh { color: var(--color-good); border-color: color-mix(in srgb, var(--color-good) 40%, transparent); }
.mx-fresh-item.is-stale { color: var(--color-warn); border-color: color-mix(in srgb, var(--color-warn) 40%, transparent); }
.mx-fresh-item.is-old { color: var(--color-bad); border-color: color-mix(in srgb, var(--color-bad) 40%, transparent); }
.mx-fresh-item.is-none { color: var(--text-4); }
/* Колонка категории */
.mx-cat-head { min-width: 120px; }
.mx-cat-cell {
max-width: 150px; overflow: hidden; text-overflow: ellipsis;
white-space: nowrap; font-size: var(--fs-xs); color: var(--text-3);
padding: var(--space-2) var(--space-3);
}
/* Шапка SKU / короткий тайтл */
.mx-num-head { text-align: right; white-space: nowrap; }
.mx-sku-wrap { display: flex; align-items: center; gap: var(--space-2); }
.mx-title-short { color: var(--text-1); font-weight: var(--fw-medium); }
/* Ячейка-ссылка на живой листинг */
.mx-cell-link { text-decoration: none; cursor: pointer; }
.mx-cell-link:hover { outline: 1px solid currentColor; }
.mx-cell-search { opacity: .75; border-bottom: 1px dashed currentColor; }
/* Выбор числа строк + ручное обновление матрицы */
.mx-rows-form { display: inline-flex; align-items: center; gap: var(--space-2); }
.mx-rows-label { font-size: var(--fs-xs); color: var(--text-3); }
.mx-refresh-form { display: inline-flex; margin-left: var(--space-2); }
/* Пагинация матрицы */
.mx-pager {
display: flex; align-items: center; justify-content: space-between;
font-size: var(--fs-2sm); margin-top: var(--space-3);
}
.mx-pager-info { color: var(--text-3); }
.mx-pager-btns { display: flex; gap: var(--space-2); }
.mx-cat-sep { color: var(--text-4); }
.mx-cat-more { color: var(--text-4); font-weight: var(--fw-bold); }
.mx-cats-level { margin-top: var(--space-2); }