/* Страница настроек A (new/settings_main.php, new/js/settings.js) и общая шапка вкладок. Классы — с префиксом osa-,
   разделы настроек — под .osa: Materialize и вкладки «Дашборд», «Печать этикеток», «Отзывы», «Остатки» не задеваются.
   Фрейм страницы приложения — 1078×658 с прокруткой внутри (ТЗ, «Где живёт страница»): шапка и навигация прилипают. */

/* Прилипание работает, только если выше нет overflow: hidden (main.css ставит его .wrapper и .section) */
.wrapper, .wrapper .section { overflow: visible; overflow-x: clip; }
.wrapper .section { padding: 16px 0 88px; }
body.osa-nosave .wrapper .section { padding-bottom: 0; } /* на вкладках без «Сохранить» панели внизу нет */
.wrapper .container.m { width: 100%; max-width: none; padding: 0 24px; margin: 0; }

/* ---- общее ---- */
.osa-pill { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px; border-radius: 12px; font: 600 12px/1 Roboto, Inter, system-ui, sans-serif; letter-spacing: 0; white-space: nowrap; }
.osa-pill.osa-ok { background: #E7F6EE; color: #0E5C33; }
.osa-pill.osa-warn { background: #FFF3DC; color: #7A4200; }
.osa-pill.osa-bad { background: #FDECEA; color: #9B1C12; }
.osa-pill.osa-muted { background: #EEF1F4; color: #2E3742; }
.osa-status:empty { display: none; }
.osa-status::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: currentColor; opacity: .8; }
.osa-status.osa-ok::before { background: #1A9F55; opacity: 1; }

.osa-switch { position: relative; display: inline-block; flex: none; width: 40px; height: 24px; margin: 2px 0 0; cursor: pointer; }
.osa-switch input[type=checkbox] { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.osa-switch .lever { position: absolute; inset: 0; border-radius: 12px; background: #B7C1CC; transition: background .15s; }
.osa-switch .lever::after { content: ''; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: left .15s; box-shadow: 0 1px 2px rgba(0, 0, 0, .15); }
.osa-switch input:checked + .lever { background: #0050E0; }
.osa-switch input:checked + .lever::after { left: 19px; }
.osa-switch input:focus-visible + .lever { box-shadow: 0 0 0 3px rgba(0, 80, 224, .25); }
.osa-switch input:disabled + .lever { opacity: .5; cursor: default; }

.osa-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 36px; padding: 0 14px; border-radius: 9px; border: 1px solid transparent;
    font: 600 14px/1 Roboto, Inter, system-ui, sans-serif; letter-spacing: 0; text-transform: none; cursor: pointer; text-decoration: none; white-space: nowrap; box-shadow: none; }
.osa-btn:disabled { opacity: .55; cursor: default; }
.osa-btn-primary, .osa-btn-primary:focus { background: #0050E0; color: #fff; }
.osa-btn-primary:hover:not(:disabled) { background: #003DB0; color: #fff; }
.osa-btn-ghost, .osa-btn-ghost:focus { background: #fff; color: #1B1F24; border-color: #D5DBE2; }
.osa-btn-ghost:hover:not(:disabled) { background: #F3F5F7; color: #1B1F24; }
.osa-btn-text, .osa-btn-text:focus { background: none; color: #0050E0; padding: 0 8px; }
.osa-btn-text:hover:not(:disabled) { background: #EEF4FF; color: #003DB0; }
.osa-btn-danger, .osa-btn-danger:focus { color: #B42318; }
.osa-btn-sm { min-height: 30px; padding: 0 10px; font-size: 13px; }
.osa-btn:focus-visible { outline: 2px solid rgba(0, 80, 224, .35); outline-offset: 1px; }
.osa-btn .material-icons { font-size: 18px; }

/* ---- шапка ---- */
.osa-top { position: sticky; top: 0; z-index: 30; background: #fff; border-bottom: 1px solid #E3E7EC; padding: 0 24px;
    font-family: Roboto, Inter, system-ui, sans-serif; color: #1B1F24; }
.osa-top-title { display: none; padding-top: 16px; font-size: 20px; font-weight: 700; }
body.osa-slider .osa-top-title { display: block; }
.osa-top-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.osa-top .settings-tabs { display: flex; gap: 2px; margin: 0; border: 0; overflow-x: auto; scrollbar-width: none; min-width: 0; }
.osa-top .settings-tabs::-webkit-scrollbar { display: none; }
.osa-top .settings-tab-btn { white-space: nowrap; border: 0; border-bottom: 2px solid transparent; background: none; padding: 13px 12px 12px; margin: 0;
    font: 500 14px/1.2 Roboto, Inter, system-ui, sans-serif; letter-spacing: 0; color: #4F5966; cursor: pointer; }
.osa-top .settings-tab-btn:hover { color: #1B1F24; }
.osa-top .settings-tab-btn:focus { background: none; outline: none; }
.osa-top .settings-tab-btn:focus-visible { box-shadow: inset 0 0 0 2px rgba(0, 80, 224, .3); }
.osa-top .settings-tab-btn.active { color: #0050E0; font-weight: 600; border-bottom-color: #0050E0; }
.osa-top-right { display: flex; align-items: center; gap: 10px; flex: none; }
.osa-top-right .osa-switch { margin: 0; }

/* ---- нижняя панель «Сохранить» ---- */
.osa-savebar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; display: flex; align-items: center; justify-content: flex-end; gap: 14px;
    padding: 10px 24px; margin: 0; background: #fff; border-top: 1px solid #E3E7EC; box-shadow: 0 -4px 14px rgba(20, 30, 45, .06);
    font: 14px/1.4 Roboto, Inter, system-ui, sans-serif; color: #4F5966; text-align: left; }
.osa-savebar .osa-save-hint { flex: 1; min-width: 0; text-align: right; }
.osa-savebar .osa-save-hint.osa-dirty { color: #7A4200; font-weight: 600; }
.osa-savebar .osa-save-hint.osa-saved { color: #127A43; font-weight: 600; }
.osa-savebar .osa-save-hint.osa-required { color: #B42318; font-weight: 600; }
.osa-savebar .save-error { flex: 1; min-width: 0; text-align: right; color: #B42318; font-weight: 600; }
.osa-savebar .osa-btn { min-width: 128px; }
.osa-savebar .success-form { font-size: 18px; }

/* ---- раскладка вкладки «Настройки» ---- */
.osa { font: 14px/1.45 Roboto, Inter, system-ui, sans-serif; letter-spacing: 0; color: #1B1F24; -webkit-font-smoothing: antialiased; }
.osa *, .osa *::before, .osa *::after { box-sizing: border-box; }
.osa a { color: #0050E0; text-decoration: none; }
.osa a:hover { color: #003DB0; text-decoration: underline; }
.osa p { margin: 0; }
.osa h2 { margin: 0; font-size: 17px; font-weight: 700; line-height: 1.3; }
.osa label { font-size: inherit; color: inherit; }
.osa code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; background: #F3F5F7; padding: 2px 6px; border-radius: 6px; word-break: break-all; }
.osa .input-field { margin: 0; position: static; }
.osa [hidden] { display: none !important; }

.osa-layout { display: flex; gap: 24px; align-items: flex-start; }
.osa-nav { flex: none; width: 180px; position: sticky; top: calc(var(--osa-top, 49px) + 16px); display: flex; flex-direction: column; gap: 1px; }
.osa .osa-nav a { display: block; padding: 7px 10px; border-radius: 8px; color: #2E3742; font-size: 14px; font-weight: 500; }
.osa .osa-nav a:hover, .osa .osa-nav a.osa-current { background: #EEF1F4; color: #1B1F24; text-decoration: none; }
.osa-nav-links { margin-top: 12px; padding: 12px 10px 0; border-top: 1px solid #E3E7EC; display: flex; flex-direction: column; gap: 6px; }
.osa .osa-nav .osa-nav-links a { padding: 0; font-size: 13px; color: #0050E0; background: none; }
.osa-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 14px; }

.osa-card { border: 1px solid #E3E7EC; border-radius: 14px; padding: 20px 22px; display: flex; flex-direction: column; gap: 16px; background: #fff;
    scroll-margin-top: calc(var(--osa-top, 49px) + 12px); }
.osa-card[style*="display: block"] > * + * { margin-top: 16px; } /* блок пользователя Б24 показывает чужой скрипт через display:block */
.osa-lead { margin-top: 4px !important; color: #4F5966; }
.osa-hint { font-size: 13px; color: #5B6572; line-height: 1.45; }
.osa-right { text-align: right; }
.osa-nowrap { white-space: nowrap; }
.osa-grow { flex: 1 1 300px; min-width: 0; }
.osa-w420 { max-width: 420px; }
.osa-box { padding: 10px 12px; border-radius: 10px; background: #F6F8FA; color: #2E3742; }
.osa-bad-text { color: #9B1C12; }
.osa-small-link { font-size: 13px; }

.osa-notice { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; padding: 12px 16px; border-radius: 12px; font-size: 14px; line-height: 1.45; }
.osa-notice.osa-warn { background: #FFF3DC; color: #5C3300; }
.osa-notice.osa-bad { background: #FDECEA; color: #7A1A10; }
.osa-notice.osa-info { background: #EEF4FF; color: #0B2F73; }
.osa-notice-text { flex: 1 1 320px; min-width: 0; }

.osa-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.osa-field > label { font-size: 13px; font-weight: 600; color: #2E3742; }
.osa-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.osa select.osa-select, .osa input.osa-input { display: block; height: 38px; width: 100%; margin: 0; padding: 0 10px; border: 1px solid #C9D2DD; border-radius: 8px;
    background: #fff; font: 400 14px Roboto, Inter, system-ui, sans-serif; color: #1B1F24; box-shadow: none; outline: none; }
.osa select.osa-select:focus, .osa input.osa-input:focus { border-color: #0050E0; box-shadow: 0 0 0 3px rgba(0, 80, 224, .12); }
.osa input.osa-input:invalid { border-color: #D93025; }
.osa select.osa-select.osa-empty { border-color: #D93025; color: #9B1C12; background: #FFF7F6; }

.osa-rows { display: flex; flex-direction: column; }
.osa-row { display: flex; gap: 16px; align-items: flex-start; justify-content: space-between; padding: 12px 0; border-top: 1px solid #EEF1F4; }
.osa-rows > .osa-row:first-child { border-top: 0; padding-top: 0; }
.osa-row.osa-wrap { flex-wrap: wrap; }
.osa-row-t { font-weight: 600; font-size: 15px; }
.osa-sub { flex: 1 1 100%; padding: 12px 14px; border-radius: 10px; background: #F6F8FA; }

.osa table.osa-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.osa table.osa-table tr { border: 0; }
.osa table.osa-table th { text-align: left; font-size: 12px; font-weight: 600; color: #5B6572; padding: 0 10px 8px; text-transform: uppercase; letter-spacing: .03em; border-radius: 0; }
.osa table.osa-table td { padding: 8px 10px; border-top: 1px solid #EEF1F4; vertical-align: middle; border-radius: 0; }
.osa table.osa-table th:first-child, .osa table.osa-table td:first-child { padding-left: 0; }
.osa table.osa-table th:last-child, .osa table.osa-table td:last-child { padding-right: 0; }
.osa-w36 { width: 36%; }
.osa-w32 { width: 32%; }
.osa-tag { display: inline-block; padding: 1px 7px; border-radius: 6px; background: #E6F0FF; color: #0040B8; font-size: 12px; font-weight: 600; vertical-align: 1px; }
.osa-tag.osa-tag-grey { background: #EEF1F4; color: #2E3742; }
.osa-dir-in { font-size: 13px; color: #4F5966; }
.osa-dir-out { display: inline-block; font-size: 13px; font-weight: 600; color: #0040B8; background: #E6F0FF; padding: 3px 8px; border-radius: 6px; }
.osa-stages.osa-b24-off .osa-dir-out { color: #6B7580; background: #EEF1F4; text-decoration: line-through; }
.osa-dir-off { font-size: 12px; color: #6B7580; margin-left: 6px; }
.osa-empty-note { padding: 10px 14px; border-radius: 10px; background: #FDECEA; color: #7A1A10; line-height: 1.5; }

/* кабинеты */
.osa-cabinets td { padding-top: 10px; padding-bottom: 10px; }
.osa-cab-name { font-weight: 600; }
.osa-mask { white-space: nowrap; }
.osa-cab-actions { text-align: right; white-space: nowrap; }
.osa input.osa-input-name { height: 32px; max-width: 280px; }
.osa-editor-slot:empty { display: none; }
.osa-cab-add { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.osa-editor { display: flex; flex-direction: column; gap: 12px; padding: 14px 16px; border-radius: 12px; background: #F6F8FA; border: 1px solid #E3E7EC; }
.osa-editor-title { font-weight: 600; font-size: 15px; }
.osa-editor-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .8fr) minmax(0, 1.4fr); gap: 12px; }
.osa-editor-msg { padding: 10px 12px; border-radius: 10px; line-height: 1.45; }
.osa-editor-msg.osa-ok { background: #E7F6EE; color: #0E5C33; }
.osa-editor-msg.osa-warn { background: #FFF3DC; color: #5C3300; }
.osa-editor-msg.osa-bad { background: #FDECEA; color: #7A1A10; }
.osa-editor-msg ul { margin: 6px 0 0 18px; padding: 0; }
.osa-editor-msg li { list-style: disc; }
.osa-btns { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }

/* расписание */
.osa-schedule .osa-interval { width: 230px; white-space: nowrap; }
.osa-iv { display: flex; align-items: center; gap: 8px; }
.osa-iv .input-field { width: 84px; flex: none; }
.osa input.osa-num { width: 64px; flex: none; text-align: center; -moz-appearance: textfield; }
.osa-schedule td:last-child { width: 170px; }
.osa .next-exchange-alert { margin-top: -4px; }

/* уведомления */
.osa-steps { display: flex; flex-direction: column; gap: 8px; padding: 14px; border-radius: 10px; background: #F6F8FA; line-height: 1.6; }
.osa-copy-line { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }

/* функции модуля */
.osa-fgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.osa-fcard { border: 1px solid #E3E7EC; border-radius: 12px; padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.osa-fcard.osa-wide { grid-column: 1 / -1; }
.osa-fhead { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.osa-ft { font-size: 15px; font-weight: 600; margin-bottom: 3px; }
.osa-fsub { padding-top: 10px; border-top: 1px solid #EEF1F4; align-items: center; }
.osa-fsub .osa-hint { color: #2E3742; }
.osa-placements-note.osa-bad-text { color: #9B1C12; }
.osa-chats .alert { margin: 0; box-shadow: none; border: 0; background: #F6F8FA; padding: 12px 14px; }
.osa-chats .alert p { margin: 0 0 6px; }
/* Кнопки Materialize внутри страницы (блок чатов OzonChats::settingsBlock): правило ссылок .osa a перекрашивало текст в синий */
.osa a.btn, .osa a.btn:hover, .osa a.btn:focus { color: #fff; text-decoration: none; background: #0050E0; box-shadow: none; border-radius: 9px;
    text-transform: none; font-weight: 600; letter-spacing: 0; }
.osa a.btn:hover { background: #003DB0; }
.osa-b24-line { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; justify-content: space-between; }
#b24-user-text { font-weight: 500; }

/* узкий фрейм: навигация — полосой над разделами */
@media (max-width: 900px) {
    .osa-layout { flex-direction: column; gap: 12px; }
    .osa-nav { position: sticky; top: var(--osa-top, 49px); z-index: 5; width: 100%; flex-direction: row; overflow-x: auto; background: #fff; padding: 6px 0; scrollbar-width: none; }
    .osa-nav::-webkit-scrollbar { display: none; }
    .osa .osa-nav a { white-space: nowrap; }
    .osa-nav-links { display: none; }
    .osa-card { scroll-margin-top: calc(var(--osa-top, 49px) + 56px); }
    .osa-editor-fields, .osa-grid2, .osa-fgrid { grid-template-columns: minmax(0, 1fr); }
    .osa-top-right .osa-status { max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
}
@media (max-width: 600px) {
    .wrapper .container.m, .osa-top, .osa-savebar { padding-left: 12px; padding-right: 12px; }
    .osa-card { padding: 16px; }
    .osa table.osa-stages th:last-child, .osa table.osa-stages td:last-child { display: none; }
    .osa-cabinets thead { display: none; }
}

/* ---- вкладки «Дашборд» и «Печать этикеток» по макету A (.ot; разметка — new/index.php, поведение — dashboard.js, labels.js) ---- */
.ot { font: 14px/1.45 Roboto, Inter, system-ui, sans-serif; letter-spacing: 0; color: #1B1F24; display: flex; flex-direction: column; gap: 14px; }
.ot[style*="display: none"] { display: none !important; }
.ot *, .ot *::before, .ot *::after { box-sizing: border-box; }
.ot a { color: #0050E0; text-decoration: none; }
.ot a:hover { color: #003DB0; text-decoration: underline; }
.ot p { margin: 0; }
.ot h2 { margin: 0; font-size: 16px; font-weight: 700; line-height: 1.3; }
.ot-hint { font-size: 13px; color: #5B6572; line-height: 1.45; }
.ot-filters { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.ot-filters > b { font-size: 14px; font-weight: 600; }
.ot input.ot-in, .ot select.ot-in { height: 38px; width: auto; margin: 0; padding: 0 12px; border: 1px solid #C9D2DD; border-radius: 8px; background: #fff;
    font: 400 14px Roboto, Inter, system-ui, sans-serif; color: #1B1F24; box-shadow: none; outline: none; }
.ot input.ot-in:focus, .ot select.ot-in:focus { border-color: #0050E0; box-shadow: 0 0 0 3px rgba(0, 80, 224, .12); }
.ot select.ot-in { min-width: 190px; }
.ot-seg { display: inline-flex; border: 1px solid #D5DBE2; border-radius: 9px; overflow: hidden; }
.ot-seg button { border: 0; border-left: 1px solid #D5DBE2; background: #fff; padding: 0 12px; height: 36px; font: 600 13px Roboto, Inter, system-ui, sans-serif; color: #2E3742; cursor: pointer; }
.ot-seg button:first-child { border-left: 0; }
.ot-seg button:focus { background: #fff; outline: none; }
.ot-seg button.active, .ot-seg button.active:focus { background: #E6F0FF; color: #0040B8; }
.ot-card { border: 1px solid #E3E7EC; border-radius: 14px; padding: 18px 20px; display: flex; flex-direction: column; gap: 12px; min-width: 0; background: #fff; scroll-margin-top: calc(var(--osa-top, 49px) + 12px); }
.ot-card[style*="display: none"] { display: none !important; }
.ot-card-flush { padding: 6px 0 0; }
.ot-card-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.ot-card-tools { display: flex; gap: 10px; align-items: center; }
.ot-card-tools select.ot-in { min-width: 200px; height: 36px; margin: 0; }
.ot-hint:empty, .ot-result:empty { display: none; }
.ot-result p { margin: 0 0 4px; }
.ot-result ul { margin: 4px 0 8px 18px; padding: 0; }
.ot-result li { list-style: disc; color: #5B6572; }
.ot-table-wrap { overflow-x: auto; }
.ot table.ot-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.ot table.ot-table tr, .ot table.ot-table tr:hover { border: 0; background: none; }
.ot table.ot-table th { text-align: left; font-size: 12px; font-weight: 600; color: #5B6572; padding: 0 10px 8px; text-transform: uppercase; letter-spacing: .03em; white-space: nowrap; border: 0; border-radius: 0; width: auto; }
.ot table.ot-table td { padding: 9px 10px; border: 0; border-top: 1px solid #EEF1F4; border-radius: 0; vertical-align: middle; width: auto; }
.ot-card-flush table.ot-table th:first-child, .ot-card-flush table.ot-table td:first-child { padding-left: 20px; }
.ot-card-flush table.ot-table th:last-child, .ot-card-flush table.ot-table td:last-child { padding-right: 20px; }
.ot .ot-check { width: 36px; }
.ot input.ot-cb { position: static; opacity: 1; pointer-events: auto; width: 16px; height: 16px; margin: 0; vertical-align: middle; accent-color: #0050E0; cursor: pointer; }
.ot .ot-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ot .ot-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; white-space: nowrap; }
.ot .ot-nowrap { white-space: nowrap; }
.ot .ot-red { color: #B42318; font-weight: 600; }
.ot .ot-orange { color: #9A4A00; font-weight: 600; }
.ot .ot-tag { margin-left: 6px; font-family: Roboto, Inter, system-ui, sans-serif; }
.ot .osa-pill.ot-pill-info { background: #E6F0FF; color: #0040B8; }
.ot-empty { color: #127A43; }
.ot-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; }
.ot-kpis[style*="display: none"] { display: none !important; }
.ot-kpi { border: 1px solid #E3E7EC; border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 3px; background: #fff; color: #1B1F24; }
.ot a.ot-kpi, .ot a.ot-kpi:hover { color: #1B1F24; text-decoration: none; cursor: pointer; }
.ot-kpi-l { font-size: 13px; font-weight: 500; color: #2E3742; }
.ot-kpi-v { font-size: 24px; font-weight: 700; line-height: 1.15; font-variant-numeric: tabular-nums; }
.ot-kpi.warn .ot-kpi-v { color: #9A4A00; }
.ot-kpi.good .ot-kpi-v { color: #127A43; }
.ot-kpi.bad { border-color: #F2B8B5; background: #FFF8F7; }
.ot-kpi.bad .ot-kpi-v { color: #B42318; }
.ot-kpi.bad .ot-hint { color: #7A1A10; }
.ot .ozon-reviews-notice { margin: 0; border-left: 0; border-radius: 12px; background: #EEF4FF; color: #14305C; padding: 12px 16px; }
.ot .ozon-reviews-notice li { color: #3D4752; }
/* Панель «Отмечено N из M» прилипает к низу фрейма, пока виден список */
.ot-bar { position: sticky; bottom: 0; z-index: 5; display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap;
    margin: 0 -24px; padding: 10px 24px; background: #fff; border-top: 1px solid #E3E7EC; box-shadow: 0 -4px 14px rgba(20, 30, 45, .06); }
@media (max-width: 600px) { .ot-bar { margin: 0 -12px; padding: 10px 12px; } }

/* ---- «Отзывы» и «Остатки» по макету A: разметку и строки таблиц рисуют reviews.js и stocks.js своими классами,
   здесь — только их вид. Селекторы с id вкладки: встроенные стили new/index.php (ozon-reviews-*, ozon-stocks-*) идут позже. ---- */
.ot-spacer { flex: 1; }
.ot-note { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; padding: 10px 14px; border-radius: 12px; background: #EEF4FF; color: #14305C; line-height: 1.45; }
.ot-note > span { flex: 1 1 320px; }
#ozon-reviews .ot-filters, #ozon-stocks .ot-filters { margin: 0; }
#ozon-reviews .instruction-link, #ozon-stocks .instruction-link { display: inline-flex; align-items: center; height: 32px; margin: 0; padding: 0 12px; border-radius: 16px;
    border: 1px solid #D5DBE2; background: #fff; color: #2E3742; font: 600 13px Roboto, Inter, system-ui, sans-serif; letter-spacing: 0; text-decoration: none; cursor: pointer; }
#ozon-reviews .instruction-link:hover, #ozon-stocks .instruction-link:hover { background: #F3F5F7; }
#ozon-reviews .instruction-link:focus, #ozon-stocks .instruction-link:focus { outline: none; }
#ozon-reviews .instruction-link.active, #ozon-stocks .instruction-link.active { background: #0050E0; border-color: #0050E0; color: #fff; }
#ozon-reviews select.ot-in, #ozon-stocks select.ot-in { min-width: 180px; height: 36px; border-radius: 8px; border-color: #C9D2DD; }
#ozon-stocks input.ozon-stocks-search { width: 260px; height: 36px; border-radius: 8px; border-color: #C9D2DD; }
#ozon-stocks .osa-btn .material-icons { font-size: 18px; }
/* Кнопки, которые рисуют скрипты вкладок (Materialize .btn): вид кнопок страницы A */
#ozon-reviews .btn, #ozon-stocks .btn { height: auto; min-height: 34px; line-height: 1; padding: 0 14px; border-radius: 9px; box-shadow: none; text-transform: none;
    font: 600 13px Roboto, Inter, system-ui, sans-serif; letter-spacing: 0; background: #0050E0; color: #fff; display: inline-flex; align-items: center; }
#ozon-reviews .btn:hover, #ozon-stocks .btn:hover { background: #003DB0; box-shadow: none; }
#ozon-reviews .btn.grey, #ozon-stocks .btn.grey { background: #fff !important; color: #1B1F24; border: 1px solid #D5DBE2; }
#ozon-reviews .btn.grey:hover, #ozon-stocks .btn.grey:hover { background: #F3F5F7 !important; }
#ozon-reviews .btn:focus, #ozon-stocks .btn:focus { outline: 2px solid rgba(0, 80, 224, .3); }
/* Таблицы — как на «Дашборде» */
#ozon-reviews table.ozon-reviews-table th, #ozon-stocks table.ozon-stocks-table th { font-size: 12px; font-weight: 600; color: #5B6572; text-transform: uppercase; letter-spacing: .03em; border: 0; padding: 0 10px 8px; }
#ozon-reviews table.ozon-reviews-table td, #ozon-stocks table.ozon-stocks-table td { border: 0; border-top: 1px solid #EEF1F4; padding: 10px; }
#ozon-reviews .ot-card-flush table th:first-child, #ozon-reviews .ot-card-flush table td:first-child,
#ozon-stocks .ot-card-flush table th:first-child, #ozon-stocks .ot-card-flush table td:first-child { padding-left: 18px; }
#ozon-reviews .ot-card-flush table th:last-child, #ozon-reviews .ot-card-flush table td:last-child,
#ozon-stocks .ot-card-flush table th:last-child, #ozon-stocks .ot-card-flush table td:last-child { padding-right: 18px; }
#ozon-reviews table tr:hover, #ozon-stocks table tr:hover { background: none; }
#ozon-reviews .ozon-reviews-table tr.ozon-review-reply td { background: #F6F8FA; }
#ozon-reviews .ozon-review-reply textarea.ozon-review-answer { border-color: #C9D2DD; border-radius: 10px; }
#ozon-reviews .ozon-review-reply textarea.ozon-review-answer:focus { border-color: #0050E0; box-shadow: 0 0 0 3px rgba(0, 80, 224, .12); }
#ozon-reviews .ozon-review-stars.bad { color: #B42318; } #ozon-reviews .ozon-review-stars.mid { color: #9A4A00; } #ozon-reviews .ozon-review-stars.good { color: #127A43; }
#ozon-reviews .ozon-review-stars .off { color: #D5DBE2; }
#ozon-reviews .ozon-review-age.late { color: #B42318; }
#ozon-reviews .ozon-review-link { color: #0050E0; }
#ozon-reviews a, #ozon-stocks a { color: #0050E0; }
#ozon-reviews .status-badge { display: inline-flex; align-items: center; height: 24px; padding: 0 9px; border-radius: 12px; border: 0; font: 600 12px Roboto, Inter, system-ui, sans-serif; }
#ozon-reviews .status-badge.status-done { background: #E7F6EE; color: #0E5C33; }
#ozon-reviews .status-badge.status-wait { background: #E6F0FF; color: #0040B8; }
#ozon-reviews .status-badge.status-bad { background: #FDECEA; color: #9B1C12; }
#ozon-reviews .alert, #ozon-stocks .alert { margin: 0; box-shadow: none; border: 0; border-radius: 12px; background: #FFF3DC; color: #4D2B00; padding: 12px 16px; }
/* Карточки остатков — как карточки «Дашборда»; по ним фильтруют, поэтому — кнопки */
#ozon-stocks .ozon-stocks-cards { margin: 0; gap: 10px; }
#ozon-stocks .ozon-stocks-card { border: 1px solid #E3E7EC; border-radius: 12px; padding: 12px 14px; background: #fff; gap: 3px; }
#ozon-stocks .ozon-stocks-card:hover { border-color: #9DB8E8; }
#ozon-stocks .ozon-stocks-card.active { border-color: #0050E0; box-shadow: 0 0 0 1px #0050E0 inset; }
#ozon-stocks .ozon-stocks-card-label { font-size: 13px; font-weight: 500; color: #2E3742; }
#ozon-stocks .ozon-stocks-card-value { font-size: 24px; font-weight: 700; line-height: 1.15; color: #1B1F24; }
#ozon-stocks .ozon-stocks-card.good .ozon-stocks-card-value { color: #127A43; }
#ozon-stocks .ozon-stocks-card.bad .ozon-stocks-card-value { color: #B42318; }
#ozon-stocks .ozon-stocks-card.warn .ozon-stocks-card-value { color: #9A4A00; }
#ozon-stocks .ozon-stocks-card-hint { font-size: 12px; color: #5B6572; }
#ozon-stocks .ozon-stocks-row.open, #ozon-stocks .ozon-stocks-row.open:hover { background: #F2F6FF; }
#ozon-stocks .ozon-stocks-detail-row td { background: #F6F8FA; }
#ozon-stocks .ozon-stocks-sort.active { color: #0050E0; }
#ozon-stocks .ozon-stocks-grade { border: 0; border-radius: 12px; padding: 2px 8px; }
#ozon-stocks .ozon-stocks-grade.good { background: #E7F6EE; color: #0E5C33; }
#ozon-stocks .ozon-stocks-grade.bad { background: #FDECEA; color: #9B1C12; }
#ozon-stocks .ozon-stocks-grade.warn { background: #FFF3DC; color: #7A4200; }
#ozon-stocks .ozon-stocks-qty.zero, #ozon-stocks .ozon-stocks-days.bad { color: #B42318; }
#ozon-stocks .ozon-stocks-days.warn, #ozon-stocks .ozon-stocks-status { color: #9A4A00; }
#ozon-reviews td.ozon-review-act .btn:not(.grey) { background: #fff; color: #1B1F24; border: 1px solid #D5DBE2; }
#ozon-reviews td.ozon-review-act .btn:not(.grey):hover { background: #F3F5F7; }
#ozon-stocks .ozon-stocks-cards { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
#ozon-stocks table.ozon-stocks-table th.num, #ozon-stocks .ozon-stocks-mini th.num { text-align: right; }

/* ---- вкладка «История работы» по макету A (#ozon-history; разметка — new/index.php, поведение — new/js/history.js) ---- */
.oh-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.ot button.oh-chip { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border-radius: 16px; border: 1px solid #D5DBE2; background: #fff;
    font: 600 13px Roboto, Inter, system-ui, sans-serif; color: #2E3742; white-space: nowrap; cursor: pointer; }
.ot button.oh-chip:hover { background: #F3F5F7; }
.ot button.oh-chip:focus { outline: none; }
.ot button.oh-chip:focus-visible { box-shadow: 0 0 0 3px rgba(0, 80, 224, .25); }
.ot button.oh-chip.on, .ot button.oh-chip.on:hover { background: #0050E0; border-color: #0050E0; color: #fff; }
.oh-chip b { font-weight: 700; opacity: .75; }
.oh-chip b:empty { display: none; }
.oh-card { gap: 0; }
.oh-day { padding: 10px 20px 6px; font-size: 12px; font-weight: 600; color: #5B6572; text-transform: uppercase; letter-spacing: .04em; border-top: 1px solid #EEF1F4; }
#ozon-history-list > .oh-day:first-child { border-top: 0; }
.oh-row { display: grid; grid-template-columns: 52px 140px minmax(0, 1fr); gap: 14px; padding: 10px 20px; border-top: 1px solid #EEF1F4; align-items: start; font-size: 14px; }
.oh-row-err { background: #FFF8F7; }
.oh-time { color: #6B7580; font-variant-numeric: tabular-nums; line-height: 24px; }
.oh-text { line-height: 1.5; padding-top: 2px; overflow-wrap: anywhere; }
.oh-text .ot-hint { margin-top: 2px; }
.ot .osa-pill.oh-info { background: #E6F0FF; color: #0040B8; }
.ot a.oh-link { font-size: 13px; }
.oh-foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 20px; border-top: 1px solid #EEF1F4; }
#ozon-history-status:empty { display: none; }
@media (max-width: 600px) {
    .oh-row { grid-template-columns: 44px minmax(0, 1fr); padding: 10px 12px; }
    .oh-row > span:nth-child(2) { grid-column: 2; }
    .oh-row > .oh-text { grid-column: 2; }
    .oh-day, .oh-foot { padding-left: 12px; padding-right: 12px; }
}