/* Compact order chrome; kept separate from the published catalogue styles. */
.catalog-order-header { padding-left: 72px; padding-right: 72px; }
.catalog-order-controls { top: 14px; right: 14px; }
.catalog-order-controls .catalog-order-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    min-height: 44px;
    padding: 0;
    border: 1px solid #e8ebf1;
    border-radius: 50%;
    background: #f3f5f8;
    color: #687384;
    transition: background .15s, border-color .15s, color .15s;
}
.catalog-order-controls .catalog-order-close:hover {
    border-color: #c9d7ff;
    background: #eaf0ff;
    color: #1b5cff;
}
.catalog-order-controls .catalog-order-close:active { background: #dce6ff; }
.catalog-order-close-icon { position: relative; width: 18px; height: 18px; pointer-events: none; }
.catalog-order-close-icon::before,
.catalog-order-close-icon::after {
    content: "";
    position: absolute;
    left: 8px;
    top: 0;
    width: 2px;
    height: 18px;
    border-radius: 2px;
    background: currentColor;
    transform: rotate(45deg);
}
.catalog-order-close-icon::after { transform: rotate(-45deg); }
@media (max-width: 600px), (max-height: 500px) and (max-width: 960px) {
    .catalog-order-dialog {
        width: calc(100vw - 24px);
        height: min(600px, calc(100vh - 48px));
        height: min(600px, calc(100dvh - 48px));
        max-height: calc(100vh - 48px);
        max-height: calc(100dvh - 48px);
        border-radius: 18px;
    }
    .catalog-order-header { min-height: 52px; padding: 8px 60px; }
    .catalog-order-header h2 { font-size: 17px; line-height: 1.4; }
    .catalog-order-controls { top: 4px; right: 8px; }
    .catalog-order-controls .catalog-order-close {
        border-color: transparent;
        background: radial-gradient(circle, #f0f3f8 0 17px, transparent 18px);
    }
    .catalog-order-controls .catalog-order-close:hover,
    .catalog-order-controls .catalog-order-close:active {
        background: radial-gradient(circle, #e3ebff 0 17px, transparent 18px);
    }
    .catalog-order-status { padding: 12px 16px; font-size: 14px; }
}
@media (max-height: 500px) and (max-width: 960px) {
    .catalog-order-dialog {
        height: calc(100vh - 24px);
        height: calc(100dvh - 24px);
        max-height: calc(100vh - 24px);
        max-height: calc(100dvh - 24px);
    }
}
@media (prefers-reduced-motion: reduce) {
    .catalog-order-controls .catalog-order-close { transition: none; }
}