/*
 * CENTER CRM — Stage 9.3
 * Единый уровень карточек и кнопок.
 */

/* Карточки в одной строке растягиваются до одинаковой высоты. */
.row > [class*="col-"] {
    display: flex;
    flex-direction: column;
}

.row > [class*="col-"] > .card,
.row > [class*="col-"] > .panel,
.row > [class*="col-"] > .dashboard-card,
.row > [class*="col-"] > .entity-card {
    width: 100%;
    height: 100%;
}

/* Содержимое карточки строится вертикально. */
.card-body,
.dashboard-card .card-body,
.entity-card .card-body {
    display: flex;
    flex-direction: column;
}

/* Явные зоны действий всегда находятся внизу карточки. */
.card-actions,
.actions,
.action-row,
.form-actions,
.entity-actions,
.dashboard-actions {
    margin-top: auto;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/*
 * Для старых карточек без отдельного контейнера действий:
 * первая непосредственная кнопка прижимает всю группу кнопок вниз.
 */
.card-body > .btn:first-of-type > .btn:first-of-type,
.dashboard-card .card-body > .btn:first-of-type,
.entity-card .card-body > .btn:first-of-type {
    margin-top: auto;
}

/* Одинаковая вертикальная геометрия кнопок. */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1.2;
    white-space: nowrap;
}

.btn:not(.btn-sm):not(.btn-lg) {
    min-height: 40px;
}

.btn-sm {
    min-height: 32px;
}

.btn-lg {
    min-height: 48px;
}

/* Соседние кнопки не должны прыгать из-за разных отступов. */
.btn + .btn,
.actions > .btn,
.card-actions > .btn,
.action-row > .btn > .btn,
.form-actions > .btn {
    align-self: center;
}

/* Текстовый логотип до разработки графического знака. */
.center-crm-wordmark,
.navbar-brand,
.sidebar-brand,
.login-brand {
    letter-spacing: 0.035em;
}

/* CENTER CRM STAGE 9.3.14.3 EXACT LOGO START */

/*
 * The asset is the exact approved uploaded logo.
 * No stretching, redrawing, filter, blend mode or artificial spacing.
 */

html body a.brand.brand-image.center-brand-final {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex: 0 0 270px !important;
    width: 270px !important;
    min-width: 270px !important;
    max-width: 270px !important;
    height: 64px !important;
    min-height: 64px !important;
    margin: 0 34px 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    text-decoration: none !important;
    line-height: 1 !important;
}

html body a.brand.brand-image.center-brand-final
> img.brand-logo-image.center-brand-logo-final {
    display: block !important;
    flex: 0 0 auto !important;
    width: 258px !important;
    height: auto !important;
    min-width: 258px !important;
    max-width: 258px !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    object-fit: contain !important;
    object-position: left center !important;
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
    mix-blend-mode: normal !important;
    background: transparent !important;
    box-shadow: none !important;
    image-rendering: auto !important;
}

@media (max-width: 1180px) {
    html body a.brand.brand-image.center-brand-final {
        flex-basis: 232px !important;
        width: 232px !important;
        min-width: 232px !important;
        max-width: 232px !important;
        margin-right: 24px !important;
    }

    html body a.brand.brand-image.center-brand-final
    > img.brand-logo-image.center-brand-logo-final {
        width: 224px !important;
        min-width: 224px !important;
        max-width: 224px !important;
    }
}

@media (max-width: 760px) {
    html body a.brand.brand-image.center-brand-final {
        flex-basis: 202px !important;
        width: 202px !important;
        min-width: 202px !important;
        max-width: 202px !important;
        height: 56px !important;
        min-height: 56px !important;
        margin-right: 16px !important;
    }

    html body a.brand.brand-image.center-brand-final
    > img.brand-logo-image.center-brand-logo-final {
        width: 194px !important;
        min-width: 194px !important;
        max-width: 194px !important;
    }
}

@media (max-width: 520px) {
    html body a.brand.brand-image.center-brand-final {
        flex-basis: 174px !important;
        width: 174px !important;
        min-width: 174px !important;
        max-width: 174px !important;
        margin-right: 12px !important;
    }

    html body a.brand.brand-image.center-brand-final
    > img.brand-logo-image.center-brand-logo-final {
        width: 168px !important;
        min-width: 168px !important;
        max-width: 168px !important;
    }
}

