﻿body.as-shell {
    min-height: 100vh;
    margin: 0;
    background: radial-gradient(circle at top, rgba(22, 163, 74, 0.10), transparent 26%), linear-gradient(180deg, #f6f8fb 0%, #eef3f8 100%);
    color: #172033;
    font-family: "DM Sans", sans-serif;
}

/* Aplicar cobro */
.as-editor-overlay-host {
    overflow: visible;
    position: relative;
}

.as-editor-overlay-host:focus-within {
    z-index: 30;
}

.collection-page.collection-workspace {
    display: grid;
    gap: 1rem;
}

.collection-heading {
    align-items: center;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: auto minmax(0, 1fr) auto;
}

.collection-back {
    align-items: center;
    background: #e7edf4;
    border-radius: 0.65rem;
    color: #28405f;
    display: inline-flex;
    font-size: 1.25rem;
    height: 2.65rem;
    justify-content: center;
    text-decoration: none;
    width: 2.65rem;
}

.collection-back:hover,
.collection-back:focus-visible {
    background: #d8e2ec;
    color: #10233e;
}

.collection-heading__copy h1 {
    color: #10233e;
    font-family: "Manrope", sans-serif;
    font-size: clamp(1.35rem, 2.2vw, 1.75rem);
    font-weight: 800;
    letter-spacing: -0.03em;
    margin: 0;
}

.collection-heading__copy p {
    color: #61728a;
    font-size: 0.82rem;
    margin: 0.15rem 0 0;
}

.collection-progress {
    align-items: center;
    display: flex;
    gap: 0.45rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.collection-progress li {
    background: #e7edf4;
    border-radius: 999px;
    color: #58708d;
    font-size: 0.78rem;
    font-weight: 750;
    padding: 0.48rem 0.8rem;
    white-space: nowrap;
}

.collection-progress li.is-active {
    background: #dff7f1;
    color: #087b68;
}

.collection-context {
    align-items: end;
    display: grid;
    gap: 1.25rem;
    grid-template-columns: minmax(430px, 1.7fr) minmax(260px, 1fr) minmax(150px, auto);
    padding: 1rem 1.1rem;
}

.collection-context__selectors {
    display: grid;
    gap: 0.85rem;
    grid-template-columns: minmax(210px, 0.9fr) minmax(280px, 1.35fr);
}
/*fix extrapadding cltoolbar*/
    .collection-context__selectors.cl-toolbar {
        padding: 0 !important;
    }

.collection-context__label,
.collection-balance > span {
    color: #52647d;
    display: block;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    margin-bottom: 0.25rem;
    text-transform: uppercase;
}

.collection-tax-data {
    align-self: center;
    min-width: 0;
}

.collection-tax-data strong,
.collection-tax-data > span:last-child {
    color: #17304f;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.collection-tax-data strong {
    font-size: 0.85rem;
}

.collection-tax-data > span:last-child {
    color: #63758e;
    font-size: 0.75rem;
    margin-top: 0.18rem;
}

.collection-balance {
    align-self: center;
    text-align: right;
}

.collection-balance strong {
    color: #071a35;
    display: block;
    font-family: "Manrope", sans-serif;
    font-size: 1.35rem;
    font-weight: 850;
    letter-spacing: -0.025em;
}

.collection-balance small {
    background: #e5f6f2;
    border-radius: 999px;
    color: #087b68;
    display: inline-flex;
    font-size: 0.7rem;
    font-weight: 750;
    gap: 0.35rem;
    margin-top: 0.25rem;
    padding: 0.3rem 0.55rem;
}

.collection-balance small i {
    color: #24b99a;
    font-size: 0.45rem;
    margin-top: 0.3rem;
}

.collection-layout {
    align-items: start;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 360px);
}

.collection-accounts {
    overflow: hidden;
    padding: 0;
}

.collection-workspace .collection-accounts .collection-accounts__head {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin: 0;
    padding: 0.95rem 1rem;
}

.collection-title-line {
    align-items: center;
    display: flex;
    gap: 0.65rem;
}

.collection-count {
    align-items: center;
    background: #eaf0f6;
    border-radius: 999px;
    color: #405a77;
    display: inline-flex;
    font-size: 0.72rem;
    font-weight: 800;
    height: 1.55rem;
    justify-content: center;
    min-width: 1.55rem;
    padding: 0 0.35rem;
}

.collection-document-link {
    text-align: left;
}

.collection-accounts__footer {
    align-items: center;
    border-top: 1px solid #e2e9f1;
    color: #60738c;
    display: flex;
    font-size: 0.74rem;
    justify-content: space-between;
    padding: 0.75rem 1rem;
}

.collection-accounts__footer strong {
    color: #526782;
    font-weight: 750;
}

.collection-payment {
    background: #ffffff;
    border: 1px solid #d8e2ec;
    border-radius: 0.7rem;
    box-shadow: 0 14px 32px rgba(16, 35, 62, 0.1);
    overflow: visible;
    position: sticky;
    top: 1rem;
}

.collection-payment__head {
    background: #17385f;
    border-radius: 0.65rem 0.65rem 0 0;
    color: #ffffff;
    padding: 1rem;
}

.collection-payment__head h2 {
    color: inherit;
    font-family: "Manrope", sans-serif;
    font-size: 1.05rem;
    font-weight: 800;
    margin: 0;
}

.collection-payment__head p {
    color: #d7e2ef;
    font-size: 0.75rem;
    margin: 0.2rem 0 0;
}

.collection-payment__body {
    display: grid;
    gap: 0.85rem;
    padding: 1rem;
}

.collection-exchange {
    align-items: end;
    display: none;
    gap: 0.75rem;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.collection-exchange.is-visible {
    display: grid;
}

.collection-conversion {
    background: #f2f6fa;
    border-radius: 0.45rem;
    min-height: 2.65rem;
    padding: 0.45rem 0.65rem;
}

.collection-conversion span,
.collection-conversion strong {
    color: #61738a;
    display: block;
    font-size: 0.68rem;
}

.collection-conversion strong {
    color: #17304f;
    font-size: 0.78rem;
    margin-top: 0.08rem;
}

.collection-receipt-options,
.collection-complement {
    display: grid;
    gap: 0.55rem;
}

.collection-complement {
    background: #f7f9fc;
    border: 1px solid #e3eaf2;
    border-radius: 0.55rem;
    padding: 0.75rem;
}

.collection-payment__actions {
    display: grid;
    gap: 0.7rem;
}

.collection-payment__actions .as-action {
    justify-content: center;
}

.collection-payment__notification {
    background: #f6f9fc;
    border: 1px solid #e1e8f0;
    border-radius: 0.5rem;
    padding: 0.7rem 0.75rem;
}

.collection-payment__process {
    font-size: 0.9rem;
    min-height: 2.75rem;
    text-transform: none;
}

.collection-payment__process:not([class*="dxbDisabled"]) {
    box-shadow: 0 8px 18px rgba(17, 106, 199, 0.24);
}

.collection-payment__process[class*="dxbDisabled"] {
    background: #e7edf4 !important;
    border-color: #d5dee8 !important;
    box-shadow: none !important;
    color: #7a8796 !important;
    cursor: not-allowed;
    opacity: 1;
}

.collection-payment__process[class*="dxbDisabled"] * {
    color: #7a8796 !important;
}

.collection-payment__process-hint {
    color: #6b7888;
    display: block;
    font-size: 0.72rem;
    line-height: 1.35;
    margin-top: -0.25rem;
    text-align: center;
}

.collection-payment__process-hint[hidden] {
    display: none;
}

@media (max-width: 1199.98px) {
    .collection-context {
        grid-template-columns: minmax(0, 1fr) minmax(220px, 0.65fr);
    }

    .collection-balance {
        grid-column: 2;
        grid-row: 1;
    }

    .collection-tax-data {
        grid-column: 1 / -1;
    }

    .collection-layout {
        grid-template-columns: minmax(0, 1fr) minmax(300px, 330px);
    }
}

@media (max-width: 991.98px) {
    .collection-layout {
        grid-template-columns: 1fr;
    }

    .collection-payment {
        position: static;
    }
}

@media (max-width: 767.98px) {
    .collection-heading {
        align-items: start;
        grid-template-columns: auto minmax(0, 1fr);
    }

    .collection-progress {
        grid-column: 1 / -1;
        padding-left: 3.4rem;
    }

    .collection-context,
    .collection-context__selectors {
        grid-template-columns: 1fr;
    }

    .collection-tax-data,
    .collection-balance {
        grid-column: auto;
        grid-row: auto;
        text-align: left;
    }

    .collection-workspace .collection-accounts .collection-accounts__head,
    .collection-accounts__footer {
        align-items: stretch;
        flex-direction: column;
    }

    .collection-accounts__head .as-action {
        justify-content: center;
        width: 100%;
    }
}

/* Dashboard */
[data-ng-cloak] {
    display: none !important;
}

.dashboard-view {
    display: grid;
    gap: 1rem;
}

.dashboard-hero {
    align-items: flex-end;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.dashboard-hero h1 {
    color: #0f172a;
    font-family: "Manrope", sans-serif;
    font-size: clamp(1.45rem, 2.5vw, 2.15rem);
    font-weight: 800;
    letter-spacing: -0.035em;
    margin: 0;
}

.dashboard-hero p {
    color: #64748b;
    margin: 0.4rem 0 0;
}

.dashboard-hero__total {
    color: #0f766e;
    font-family: "Manrope", sans-serif;
    font-size: clamp(1.25rem, 2.2vw, 1.8rem);
    white-space: nowrap;
}

.dashboard-metrics {
    background: #101a2d;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 0.55rem;
    box-shadow: 0 14px 32px rgba(9, 17, 31, 0.16);
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow: hidden;
}

.dashboard-metrics--sales {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dashboard-metric {
    align-items: flex-start;
    color: #ffffff;
    display: flex;
    gap: 0.85rem;
    min-width: 0;
    padding: 1.3rem 1.2rem;
    position: relative;
}

.dashboard-metric + .dashboard-metric::before {
    background: rgba(255, 255, 255, 0.11);
    content: "";
    inset: 1.15rem auto 1.15rem 0;
    position: absolute;
    width: 1px;
}

.dashboard-metric__icon {
    align-items: center;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 0.45rem;
    color: #8bc5ff;
    display: inline-flex;
    flex: 0 0 2.45rem;
    height: 2.45rem;
    justify-content: center;
}

.dashboard-metric--positive .dashboard-metric__icon {
    color: #5ee0aa;
}

.dashboard-metric--warning .dashboard-metric__icon {
    color: #f6c76d;
}

.dashboard-metric__label,
.dashboard-metric__note {
    display: block;
}

.dashboard-metric__label {
    color: #bec9d9;
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.3;
}

.dashboard-metric__value {
    display: block;
    font-family: "Manrope", sans-serif;
    font-size: clamp(1.2rem, 2vw, 1.65rem);
    line-height: 1.2;
    margin: 0.25rem 0 0.35rem;
    overflow-wrap: anywhere;
}

.dashboard-metric__value--name {
    font-size: clamp(1rem, 1.55vw, 1.3rem);
    line-height: 1.3;
}

.dashboard-metric__note {
    color: #93a1b5;
    font-size: 0.72rem;
}

.dashboard-metric__note b {
    color: #dbe5f2;
    font-weight: 700;
}

.dashboard-currency-warning {
    align-items: center;
    background: #fff8e8;
    border: 1px solid #f0d48c;
    border-radius: 0.5rem;
    color: #73510d;
    display: flex;
    font-size: 0.82rem;
    gap: 0.65rem;
    padding: 0.75rem 0.9rem;
}

.dashboard-currency-warning .fa {
    color: #b7790b;
}

.dashboard-layout {
    align-items: start;
    display: grid;
    gap: 1.25rem;
    grid-template-columns: minmax(220px, 260px) minmax(0, 1fr);
}

.dashboard-sidebar,
.dashboard-content {
    display: grid;
    gap: 1.25rem;
    min-width: 0;
}

.dashboard-filters {
    padding: 1rem;
}

.dashboard-card-heading {
    align-items: flex-start;
    border-bottom: 1px solid #e7edf3;
    display: flex;
    gap: 0.7rem;
    margin-bottom: 1rem;
    padding-bottom: 0.9rem;
}

.dashboard-card-heading__icon {
    align-items: center;
    background: #e4f5f0;
    border-radius: 0.4rem;
    color: #087d68;
    display: inline-flex;
    flex: 0 0 2rem;
    height: 2rem;
    justify-content: center;
}

.dashboard-card-heading h2,
.dashboard-chart-card__header h2 {
    color: #172033;
    font-family: "Manrope", sans-serif;
    font-size: 0.95rem;
    font-weight: 800;
    margin: 0;
}

.dashboard-card-heading p,
.dashboard-chart-card__header p {
    color: #718096;
    font-size: 0.76rem;
    line-height: 1.4;
    margin: 0.2rem 0 0;
}

.dashboard-filter-fields {
    display: grid;
    gap: 0.9rem;
}

.dashboard-field label {
    color: #415068;
    display: block;
    font-size: 0.78rem;
    font-weight: 700;
    margin-bottom: 0.38rem;
}

.dashboard-field .form-select,
.dashboard-field .form-control,
.dashboard-field .dx-texteditor {
    border-color: #d7e1eb;
    border-radius: 0.4rem;
    box-shadow: none;
    font-size: 0.82rem;
    min-height: 2.55rem;
}

.dashboard-field .form-select:focus,
.dashboard-field .form-control:focus,
.dashboard-field .dx-state-focused {
    border-color: #15a887;
    box-shadow: 0 0 0 0.18rem rgba(21, 168, 135, 0.13);
}

.dashboard-autocomplete {
    position: relative;
}

.dashboard-autocomplete__control {
    position: relative;
}

.dashboard-autocomplete__control .form-control {
    padding-right: 2.25rem;
}

.dashboard-autocomplete__clear {
    align-items: center;
    background: transparent;
    border: 0;
    color: #718096;
    display: inline-flex;
    height: 2rem;
    justify-content: center;
    padding: 0;
    position: absolute;
    right: 0.35rem;
    top: 50%;
    transform: translateY(-50%);
    width: 2rem;
}

.dashboard-autocomplete__clear:hover,
.dashboard-autocomplete__clear:focus-visible {
    color: #0f766e;
}

.dashboard-autocomplete__options {
    background: #ffffff;
    border: 1px solid #cfd9e5;
    border-radius: 0.42rem;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.16);
    left: 0;
    margin-top: 0.3rem;
    max-height: 17rem;
    overflow-y: auto;
    padding: 0.3rem;
    position: absolute;
    right: 0;
    z-index: 1060;
}

.dashboard-autocomplete__option {
    background: transparent;
    border: 0;
    border-radius: 0.3rem;
    color: #26354c;
    display: block;
    font-size: 0.8rem;
    line-height: 1.35;
    padding: 0.55rem 0.65rem;
    text-align: left;
    width: 100%;
}

.dashboard-autocomplete__option:hover,
.dashboard-autocomplete__option:focus-visible,
.dashboard-autocomplete__option.is-active {
    background: #e9f6f2;
    color: #08745f;
    outline: 0;
}

.dashboard-autocomplete__option--all {
    border-bottom: 1px solid #e7edf3;
    border-radius: 0.3rem 0.3rem 0 0;
    color: #526076;
    font-weight: 700;
    margin-bottom: 0.2rem;
}

.dashboard-autocomplete__empty {
    color: #718096;
    font-size: 0.78rem;
    margin: 0;
    padding: 0.7rem 0.65rem;
}

.dashboard-filter-action {
    margin-top: 1rem;
    width: 100%;
}

.dashboard-chart-card {
    overflow: hidden;
}

.dashboard-chart-card__header {
    align-items: flex-start;
    background: #f8fafc;
    border-bottom: 1px solid #e6ebf1;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    min-height: 4.2rem;
    padding: 1rem 1.15rem;
}

.dashboard-chart-total {
    color: #0f766e;
    font-family: "Manrope", sans-serif;
    font-size: 1.15rem;
    text-align: right;
    white-space: nowrap;
}

.dashboard-chart-option {
    margin-top: 0.35rem;
}

.dashboard-chart-option .dx-checkbox-text {
    color: #64748b;
    font-family: "DM Sans", sans-serif;
    font-size: 0.76rem;
}

.dashboard-chart {
    min-height: 320px;
    padding: 0.75rem;
}

.dashboard-chart--pie {
    min-height: 390px;
}

.dashboard-chart--customers {
    min-height: 440px;
    padding: 1rem 1.25rem 1.25rem;
}

.dashboard-grid {
    border-top: 1px solid #e6ebf1;
    padding: 1rem;
}

.cashflow-hero {
    align-items: center;
}

.cashflow-rate {
    background: #e4f5f0;
    border: 1px solid #bce8dc;
    border-radius: 0.45rem;
    color: #315e56;
    padding: 0.65rem 0.85rem;
    text-align: right;
}

.cashflow-rate span,
.cashflow-rate strong {
    display: block;
}

.cashflow-rate span {
    font-size: 0.72rem;
    font-weight: 650;
}

.cashflow-rate strong {
    color: #08745f;
    font-family: "Manrope", sans-serif;
    font-size: 0.95rem;
    margin-top: 0.1rem;
}

.cashflow-filters {
    padding: 1rem;
}

.cashflow-filter-fields {
    align-items: end;
    display: grid;
    gap: 0.85rem;
    grid-template-columns: minmax(160px, 1.1fr) repeat(2, minmax(135px, 0.8fr)) minmax(190px, 1.35fr) auto;
}

.cashflow-filter-action {
    min-height: 2.55rem;
    white-space: nowrap;
}

.cashflow-filter-note {
    color: #718096;
    font-size: 0.74rem;
    margin: 0.65rem 0 0;
}

.cashflow-metrics {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.cashflow-net .dashboard-metric__icon {
    color: #5ee0aa;
}

.cashflow-net--negative .dashboard-metric__icon {
    color: #f4a07a;
}

.cashflow-primary-grid {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: minmax(0, 1.65fr) minmax(290px, 1fr);
}

.cashflow-primary-grid > * {
    min-width: 0;
}

.cashflow-monthly-chart,
.cashflow-category-chart {
    min-height: 355px;
}

.cashflow-balances {
    overflow: hidden;
}

.cashflow-balance-table {
    padding: 0.35rem 1.15rem 1rem;
}

.cashflow-balance-row {
    align-items: center;
    border-bottom: 1px solid #e7edf3;
    color: #334155;
    display: grid;
    font-size: 0.8rem;
    gap: 1rem;
    grid-template-columns: minmax(220px, 1.7fr) minmax(75px, 0.45fr) minmax(120px, 0.8fr) minmax(130px, 0.8fr);
    padding: 0.75rem 0.45rem;
}

.cashflow-balance-row > :nth-child(n+3) {
    text-align: right;
}

.cashflow-balance-row--head {
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 700;
}

.cashflow-empty {
    color: #718096;
    font-size: 0.82rem;
    margin: 0;
    padding: 1.25rem;
}

@media (max-width: 1199.98px) {
    .dashboard-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-metric:nth-child(3)::before {
        display: none;
    }

    .dashboard-metric:nth-child(n+3) {
        border-top: 1px solid rgba(255, 255, 255, 0.11);
    }

    .cashflow-filter-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cashflow-filter-action {
        width: 100%;
    }
}

@media (max-width: 991.98px) {
    .dashboard-layout {
        grid-template-columns: 1fr;
    }

    .dashboard-sidebar {
        grid-template-columns: 1fr;
    }

    .dashboard-filter-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cashflow-primary-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .dashboard-hero {
        align-items: flex-start;
        flex-direction: column;
    }

    .dashboard-metrics,
    .dashboard-sidebar {
        grid-template-columns: 1fr;
    }

    .dashboard-metric + .dashboard-metric::before {
        display: none;
    }

    .dashboard-metric:nth-child(n+2) {
        border-top: 1px solid rgba(255, 255, 255, 0.11);
    }

    .dashboard-filter-fields {
        grid-template-columns: 1fr;
    }

    .dashboard-chart-card__header {
        flex-direction: column;
    }

    .dashboard-chart-total {
        text-align: left;
    }

    .dashboard-chart {
        min-height: 280px;
        padding: 0.35rem;
    }

    .cashflow-filter-fields {
        grid-template-columns: 1fr;
    }

    .cashflow-balance-table {
        overflow-x: auto;
    }

    .cashflow-balance-row {
        min-width: 680px;
    }
}

.as-topbar {
    position: sticky;
    top: 0;
    z-index: 1030;
    background: linear-gradient(135deg, #09111f 0%, #101a2d 55%, #172744 100%);
    box-shadow: 0 12px 30px rgba(9, 17, 31, 0.22);
}

.as-topbar__inner {
    max-width: 1480px;
    padding: 1rem 1.5rem;
    transition: max-width 0.24s ease;
}

.as-brand__logo {
    height: 40px;
    width: auto;
}

html,
body.as-shell {
    margin: 0 !important;
    padding: 0 !important;
}

.as-topbar,
.as-topbar .navbar {
    margin: 0 !important;
}

.as-nav {
    gap: 0.35rem;
    margin-left: 1.75rem;
}

.as-nav .nav-link {
    border-bottom: 2px solid transparent;
    border-radius: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.9rem;
    font-weight: 600;
    padding: 0.7rem 0.85rem 0.58rem;
    transition: color 0.2s ease, border-color 0.2s ease;
}

.as-nav .nav-link:hover,
.as-nav .nav-link:focus {
    color: #ffffff;
    background: transparent;
}

.as-nav .nav-link.active {
    color: #ffffff;
    border-bottom-color: #35d997;
}

.as-user {
    align-items: center;
    color: #ffffff;
    display: flex;
    gap: 0.9rem;
}

.as-user__utilities {
    align-items: center;
    display: flex;
    gap: 0.55rem;
}

.as-user__icon,
.as-user__width-toggle {
    align-items: center;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 999px;
    color: #ffffff;
    display: inline-flex;
    flex: 0 0 38px;
    height: 38px;
    justify-content: center;
    padding: 0;
    width: 38px;
}

.as-user__width-toggle {
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.as-user__width-toggle:hover {
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(255, 255, 255, 0.22);
    color: #9ff0c8;
}

.as-user__width-toggle:focus-visible {
    box-shadow: 0 0 0 0.2rem rgba(159, 240, 200, 0.24);
    outline: 2px solid #9ff0c8;
    outline-offset: 2px;
}

.as-user__width-toggle .bi[hidden] {
    display: none;
}

.as-user__name,
.as-user__logout {
    color: #ffffff;
    font-weight: 600;
    text-decoration: none;
}

.as-user__name:hover,
.as-user__logout:hover {
    color: #9ff0c8;
}

.as-main {
    padding: 1rem 0 2.5rem;
}

.as-page {
    max-width: 1480px;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    transition: max-width 0.24s ease;
}

.as-page.as-layout-width--expanded,
.as-topbar__inner.as-layout-width--expanded {
    max-width: 100%;
}

.as-card {
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(226, 232, 240, 0.95);
    border-radius: 0.5rem;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06);
}

/* Let popup layers participate in the page stacking order. A backdrop filter
   would trap them in the card's own stacking context. */
.as-popup-host {
    position: relative;
    overflow: visible;
    backdrop-filter: none;
    z-index: auto;
}

.cl-page {
    display: grid;
    gap: 1.5rem;
}

.cl-hero {
    align-items: flex-start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.cl-hero h1,
.cl-page-title {
    color: #0f172a;
    font-family: "Manrope", sans-serif;
    font-size: clamp(1.3rem, 2.5vw, 2rem);
    font-weight: 800;
    letter-spacing: -0.03em;
}

.cl-hero h1 {
    margin: 0;
}

.cl-hero p {
    color: #5a667d;
    font-size: 1rem;
    margin: 0.45rem 0 0;
    max-width: 780px;
}

.cl-actions {
    display: flex;
    gap: 0.75rem;
}

.as-actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.as-actions--end {
    margin-left: auto;
}

.as-action {
    align-items: center;
    border: 1px solid transparent;
    border-radius: 0.4rem;
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: 0.8rem;
    font-weight: 700;
    gap: 0.38rem;
    justify-content: center;
    min-height: 2.25rem;
    padding: 0.45rem 0.72rem;
    text-decoration: none;
}

.as-action--primary {
    background: linear-gradient(135deg, #1675d2 0%, #116ac7 100%);
    box-shadow: 0 5px 12px rgba(17, 106, 199, 0.18);
    color: #ffffff;
}

.as-action--primary:hover,
.as-action--primary:focus {
    background: #0d56a0;
    color: #ffffff;
}

.as-action--edit {
    background: #f4f8fe;
    border-color: #c6daf4;
    color: #116ac7;
}

.as-action--edit:hover,
.as-action--edit:focus {
    background: #e8f1fc;
    border-color: #8bb9eb;
    color: #0d56a0;
}

.as-action--create {
    background: linear-gradient(135deg, #11b67b 0%, #0d9b69 100%);
    box-shadow: 0 5px 12px rgba(13, 155, 105, 0.16);
    color: #ffffff;
}

.as-action--create:hover,
.as-action--create:focus {
    background: #087d57;
    color: #ffffff;
}

.as-action--secondary {
    background: #ffffff;
    border-color: #d7e1eb;
    color: #334155;
}

.as-action--secondary:hover,
.as-action--secondary:focus {
    background: #edf7f4;
    border-color: #94d7c6;
    color: #08745f;
}

.as-action--danger {
    background: #ffffff;
    border-color: #dce5ef;
    color: #7a8799;
}

.as-action--danger:hover,
.as-action--danger:focus {
    background: #fff4f4;
    border-color: #f2b9b9;
    color: #bd3030;
}

.as-action--compact {
    font-size: 0.78rem;
    min-height: 2.1rem;
    padding: 0.4rem 0.62rem;
}

.as-action--icon {
    min-width: 2.1rem;
    padding-left: 0.45rem;
    padding-right: 0.45rem;
}

.cl-toolbar,
.cl-grid-card {
    padding: 1.35rem;
}

.cl-toolbar {
    overflow: visible;
    position: relative;
    z-index: 20;
}

.cl-grid-card {
    position: relative;
    overflow: visible;
    backdrop-filter: none;
    z-index: auto;
}

.cl-toolbar__grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.mail-template-filters {
    grid-template-columns: minmax(260px, 420px);
}

.cl-field label {
    color: #334155;
    display: block;
    font-size: 0.9rem;
    font-weight: 700;
    margin-bottom: 0.45rem;
}

.cl-field input:not([type="radio"]):not([type="checkbox"]):not([class*="dxeEditArea"]),
.cl-field select {
    background: #f9fbfd;
    border: 1px solid #d8e2ee;
    border-radius: 0.5rem;
    box-shadow: none;
    color: #0f172a;
    min-height: 48px;
    padding: 0.7rem 0.95rem;
    width: 100%;
}

.cl-field input:not([type="radio"]):not([type="checkbox"]):not([class*="dxeEditArea"]):focus,
.cl-field select:focus {
    border-color: #20b47b;
    box-shadow: 0 0 0 0.25rem rgba(32, 180, 123, 0.14);
    outline: 0;
}

.cl-toolbar .input-group {
    flex-wrap: nowrap;
}

.cl-toolbar .input-group > .form-control {
    min-width: 0;
    width: 1%;
}

.cl-toolbar .input-group .btn {
    align-items: center;
    display: inline-flex;
    height: 48px;
    justify-content: center;
    padding: 0;
    width: 42px;
}

.cl-toolbar .dropdown-menu {
    z-index: 1055;
}

.cl-field--actions {
    align-self: end;
    display: flex;
    justify-content: flex-end;
}

.cl-field--actions .btn {
    border-radius: 0.5rem;
    min-height: 48px;
    padding-left: 1rem;
    padding-right: 1rem;
}

.cl-grid-card__head {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.cl-grid-card__title {
    margin: 0;
}

.cl-grid-card__title h2 {
    font-family: "Manrope", sans-serif;
    font-size: 1.1rem;
    font-weight: 800;
    margin: 0;
}

.cl-grid-card__title p {
    color: #64748b;
    margin: 0.3rem 0 0;
}

.cl-badge {
    background: rgba(16, 185, 129, 0.12);
    border: 1px solid rgba(16, 185, 129, 0.18);
    border-radius: 0.35rem;
    color: #0f9f63;
    display: inline-flex;
    font-size: 0.88rem;
    font-weight: 700;
    padding: 0.55rem 0.9rem;
}

/* DevExpress popup edit forms can extend beyond a short or empty grid. */
.cl-grid-shell {
    overflow: visible;
    position: relative;
}

.cl-grid-shell.is-loading::after {
    background: rgba(255, 255, 255, 0.66);
    content: "";
    inset: 0;
    position: absolute;
    z-index: 5;
}

.cl-grid-shell.is-loading::before {
    animation: cl-spin 0.8s linear infinite;
    border: 2px solid #d7e3dc;
    border-radius: 50%;
    border-top-color: #0d9b69;
    content: "";
    height: 26px;
    left: calc(50% - 13px);
    position: absolute;
    top: calc(50% - 13px);
    width: 26px;
    z-index: 6;
}

@keyframes cl-spin {
    to {
        transform: rotate(360deg);
    }
}

.cl-grid {
    width: 100%;
}

.cl-label,
.cl-label:visited,
.cl-label:hover,
.cl-label:focus {
    color: #172033 !important;
    font-weight: 700;
    text-decoration: none;
}

.company-grid {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.company-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.company-card__visual {
    aspect-ratio: 22 / 13;
    align-items: center;
    background: #f4f7fa;
    border-bottom: 1px solid #e3e9f1;
    display: flex;
    justify-content: center;
    max-height: 300px;
    overflow: hidden;
    padding: 1.25rem;
    width: 100%;
}

.company-card__logo-link {
    display: block;
    height: 100%;
    width: 100%;
}

.company-card__logo-link:focus-visible {
    outline: 3px solid rgba(17, 106, 199, 0.45);
    outline-offset: -3px;
}

.company-card__logo-link img {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.company-logo {
    display: block;
    height: auto;
    max-height: 11rem;
    max-width: 100%;
    object-fit: contain;
}

.company-card__body {
    flex: 1;
    min-width: 0;
    padding: 1.2rem;
}

.company-card__heading {
    align-items: flex-start;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
}

.company-card__title,
.company-card__title:visited,
.company-card__title:hover,
.company-card__title:focus {
    color: #172033 !important;
    font-family: "Manrope", sans-serif;
    font-size: 1.05rem !important;
    font-weight: 800;
    overflow-wrap: anywhere;
    text-decoration: none;
}

.company-card__details {
    display: grid;
    gap: 0.75rem;
    margin: 1rem 0 0;
}

.company-card__details div {
    min-width: 0;
}

.company-card__details dt {
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 750;
    margin-bottom: 0.15rem;
}

.company-card__details dd {
    color: #334155;
    font-size: 0.86rem;
    line-height: 1.45;
    margin: 0;
    overflow-wrap: anywhere;
}

.company-logo-shell {
    align-items: center;
    background: #f7f9fc;
    border: 1px solid #e3e9f1;
    border-radius: 0.5rem;
    display: flex;
    justify-content: center;
    min-height: 11rem;
    padding: 1rem;
}

.company-detail-page .panel-heading + .panel-body > .row {
    --bs-gutter-y: 1rem;
}

.cl-grid-actions {
    white-space: nowrap;
}

.client-page,
.import-page {
    display: grid;
    gap: 1.5rem;
}

.client-page > .row {
    --bs-gutter-y: 1.5rem;
}

.cl-page-title {
    margin: 0 0 1.25rem;
}

.client-page .panel {
    background: #fff;
    border: 1px solid #e3e9f1;
    border-radius: 0.5rem;
    box-shadow: 0 6px 18px rgba(23, 32, 51, 0.045);
    margin-bottom: 1.25rem;
    overflow: hidden;
}

.client-page .panel-heading {
    align-items: center;
    background: #f8fafc;
    border-bottom: 1px solid #e3e9f1;
    display: flex;
    gap: 0.75rem;
    justify-content: space-between;
    min-height: 3.85rem;
    padding: 0.85rem 1.1rem;
}

.client-page .panel-heading .title-panel {
    color: #172033;
    font-family: "Manrope", sans-serif;
    font-size: 0.95rem;
    font-weight: 750;
    margin: 0;
}

.as-form-actions,
.client-popup-actions {
    align-items: center;
    border-top: 1px solid #e8edf3;
    display: flex;
    gap: 0.55rem;
    justify-content: flex-end;
    margin-top: 1.1rem;
    padding-top: 1rem;
}

.as-edit-form,
.client-edit-form {
    padding: 1.25rem;
}

.as-edit-form .as-form-field label,
.client-edit-form .client-edit-field label {
    color: #415068;
    display: block;
    font-size: 0.78rem;
    font-weight: 750;
    letter-spacing: 0.01em;
    margin: 0 0 0.4rem;
}

.as-edit-form .as-form-check,
.client-edit-form .client-edit-check {
    align-items: flex-end;
    display: flex;
    min-height: 4rem;
}

.as-edit-form .dxeTextBox,
.as-edit-form .dxeButtonEdit,
.client-edit-form .dxeTextBox,
.client-edit-form .dxeButtonEdit {
    border-color: #d7e1eb;
    border-radius: 0.4rem;
    box-shadow: none;
}

.as-edit-form .dxeEditArea,
.client-edit-form .dxeEditArea {
    min-height: 2.35rem;
    padding: 0.45rem 0.65rem;
}

.as-readonly.dxeButtonEdit,
.as-readonly.dxeTextBox,
.as-readonly .dxic,
.dxic:has(.as-readonly),
.as-readonly .dxeEditArea,
.as-readonly .dxeEditAreaSys,
.as-readonly input {
    background-color: #f1f7f6;
    color: #64748b;
    cursor: default;
}

.client-page .client-comments {
    align-self: start;
    margin-top: 3.25rem;
}

.client-comments {
    isolation: isolate;
}

.client-comments .panel-body {
    padding: 1rem;
}

.client-comment-compose .dxeMemo {
    border-color: #d7e1eb;
    border-radius: 0.4rem;
    box-shadow: none;
}

.client-comment-compose .dxeMemo textarea {
    padding: 0.65rem;
}

.client-comment-compose .as-actions {
    margin-top: 0.7rem;
}

.client-comment-list {
    border-top: 1px solid #e8edf3;
    margin-top: 1rem;
    padding-top: 0.4rem;
}

.client-comment {
    border-bottom: 1px solid #edf1f5;
    padding: 0.8rem 0;
}

.client-comment:last-child {
    border-bottom: 0;
}

.client-comment__meta {
    align-items: center;
    color: #334155;
    display: flex;
    font-size: 0.78rem;
    justify-content: space-between;
    margin-bottom: 0.3rem;
}

.client-comment__meta time {
    color: #7a8799;
    font-size: 0.72rem;
}

.client-comment__body {
    color: #46566e;
    font-size: 0.82rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.client-page .panel-heading .btn,
.client-page .panel-body .btn {
    align-items: center;
    border: 1px solid #d7e1eb;
    border-radius: 0.4rem;
    color: #334155;
    display: inline-flex;
    font-size: 0.8rem;
    font-weight: 700;
    gap: 0.35rem;
    justify-content: center;
    min-height: 2rem;
    padding: 0.35rem 0.65rem;
}

.client-page .panel-heading .btn:hover,
.client-page .panel-body .btn:hover {
    background: #edf7f4;
    border-color: #94d7c6;
    color: #08745f;
}

.client-page .panel-body {
    padding: 1.1rem;
}

.client-page .panel-body .insert-space {
    margin-bottom: 0.9rem;
}

.client-page .panel-body label,
.import-fields label {
    color: #415068;
    display: block;
    font-size: 0.78rem;
    font-weight: 750;
    letter-spacing: 0.01em;
    margin: 0.4rem 0 0.4rem;
}

.as-detail-view > .row {
    --bs-gutter-y: 0.85rem;
    margin-bottom: 0.35rem;
}

.as-detail-view .Data-Info,
.as-detail-view .Data-info {
    background-color: aliceblue;
    color: #172033;
    font-weight: 650;
    line-height: 1.45;
    min-height: 2.35rem;
    padding-top: 0.35rem;
}

.recurring-detail-page .label_format {
    display: inline-block;
    font-weight: 700;
    margin-bottom: 0.35rem;
    max-width: 100%;
}

.recurring-detail-page .panel-heading .panel-title {
    color: #172033;
    font-family: "Manrope", sans-serif;
    font-size: 0.95rem;
    font-weight: 750;
    margin: 0;
}

.recurring-detail-value--number {
    text-align: right;
}

.recurring-detail-alerts:empty {
    display: none;
}

.recurring-detail-alerts .alert {
    margin-bottom: 1rem;
}

.recurring-detail-tabs {
    overflow: visible;
    padding: 0.4rem;
}

.recurring-grid-head {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding: 1rem 0.75rem;
}

.recurring-grid-head h3 {
    color: #172033;
    font-family: "Manrope", sans-serif;
    font-size: 1rem;
    font-weight: 800;
    margin: 0;
}

.recurring-grid-head p {
    color: #64748b;
    font-size: 0.82rem;
    margin: 0.25rem 0 0;
}

.recurring-grid-actions {
    flex-wrap: nowrap;
    justify-content: center;
}

.recurring-detail-date-field {
    position: static;
}

.recurring-detail-summary {
    margin-top: 0.75rem;
}


.import-card {
    padding: clamp(1.1rem, 2.5vw, 1.75rem);
}

.import-card__heading {
    align-items: flex-start;
    border-bottom: 1px solid #e8edf3;
    display: flex;
    gap: 0.85rem;
    margin-bottom: 1.25rem;
    padding-bottom: 1.1rem;
}

.import-card__icon {
    align-items: center;
    background: #e1f6ef;
    border-radius: 0.5rem;
    color: #07816a;
    display: inline-flex;
    flex: 0 0 2.35rem;
    height: 2.35rem;
    justify-content: center;
}

.import-card__heading h2 {
    color: #172033;
    font-family: "Manrope", sans-serif;
    font-size: 1rem;
    font-weight: 750;
    margin: 0 0 0.2rem;
}

.import-card__heading p,
.import-fields .help-block {
    color: #667085;
    font-size: 0.82rem;
    line-height: 1.5;
    margin: 0;
}

.import-fields .form-control {
    border-color: #d7e1eb;
    border-radius: 0.4rem;
    color: #243249;
    min-height: 2.55rem;
}

.import-fields .form-control:focus {
    border-color: #15ad8d;
    box-shadow: 0 0 0 0.18rem rgba(21, 173, 141, 0.14);
}

.import-file {
    border: 1px dashed #aebdcc;
    border-radius: 0.4rem;
    padding: 0.25rem;
}

.import-file .form-control {
    border: 0;
    box-shadow: none;
}

.import-actions {
    border-top: 1px solid #e8edf3;
    display: flex;
    justify-content: flex-end;
    margin-top: 0.7rem;
    padding-top: 1.15rem;
}

.import-guide {
    align-items: start;
    background: #f8fbfe;
    border-left: 4px solid #1976d2;
    display: grid;
    gap: 1.25rem;
    grid-template-columns: minmax(13rem, 0.8fr) minmax(0, 1.5fr);
    padding: 1.25rem 1.5rem;
}

.import-guide h2 {
    color: #172033;
    font-family: "Manrope", sans-serif;
    font-size: 1rem;
    font-weight: 750;
    margin: 0 0 0.35rem;
}

.import-guide p,
.import-guide li {
    color: #52637a;
    font-size: 0.88rem;
    line-height: 1.55;
}

.import-guide p {
    margin: 0;
}

.import-guide ol {
    display: grid;
    gap: 0.4rem;
    margin: 0;
    padding-left: 1.3rem;
}

.fr-popup-intro h3 {
    color: #172033;
    font-family: "Manrope", sans-serif;
    font-size: 1.05rem;
    font-weight: 800;
    margin: 0;
}

.fr-popup-intro p {
    color: #64748b;
    font-size: 0.86rem;
    margin: 0.3rem 0 0;
}

.fr-status {
    align-items: center;
    background: #f9fbfd;
    border: 1px solid #d8e2ee;
    border-radius: 0.5rem;
    display: flex;
    min-height: 48px;
    padding: 0.45rem 0.75rem;
}

.fr-status table {
    width: 100%;
}

.fr-grid-card {
    min-width: 0;
}

.fr-grid .as-actions {
    flex-wrap: nowrap;
    justify-content: center;
}

.fr-popup-content {
    padding: 0.35rem 0.2rem 0.15rem;
}

.fr-popup-intro {
    align-items: flex-start;
    display: flex;
    gap: 0.8rem;
    margin-bottom: 1.25rem;
}

.fr-popup-icon {
    align-items: center;
    background: #eaf8f3;
    border-radius: 50%;
    color: #07816a;
    display: inline-flex;
    flex: 0 0 2.5rem;
    height: 2.5rem;
    justify-content: center;
}

.fr-contract-options {
    display: grid;
    gap: 0.75rem;
}

.fr-contract-option {
    background: #f9fbfd;
    border: 1px solid #dfe7ef;
    border-radius: 0.5rem;
    padding: 0.9rem 1rem;
}

.fr-contract-option > span {
    color: #64748b;
    display: block;
    font-size: 0.82rem;
    margin: 0.35rem 0 0 1.55rem;
}

.fr-popup-content .as-form-actions,
.fr-popup-content .client-popup-actions {
    border-top: 1px solid #e8edf3;
    margin-top: 1.2rem;
    padding-top: 1rem;
}

.billing-page {
    gap: 1.35rem;
}

.billing-nav {
    align-items: center;
    align-self: start;
    background: #eef3f8;
    border: 1px solid #dce5ef;
    border-radius: 0.55rem;
    display: inline-flex;
    gap: 0.25rem;
    padding: 0.3rem;
}

.billing-nav__item {
    align-items: center;
    border-radius: 0.38rem;
    color: #526076;
    display: inline-flex;
    font-size: 0.8rem;
    font-weight: 700;
    gap: 0.45rem;
    min-height: 2.3rem;
    padding: 0.5rem 0.75rem;
    text-decoration: none;
    transition: background-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}

.billing-nav__item:hover,
.billing-nav__item:focus-visible {
    background: rgba(255, 255, 255, 0.7);
    color: #116ac7;
    outline: 0;
}

.billing-nav__item.is-active {
    background: #ffffff;
    box-shadow: 0 2px 7px rgba(15, 23, 42, 0.09);
    color: #0f172a;
}

.billing-nav__item.is-active i {
    color: #0d9b69;
}

.billing-hero {
    align-items: center;
}

.billing-hero__actions {
    flex: 0 0 auto;
}

.billing-section-heading {
    border-bottom: 1px solid #e8edf3;
    margin: -0.1rem 0 1.05rem;
    padding-bottom: 0.85rem;
}

.billing-section-heading h2 {
    color: #172033;
    font-family: "Manrope", sans-serif;
    font-size: 1rem;
    font-weight: 800;
    margin: 0;
}

.billing-section-heading p {
    color: #64748b;
    font-size: 0.82rem;
    margin: 0.25rem 0 0;
}

.billing-field .dxeButtonEdit,
.billing-field .dxeTextBox {
    border-color: #d7e1eb;
    border-radius: 0.4rem;
    box-shadow: none;
    min-height: 2.65rem;
}

.billing-field input[class*="dxeEditArea"] {
    box-sizing: border-box;
    height: 2.5rem;
    min-height: 0;
    padding: 0.5rem 0.65rem;
}

.billing-field .dxeFocused {
    border-color: #15ad8d;
    box-shadow: 0 0 0 0.18rem rgba(21, 173, 141, 0.14);
}

.billing-search {
    min-height: 2.65rem;
    width: 100%;
}

.billing-grid-card {
    min-width: 0;
}

.billing-concepts-card {
    min-width: 0;
    overflow: visible;
    padding: 0;
}

.billing-concepts-head {
    align-items: center;
    border-bottom: 1px solid #e3e9f1;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding: 1rem 1.1rem;
}

.billing-concepts-head .cl-grid-card__title h2 {
    color: #172033;
    font-family: "Manrope", sans-serif;
    font-size: 0.98rem;
    font-weight: 800;
    margin: 0;
}

.billing-concepts-head .cl-grid-card__title p {
    color: #718096;
    font-size: 0.76rem;
    margin: 0.2rem 0 0;
}

.billing-concepts-table {
    margin: 0;
    min-width: 0;
    overflow-x: auto;
}

.billing-concepts-grid {
    min-width: 760px;
}

div[id^="gridconceptos_DXPEForm_PW-"],
div[id*="gridConceptos_DXPEForm_PW-"] {
    max-width: calc(100vw - 2rem) !important;
    min-width: 0 !important;
    width: min(1040px, calc(100vw - 2rem)) !important;
}

div[id^="gridconceptos_DXPEForm_PW-"] .dxpc-content,
div[id^="gridconceptos_DXPEForm_PW-"] [class*="dxpc-content"],
div[id*="gridConceptos_DXPEForm_PW-"] .dxpc-content,
div[id*="gridConceptos_DXPEForm_PW-"] [class*="dxpc-content"] {
    padding: 0 !important;
}

.billing-concept-editor {
    background: #ffffff;
    max-height: calc(100vh - 3rem);
    overflow-x: hidden;
    overflow-y: auto;
}

.billing-concept-editor__head {
    align-items: flex-start;
    background: #f7f9fc;
    border-bottom: 1px solid #e3e9f1;
    display: flex;
    gap: 0.8rem;
    padding: 1rem 1.25rem;
}

.billing-concept-editor__icon {
    align-items: center;
    background: #e4f5f0;
    border-radius: 0.42rem;
    color: #087d68;
    display: inline-flex;
    flex: 0 0 2.25rem;
    height: 2.25rem;
    justify-content: center;
}

.billing-concept-editor__head h3 {
    color: #172033;
    font-family: "Manrope", sans-serif;
    font-size: 1rem;
    font-weight: 800;
    margin: 0;
}

.billing-concept-editor__head p {
    color: #64748b;
    font-size: 0.78rem;
    margin: 0.25rem 0 0;
}

.billing-concept-form {
    padding: 0.9rem 1.25rem 1.1rem;
}

.billing-concept-form > .row + .row {
    margin-top: 0.05rem;
}

.billing-concept-form > .row {
    --bs-gutter-y: 0.65rem;
}

.billing-concept-retentions {
    border-bottom: 1px solid #e8edf3;
    border-top: 1px solid #e8edf3;
    margin-bottom: 0.2rem;
    margin-top: 0.9rem !important;
    padding-bottom: 0.9rem;
    padding-top: 0.65rem;
}

.billing-concept-total {
    background: #f1f7f6;
    border: 1px solid #d6ebe6;
    border-radius: 0.45rem;
    padding: 0.75rem;
}

.billing-concept-description {
    margin-top: 0.35rem;
}

.billing-concept-description > div,
.billing-concept-description table {
    max-width: 100%;
}

.billing-concept-actions {
    background: #ffffff;
    bottom: 0;
    margin-left: -1.25rem;
    margin-right: -1.25rem;
    padding: 0.9rem 1.25rem 0;
    position: sticky;
    z-index: 3;
}

.billing-concept-actions .as-action {
    min-width: 8.75rem;
}

.billing-grid .billing-status {
    border: 1px solid transparent;
    border-radius: 999px;
    display: inline-flex;
    font-size: 0.72rem;
    font-weight: 750;
    line-height: 1;
    padding: 0.38rem 0.58rem;
    white-space: nowrap;
}

.billing-status--paid {
    background: #e8f8f1;
    border-color: #bdebd8;
    color: #08745f;
}

.billing-status--pending {
    background: #fff8e6;
    border-color: #f2dda1;
    color: #8a6412;
}

.billing-status--cancelled {
    background: #fff0f0;
    border-color: #f2c4c4;
    color: #b12d2d;
}

.billing-row-actions {
    flex-wrap: nowrap;
    justify-content: center;
}

.finance-list-page,
.finance-detail-page,
.collection-page {
    gap: 1.35rem;
}

.finance-grid-card {
    min-width: 0;
}

.finance-grid-card .cl-grid-card__head {
    border-bottom: 1px solid #e8edf3;
    margin: -0.1rem -0.1rem 1rem;
    padding: 0 0.1rem 0.9rem;
}

.finance-grid .dxgvHeader,
.billing-grid .dxgvHeader {
    background: #f6f8fb;
    color: #344054;
    font-family: "DM Sans", sans-serif;
    font-size: 0.76rem;
    font-weight: 750;
}

.finance-grid .dxgvDataRow td,
.billing-grid .dxgvDataRow td {
    color: #334155;
    font-size: 0.8rem;
}

.finance-choice {
    align-items: center;
    background: #f9fbfd;
    border: 1px solid #d7e1eb;
    border-radius: 0.4rem;
    display: flex;
    min-height: 2.65rem;
    padding: 0.45rem 0.7rem;
}

.finance-detail-page > .billing-nav,
.recurring-detail-page > .billing-nav {
    align-self: start;
    margin-bottom: 0.1rem;
}

.billing-document-page .fv-margin {
    margin: 0;
    width: 100%;
}

.billing-document-page h1,
.billing-document-page .cl-page-title {
    color: #0f172a;
    font-family: "Manrope", sans-serif;
    font-size: clamp(1.3rem, 2.5vw, 2rem);
    font-weight: 800;
    letter-spacing: -0.03em;
    margin: 0 0 1.2rem;
}

.billing-document-page .panel-heading .title-panel,
.billing-document-page .panel-heading .panel-title {
    color: #172033;
    font-family: "Manrope", sans-serif;
    font-size: 0.95rem;
    font-weight: 750;
    margin: 0;
}

.collection-page .panel-body > .row {
    --bs-gutter-y: 0.85rem;
    margin-bottom: 0.35rem;
}

.as-shell .panel-body label,
.as-shell .as-form-field > label,
.as-shell .cl-field > label {
    color: #526076;
    font-size: 0.78rem;
    font-weight: 750;
}

.collection-page .Data-Info,
.collection-page .Data-info {
    color: #172033;
    font-weight: 650;
    line-height: 1.45;
    min-height: 2.35rem;
    padding-top: 0.35rem;
}

.collection-page .dxeButtonEdit,
.collection-page .dxeTextBox,
.collection-page .dxeMemo {
    border-color: #d7e1eb;
    border-radius: 0.4rem;
    box-shadow: none;
}

.billing-document-page .panel-heading,
.collection-page .panel-heading {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: space-between;
}

.billing-document-page .panel-heading .as-actions,
.collection-page .panel-heading .as-actions {
    margin-left: auto;
}

.collection-savebar {
    align-items: center;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid #dce5ef;
    border-radius: 0.5rem;
    bottom: 1rem;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.13);
    display: flex;
    gap: 1rem;
    justify-content: flex-end;
    padding: 0.8rem 1rem;
    position: sticky;
    z-index: 20;
}

.collection-page .alert,
.billing-document-page .alert {
    border-radius: 0.45rem;
    font-size: 0.84rem;
}

.as-shell .alert {
    padding-right: 3.25rem;
    position: relative;
}

.as-shell .alert > .finance-alert-close,
.as-shell .alert > .alert-close,
.as-shell .alert > .close {
    align-items: center;
    background: rgba(15, 23, 42, 0.08);
    border: 0;
    border-radius: 0.4rem;
    color: inherit;
    cursor: pointer;
    display: inline-flex;
    font-size: 1rem;
    font-weight: 700;
    height: 2rem;
    justify-content: center;
    line-height: 1;
    opacity: 0.72;
    padding: 0;
    position: absolute;
    right: 0.65rem;
    text-decoration: none;
    top: 0.65rem;
    width: 2rem;
}

.as-shell .alert > .finance-alert-close:hover,
.as-shell .alert > .alert-close:hover,
.as-shell .alert > .close:hover {
    background: rgba(15, 23, 42, 0.14);
    color: inherit;
    opacity: 1;
}

.as-shell .alert > .finance-alert-close:focus-visible,
.as-shell .alert > .alert-close:focus-visible,
.as-shell .alert > .close:focus-visible {
    box-shadow: 0 0 0 0.2rem rgba(15, 109, 190, 0.22);
    outline: 2px solid #0f6dbe;
    outline-offset: 1px;
}

.as-shell .alert > .finance-alert-close i,
.as-shell .alert > .alert-close i {
    pointer-events: none;
}

.as-shell .alert > p:last-child {
    margin-bottom: 0;
}

.finance-popup .panel,
.billing-document-page .dxpc-content .panel {
    border: 0;
    box-shadow: none;
    margin: 0;
}

.finance-popup .panel-body,
.billing-document-page .dxpc-content .panel-body {
    padding: 1rem;
}

@media (max-width: 1199.98px) {
    .as-nav {
        margin-left: 0;
        margin-top: 1rem;
    }

    .as-user {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.65rem;
    }

    .as-user__width-toggle {
        display: none;
    }

    .cl-toolbar__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .as-main {
        padding-top: 1rem;
    }

    .as-page,
    .as-topbar__inner {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .cl-hero {
        flex-direction: column;
    }

    .cl-actions,
    .cl-field--actions {
        width: 100%;
    }

    .cl-actions {
        flex-direction: column;
    }

    .cl-actions > a,
    .cl-field--actions .btn {
        justify-content: center;
        width: 100%;
    }

    .cl-toolbar__grid {
        grid-template-columns: 1fr;
    }

    .cl-toolbar,
    .cl-grid-card {
        padding: 1rem;
    }

    .client-page .panel-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .client-page .panel-heading .as-actions,
    .import-actions {
        width: 100%;
    }

    .client-page .panel-heading .as-actions .as-action,
    .import-actions .as-action {
        flex: 1 1 auto;
    }

    .import-guide {
        grid-template-columns: 1fr;
        padding: 1rem;
    }

    .as-form-actions,
    .client-popup-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .as-form-actions .as-action,
    .client-popup-actions .as-action {
        justify-content: center;
        width: 100%;
    }

    .client-page .client-comments {
        margin-top: 0;
    }

    .recurring-grid-head {
        align-items: stretch;
        flex-direction: column;
    }

    .recurring-grid-head .as-action {
        width: 100%;
    }

    .fr-page .as-actions--end,
    .fr-page .as-actions--end .as-action {
        justify-content: center;
        width: 100%;
    }

    .billing-nav {
        align-items: stretch;
        display: flex;
        overflow-x: auto;
        width: 100%;
    }

    .billing-nav__item {
        flex: 0 0 auto;
        justify-content: center;
    }

    .billing-hero {
        align-items: flex-start;
    }

    .billing-hero__actions,
    .billing-hero__actions .as-action {
        width: 100%;
    }

    .collection-savebar {
        align-items: stretch;
        bottom: 0.5rem;
        flex-direction: column;
    }

    .collection-savebar .as-action,
    .collection-savebar > div {
        width: 100%;
    }

    .billing-document-page .panel-heading .as-actions,
    .collection-page .panel-heading .as-actions {
        margin-left: 0;
        width: 100%;
    }

    .billing-concepts-head {
        align-items: stretch;
        flex-direction: column;
    }

    .billing-concepts-head .as-action {
        justify-content: center;
        width: 100%;
    }

    .billing-concept-editor__head,
    .billing-concept-form {
        padding-left: 0.9rem;
        padding-right: 0.9rem;
    }

    .billing-concept-actions {
        margin-left: -0.9rem;
        margin-right: -0.9rem;
        padding-left: 0.9rem;
        padding-right: 0.9rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .as-page,
    .as-topbar__inner {
        transition: none;
    }
}

/* Consultas y reportes */
.reports-page,
.report-preview-page {
    display: grid;
    gap: 1.15rem;
}

.reports-hero,
.report-preview-hero {
    align-items: flex-end;
}

.reports-eyebrow {
    color: #0f766e;
    display: block;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    margin-bottom: 0.35rem;
    text-transform: uppercase;
}

.reports-tabs {
    align-items: center;
    border-bottom: 1px solid #dbe4ee;
    display: flex;
    gap: 0.25rem;
    overflow-x: auto;
}

.reports-tabs__item {
    align-items: center;
    border-bottom: 3px solid transparent;
    color: #64748b;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 0.82rem;
    font-weight: 750;
    gap: 0.5rem;
    margin-bottom: -1px;
    padding: 0.75rem 0.95rem;
    text-decoration: none;
}

.reports-tabs__item:hover,
.reports-tabs__item:focus-visible {
    color: #0f766e;
}

.reports-tabs__item.active {
    border-bottom-color: #079981;
    color: #0f766e;
}

.reports-toolbar {
    align-items: flex-end;
    display: flex;
    gap: 1.25rem;
    justify-content: space-between;
    padding: 1rem 1.15rem;
}

.reports-toolbar__copy,
.reports-library__head {
    align-items: center;
    display: flex;
    gap: 0.75rem;
}

.reports-toolbar__icon,
.reports-library__icon {
    align-items: center;
    background: #e4f5f0;
    border-radius: 0.42rem;
    color: #087d68;
    display: inline-flex;
    flex: 0 0 2.35rem;
    height: 2.35rem;
    justify-content: center;
}

.reports-toolbar h2,
.reports-result-card h2,
.reports-library h2,
.reports-viewer-card h2 {
    color: #172033;
    font-family: "Manrope", sans-serif;
    font-size: 0.98rem;
    font-weight: 800;
    margin: 0;
}

.reports-toolbar p,
.reports-result-card p,
.reports-library p {
    color: #718096;
    font-size: 0.76rem;
    margin: 0.18rem 0 0;
}

.reports-toolbar__controls {
    align-items: flex-end;
    display: flex;
    flex: 0 0 auto;
    gap: 0.75rem;
}

.reports-year-field {
    min-width: 130px;
}

.reports-export-action .btn {
    align-items: center;
    background: #0f6dbe;
    border-color: #0f6dbe;
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 750;
    min-height: 38px;
    padding-left: 1rem;
    padding-right: 1rem;
}

.reports-result-card {
    min-width: 0;
    padding: 0;
    position: relative;
}

.reports-result-card__head,
.reports-viewer-card__head {
    align-items: center;
    border-bottom: 1px solid #e5ebf2;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding: 1rem 1.15rem;
}

.reports-result-card__hint,
.reports-viewer-card__status {
    color: #7b8798;
    font-size: 0.7rem;
    white-space: nowrap;
}

.reports-result-card.is-loading::after {
    background: rgba(255, 255, 255, 0.68);
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: 5;
}

.reports-pivot-shell,
.reports-document-shell {
    min-width: 0;
    overflow: auto;
}

.reports-pivot-shell {
    padding: 0.75rem;
}

.reports-pivot {
    min-width: 760px;
}

.reports-workspace {
    align-items: start;
    display: grid;
    gap: 1rem;
    grid-template-columns: 270px minmax(0, 1fr);
}

.reports-library {
    overflow: hidden;
    padding: 0;
}

.reports-library__head {
    border-bottom: 1px solid #e5ebf2;
    padding: 1rem;
}

.reports-library__group {
    display: grid;
    gap: 0.4rem;
    padding: 0.9rem 0.75rem;
}

.reports-library__group + .reports-library__group {
    border-top: 1px solid #eef2f6;
}

.reports-library__label,
.reports-viewer-card__kicker {
    color: #7b8798;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.reports-library__label {
    padding: 0 0.4rem;
}

.reports-library__link {
    align-items: center;
    border-radius: 0.45rem;
    color: #253147;
    display: grid;
    gap: 0.65rem;
    grid-template-columns: 2rem minmax(0, 1fr) auto;
    padding: 0.7rem 0.55rem;
    text-decoration: none;
}

.reports-library__link:hover,
.reports-library__link:focus-visible,
.reports-library__link.active {
    background: #eef7f5;
    color: #0f766e;
}

.reports-library__link.active {
    box-shadow: inset 3px 0 #079981;
}

.reports-library__link-icon {
    align-items: center;
    background: #eef3f8;
    border-radius: 0.38rem;
    color: #0f6dbe;
    display: inline-flex;
    height: 2rem;
    justify-content: center;
}

.reports-library__link strong,
.reports-library__link small {
    display: block;
}

.reports-library__link strong {
    font-size: 0.76rem;
}

.reports-library__link small {
    color: #7b8798;
    font-size: 0.66rem;
    line-height: 1.35;
    margin-top: 0.12rem;
}

.reports-library__arrow {
    color: #9aa5b5;
}

.reports-viewer-card,
.report-preview-card {
    min-width: 0;
    overflow: hidden;
    padding: 0;
}

.reports-viewer-card__kicker {
    display: block;
    margin-bottom: 0.22rem;
}

.reports-viewer-card__status {
    color: #0f766e;
    font-weight: 700;
}

.reports-viewer-card__status .fa {
    font-size: 0.45rem;
    margin-right: 0.3rem;
    vertical-align: middle;
}

.reports-document-shell {
    padding: 0.75rem;
}

.reports-document-shell > div {
    min-width: 760px;
}

.reports-empty-state {
    align-items: center;
    color: #718096;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 390px;
    padding: 2rem;
    text-align: center;
}

.reports-empty-state__icon {
    align-items: center;
    background: #edf3f8;
    border-radius: 50%;
    color: #0f6dbe;
    display: inline-flex;
    font-size: 1.35rem;
    height: 3.5rem;
    justify-content: center;
    margin-bottom: 1rem;
    width: 3.5rem;
}

.reports-empty-state h2,
.reports-empty-state h3 {
    color: #253147;
    font-family: "Manrope", sans-serif;
    font-size: 1rem;
    font-weight: 800;
    margin: 0;
}

.reports-empty-state p {
    font-size: 0.78rem;
    margin: 0.35rem 0 0;
    max-width: 360px;
}

.report-preview-actions {
    flex: 0 0 auto;
}

.reports-document-shell--preview {
    min-height: 560px;
}

@media (max-width: 991.98px) {
    .reports-workspace {
        grid-template-columns: 1fr;
    }

    .reports-library__group {
        display: inline-grid;
        vertical-align: top;
        width: 50%;
    }

    .reports-library__group + .reports-library__group {
        border-left: 1px solid #eef2f6;
        border-top: 0;
    }
}

@media (max-width: 767.98px) {
    .reports-toolbar,
    .reports-result-card__head,
    .reports-viewer-card__head {
        align-items: stretch;
        flex-direction: column;
    }

    .reports-toolbar__controls {
        width: 100%;
    }

    .reports-year-field,
    .reports-export-action,
    .reports-export-action .btn {
        width: 100%;
    }

    .reports-library__group {
        display: grid;
        width: 100%;
    }

    .reports-library__group + .reports-library__group {
        border-left: 0;
        border-top: 1px solid #eef2f6;
    }

    .report-preview-hero {
        align-items: stretch;
        flex-direction: column;
    }

    .report-preview-actions,
    .report-preview-actions .as-action {
        justify-content: center;
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .billing-nav__item {
        transition: none;
    }
}
@media (max-width: 1199.98px) {
    .company-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .company-grid {
        grid-template-columns: 1fr;
    }

    .company-card__visual {
        padding: 1rem;
    }

    .company-catalog-page .cl-actions,
    .company-catalog-page .cl-actions .as-action {
        justify-content: center;
        width: 100%;
    }
}

/* Administration directory: navigation only; editors use the shared form system. */
.admin-directory {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2rem;
    padding: 1.5rem;
}

.admin-directory__group h2 {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    color: #0f172a;
    font-size: 1rem;
    font-weight: 750;
    margin: 0 0 0.75rem;
}

.admin-directory__group h2 .fa {
    color: #2563eb;
    width: 1.25rem;
    text-align: center;
}

.admin-directory__group ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.admin-directory__group li + li {
    border-top: 1px solid #e8edf3;
}

.admin-directory__group a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.75rem 0.5rem;
    border-radius: 0.35rem;
    color: #415068;
    text-decoration: none;
    transition: background-color 150ms ease, color 150ms ease;
}

.admin-directory__group a:hover,
.admin-directory__group a:focus-visible {
    color: #1d4ed8;
    background: #eff6ff;
}

.admin-directory__group a:focus-visible {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
}

@media (max-width: 991.98px) {
    .admin-directory { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 575.98px) {
    .admin-directory { grid-template-columns: minmax(0, 1fr); padding: 1rem; gap: 1.5rem; }
}

@media (prefers-reduced-motion: reduce) {
    .admin-directory__group a { transition: none; }
}
/*devepress overrides*/
.dxpcLite_Material .dxpc-header, .dxdpLite_Material .dxpc-header {
    padding: 10px 15px 10px 15px;
    background-color: #f1f1f1;
}
.dxgvPopupEditForm_Material {
    padding:0px;
}

/* Importación de cobranza: libro bancario y mesa de conciliación. */
.bank-import-page { --bank-ink: #14233b; --bank-line: #dce4ee; --bank-blue: #2563eb; }
.bank-import-hero { align-items: center; }
.bank-import-command { margin-bottom: 1rem; padding: 1.25rem; border-left: 4px solid var(--bank-blue); }
.bank-import-command__intro { display: flex; align-items: center; gap: 0.9rem; margin-bottom: 1.15rem; }
.bank-import-command__intro h2, .bank-import-command__intro p { margin: 0; }
.bank-import-command__intro h2 { color: var(--bank-ink); font-size: 1.05rem; }
.bank-import-command__intro p { color: #65748b; font-size: 0.9rem; }
.bank-import-command__icon { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; color: #fff; background: var(--bank-blue); flex: 0 0 auto; }
.bank-import-preview { margin-bottom: 1rem; }
.bank-import-metrics { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1px; margin-bottom: 1rem; overflow: hidden; border: 1px solid var(--bank-line); border-radius: 0.65rem; background: var(--bank-line); }
.bank-import-metrics > div { min-width: 0; padding: 0.85rem 1rem; background: #fff; }
.bank-import-metrics span { display: block; color: #65748b; font-size: 0.78rem; }
.bank-import-metrics strong { display: block; margin-top: 0.15rem; color: var(--bank-ink); font-size: 1.15rem; font-variant-numeric: tabular-nums; }
.bank-review-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(30rem, 1fr); gap: 1rem; align-items: start; margin-bottom: 1rem; }
.bank-ledger, .bank-match { min-width: 0; }
.bank-ledger > .cl-grid-shell { max-height: 46rem; overflow: auto; }
.bank-match { position: sticky; top: 1rem; overflow: hidden; }
.bank-match__empty { padding: 3rem 1.5rem; text-align: center; color: #65748b; }
.bank-match__empty .fa { display: block; margin-bottom: 0.75rem; color: #9aa8ba; font-size: 1.8rem; }
.bank-match__empty h2 { color: var(--bank-ink); font-size: 1.05rem; }
.bank-match__head { display: flex; justify-content: space-between; gap: 1rem; align-items: start; padding: 1rem 1.15rem; border-bottom: 1px solid var(--bank-line); }
.bank-match__head span { color: #65748b; font-size: 0.75rem; }
.bank-match__head h2 { max-width: 28rem; margin: 0.15rem 0 0; color: var(--bank-ink); font-size: 1rem; line-height: 1.35; }
.bank-match__head > strong { color: #087f5b; font-size: 1.1rem; white-space: nowrap; }
.bank-match__tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-bottom: 1px solid var(--bank-line); background: #f7f9fc; }
.bank-match__tab { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 0.45rem; min-height: 3rem; padding: 0.65rem 0.8rem; border: 0; color: #5d6b7f; background: transparent; font: inherit; font-size: 0.82rem; font-weight: 700; cursor: pointer; }
.bank-match__tab::after { content: ""; position: absolute; right: 0.8rem; bottom: -1px; left: 0.8rem; height: 3px; border-radius: 3px 3px 0 0; background: transparent; }
.bank-match__tab.is-active { color: var(--bank-blue); background: #fff; }
.bank-match__tab.is-active::after { background: var(--bank-blue); }
.bank-match__tab:focus-visible { z-index: 1; outline: 3px solid rgba(37, 99, 235, 0.25); outline-offset: -3px; }
.bank-match__tab-panel[hidden] { display: none; }
.bank-match__section-head { display: flex; justify-content: space-between; gap: 1rem; padding: 0.9rem 1.15rem 0.65rem; }
.bank-match__section-head h3 { margin: 0; color: var(--bank-ink); font-size: 0.92rem; }
.bank-match__section-head p { margin: 0.2rem 0 0; color: #65748b; font-size: 0.78rem; }
.bank-match__documents { max-height: 15rem; overflow: auto; border-top: 1px solid var(--bank-line); border-bottom: 1px solid var(--bank-line); }
.bank-match__more { display: flex; justify-content: flex-end; min-height: 0.75rem; padding: 0.5rem 1.15rem 0; }
.bank-match__manual { padding: 0.85rem 1.15rem 1rem; border-top: 1px solid var(--bank-line); }
.bank-match__manual > p { margin: 0.2rem 0 0.65rem; color: #65748b; font-size: 0.78rem; }
.bank-match__invoices { max-height: 13rem; margin-top: 0.75rem; overflow: auto; border: 1px solid var(--bank-line); border-radius: 0.4rem; }
.bank-match__summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0 1.15rem 1rem; border: 1px solid var(--bank-line); border-radius: 0.45rem; background: #f7f9fc; }
.bank-match__summary > div { min-width: 0; padding: 0.7rem 0.85rem; }
.bank-match__summary > div + div { border-left: 1px solid var(--bank-line); }
.bank-match__summary span { display: block; color: #65748b; font-size: 0.75rem; }
.bank-match__summary strong { display: block; margin-top: 0.15rem; color: var(--bank-ink); font-size: 1rem; font-variant-numeric: tabular-nums; }
.bank-match__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.5rem; padding: 0 1.15rem 1rem; }
.bank-import-history { margin-top: 1rem; }
.bank-import-table, .bank-candidates { width: 100%; margin: 0; color: var(--bank-ink); font-size: 0.85rem; }
.bank-import-table th, .bank-candidates th { border-bottom: 1px solid #cbd5e1; color: #526178; background: #f7f9fc; font-size: 0.75rem; font-weight: 700; white-space: nowrap; }
.bank-import-table td, .bank-import-table th, .bank-candidates td, .bank-candidates th { padding: 0.7rem 0.75rem; vertical-align: middle; }
.bank-import-table td, .bank-candidates td { border-bottom: 1px solid #edf1f6; }
.bank-import-table tr:last-child td, .bank-candidates tr:last-child td { border-bottom: 0; }
.bank-status { display: inline-flex; align-items: center; min-height: 1.55rem; padding: 0.15rem 0.48rem; border: 1px solid #d6dde7; border-radius: 999px; color: #536174; background: #f8fafc; font-size: 0.72rem; font-weight: 700; white-space: nowrap; }
.bank-status--ok { color: #087f5b; border-color: #a8dfcc; background: #ecfbf5; }
.bank-status--warning { color: #9a6700; border-color: #f1d18a; background: #fff8e6; }
.bank-status--danger { color: #b42318; border-color: #f5b8b2; background: #fff0ef; }
.bank-status--blue { color: #1d4ed8; border-color: #b8cdfa; background: #eff6ff; }
.bank-status--suggested { color: #6d45b5; border-color: #d8c6f4; background: #f7f2ff; }
.bank-empty-inline { padding: 1rem; color: #65748b; }

@media (max-width: 1399.98px) {
    .bank-import-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .bank-review-layout { grid-template-columns: 1fr; }
    .bank-match { position: static; }
}

@media (max-width: 575.98px) {
    .bank-import-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .bank-import-command { padding: 1rem; }
    .bank-match__head, .bank-match__actions { flex-direction: column; }
    .bank-match__actions .as-action { width: 100%; justify-content: center; }
    .bank-match__summary { grid-template-columns: 1fr; }
    .bank-match__summary > div + div { border-top: 1px solid var(--bank-line); border-left: 0; }
    .bank-match__tab { min-height: 3.35rem; padding: 0.55rem; font-size: 0.76rem; line-height: 1.2; }
}

.invoice-issuer {
    display: inline-block;
    background: #d6eafb;
    border-radius: 999px;
    color: #58708d;
    font-size: 0.88rem;
    font-weight: 750;
    padding: 0.80rem 0.8rem;
    white-space: nowrap;
    letter-spacing:0.1rem;
}
