/* Подсветка открываемых элементов (summary в details) при наведении */
details > summary {
    list-style: none;
    cursor: pointer;
    transition: background 0.2s;
    border-radius: 4px;
    padding: 2px 6px;
}
details > summary:hover, details[open] > summary {
    background: #eaf6ff;
    color: #003366;
}
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap');
body {
    font-family: 'Inter', Arial, sans-serif;
    margin: 0;
}
/* Стилизация стрелки (треугольника) у summary */
details > summary {
    position: relative;
    cursor: pointer;
    transition: background 0.2s;
    border-radius: 4px;
    padding: 2px 6px 2px 22px;
    font-weight: 600;
    font-size: 1.0em;
}
details > summary::marker,
details > summary::-webkit-details-marker {
    display: none;
}
details > summary::before {
    content: '';
    position: absolute;
    left: 6px;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
    border-style: solid;
    border-width: 7px 5px 0 5px;
    border-color: #263d45 transparent transparent transparent;
    transition: transform 0.2s;
}
details[open] > summary::before {
    transform: translateY(-50%) rotate(180deg);
    border-width: 0 5px 7px 5px;
    border-color: transparent transparent #263d45 transparent;
}
.container {
    width: 100vw;
    max-width: 100vw;
    margin: 0;
    padding: 0 0 40px 0;
}
pre { background: #f4f4f4; padding: 15px; border-radius: 6px; overflow-x: auto; }
.error { color: red; font-weight: bold; }
a { display: inline-block; margin-top: 20px; }
table {
    border-collapse: collapse;
    width: 100%;
    max-width: 100%;
    min-width: 1200px;
    margin: 20px 0;
    border: 1px solid #eff8ff !important;
    background: #eff8ff;
    box-shadow: 0 2px 8px rgba(0,120,255,0.04);
    overflow-x: auto;
}
th, td {
    border: 1px solid #fff;
    padding: 8px 12px;
    text-align: left;
}
th {
    background: #eff8ff;
    font-weight: bold;
}
tr:nth-child(even) {
    background: #eff8ff;
}
tr:hover {
    background: #eff8ff;
}

.delimetr {
    background: #fff !important;
    border: 1px solid #fff !important;
    padding: 0 !important;
    height: 18px;

}

/* Таблица ежедневной финансовой сводки */
.financial-table {
    width: 100%;
    max-width: 100%;
    min-width: 0; /* перекрываем min-width: 1200px у общего table */
    border-collapse: collapse;
    margin: 10px 0 16px 0;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 2px 8px rgba(15,23,42,0.04);
    font-size: 13px;
}

.financial-table th,
.financial-table td {
    padding: 6px 10px;
    border: 1px solid #e5e7eb;
    text-align: left;
    white-space: normal; /* позволяем переносить подписи колонок и значения */
}

.financial-table th {
    background: #f3f4f6;
    font-weight: 600;
    color: #111827;
}

.financial-table tr:nth-child(even) {
    background: #f9fafb;
}

.financial-table tr:hover {
    background: #eaf6ff;
}

.financial-table th.num,
.financial-table td.num {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* заголовки могут переноситься, чтобы не растягивать колонку */
.financial-table th.num {
    white-space: normal;
}

/* Выделение для колонки "Итого к выплате" */
.financial-table th[style*="background:#ffe9b3"] {
    background: #fefaec !important;
    color: #263d45 !important;
    font-weight: 700 !important;
}
.financial-table td[style*="background:#fff7db"] {
    background: #fefaec !important;
    color: #263d45 !important;
    font-weight: 700 !important;
}

/* значения держим в одной строке, чтобы ширина бралась от чисел */
.financial-table td.num {
    white-space: nowrap;
}

/* контейнер с ежедневной сводкой не должен раздвигать сетку */
#financial-summary {
    overflow-x: auto;
}



.goods-window {
    background: #fff !important;
    border: 1px solid #eaf6ff !important;
    padding: 0 !important;
    height: 18px;
}

/* Стили для таблицы goods в светло-голубых тонах */
.goods-table {
    background: #fff;
    border: 1px solid #e0e0e0;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
.goods-table th {
    background: #f7f7f7;
    color: #003366;
    font-weight: bold;
    white-space: nowrap;
}
.goods-table td {
    color: #222;
    font-size: 13px;
}
.goods-table tr:nth-child(even) {
    background: #f3f4f6;
}
.goods-table tr:hover {
    background: #eaf6ff !important;
}

/* Кнопки сортировки в заголовках */
.goods-table .sort-btn {
    background: transparent;
    border: none;
    padding: 2px 6px;
    font: inherit;
    color: inherit;
    cursor: pointer;
}

.goods-table th.sorted-asc .sort-btn::after {
    content: " \25B2"; /* ▲ */
    font-size: 0.8em;
}

.goods-table th.sorted-desc .sort-btn::after {
    content: " \25BC"; /* ▼ */
    font-size: 0.8em;
}

/* Выравнивание числовых столбцов */
.goods-table th.num,
.goods-table td.num {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* Текстовые колонки */
.goods-table td.text-cell {
    white-space: nowrap;
}

/* Баркод компактнее и моноширинный */
.goods-table th.barcode-col,
.goods-table td.barcode-cell {
    font-family: "Consolas", "SF Mono", monospace;
    white-space: nowrap;
}

/* Макет главной страницы аналитики WB */
.wb-main-grid {
    display: grid;
    /* minmax(0, ...) позволяет колонкам сжиматься и не выталкивать соседние блоки */
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
    gap: 32px;
    align-items: flex-start;
    min-height: 60vh;
}
.wb-main-left {
    display: block;
    min-width: 0; /* разрешаем контенту внутри сжиматься по ширине */
}
.wb-main-right {
    display: block;
    min-width: 0;
    /* Сделать правую колонку единым карточным контейнером (как левый блок) */
    background: #ffffff;
    border-radius: 12px;
    padding: 16px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 2px 8px rgba(15,23,42,0.04);
    height: fit-content;
}

/* Вкладки компаний/группы на странице WB */
#company-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
    flex-wrap: wrap;
}

.company-tab {
    border: 1px solid #e5e7eb;
    background: #f3f4f6;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 12px;
    cursor: pointer;
}

.company-tab.active {
    background: #eaf6ff;
    border-color: #4f8cff;
    color: #003366;
}

/* Вкладки компаний на странице аналитики WB */
#company-tabs {
    margin-bottom: 8px;
}

.company-tab {
    display: inline-block;
    margin-right: 6px;
    margin-bottom: 4px;
    padding: 4px 10px;
    font-size: 13px;
    border-radius: 999px;
    border: 1px solid #d1e5ff;
    background: #f5f9ff;
    color: #1f2937;
    cursor: pointer;
}

.company-tab.active {
    background: #2563eb;
    color: #ffffff;
    border-color: #2563eb;
}
.api-block {
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 4px 16px rgba(15,23,42,0.08);
    padding: 18px 18px 14px 18px;
    margin-bottom: 24px;
    transition: box-shadow 0.2s;
    border: 1px solid #eaf6ff;
    position: relative;
}
.api-block-header {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 5px;
}
.api-block-icon {
    font-size: 1.5em;
    background: #eaf6ff;
    border-radius: 50%;
    padding: 6px;
    box-shadow: 0 2px 8px rgba(0,120,255,0.08);
}
.api-block-title {
    font-size: 1.08em;
    font-weight: 600;
    color: #003366;
    letter-spacing: 0.01em;
}
.api-block-today-card {
    border-left: 4px solid #4f8cff;
}
.api-block-yesterday-card {
    border-left: 4px solid #7dcf7d;
}

/* Если .api-block находится внутри правой колонки, делаем его частью единого контейнера
   — убираем тяжёлые тени и границы, чтобы блоки выглядели как секции внутри карточки */
.wb-main-right .api-block {
    background: transparent;
    border-radius: 8px;
    box-shadow: none;
    padding: 10px 8px;
    margin-bottom: 12px;
    border: none;
}

.wb-main-right .api-block-header {
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1px solid #f3f4f6;
}

/* Объединённый блок аналитики с двумя колонками */
.analytics-unified-block {
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
    margin: 0;
    border: none;
}

/* Стили для графиков финансовых показателей */
.financial-charts {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 2px solid #e5e7eb;
}

.charts-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.chart-container {
    background: #f8fafc;
    border-radius: 8px;
    padding: 12px;
    border: 1px solid #e5e7eb;
    min-height: 250px;
}

.chart-container canvas {
    max-height: 230px;
}

.analytics-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

@media (max-width: 1024px) {
    .analytics-columns {
        grid-template-columns: 1fr;
    }
}

.analytics-column {
    background: transparent;
    border-radius: 8px;
    padding: 0;
}

.analytics-column-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 2px solid #f3f4f6;
}