/* CENTER CRM STAGE 9.3.14.3 EXACT LOGO END */

/* CENTER CRM STAGE 9.3.15 UI POLISH START */

:root {
    --ccrm-ui-control-height: 62px;
    --ccrm-ui-filter-gap: 16px;
    --ccrm-ui-filter-gap-large: 18px;
}

/* Shared filter geometry */
html body .ccrm-ui-filter-form {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    align-items: end !important;
    gap: var(--ccrm-ui-filter-gap) !important;
}

html body .ccrm-ui-filter-surface {
    min-width: 0 !important;
}

html body .ccrm-ui-field {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    min-width: 0 !important;
    margin: 0 !important;
}

html body .ccrm-ui-label {
    display: block !important;
    min-height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #f2f2f2 !important;
    font-size: 15px !important;
    font-weight: 750 !important;
    line-height: 24px !important;
}

html body .ccrm-ui-control {
    width: 100% !important;
    min-width: 0 !important;
    height: var(--ccrm-ui-control-height) !important;
    min-height: var(--ccrm-ui-control-height) !important;
    max-height: var(--ccrm-ui-control-height) !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

html body .ccrm-ui-action {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    align-self: end !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

html body .ccrm-ui-action-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 154px !important;
    height: var(--ccrm-ui-control-height) !important;
    min-height: var(--ccrm-ui-control-height) !important;
    max-height: var(--ccrm-ui-control-height) !important;
    margin: 0 !important;
    padding: 0 24px !important;
    white-space: nowrap !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
}

/* Clients */
html body.ccrm-page-clients .ccrm-ui-filter-form--clients {
    display: grid !important;
    grid-template-columns:
        minmax(340px, 1fr)
        minmax(150px, 174px)
        minmax(170px, 190px)
        minmax(210px, 250px)
        auto !important;
}

html body.ccrm-page-clients .ccrm-ui-field--grow {
    min-width: 320px !important;
}

/* Delivery applications */
html body .ccrm-ui-delivery-filter-panel {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    gap: var(--ccrm-ui-filter-gap) !important;
}

html body.ccrm-page-deliveries
.ccrm-ui-filter-form--deliveries {
    display: flex !important;
    align-items: flex-end !important;
    flex: 0 1 auto !important;
    width: auto !important;
    gap: var(--ccrm-ui-filter-gap) !important;
}

html body.ccrm-page-deliveries
.ccrm-ui-filter-form--deliveries
.ccrm-ui-field {
    flex: 0 0 250px !important;
    width: 250px !important;
}

html body.ccrm-page-deliveries
.ccrm-ui-filter-form--deliveries
.ccrm-ui-field:first-of-type {
    flex-basis: 184px !important;
    width: 184px !important;
}

html body .ccrm-ui-scope-tabs {
    display: inline-flex !important;
    align-items: center !important;
    align-self: flex-end !important;
    flex: 0 0 auto !important;
    width: max-content !important;
    height: var(--ccrm-ui-control-height) !important;
    min-height: var(--ccrm-ui-control-height) !important;
    margin: 0 !important;
    padding: 5px !important;
    box-sizing: border-box !important;
}

html body .ccrm-ui-scope-tab {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 50px !important;
    min-height: 50px !important;
    margin: 0 !important;
    padding: 0 20px !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}

/* Daily report */
html body.ccrm-page-report .ccrm-ui-filter-form--report {
    display: grid !important;
    grid-template-columns:
        minmax(280px, 380px)
        minmax(280px, 380px)
        auto !important;
    justify-content: start !important;
    column-gap: var(--ccrm-ui-filter-gap-large) !important;
}

html body.ccrm-page-report .ccrm-ui-action-button {
    min-width: 190px !important;
}

/* Page-header primary actions */
html body .ccrm-ui-header-action {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 58px !important;
    padding: 0 24px !important;
    white-space: nowrap !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
}

/* Low-risk project-wide refinements */
html body main button,
html body main .button,
html body main input[type="submit"],
html body main a.button {
    vertical-align: middle !important;
}

html body main input,
html body main select,
html body main textarea,
html body main button,
html body main .button {
    box-sizing: border-box !important;
}

html body main button:focus-visible,
html body main .button:focus-visible,
html body main a:focus-visible,
html body main input:focus-visible,
html body main select:focus-visible,
html body main textarea:focus-visible {
    outline: 2px solid rgba(246, 197, 67, 0.92) !important;
    outline-offset: 3px !important;
}

html body .ccrm-ui-empty-state {
    display: flex !important;
    align-items: center !important;
    min-height: 132px !important;
    padding: 28px 32px !important;
    line-height: 1.5 !important;
}

/* Tablet layouts */
@media (max-width: 1360px) {
    html body.ccrm-page-clients .ccrm-ui-filter-form--clients {
        grid-template-columns:
            minmax(300px, 1fr)
            repeat(2, minmax(170px, 1fr))
            minmax(200px, 1fr)
            auto !important;
    }
}

@media (max-width: 1120px) {
    html body.ccrm-page-clients .ccrm-ui-filter-form--clients {
        grid-template-columns:
            minmax(170px, 1fr)
            minmax(170px, 1fr)
            minmax(170px, 1fr)
            auto !important;
    }

    html body.ccrm-page-clients .ccrm-ui-field--grow {
        grid-column: 1 / -1 !important;
        min-width: 0 !important;
    }

    html body.ccrm-page-clients .ccrm-ui-action {
        justify-content: flex-end !important;
    }

    html body .ccrm-ui-delivery-filter-panel {
        align-items: flex-end !important;
    }

    html body.ccrm-page-deliveries
    .ccrm-ui-filter-form--deliveries {
        flex: 1 1 600px !important;
    }
}

/* Mobile and narrow windows */
@media (max-width: 820px) {
    :root {
        --ccrm-ui-control-height: 56px;
        --ccrm-ui-filter-gap: 14px;
    }

    html body.ccrm-page-clients .ccrm-ui-filter-form--clients,
    html body.ccrm-page-report .ccrm-ui-filter-form--report {
        grid-template-columns: 1fr !important;
    }

    html body.ccrm-page-clients .ccrm-ui-field--grow {
        grid-column: auto !important;
    }

    html body .ccrm-ui-delivery-filter-panel {
        display: grid !important;
        grid-template-columns: 1fr !important;
        align-items: stretch !important;
    }

    html body.ccrm-page-deliveries
    .ccrm-ui-filter-form--deliveries {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        width: 100% !important;
    }

    html body.ccrm-page-deliveries
    .ccrm-ui-filter-form--deliveries
    .ccrm-ui-field,
    html body.ccrm-page-deliveries
    .ccrm-ui-filter-form--deliveries
    .ccrm-ui-field:first-of-type {
        width: auto !important;
        flex-basis: auto !important;
    }

    html body .ccrm-ui-scope-tabs {
        width: 100% !important;
        justify-content: stretch !important;
    }

    html body .ccrm-ui-scope-tab {
        flex: 1 1 0 !important;
        padding-inline: 12px !important;
    }

    html body .ccrm-ui-action,
    html body .ccrm-ui-action-button {
        width: 100% !important;
    }

    html body .ccrm-ui-header-action {
        min-height: 54px !important;
    }
}

@media (max-width: 560px) {
    html body.ccrm-page-deliveries
    .ccrm-ui-filter-form--deliveries {
        grid-template-columns: 1fr !important;
    }

    html body .ccrm-ui-label {
        min-height: 22px !important;
        line-height: 22px !important;
    }
}

/* CENTER CRM STAGE 9.3.15 UI POLISH END */

/* CENTER CRM STAGE 9.3.16 CLIENT FORM START */

html body .client-editor-heading {
    margin-bottom: 12px !important;
}

html body .client-editor-heading h1 {
    margin-bottom: 6px !important;
    font-size: clamp(1.8rem, 3.2vw, 2.75rem) !important;
}

html body .client-editor-heading .eyebrow {
    margin-bottom: 5px !important;
}

html body .client-editor-heading .muted {
    margin: 0 !important;
    font-size: 0.9rem !important;
}

html body .client-editor-form {
    display: grid !important;
    gap: 10px !important;
}

html body .client-form-layout {
    display: grid !important;
    grid-template-columns:
        minmax(320px, 0.82fr)
        minmax(520px, 1.38fr) !important;
    grid-template-areas:
        "client request"
        "delivery request" !important;
    align-items: stretch !important;
    gap: 10px !important;
}

html body .client-editor-section-client {
    grid-area: client !important;
}

html body .client-editor-section-request {
    grid-area: request !important;
}

html body .client-editor-section-delivery {
    grid-area: delivery !important;
}

html body .client-editor-section {
    min-width: 0 !important;
    padding: 14px 16px !important;
}

html body .client-editor-section-title {
    margin-bottom: 12px !important;
    align-items: center !important;
    gap: 10px !important;
}

html body .client-editor-section-title > span {
    width: 30px !important;
    height: 30px !important;
    font-size: 0.72rem !important;
}

html body .client-editor-section-title h2 {
    font-size: 1rem !important;
    line-height: 1.1 !important;
}

html body .client-editor-section-title p {
    margin-top: 2px !important;
    font-size: 0.72rem !important;
    line-height: 1.3 !important;
}

html body .client-editor-form .form-grid {
    gap: 9px 10px !important;
}

html body .client-editor-form .field {
    gap: 5px !important;
    font-size: 0.75rem !important;
}

html body .client-editor-form .field > label,
html body .client-editor-form .client-field-label {
    color: #ededed !important;
    font-weight: 750 !important;
}

html body .client-editor-form .field input:not([type="file"]),
html body .client-editor-form .field select {
    min-height: 39px !important;
    height: 39px !important;
    padding: 7px 10px !important;
    border-radius: 9px !important;
}

html body .client-editor-form .field textarea {
    min-height: 66px !important;
    padding: 8px 10px !important;
    border-radius: 9px !important;
    resize: vertical !important;
}

html body .client-editor-form .field-help {
    font-size: 0.67rem !important;
    line-height: 1.3 !important;
}

html body .client-editor-form .field-errors {
    font-size: 0.68rem !important;
}

html body .client-editor-form .field-span-3 {
    grid-column: span 3 !important;
}

html body .client-request-grid {
    align-content: start !important;
}

html body .client-operator-comment textarea {
    min-height: 74px !important;
}

html body .client-delivery-comment textarea {
    min-height: 72px !important;
}

html body .client-auto-branch-field select.is-auto-branch {
    pointer-events: none !important;
    border-color: rgba(246, 197, 67, 0.3) !important;
    background:
        linear-gradient(
            90deg,
            rgba(246, 197, 67, 0.06),
            transparent 55%
        ),
        #1b1b1b !important;
    color: #f5f5f5 !important;
}

html body .client-screenshot-input {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    min-height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    border: 0 !important;
    white-space: nowrap !important;
}

html body .client-upload-zone {
    display: flex !important;
    min-height: 54px !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 8px 10px !important;
    border: 1px dashed #4a4a4a !important;
    border-radius: 9px !important;
    background: #181818 !important;
    color: #eeeeee !important;
    cursor: pointer !important;
    transition:
        border-color 0.15s ease,
        background 0.15s ease !important;
}

html body .client-upload-zone:hover,
html body .client-upload-zone:focus-visible,
html body .client-upload-zone.is-dragover {
    border-color: var(--brand) !important;
    background: rgba(246, 197, 67, 0.06) !important;
    outline: none !important;
}

html body .client-upload-zone.has-files {
    border-style: solid !important;
    border-color: rgba(246, 197, 67, 0.36) !important;
}

html body .client-upload-icon {
    display: grid !important;
    width: 30px !important;
    height: 30px !important;
    flex: 0 0 30px !important;
    place-items: center !important;
    border-radius: 8px !important;
    background: var(--brand) !important;
    color: #101010 !important;
    font-size: 1.1rem !important;
    font-weight: 900 !important;
}

html body .client-upload-zone > span:last-child {
    display: grid !important;
    min-width: 0 !important;
    gap: 2px !important;
}

html body .client-upload-zone strong {
    font-size: 0.76rem !important;
}

html body .client-upload-zone small {
    color: var(--text-muted) !important;
    font-size: 0.66rem !important;
    font-weight: 500 !important;
}

html body .client-upload-feedback.is-error {
    color: #ff8885 !important;
}

html body .client-upload-previews {
    display: flex !important;
    min-width: 0 !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
}

html body .client-upload-preview {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) 22px !important;
    width: min(100%, 240px) !important;
    min-height: 46px !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 3px 5px 3px 3px !important;
    border: 1px solid #333333 !important;
    border-radius: 8px !important;
    background: #171717 !important;
}

