/* Кабинет: общий адаптив — @media/@container, перекрывающие несколько разделов. Грузится последним: в исходном cabinet.css эти блоки шли в хвосте своих зон. */

@layer pages {

    @media (max-width: 720px) {
        .cab-specs-main {
            padding: 10px;
        }

        .cab-prices-form__category-line {
            grid-template-columns: minmax(0, 1fr);
        }

        .cab-prices-form--spec-main .cab-prices-form__actions {
            justify-content: stretch;
        }

        .cab-prices-form--spec-main .cab-prices-form__actions .cab-btn {
            width: 100%;
            justify-content: center;
        }

        .cab-spec-row {
            grid-template-columns: minmax(0, 1fr) auto;
            align-items: start;
        }

        .cab-spec-label {
            grid-column: 1;
        }

        .cab-spec-value {
            grid-column: 1 / -1;
            grid-row: 2;
        }

        .cab-spec-actions {
            grid-column: 2;
            grid-row: 1;
        }

        .cab-spec-composite-row {
            grid-template-columns: 1fr;
        }

        .cab-spec-composite-label {
            min-height: 0;
            justify-content: flex-start;
        }

        .cab-spec-composite-label span {
            text-align: left;
        }
    }

    @media (max-width: 680px) {
        .cab-select-label {
            display: none;
        }

        .cab-topbar__actions {
            gap: 6px;
        }

        .cab-icon-btn {
            width: 38px;
            height: 38px;
        }

        .cab-section-head,
        .cab-active-card__head,
        .cab-panel__head {
            align-items: flex-start;
            flex-direction: column;
        }

        .cab-scoreboard,
        .cab-action-grid {
            grid-template-columns: 1fr;
        }

        .cab-score,
        .cab-action {
            border-right: 0;
            border-bottom: 1px solid var(--border);
        }

        .cab-score:last-child,
        .cab-action:last-child {
            border-bottom: 0;
        }

        .cab-card-summary {
            grid-template-columns: 1fr;
        }

        .cab-card-candidate-head,
        .cab-card-candidate,
        .cab-card-candidate-tools,
        .cab-card-create-field,
        .cab-card-create-ack,
        .cab-card-create-actions {
            align-items: stretch;
            flex-direction: column;
        }

        .cab-card-candidate-tools,
        .cab-card-candidate .cab-btn,
        .cab-card-create-actions .cab-btn {
            width: 100%;
        }

        .cab-card-panel,
        .cab-card-panel--open {
            inset: 10px;
            width: auto;
            height: auto;
            max-height: calc(100dvh - 20px);
        }

        .cab-card-panel {
            transform: translateY(12px) scale(.985);
        }

        .cab-card-panel--open {
            transform: translateY(0) scale(1);
        }

        .cab-card-create-field span {
            flex-basis: auto;
        }

        .cab-products-toolbar,
        .cab-products-actions,
        .cab-products-tools,
        .cab-products-pager {
            align-items: stretch;
            flex-direction: column;
        }

        .cab-section-picker,
        .cab-products-actions,
        .cab-products-actions .cab-btn,
        .cab-products-tools .cab-btn,
        .cab-products-pager .cab-btn,
        .cab-search-field {
            flex-basis: auto;
            width: 100%;
        }

        .cab-products-filters__view {
            margin-left: 0;
            width: 100%;
            justify-content: space-between;
        }

        .cab-login__panel,
        .cab-state__panel {
            gap: 16px;
            padding: 22px;
        }

        .cab-login h1,
        .cab-state h1 {
            font-size: 27px;
        }

        .cab-login__qr-code {
            width: 210px;
            height: 210px;
        }

        .cab-login__qr-code canvas,
        .cab-login__qr-code img,
        .cab-login__qr-code svg {
            width: 190px !important;
            height: 190px !important;
        }

        /* шапка «Мои товары»: заголовок и кебаб «…» в одну строку, кнопка компактная */
        .cab-products-panel .cab-panel__head {
            flex-direction: row;
            align-items: center;
        }

        .cab-products-actions {
            width: auto;
            flex: 0 0 auto;
        }

        .cab-products-actions .cab-btn--icon {
            width: 40px;
            flex: 0 0 auto;
        }

        /* sticky на ячейках не работает при border-collapse:collapse — на мобиле separate */
        .cab-products-table {
            border-collapse: separate;
            border-spacing: 0;
        }

        /* колонка «Товар» липнет слева — имя всегда видно, цены/статусы листаются */
        .cab-products-table th.cab-products__col-descr,
        .cab-products-table td.cab-products__col-descr {
            position: sticky;
            left: 0;
            z-index: 1;
            min-width: 150px;
            max-width: 58vw;
        }

        .cab-products-table th.cab-products__col-descr {
            z-index: 2;
            background: var(--card-muted);
        }

        .cab-products-table td.cab-products__col-descr {
            background: var(--card);
        }

        .cab-product-row:hover td.cab-products__col-descr {
            background: var(--card-muted);
        }

        /* подсветка состояния строки сохраняется на липкой ячейке (фон непрозрачный) */
        .cab-product-row--recent td.cab-products__col-descr {
            background-color: var(--card);
            background-image: linear-gradient(rgba(var(--accent-rgb), .14), rgba(var(--accent-rgb), .14));
        }
        .cab-product-row--edit td.cab-products__col-descr {
            background-color: var(--card);
            background-image: linear-gradient(rgba(var(--accent-rgb), .06), rgba(var(--accent-rgb), .06));
        }
        .cab-product-row--saved td.cab-products__col-descr {
            background-color: var(--card);
            background-image: linear-gradient(rgba(46, 160, 67, .22), rgba(46, 160, 67, .22));
        }
        .cab-product-row--error td.cab-products__col-descr {
            background-color: var(--card);
            background-image: linear-gradient(rgba(239, 68, 68, .22), rgba(239, 68, 68, .22));
        }

        /* проскроллено от начала → тень-разделитель показывает «колонка заморожена» */
        .cab-table-scroll.is-scrolled .cab-products-table .cab-products__col-descr {
            box-shadow: 7px 0 9px -7px rgba(0, 0, 0, .32);
        }

        /* есть ещё контент справа → фейд со стрелкой; в конце прокрутки гаснет */
        .cab-table-scroll__more {
            position: absolute;
            top: 1px;
            right: 1px;
            bottom: 1px;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            width: 40px;
            padding-right: 3px;
            pointer-events: none;
            opacity: 0;
            border-radius: 0 8px 8px 0;
            background: linear-gradient(to right, rgba(0, 0, 0, 0), var(--card) 72%);
            color: var(--accent);
            transition: opacity .16s ease;
        }

        .cab-table-scroll.has-overflow:not(.is-scroll-end) .cab-table-scroll__more {
            opacity: 1;
        }

        .cab-table-scroll__more .material-symbols-rounded {
            font-size: 22px;
            animation: cab-table-nudge 1.1s ease-in-out infinite;
        }

        @keyframes cab-table-nudge {
            0%, 100% { transform: translateX(0); }
            50% { transform: translateX(3px); }
        }
    }

    @media (prefers-reduced-motion: reduce) {
        .cab-sidebar,
        .cab-backdrop,
        .cab-login-bg::before,
        .cab-login-bg::after,
        .cab-login__details,
        .cab-login__details-inner,
        .cab-login__guide--changed,
        .cab-login__waiting-dots i,
        .cab-login__sms-targets:not([hidden]),
        .cab-login__qr-link:not([hidden]),
        .cab-login__remind:not([hidden]),
        .cab-login__code:not([hidden]),
        .cab-table-scroll__more .material-symbols-rounded,
        html.cab-fonts-pending .cab-body::before {
            transition: none;
            animation: none;
        }
    }
}

@media (prefers-reduced-motion: reduce) {
    .cab-loader__spinner { animation-duration: 1.4s; }
    .cab-orders-table.is-fresh { animation: none; }
}