.analytics-today .analytics-column-header {
    border-bottom-color: #4f8cff;
}

.analytics-yesterday .analytics-column-header {
    border-bottom-color: #7dcf7d;
}

.analytics-column-title {
    font-size: 0.95em;
    font-weight: 600;
    color: #334155;
    letter-spacing: 0.01em;
}

.reports-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.reports-list li {
    padding: 8px 0;
    border-bottom: 1px solid #e5e7eb;
    font-size: 15px;
}
.reports-list li:last-child {
    border-bottom: none;
}

/* Компактная таблица для блока API на главной WB */
.api-table {
    width: 100%;
    min-width: 0;
    border-collapse: separate;
    border-spacing: 0 4px;
    background: #f7fbff;
    font-size: 13px;
    table-layout: fixed;
    margin-top: 2px;
    margin-bottom: 2px;
}

.api-table tr {
    border-bottom: none;
    border-radius: 8px;
    background: #f7fbff;
    box-shadow: 0 1px 4px rgba(0,120,255,0.04);
}

.api-table tr:last-child {
    border-bottom: none;
}


.api-table th,
.api-table td {
    display: block;
    padding: 2px 10px;
    border: none;
    word-break: break-word;
    border-radius: 6px;
}

/* Для ячеек с названием (светлый цвет) */
.api-table .api-label {
    color: #7a8ca3;
    font-weight: 500;
    font-size: 12px;
    margin-right: 2px;
}
/* Для значений (тёмный цвет) */
.api-table .api-value {
    color: #1a2332;
    font-weight: 600;
    font-size: 14px;
}

.api-table th {
    font-weight: 600;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #6b7280;
}

.api-table td {
    font-weight: 600;
    font-size: 13px;
    color: #111827;
}

/* глушим глобальные полоски и наведение для таблиц внутри api-block */