html body .client-upload-preview img {
    width: 42px !important;
    height: 40px !important;
    border-radius: 6px !important;
    object-fit: cover !important;
}

html body .client-upload-preview > span {
    min-width: 0 !important;
    overflow: hidden !important;
    color: #aaaaaa !important;
    font-size: 0.62rem !important;
    line-height: 1.25 !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

html body .client-upload-remove {
    display: inline-grid !important;
    width: 22px !important;
    height: 22px !important;
    min-height: 22px !important;
    padding: 0 !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: 6px !important;
    background: #292929 !important;
    color: #cccccc !important;
    cursor: pointer !important;
}

html body .client-upload-remove:hover {
    background: rgba(239, 83, 80, 0.18) !important;
    color: #ff8d8b !important;
}

html body .client-editor-actions {
    bottom: 10px !important;
    padding: 6px !important;
    gap: 6px !important;
    border-radius: 11px !important;
}

html body .client-editor-actions .button {
    min-height: 40px !important;
    padding: 0 16px !important;
}

@media (max-width: 980px) {
    html body .client-form-layout {
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "client"
            "request"
            "delivery" !important;
    }
}

@media (max-width: 700px) {
    html body .client-editor-section {
        padding: 14px !important;
    }

    html body .client-request-grid {
        grid-template-columns: 1fr 1fr !important;
    }

    html body .client-request-grid .field-span-3 {
        grid-column: span 2 !important;
    }
}

@media (max-width: 560px) {
    html body .client-contact-grid,
    html body .client-request-grid,
    html body .client-delivery-grid {
        grid-template-columns: 1fr !important;
    }

    html body .client-editor-form .field-span-2,
    html body .client-editor-form .field-span-3 {
        grid-column: auto !important;
    }
}

/* CENTER CRM STAGE 9.3.16 CLIENT FORM END */


/* CENTER CRM 0.11.72 — square minimal brand v5 */
html body a.brand.brand-image.center-brand-final {
    flex: 0 0 214px !important;
    width: 214px !important;
    min-width: 214px !important;
    max-width: 214px !important;
    height: 64px !important;
    min-height: 64px !important;
    margin-right: 26px !important;
}
html body a.brand.brand-image.center-brand-final
> img.brand-logo-image.center-brand-logo-final {
    width: 204px !important;
    min-width: 204px !important;
    max-width: 204px !important;
    height: auto !important;
    max-height: 58px !important;
    object-fit: contain !important;
    object-position: left center !important;
}
html body a.brand.brand-image.center-brand-final:hover
> img.brand-logo-image.center-brand-logo-final {
    opacity: .96 !important;
}
@media (max-width: 1180px) {
    html body a.brand.brand-image.center-brand-final {
        flex-basis: 190px !important;
        width: 190px !important;
        min-width: 190px !important;
        max-width: 190px !important;
        margin-right: 20px !important;
    }
    html body a.brand.brand-image.center-brand-final
    > img.brand-logo-image.center-brand-logo-final {
        width: 182px !important;
        min-width: 182px !important;
        max-width: 182px !important;
        max-height: 54px !important;
    }
}
@media (max-width: 760px) {
    html body a.brand.brand-image.center-brand-final {
        flex-basis: 164px !important;
        width: 164px !important;
        min-width: 164px !important;
        max-width: 164px !important;
        height: 56px !important;
        min-height: 56px !important;
        margin-right: 12px !important;
    }
    html body a.brand.brand-image.center-brand-final
    > img.brand-logo-image.center-brand-logo-final {
        width: 156px !important;
        min-width: 156px !important;
        max-width: 156px !important;
        max-height: 48px !important;
    }
}
@media (max-width: 520px) {
    html body a.brand.brand-image.center-brand-final {
        flex-basis: 138px !important;
        width: 138px !important;
        min-width: 138px !important;
        max-width: 138px !important;
        margin-right: 9px !important;
    }
    html body a.brand.brand-image.center-brand-final
    > img.brand-logo-image.center-brand-logo-final {
        width: 132px !important;
        min-width: 132px !important;
        max-width: 132px !important;
        max-height: 44px !important;
    }
}