/* Expanded runtime CSS entrypoint. Keep this file import-free for WebView route transitions. */

@media (max-width: 1180px) {
  .customer-cabinet-page-shell main[data-cab="order"] .response-workspace { width: 100%; min-width: 0; overflow-x: clip; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-workspace .resp-head { grid-template-columns: minmax(0, 1fr); width: 100%; min-width: 0; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; width: 100%; min-width: 0; box-sizing: border-box; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-filter-trigger,
  .customer-cabinet-page-shell main[data-cab="order"] .response-number-filter input { width: 100%; min-width: 0; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-workspace .resp-tools { align-items: stretch; }
  .customer-cabinet-page-shell main[data-cab="order"] .resp-sort-options { width: 100%; overflow-x: auto; }
  .customer-cabinet-page-shell main[data-cab="order"] .view-toggle { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; }
  .customer-cabinet-page-shell main[data-cab="order"] .view-toggle [data-slot="button"] { min-width: 0; padding-inline: 8px; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-compact-row { grid-template-columns: minmax(0, 1fr) auto; gap: 10px 14px; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-compact-row > :nth-child(n+3):not(.response-row-actions) { grid-column: 1; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-compact-row .response-row-actions { grid-column: 2; grid-row: 1 / span 3; align-self: center; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-table-shell [data-slot="table-container"] { overflow: visible; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-data-table,
  .customer-cabinet-page-shell main[data-cab="order"] .response-data-table tbody { display: block; width: 100%; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-data-table thead { display: none; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-data-table tr { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px 12px; width: 100%; padding: 14px; border-bottom: 1px solid var(--border); }
  .customer-cabinet-page-shell main[data-cab="order"] .response-data-table td { display: block; min-width: 0; padding: 0; border: 0; white-space: normal; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-data-table td::before { content: none; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-data-table td:not(.response-select-column) { grid-column: 2; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-data-table .response-select-column { grid-column: 1; grid-row: 1 / span 6; width: 22px; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-data-table .c-act { margin: 0; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-data-table .response-row-actions { justify-content: flex-start; flex-wrap: wrap; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-table-tools { align-items: flex-start; }
}
@media (max-width: 560px) {
  .customer-cabinet-page-shell main[data-cab="order"] .response-filters { grid-template-columns: minmax(0, 1fr); }
  .customer-cabinet-page-shell main[data-cab="order"] .response-tabs [role="tab"] { padding-inline: 10px; }
  .customer-cabinet-page-shell main[data-cab="order"] .view-toggle [data-slot="button"] { font-size: 12px; gap: 4px; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-table-tools { flex-direction: column; }
  .customer-cabinet-page-shell main[data-cab="order"] .response-columns > div { right: auto; left: 0; }
}

/* customer-cabinet-mobile/01-customer-cabinet-mobile.css */
/* Customer cabinet responsive owner. */

.customer-mobile-appbar,
.customer-mobile-tabbar,
.customer-mobile-fab {
  display: none;
}

/* customer cabinet mobile density source */


/* customer-cabinet-mobile/02-customer-cabinet-mobile.css */
@media (max-width: 1180px) {
.customer-cabinet-page-shell {
    --cab-mobile-header: 60px;
    --cab-mobile-nav: 81px;
    --cab-card-padding: 16px;
    /*
     * Nothing, on purpose: the gutter is the page container's own 16px, the same one the
     * performer's cabinet and every public page have.
     *
     * This was 12px ADDED to those 16 -- the `.wrap` rule below zeroes the container's padding
     * with `!important` and still loses to the shared sheet's heavier one -- so every
     * customer screen sat 28px from the edge, 12px a side narrower than the screen next to it.
     */
    --cab-screen-gutter: 0px;
    --cab-title-size: 22px;
    /*
     * What sits ABOVE the cabinet's appbar, which is the site's own phone header -- not the
     * appbar's height, which is `--cab-mobile-header` and a different number.
     *
     * These were the same value, so the appbar stuck 47px too high and slid under the header, and
     * the tab strip below it went with it: the profile heading disappeared behind the tabs. The
     * header has been two rows since July (48px of controls, a 10px gap, a 36px city row, 12px of
     * padding and its border) and the 60px was written a week after that, never measured.
     *
     * It is stated rather than measured because nothing here measures: `--sb-chrome-header-height`
     * is a constant too. A guard pins this against the header's own rules so the two move together.
     */
    --sb-mobile-header: 107px;
    /*
     * What the site header holds right now, for the bars that stick under it.
     *
     * The header slides away while the reader scrolls down, and `--sb-mobile-header` above is its
     * height at rest: a bar stuck at that figure stayed 107px down an empty strip with the page
     * showing through above it. The header publishes its measured height -- zero once hidden --
     * and the stated one is only the value before that script has run.
     */
    --cab-site-header-now: var(--sb-public-mobile-header-offset, var(--sb-mobile-header));
    --sb-mobile-nav: var(--cab-mobile-nav);
    background: var(--background);
    overflow-x: hidden;
  }

.customer-cabinet-page-shell .sb-header,
  .customer-cabinet-page-shell .sb-mobile-bottom-nav,
  .customer-cabinet-page-shell .cab-nav,
  .customer-cabinet-page-shell .phead,
  .customer-cabinet-page-shell .osum {
    display: none !important;
  }

.customer-cabinet-page-shell .sb-mobile-appbar,
  .customer-cabinet-page-shell .customer-mobile-appbar {
    position: sticky;
    top: 0;
    /* Under 50, where the kit's dialogs live. At 60-70 the cabinet's own bars sat on top of any
       dialog opened from the cabinet: the availability dialog's "Сохранить" was behind the tab bar. */
    z-index: 40;
    display: flex;
    min-height: calc(var(--cab-mobile-header) + env(safe-area-inset-top, 0px));
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: calc(6px + env(safe-area-inset-top, 0px)) 14px 6px;
    border-bottom: 1px solid var(--border);
    /* Solid: a title bar, not glass. At 96% the row scrolling under it read through the title. */
    background: var(--background);
  }

.customer-cabinet-page-shell .sb-mobile-appbar__main {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 6px;
  }

.customer-cabinet-page-shell .sb-mobile-appbar__title,
  .customer-cabinet-page-shell .customer-mobile-appbar__title {
    min-width: 0;
    overflow: hidden;
    color: var(--foreground);
    font-size: var(--cab-title-size);
    font-weight: 700;
    line-height: 1.05;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

.customer-cabinet-page-shell .sb-mobile-appbar__back,
  .customer-cabinet-page-shell .sb-mobile-iconbtn,
  .customer-cabinet-page-shell .customer-mobile-iconbtn {
    display: grid;
    width: 40px;
    height: 40px;
    flex: none;
    place-items: center;
    border: none;
    border-radius: 999px;
    background: transparent;
    color: var(--foreground);
    text-decoration: none;
  }

.customer-cabinet-page-shell .sb-mobile-appbar__back svg,
  .customer-cabinet-page-shell .sb-mobile-iconbtn svg,
  .customer-cabinet-page-shell .sb-mobile-iconbtn i,
  .customer-cabinet-page-shell .customer-mobile-iconbtn svg,
  .customer-cabinet-page-shell .customer-mobile-iconbtn i {
    width: 23px;
    height: 23px;
  }

.customer-cabinet-page-shell .wrap {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-inline: calc(50% - 50vw) !important;
    overflow-x: hidden;
    padding-inline: 0 !important;
  }

.customer-cabinet-page-shell .layout {
    display: block;
    width: 100vw;
    max-width: 100vw;
    overflow-x: hidden;
    padding: 0 0 calc(var(--cab-mobile-nav) + 18px + env(safe-area-inset-bottom, 0px));
  }

.customer-cabinet-page-shell .customer-desktop-nav,
  body.sb .customer-cabinet-page-shell .customer-desktop-nav,
  body.sb .customer-cabinet-page-shell .cab-nav,
  .customer-cabinet-page-shell .cab-nav {
    display: none !important;
  }

.customer-cabinet-page-shell .wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
  }

.customer-cabinet-page-shell .layout {
    width: 100%;
    max-width: 100%;
  }

.customer-cabinet-page-shell .layout[data-active-screen="notifications"] {
    height: calc(100svh - var(--cab-mobile-header) - env(safe-area-inset-top, 0px));
    min-height: 0;
    overflow: hidden;
    padding-bottom: 0;
    background: var(--card);
  }

/* The messages screen is fixed under the header and fills the phone: the page behind it has
   nothing to scroll to. Left scrollable, a swipe took the header away and left its band empty. */
  html:has(.customer-cabinet-page-shell .layout[data-active-screen="messages"]) { overflow: hidden; }

.customer-cabinet-page-shell .layout[data-active-screen="messages"] {
    position: fixed;
    top: calc(var(--cab-mobile-header) + env(safe-area-inset-top, 0px));
    right: 0;
    bottom: calc(var(--cab-mobile-nav) + env(safe-area-inset-bottom, 0px));
    left: 0;
    height: auto;
    min-height: 0;
    overflow: hidden;
    padding-bottom: 0;
    background: var(--card);
  }

.customer-cabinet-page-shell main {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    gap: 0;
    min-width: 0;
    overflow-x: hidden;
    padding: 0;
  }

.customer-cabinet-page-shell main:not([data-cab="orders"]) {
    gap: 0;
    padding: 0 var(--cab-screen-gutter);
  }

.customer-cabinet-page-shell main[data-cab="order"] {
    gap: 18px;
    padding: 16px var(--cab-screen-gutter) 12px;
  }

.customer-cabinet-page-shell .ordlist {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px var(--cab-screen-gutter) 12px;
  }

.customer-cabinet-page-shell .ordcard {
    display: flex;
    width: 100%;
    max-width: 100%;
    min-height: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    padding: var(--cab-card-padding);
    border: 1px solid #dedede;
    border-radius: 16px;
    background: var(--card);
    box-shadow: none;
  }

.customer-cabinet-page-shell .ordcard.has-new,
  .customer-cabinet-page-shell .ordcard.is-draft {
    padding-left: var(--cab-card-padding);
    border-style: solid;
    background: var(--card);
  }

.customer-cabinet-page-shell .ord-newdot,
  .customer-cabinet-page-shell .ord-kebab-wrap,
  .customer-cabinet-page-shell .cab-pagination,
  .customer-cabinet-page-shell .ord-cta {
    display: none !important;
  }

.customer-cabinet-page-shell .ord-main {
    gap: 10px;
  }

.customer-cabinet-page-shell .ord-badges {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    margin: 0;
  }
}


/* customer-cabinet-mobile/03-customer-cabinet-mobile.css */
@media (max-width: 1180px) {
.customer-cabinet-page-shell .ord-badges .sb-badge {
    width: max-content;
    max-width: 100%;
    height: 26px;
    padding: 0 10px;
    border: none;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 800;
  }

.customer-cabinet-page-shell .ord-badges .sb-badge svg,
  .customer-cabinet-page-shell .ord-badges .sb-badge i {
    width: 16px;
    height: 16px;
  }

.customer-cabinet-page-shell .ord-badges .sb-badge {
    grid-column: 1;
  }

/* The row holds two columns and may hold three children: a second badge used to push the date
   onto a line of its own. The date keeps the first line's right corner; badges stack beside it. */
.customer-cabinet-page-shell .ord-posted {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    color: var(--foreground);
    font-size: 15px;
    line-height: 26px;
    white-space: nowrap;
  }

.customer-cabinet-page-shell .ordcard h3 {
    margin: 0;
    color: var(--foreground);
    font-size: 22px;
    font-weight: 800;
    line-height: 1.14;
  }

.customer-cabinet-page-shell .ord-meta {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    color: var(--foreground);
    font-size: 15px;
  }

.customer-cabinet-page-shell .ord-meta .m {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    min-width: 0;
    max-width: 100%;
    line-height: 1.25;
    white-space: normal;
    overflow-wrap: anywhere;
  }

.customer-cabinet-page-shell .ordcard.is-empty .ord-meta .m {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    overflow-wrap: normal;
    word-break: normal;
  }

.customer-cabinet-page-shell .ord-meta .m svg,
  .customer-cabinet-page-shell .ord-meta .m i {
    width: 20px;
    height: 20px;
    flex: none;
  }

.customer-cabinet-page-shell .ord-meta .m:has(svg[data-lucide="ruler"]) {
    display: none;
  }

.customer-cabinet-page-shell .ord-meta .m:has(svg[data-lucide="wallet"]) {
    display: block;
    grid-column: auto;
    align-items: start;
    padding-top: 12px;
    border-top: 1px solid var(--border);
    color: var(--foreground);
    font-size: 14px;
  }

.customer-cabinet-page-shell .ord-meta .m:has(svg[data-lucide="wallet"])::before {
    display: block;
    margin-bottom: 3px;
    color: var(--foreground);
    content: "Бюджет";
    font-size: 13px;
    font-weight: 500;
  }

.customer-cabinet-page-shell .ord-meta .m:has(svg[data-lucide="wallet"]) svg,
  .customer-cabinet-page-shell .ord-meta .m:has(svg[data-lucide="wallet"]) i {
    display: none;
  }

.customer-cabinet-page-shell .ord-meta .m:has(svg[data-lucide="wallet"]) b {
    display: block;
    margin-top: 4px;
    color: var(--foreground);
    font-size: 22px;
    font-weight: 800;
    line-height: 1.1;
  }

.customer-cabinet-page-shell .ord-right {
    min-width: 0;
    align-items: stretch;
    gap: 10px;
  }

.customer-cabinet-page-shell .ord-cta {
    align-items: stretch;
    width: 100%;
  }

.customer-cabinet-page-shell .ord-resp {
    justify-content: flex-end;
    gap: 8px;
    margin-top: 0;
  }

.customer-cabinet-page-shell .resp-stack .ravt {
    width: 32px;
    height: 32px;
    margin-left: -9px;
    border-width: 2px;
    font-size: 11px;
  }

.customer-cabinet-page-shell .ord-resp .rtext,
  .customer-cabinet-page-shell .ord-resp .rtext .new {
    font-size: 15px;
  }

.customer-cabinet-page-shell main[data-cab] .ord-resp,
  .customer-cabinet-page-shell main[data-cab] .ord-resp .rtext {
    width: 100%;
    min-width: 0;
    justify-content: flex-start;
    white-space: normal;
    overflow-wrap: anywhere;
  }

.customer-cabinet-page-shell .ord-resp .rtext b {
    font-size: 17px;
  }

.customer-cabinet-page-shell .ord-hired {
    align-self: flex-end;
    margin-top: 0;
    border: none;
    padding: 0;
    background: transparent;
    font-size: 15px;
  }

.customer-cabinet-page-shell .ord-hired .hav {
    width: 34px;
    height: 34px;
    font-size: 12px;
  }

.customer-cabinet-page-shell .customer-mobile-tabbar {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 45;
    display: grid;
    grid-template-columns: repeat(var(--sb-mobile-tab-count, 5), minmax(0, 1fr));
    min-height: calc(var(--cab-mobile-nav) + env(safe-area-inset-bottom, 0px));
    padding: 9px 10px calc(9px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--border);
    /* Solid, like the appbar: card text scrolling under the labels read through them. */
    background: var(--background);
    box-shadow: 0 -12px 28px oklch(0.145 0 0 / 0.08);
  }

.customer-cabinet-page-shell .customer-mobile-tabbar .sb-mobile-tabbar__item {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 62px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    border: 0;
    border-radius: 17px;
    background: transparent;
    color: var(--foreground);
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
  }
}


/* customer-cabinet-mobile/04-customer-cabinet-mobile.css */
@media (max-width: 1180px) {
.customer-cabinet-page-shell .customer-mobile-tabbar .sb-mobile-tabbar__item.is-active {
    background: transparent;
    color: var(--foreground);
  }

.customer-cabinet-page-shell .customer-mobile-tabbar .sb-mobile-tabbar__item.is-active .sb-mobile-tabbar__icon {
    min-width: 64px;
    border-radius: 999px;
    background: var(--primary);
    color: var(--primary-foreground);
  }

.customer-cabinet-page-shell .customer-mobile-tabbar .sb-mobile-tabbar__icon {
    position: relative;
    display: inline-grid;
    min-height: 34px;
    place-items: center;
    padding: 0 12px;
  }

.customer-cabinet-page-shell .customer-mobile-tabbar svg,
  .customer-cabinet-page-shell .customer-mobile-tabbar i {
    width: 26px;
    height: 26px;
  }

.customer-cabinet-page-shell .customer-mobile-tabbar .sb-mobile-tabbar__icon b {
    position: absolute;
    top: -8px;
    right: -10px;
    display: grid;
    min-width: 21px;
    height: 21px;
    place-items: center;
    border-radius: 999px;
    /* White on #f00 read 4.0:1. The red of the «Срочно» badge, fixed in both themes: 4.77:1. */
    background: oklch(0.577 0.245 27.325);
    color: #fff;
    font-size: 12px;
    line-height: 1;
  }

.customer-cabinet-page-shell .customer-mobile-fab {
    position: fixed;
    right: 14px;
    bottom: calc(var(--cab-mobile-nav) + env(safe-area-inset-bottom, 0px) + 18px);
    z-index: 44;
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border: none;
    border-radius: 18px;
    background: var(--primary);
    color: #111;
    box-shadow: 0 12px 28px oklch(0.145 0 0 / 0.18);
  }

.customer-cabinet-page-shell .customer-mobile-fab svg,
  .customer-cabinet-page-shell .customer-mobile-fab i {
    width: 28px;
    height: 28px;
  }

.customer-cabinet-page-shell .od-head,
  .customer-cabinet-page-shell .resp-head,
  .customer-cabinet-page-shell .cabinet-section-card-header,
  .customer-cabinet-page-shell .settings-row {
    align-items: flex-start;
    gap: 14px;
  }

.customer-cabinet-page-shell .od-head,
  .customer-cabinet-page-shell .resp-head {
    flex-direction: column;
  }

.customer-cabinet-page-shell .order-detail {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 16px;
  }

.customer-cabinet-page-shell .od-head {
    display: flex;
    margin: 0;
  }

.customer-cabinet-page-shell .od-head h1 {
    margin: 10px 0 0;
    color: var(--foreground);
    font-size: 28px;
    font-weight: 800;
    line-height: 1.1;
  }

.customer-cabinet-page-shell .od-head [data-slot="button"],
  .customer-cabinet-page-shell .settings-action,
  .customer-cabinet-page-shell .profile-form-actions [data-slot="button"] {
    width: 100%;
    justify-content: center;
  }

.customer-cabinet-page-shell .od-head-actions,
  .customer-cabinet-page-shell .od-promotion-action {
    align-items: stretch;
    width: 100%;
  }

.customer-cabinet-page-shell .od-summary,
  .customer-cabinet-page-shell .profile-form {
    grid-template-columns: minmax(0, 1fr);
  }

.customer-cabinet-page-shell .od-summary {
    display: grid;
    gap: 1px;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--border);
    box-shadow: var(--shadow-xs);
  }

.customer-cabinet-page-shell .od-summary .cell {
    min-width: 0;
    padding: 16px;
    background: var(--card);
  }

.customer-cabinet-page-shell .od-summary .l {
    color: var(--foreground);
    font-size: 13px;
    line-height: 1.2;
  }

.customer-cabinet-page-shell .od-summary .v {
    margin-top: 4px;
    color: var(--foreground);
    font-size: 16px;
    font-weight: 800;
    line-height: 1.25;
    overflow-wrap: anywhere;
  }

.customer-cabinet-page-shell .od-desc {
    margin: 0;
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--card);
    color: var(--foreground);
    font-size: 16px;
    line-height: 1.55;
  }

  /* The order screen on a phone. The four summary cells are one card cut by hairlines, two across:
     as four separate rounded cards they stood with no gap between them and filled the first
     screen. The chosen crew stacks -- who, then the terms, then the button across the card: side by
     side the text was left a 120px column and broke after every word. */
  .customer-cabinet-page-shell .od-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .customer-cabinet-page-shell .od-summary .cell { border: 0; border-radius: 0; box-shadow: none; }
  .customer-cabinet-page-shell .od-props { padding: 16px; gap: 12px; border-radius: 16px; }
  .customer-cabinet-page-shell .od-prop { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .customer-cabinet-page-shell .od-prop dt { font-size: 13px; }
  .customer-cabinet-page-shell .inwork-banner { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 12px; align-items: center; padding: 16px; }
  .customer-cabinet-page-shell .inwork-banner i.lead, .customer-cabinet-page-shell .inwork-banner svg.lead { display: none; }
  .customer-cabinet-page-shell .inwork-banner .ib-main .t { overflow-wrap: anywhere; }
  .customer-cabinet-page-shell .inwork-banner .inwork-chat-action { grid-column: 1 / -1; width: 100%; min-height: 44px; justify-content: center; }


.customer-cabinet-page-shell .resp-empty,
  .customer-cabinet-page-shell .empty-card {
    min-height: 190px;
    border-radius: 18px;
  }

.customer-cabinet-page-shell .resp-tools {
    width: 100%;
    flex-wrap: wrap;
  }

.customer-cabinet-page-shell .sortmini {
    display: grid;
    grid-template-columns: auto minmax(140px, 1fr);
    align-items: center;
    width: 100%;
  }

.customer-cabinet-page-shell .sortmini .resp-sort-trigger {
    min-width: 0;
    width: 100%;
    color: var(--foreground);
    background-color: var(--card);
  }
}


/* customer-cabinet-mobile/05-customer-cabinet-mobile.css */
@media (max-width: 1180px) {
.customer-cabinet-page-shell .view-toggle {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

.customer-cabinet-page-shell .view-toggle [data-slot="button"] {
    justify-content: center;
  }

.customer-cabinet-page-shell .rcard {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    padding: 14px;
    border-color: var(--border);
    border-radius: 16px;
  }

.customer-cabinet-page-shell .rc-top {
    align-items: flex-start;
    gap: 12px;
  }

.customer-cabinet-page-shell .rc-av {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    font-size: 16px;
  }

.customer-cabinet-page-shell .rc-name {
    font-size: 19px;
    line-height: 1.12;
  }

.customer-cabinet-page-shell .rc-ver,
  .customer-cabinet-page-shell .rc-newtag {
    font-size: 12px;
  }

.customer-cabinet-page-shell .rc-trust {
    gap: 6px 10px;
    font-size: 13.5px;
  }

.customer-cabinet-page-shell .rc-msg {
    max-width: none;
    font-size: 14px;
  }

.customer-cabinet-page-shell .rc-alert {
    width: auto;
    font-size: 12px;
  }

.customer-cabinet-page-shell .rc-offer,
  .customer-cabinet-page-shell .rc-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 12px 0 0;
    border-top: 1px solid var(--border);
    border-left: 0;
  }

.customer-cabinet-page-shell .rc-note,
  .customer-cabinet-page-shell .rc-actions {
    grid-column: 1 / -1;
  }

.customer-cabinet-page-shell .rc-price {
    font-size: 24px;
    white-space: normal;
  }

.customer-cabinet-page-shell .rc-term {
    font-size: 15px;
  }

.customer-cabinet-page-shell .rc-actions [data-slot="button"] {
    width: 100%;
    min-width: 0;
    justify-content: center;
  }

.customer-cabinet-page-shell .rc-actions [data-slot="button"]:first-child {
    grid-column: 1 / -1;
  }

.customer-cabinet-page-shell .cmp-wrap {
    overflow: visible;
    border-radius: 16px;
    background: transparent;
    border: 0;
    box-shadow: none;
  }

.customer-cabinet-page-shell .cmp,
  .customer-cabinet-page-shell .cmp tbody,
  .customer-cabinet-page-shell .cmp tr,
  .customer-cabinet-page-shell .cmp td {
    display: block;
    width: 100%;
  }

.customer-cabinet-page-shell .cmp thead {
    display: none;
  }

.customer-cabinet-page-shell .cmp tbody {
    display: grid;
    gap: 12px;
  }

.customer-cabinet-page-shell .cmp tr {
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--card);
    box-shadow: var(--shadow-xs);
  }

.customer-cabinet-page-shell .cmp th,
  .customer-cabinet-page-shell .cmp td {
    padding: 0;
    border: 0;
    text-align: left;
  }

.customer-cabinet-page-shell .cmp td + td {
    margin-top: 10px;
  }

.customer-cabinet-page-shell .cmp td:nth-child(2),
  .customer-cabinet-page-shell .cmp td:nth-child(3),
  .customer-cabinet-page-shell .cmp td:nth-child(4) {
    display: inline-flex;
    width: auto;
    min-width: 0;
    margin-top: 14px;
    margin-right: 10px;
    vertical-align: top;
  }

.customer-cabinet-page-shell .cmp td:nth-child(3)::before {
    content: "Цена";
  }

.customer-cabinet-page-shell .cmp td:nth-child(4)::before {
    content: "Срок";
  }

.customer-cabinet-page-shell .cmp td:nth-child(3)::before,
  .customer-cabinet-page-shell .cmp td:nth-child(4)::before {
    display: block;
    margin-bottom: 3px;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--foreground);
  }

.customer-cabinet-page-shell .cmp td:nth-child(3),
  .customer-cabinet-page-shell .cmp td:nth-child(4) {
    display: inline-block;
    min-width: calc(50% - 8px);
  }

.customer-cabinet-page-shell .cmp .num {
    text-align: left;
    white-space: normal;
  }
}


/* customer-cabinet-mobile/06-customer-cabinet-mobile.css */
@media (max-width: 1180px) {
.customer-cabinet-page-shell .cmp .c-brig {
    align-items: flex-start;
    gap: 12px;
  }

.customer-cabinet-page-shell .cmp .c-brig .cav {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    font-size: 16px;
  }

.customer-cabinet-page-shell .cmp .c-brig .cn {
    align-items: flex-start;
    font-size: 18px;
    line-height: 1.15;
    word-break: break-word;
  }

.customer-cabinet-page-shell .cmp .c-brig .cs {
    margin-top: 4px;
    font-size: 14px;
    line-height: 1.35;
  }

.customer-cabinet-page-shell .cmp .c-rating {
    min-height: 34px;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--muted);
  }

.customer-cabinet-page-shell .cmp .c-price {
    font-size: 22px;
    line-height: 1.05;
    white-space: normal;
    overflow-wrap: anywhere;
  }

.customer-cabinet-page-shell .cmp td:nth-child(5) {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
    color: var(--foreground);
    line-height: 1.35;
  }

.customer-cabinet-page-shell .cmp .c-act {
    margin-top: 12px;
    white-space: normal;
  }

.customer-cabinet-page-shell .cmp .c-act [data-slot="button"] {
    width: 100%;
    min-width: 0;
  }

.customer-cabinet-page-shell .cmp-note {
    margin-top: 12px;
    padding: 12px;
    border-radius: 14px;
    font-size: 13px;
    line-height: 1.35;
  }

.customer-cabinet-page-shell .settings-row,
  .customer-cabinet-page-shell .marketplace-settings-row {
    grid-template-columns: 44px minmax(0, 1fr);
  }

.customer-cabinet-page-shell .settings-row--stacked,
  .customer-cabinet-page-shell .settings-actions {
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }

.customer-cabinet-page-shell .settings-segmented {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    min-width: 0;
    width: 100%;
  }

.customer-cabinet-page-shell .settings-segmented button {
    padding: 0 8px;
    font-size: 13px;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-filter {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    margin: 0 0 10px;
    align-self: stretch;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-filter [data-slot="button"] {
    flex: 1;
    min-width: 0;
    justify-content: center;
    min-height: 32px;
    padding: 0 8px;
    font-size: 13px;
  }

.customer-cabinet-page-shell main[data-cab="profile"] {
    gap: 10px;
    width: 100%;
    max-width: none;
    padding: 0 var(--cab-screen-gutter);
  }

.customer-cabinet-page-shell main[data-cab="profile"] {
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
    padding-top: 12px;
    overflow-x: clip;
  }

.customer-cabinet-page-shell main[data-cab="settings"] {
    gap: 12px;
    padding-top: 12px;
    padding-inline: var(--cab-screen-gutter);
  }

.customer-cabinet-page-shell main[data-cab="settings"] .settings-row,
  .customer-cabinet-page-shell main[data-cab="settings"] .marketplace-settings-row {
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) !important;
    align-items: start;
    gap: 12px;
  }

.customer-cabinet-page-shell main[data-cab="settings"] .settings-row > :last-child,
  .customer-cabinet-page-shell main[data-cab="settings"] .marketplace-settings-row__actions {
    grid-column: 2 !important;
    grid-row: auto !important;
    width: 100%;
    justify-self: stretch;
    justify-content: flex-start !important;
  }

.customer-cabinet-page-shell main[data-cab="settings"] .settings-card {
    width: 100%;
    box-sizing: border-box;
    border-radius: 16px;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .phero,
  .customer-cabinet-page-shell main[data-cab="profile"] .cabinet-section-card,
  .customer-cabinet-page-shell main[data-cab="notifications"] .notifications-card,
  .customer-cabinet-page-shell main[data-cab="messages"] .stroyban-order-chat,
  .customer-cabinet-page-shell main[data-cab="messages"] .rchat {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    border-radius: 0;
  }

.customer-cabinet-page-shell .ordcard,
  .customer-cabinet-page-shell .od-hero,
  .customer-cabinet-page-shell .od-head,
  .customer-cabinet-page-shell .responses,
  .customer-cabinet-page-shell .settings-card,
  .customer-cabinet-page-shell .notifications-card,
  .customer-cabinet-page-shell .stroyban-order-chat,
  .customer-cabinet-page-shell .rchat,
  .customer-cabinet-page-shell .phero,
  .customer-cabinet-page-shell .pstats,
  .customer-cabinet-page-shell .cabinet-section-card {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .phero {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding: 14px;
    border-inline: 1px solid var(--border);
    border-radius: 16px;
    box-shadow: none;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .phero .pic {
    width: 64px;
    height: 64px;
    font-size: 22px;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .phero-main {
    min-width: 0;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .phero-name {
    display: grid;
    align-items: start;
    gap: 6px;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .phero-name h1 {
    font-size: 24px;
    line-height: 1.05;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .ver-badge {
    width: max-content;
    max-width: 100%;
    padding: 5px 8px;
    font-size: 12px;
    line-height: 1.15;
  }
}


/* customer-cabinet-mobile/07-customer-cabinet-mobile.css */
@media (max-width: 1180px) {
.customer-cabinet-page-shell main[data-cab="profile"] .ver-badge i,
  .customer-cabinet-page-shell main[data-cab="profile"] .ver-badge svg {
    width: 16px;
    height: 16px;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .phero-meta {
    display: grid;
    gap: 6px;
    margin-top: 8px;
    font-size: 14px;
    line-height: 1.25;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .phero-meta .m {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 6px;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .phero-meta .m i,
  .customer-cabinet-page-shell main[data-cab="profile"] .phero-meta .m svg {
    width: 18px;
    height: 18px;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .phero-act {
    grid-column: 1 / -1;
    width: 100%;
    flex-direction: column;
    align-items: stretch;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .phero-act [data-slot="button"] {
    width: 100%;
    min-height: 40px;
    justify-content: center;
    font-size: 14px;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .pstats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .pstat {
    min-height: 92px;
    padding: 14px;
    border-radius: 14px;
    -webkit-tap-highlight-color: transparent;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .pstat-copy {
    gap: 6px;
    max-width: 100%;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .pstat:active {
    transform: scale(0.985);
  }

.customer-cabinet-page-shell main[data-cab="profile"] .pstat.is-empty {
    box-shadow: none;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .pstat .v {
    display: block;
    font-size: 30px;
    line-height: 1;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .pstat .l {
    display: block;
    font-size: 14px;
    line-height: 1.2;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .pstat-arrow {
    width: 16px;
    height: 16px;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .cabinet-section-card {
    padding: 16px 14px 18px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--card);
    box-shadow: none;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .cabinet-section-card-header {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 12px;
    margin-bottom: 16px;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .cabinet-section-card-header h2 {
    font-size: 21px;
    line-height: 1.1;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .cabinet-section-card-action {
    min-height: 38px;
    padding: 0 12px;
    border-radius: 12px;
    font-size: 14px;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .cabinet-section-card-action i,
  .customer-cabinet-page-shell main[data-cab="profile"] .cabinet-section-card-action svg {
    width: 18px;
    height: 18px;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .profile-editor,
  .customer-cabinet-page-shell main[data-cab="profile"] .profile-form,
  .customer-cabinet-page-shell main[data-cab="profile"] .profile-avatar-upload {
    min-width: 0;
    width: 100%;
    box-sizing: border-box;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .profile-avatar-upload {
    grid-template-columns: 72px minmax(0, 1fr) !important;
    align-items: start;
    gap: 12px;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .profile-avatar-preview {
    width: 72px;
    height: 72px;
    font-size: 23px;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .profile-avatar-copy {
    min-width: 0;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .profile-avatar-button {
    grid-column: 1 / -1;
    width: 100%;
    justify-content: center;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .obj-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .obj {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    padding: 10px 0;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .obj .oi {
    width: 38px;
    height: 38px;
    border-radius: 10px;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .obj .oi i,
  .customer-cabinet-page-shell main[data-cab="profile"] .obj .oi svg {
    width: 20px;
    height: 20px;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .obj .ol {
    font-size: 13px;
    line-height: 1.2;
  }

.customer-cabinet-page-shell main[data-cab="profile"] .obj .ov {
    font-size: 16px;
    line-height: 1.2;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-row {
    position: relative;
    grid-template-columns: 1fr;
    align-items: stretch;
    gap: 0;
    min-height: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding: 0;
    overflow: hidden;
    border-top: 0;
    border-bottom: 1px solid var(--border);
  }

.customer-cabinet-page-shell main[data-cab="notifications"] {
    width: 100%;
    max-width: 100%;
    height: calc(100dvh - var(--cab-mobile-header) - var(--cab-mobile-nav) - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
    min-height: 0;
    margin-inline: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0 var(--cab-screen-gutter) !important;
    background: var(--card);
  }
}


/* customer-cabinet-mobile/08-customer-cabinet-mobile.css */
@media (max-width: 1180px) {
.customer-cabinet-page-shell main[data-cab="notifications"] .notifications-card {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
    box-sizing: border-box;
    overflow-x: hidden;
    border: 0;
    border-radius: 0;
    background: var(--card);
    box-shadow: none;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notifications-list {
    width: 100%;
    max-width: 100%;
    margin: 0;
    overflow-x: hidden;
    border-top: 0;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-date-label {
    padding: 12px 16px 8px;
    font-size: 11px;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-main {
    grid-template-columns: 38px minmax(0, 1fr) 16px;
    gap: 12px;
    width: 100%;
    box-sizing: border-box;
    min-height: 0;
    padding: 14px 14px 8px;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-icon i,
  .customer-cabinet-page-shell main[data-cab="notifications"] .notification-icon svg {
    width: 17px;
    height: 17px;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-title {
    font-size: 15px;
    line-height: 1.2;
    text-decoration: none;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-body {
    margin-top: 2px;
    font-size: 14px;
    line-height: 1.32;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-meta {
    margin-top: 4px;
    font-size: 11.5px;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-chevron {
    align-self: center;
    width: 16px;
    height: 16px;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-unread-dot {
    position: absolute;
    top: 31px;
    left: 8px;
    width: 6px;
    height: 6px;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-actions {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    box-sizing: border-box;
    padding: 0 14px 14px 64px;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-row .settings-state {
    width: fit-content;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-row .settings-action {
    width: fit-content;
    min-height: 32px;
    padding: 0 9px;
    font-size: 12px;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-row .settings-action svg,
  .customer-cabinet-page-shell main[data-cab="notifications"] .notification-row .settings-action i {
    width: 14px;
    height: 14px;
  }

.customer-cabinet-page-shell main[data-cab="messages"] {
    width: 100vw;
    max-width: 100vw;
    height: 100%;
    max-height: 100%;
    min-height: 0;
    margin-inline: calc(50% - 50vw);
    overflow: hidden;
    padding: 0 !important;
    background-color: var(--stroyban-chat-surface);
    background-image: var(--stroyban-chat-pattern);
    background-size: var(--stroyban-chat-pattern-size);
  }

.customer-cabinet-page-shell main[data-cab="messages"] .stroyban-order-chat,
  .customer-cabinet-page-shell main[data-cab="messages"] .rchat {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
    width: 100vw;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    max-width: 100vw;
    min-width: 0;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: var(--page-backdrop);
    box-shadow: none;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-list {
    width: 100%;
    min-width: 0;
    overflow-x: hidden;
    border-right: 0;
    border-bottom: 0;
    background: var(--card);
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-list-h {
    display: none;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-threads {
    display: flex;
    height: 100%;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0;
    gap: 0;
    scrollbar-width: none;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-threads::-webkit-scrollbar {
    display: none;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-thread {
    width: 100%;
    flex: none;
    gap: 10px;
    padding: 14px 16px;
    border: 0;
    border-bottom: 1px solid var(--border);
    border-radius: 0;
    background: var(--card);
  }
}


/* customer-cabinet-mobile/09-customer-cabinet-mobile.css */
@media (max-width: 1180px) {
.customer-cabinet-page-shell main[data-cab="messages"] .rchat-thread.on {
    border-color: color-mix(in oklch, var(--primary) 65%, var(--border));
    background: color-mix(in oklch, var(--primary) 12%, var(--card));
    box-shadow: none;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat.is-mobile-thread-list .rchat-conv {
    display: none;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat.is-mobile-chat-open .rchat-list {
    display: none;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat.is-mobile-chat-open .rchat-conv,
  .customer-cabinet-page-shell main[data-cab="messages"] .rchat.is-mobile-thread-list .rchat-list {
    display: flex;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
    overflow-x: hidden;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat.is-mobile-chat-open .rchat-conv {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    overflow: hidden;
    background-color: var(--stroyban-chat-surface);
    background-image: var(--stroyban-chat-pattern);
    background-size: var(--stroyban-chat-pattern-size);
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat.is-mobile-thread-list .rchat-list {
    flex-direction: column;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-mobile-back {
    display: inline-flex;
    width: auto;
    min-width: 34px;
    height: 34px;
    flex: none;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 8px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--foreground);
    font-size: 13px;
    font-weight: 700;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-mobile-back i,
  .customer-cabinet-page-shell main[data-cab="messages"] .rchat-mobile-back svg {
    width: 21px;
    height: 21px;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-offer {
    gap: 10px;
    min-height: 62px;
    padding: 8px 12px;
    background: var(--card);
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-tav,
  .customer-cabinet-page-shell main[data-cab="messages"] .oav {
    width: 36px;
    height: 36px;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-tname {
    font-size: 15px;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-tsub {
    font-size: 13px;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-scroll {
    width: 100%;
    height: 100%;
    min-height: 0;
    min-width: 0;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    padding: 14px 12px 16px;
    background-color: var(--stroyban-chat-surface);
    background-image: var(--stroyban-chat-pattern);
    background-size: var(--stroyban-chat-pattern-size);
  }

.customer-cabinet-page-shell main[data-cab="messages"] .support-chat-bubble {
    max-width: min(82%, 300px);
    padding: 7px 12px;
    border-radius: 16px;
    font-size: 14px;
    line-height: 1.35;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .support-chat-message.is-system .support-chat-bubble {
    max-width: calc(100% - 24px);
  }

.customer-cabinet-page-shell main[data-cab="messages"] .support-chat-separator {
    margin: 0 auto;
    font-size: 11px;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-input {
    position: relative;
    z-index: 1;
    width: 100%;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 48px 54px;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 10px 12px;
    border-top: 1px solid var(--stroyban-chat-pane-border);
    border-radius: 0;
    background: var(--card);
    box-shadow: none;
    backdrop-filter: none;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-input input:not([type="file"]) {
    display: block;
    box-sizing: border-box;
    min-width: 0;
    width: 100%;
    height: 48px;
    padding: 0 12px;
    border: 0;
    border-radius: 12px;
    background: var(--muted);
    font-size: 16px;
    line-height: normal;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .order-chat-drafts {
    grid-column: 1 / -1;
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-send {
    width: 54px;
    min-width: 54px;
    height: 48px;
    border-radius: 12px;
    background: var(--primary);
    color: var(--primary-foreground);
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-attach {
    width: 48px;
    min-width: 48px;
    height: 48px;
    padding: 0;
    border-radius: 14px;
  }

.customer-cabinet-page-shell main[data-cab="favorites"] .fav-acts {
    flex-wrap: wrap;
    justify-content: flex-end;
  }

.customer-cabinet-page-shell main[data-cab="favorites"] .fav-acts > * {
    flex: 0 1 auto;
    min-width: 0;
  }
}

/*
 * Between 768 and 1180 the cabinet runs its phone layout with no site header at all: the desktop
 * header is hidden for the cabinet below 1181 and the phone header exists only below 768. The
 * offset reserved for that header still said 107px, so the appbar stuck 107px down the page, on
 * top of the profile's hero. Nothing is above the appbar here, so nothing is reserved.
 */
@media (min-width: 768px) and (max-width: 1180px) {
  .customer-cabinet-page-shell {
    --sb-mobile-header: 0px;
  }
}

@media (max-width: 1180px) {
  .customer-cabinet-page-shell .ord-budget-column {
    display: flex;
    flex-direction: column;
    gap: 3px;
    align-items: flex-start;
    text-align: left;
  }
  .customer-cabinet-page-shell .ord-budget-column b { color: var(--foreground); font-size: 16px; }
  .customer-cabinet-page-shell .ord-budget-column span { color: var(--foreground); font-size: 12px; line-height: 1.35; }
  .customer-cabinet-page-shell .ord-views { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; }
  .customer-cabinet-page-shell .ord-views i,
  .customer-cabinet-page-shell .ord-views svg { width: 14px; height: 14px; }
  .customer-cabinet-page-shell .intake-draft-card .ord-right { display: flex; }
  .customer-cabinet-page-shell .intake-draft-card .ord-right [data-slot="button"] { width: 100%; }
.customer-cabinet-page-shell .ordcard .ord-right { display: flex; width: 100%; }
.customer-cabinet-page-shell .ordcard .ord-right > .ord-cta { display: flex !important; width: 100%; }
.customer-cabinet-page-shell .ordcard .ord-right > .ord-cta [data-slot="button"] { width: 100%; }
.customer-cabinet-page-shell .ordcard .ord-promote-action,
.customer-cabinet-page-shell .ordcard .ord-cta [data-slot="free-offer-price"] { display: none !important; }
  .customer-cabinet-page-shell .od-secondary-facts { display: grid; gap: 12px; margin: 0; padding: 16px; border: 1px solid var(--border); border-radius: 16px; background: var(--card); }
  .customer-cabinet-page-shell .od-secondary-facts > div { min-width: 0; }
  .customer-cabinet-page-shell .od-secondary-facts dt { color: var(--foreground); font-size: 12px; }
  .customer-cabinet-page-shell .od-secondary-facts dd { margin: 3px 0 0; color: var(--foreground); font-size: 14px; font-weight: 600; }
.customer-cabinet-page-shell .resp-head { display: flex; width: 100%; flex-direction: column; align-items: stretch; }
.customer-cabinet-page-shell .resp-head h2 { width: 100%; }
.customer-cabinet-page-shell .resp-tools { display: flex; width: 100%; flex-direction: column; align-items: stretch; }
  .customer-cabinet-page-shell .resp-sort-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; gap: 6px; }
  .customer-cabinet-page-shell .resp-sort-options [data-slot="button"] { min-width: 0; padding-inline: 8px; border-radius: 999px; }
  .customer-cabinet-page-shell .resp-sort-options [data-active="true"] { border-color: var(--selected); background: var(--selected); color: var(--on-selected); }
  .customer-cabinet-page-shell .rc-date { margin-left: 0; font-size: 12px; }
}

@media (max-width: 1180px) {
/*
  The appbar, then 16px, then the first block -- on every customer screen, the same rhythm the
  performer's cabinet keeps under its tab strip.

  Each screen had its own number: orders 12, profile and settings 12, balance 10, and favourites,
  reviews and notifications none at all -- their first card touched the rule under the appbar.
*/
.customer-cabinet-page-shell main[data-cab="favorites"],
  .customer-cabinet-page-shell main[data-cab="reviews"],
  .customer-cabinet-page-shell main[data-cab="profile"],
  .customer-cabinet-page-shell main[data-cab="settings"] {
    padding-top: 16px;
  }

/* The balance screen's heading block brings 6px of its own. */
.customer-cabinet-page-shell main[data-cab="balance"] {
    padding-top: 10px;
  }

/* This one answers an `!important` on the same element. */
.customer-cabinet-page-shell main[data-cab="notifications"] {
    padding-top: 16px !important;
  }
}

@media (max-width: 1180px) {
/*
  The hidden file input behind "Загрузить фото" stays 1px wide.

  It is hidden by size, and the shared phone sheet sizes every input to the full width of its
  row, with `!important`: the invisible input came out 393px wide, absolutely positioned 49px in,
  and the page grew to 442px -- opening the profile editor made the whole screen scroll sideways
  and pushed the bottom bar's last tab off the edge.
*/
.customer-cabinet-page-shell .profile-avatar-input {
    width: 1px !important;
    min-width: 0 !important;
    max-width: 1px !important;
  }
}

@media (max-width: 767px) {
/*
  The top-up form stacks: amount, method, button -- each the full width of the card.

  The fields ask for 180px each and the button sits in the same wrapping row, so on a phone the
  method select and "Пополнить" shared a 313px line that needs 316: the button covered the
  select's chevron and the end of its placeholder.
*/
.customer-cabinet-page-shell .wallet-row > .wallet-field {
    flex: 1 1 100%;
  }

.customer-cabinet-page-shell .wallet-row > .wallet-field [data-slot="select-trigger"] {
    width: 100%;
  }

.customer-cabinet-page-shell .wallet-row > [data-slot="button"] {
    width: 100%;
    min-height: 44px;
  }

/* The appbar already says "Баланс и услуги"; the screen's own heading said it again right under
   it. The sentence that explains the screen stays. */
.customer-cabinet-page-shell main[data-cab="balance"] .resp-h1 {
    display: none;
  }

/*
  A notification's text wraps inside its own column.

  The row is a kit Button, which is `nowrap`: a long order title ran straight through the chevron
  at the end of the row instead of breaking before it.
*/
.customer-cabinet-page-shell main[data-cab="notifications"] .notification-main {
    white-space: normal;
    text-align: left;
  }

.customer-cabinet-page-shell main[data-cab="notifications"] .notification-copy {
    min-width: 0;
  }

/* The kit card's own 24px column gap, on top of the section header's margin, put 40px of air
   between "Мой объект" and its first row. */
.customer-cabinet-page-shell .cabinet-section-card {
    gap: 0;
  }
}

@media (max-width: 1180px) {
/*
  The message list starts under the bars above it, all of them.

  The screen is pinned to the viewport and its `top` counted the appbar only -- 60px -- while the
  site's own header stands above the appbar: 107px of bar plus the 10px it pads itself with at
  rest. The first 117px of the list were drawn underneath: "Поддержка" and the newest thread could
  not be seen or pressed. The page does not scroll here, so the header is always at rest.

  The list was also capped at 260px by the shared sheet's phone rule for the public chat, which
  left a grey slab between the third thread and the bottom bar.
*/
.customer-cabinet-page-shell {
    --cab-site-header-rest-pad: 0.625rem;
  }

.customer-cabinet-page-shell .layout[data-active-screen="messages"] {
    top: calc(var(--sb-mobile-header, 0px) + var(--cab-site-header-rest-pad) + var(--cab-mobile-header) + env(safe-area-inset-top, 0px));
  }

.customer-cabinet-page-shell main[data-cab="messages"] .rchat-list {
    height: 100%;
    max-height: none;
  }
}

@media (min-width: 768px) and (max-width: 1180px) {
  /* No site header above the appbar here, so nothing of its to clear. */
  .customer-cabinet-page-shell {
    --cab-site-header-rest-pad: 0px;
  }
}

@media (max-width: 767px) {
  .customer-cabinet-page-shell main[data-cab="workers"] { gap: 12px; }
  .customer-cabinet-page-shell .workers-head { display: grid; gap: 14px; }
  /* The mobile app bar already names this screen. Keep the explanation and actions, not a second
     identical heading immediately below it. */
  .customer-cabinet-page-shell .workers-head h1 { display: none; }
  .customer-cabinet-page-shell .workers-head-actions { display: grid; grid-template-columns: 1fr 1fr; justify-content: stretch; }
  .customer-cabinet-page-shell .workers-head-actions > button:last-child { grid-column: 1 / -1; }
  .customer-cabinet-page-shell .workers-toolbar { grid-template-columns: 1fr; padding: 10px; }
  .customer-cabinet-page-shell .workers-bulk { top: 8px; flex-wrap: wrap; }
  .customer-cabinet-page-shell .workers-table { min-width: 760px; }
  .workers-panel { width: 100%; min-width: 0; max-width: 100%; resize: none; }
  .workers-panel form { grid-template-columns: 1fr; padding: 18px; }
  .workers-panel .workers-field:last-of-type, .workers-panel footer { grid-column: 1; }
  .workers-import { width: calc(100vw - 24px); max-height: calc(100svh - 24px); }
  .workers-import-counts { flex-direction: column; gap: 6px; }
}

/* Order groups (mockup 5.1, 24.10.2026): the merge bar sticks and rows stack on a phone. */
@media (max-width: 768px) {
  .customer-cabinet-page-shell .order-group-head { flex-direction: column; }
  .customer-cabinet-page-shell .order-group-side { align-items: flex-start; }
  .customer-cabinet-page-shell .order-group-row { grid-template-columns: 26px minmax(0, 1fr); }
  .customer-cabinet-page-shell .order-group-row-budget { grid-column: 2; }
  .customer-cabinet-page-shell .order-group-bar { bottom: 8px; }
  .customer-cabinet-page-shell .candidates-dialog-body { gap: 10px; }
  .customer-cabinet-page-shell .candidates-list { max-height: 42vh; }
  .customer-cabinet-page-shell .candidates-meta { max-width: 55%; }
  .customer-cabinet-page-shell .messages-order-filter { align-items: flex-start; flex-direction: column; }
}
.customer-cabinet-page-shell .rc-group-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; color: var(--foreground); }