turbo-frame {
    display: block;
}

.fu-data-table {
    background: #fff;
    border: 1px solid #dfe7f1;
    border-radius: 12px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .04);
    overflow: hidden;
}

.fu-data-table-toolbar {
    align-items: center;
    border-bottom: 1px solid #edf2f7;
    display: flex;
    justify-content: space-between;
    min-height: 48px;
    padding: .8rem 1rem;
}

.fu-data-table-scroll {
    overflow-x: auto;
}

.fu-data-table-table {
    border-collapse: separate;
    border-spacing: 0;
    color: #43536a;
    font-size: .875rem;
    min-width: 1050px;
    width: 100%;
}

.fu-data-table-table thead th {
    background: #f8fafc;
    border-bottom: 1px solid #edf2f7;
    color: #708099;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .04em;
    padding: 1rem .9rem;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}

.fu-data-table-table tbody td {
    border-bottom: 1px solid #f1f5f9;
    padding: .95rem .9rem;
    vertical-align: middle;
}

.fu-data-table-table tbody tr:hover {
    background: #f7f8ff;
}

.fu-data-table-table input[type="checkbox"] {
    accent-color: #5145e5;
    height: 16px;
    width: 16px;
}

.client-overview-page {
    color: #132238;
}

.client-page-header,
.client-content-grid,
.client-filter-row,
.client-page-actions,
.client-kpi-top,
.client-table-footer,
.client-pagination,
.client-identity,
.client-contact,
.client-row-actions,
.client-table-tools,
.client-check-line {
    align-items: center;
    display: flex;
}

.client-page-header {
    gap: 1.5rem;
    justify-content: space-between;
    margin-bottom: 1.75rem;
}

.client-title-row {
    align-items: center;
    display: flex;
    gap: .7rem;
    margin-bottom: .25rem;
}

.client-title-row h1 {
    color: #0f172a;
    font-size: 1.55rem;
    font-weight: 800;
    margin: 0;
}

.client-page-header p {
    color: #718096;
    font-size: .95rem;
    margin: 0 0 0 2.35rem;
}

.client-title-icon,
.client-kpi-icon,
.client-type-icon {
    align-items: center;
    border-radius: 10px;
    display: inline-flex;
    flex: 0 0 auto;
    justify-content: center;
}

.client-title-icon {
    background: #e9eaff;
    color: #5145e5;
    height: 32px;
    width: 32px;
}

.client-page-actions {
    gap: .65rem;
}

.client-btn {
    align-items: center;
    border-radius: 9px;
    display: inline-flex;
    font-weight: 700;
    gap: .45rem;
    min-height: 40px;
    padding: .55rem .95rem;
}

.client-btn-light {
    background: #fff;
    border: 1px solid #dfe7f1;
    color: #4a5870;
}

.client-btn-primary {
    background: #5145e5;
    border: 1px solid #5145e5;
    color: #fff;
}

.client-kpi-grid {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 1.75rem;
}

.client-kpi-card {
    background: #fff;
    border: 1px solid #dfe7f1;
    border-radius: 12px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .04);
    min-height: 132px;
    padding: 1.25rem;
}

.client-kpi-top {
    justify-content: space-between;
    margin-bottom: 1rem;
}

.client-kpi-icon {
    height: 42px;
    width: 42px;
}

.client-kpi-icon.is-brand,
.client-type-icon.is-blue {
    background: #e8f1ff;
    color: #2f6ff1;
}

.client-kpi-icon.is-blue {
    background: #edf5ff;
    color: #2f6ff1;
}

.client-kpi-icon.is-violet,
.client-type-icon.is-violet {
    background: #f1e9ff;
    color: #8247e5;
}

.client-kpi-icon.is-slate,
.client-type-icon.is-slate {
    background: #edf2f7;
    color: #62748c;
}

.client-type-icon.is-amber {
    background: #fff2c6;
    color: #cc7800;
}

.client-type-icon.is-teal {
    background: #ccfbef;
    color: #178979;
}

.client-kpi-trend {
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 800;
    padding: .2rem .55rem;
}

.client-kpi-trend.is-brand,
.client-kpi-trend.is-blue {
    background: #edf5ff;
    color: #2f6ff1;
}

.client-kpi-trend.is-violet {
    background: #f1e9ff;
    color: #8247e5;
}

.client-kpi-trend.is-slate {
    background: #edf2f7;
    color: #62748c;
}

.client-kpi-card strong {
    color: #0f172a;
    display: block;
    font-size: 1.8rem;
    line-height: 1;
}

.client-kpi-card > span:last-child {
    color: #65758c;
    display: block;
    font-size: .88rem;
    margin-top: .45rem;
}

.client-content-grid {
    align-items: flex-start;
    gap: 1.35rem;
}

.client-main-column {
    flex: 1 1 auto;
    min-width: 0;
}

.client-side-panel {
    display: flex;
    flex: 0 0 265px;
    flex-direction: column;
    gap: 1.25rem;
}

.client-filter-panel,
.client-side-card,
.client-tip-card {
    background: #fff;
    border: 1px solid #dfe7f1;
    border-radius: 12px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .04);
}

.client-filter-panel {
    margin-bottom: 1.25rem;
    padding: 1.2rem;
}

.client-filter-row {
    flex-wrap: wrap;
    gap: .75rem;
}

.client-search-field,
.client-select-field {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #dfe7f1;
    border-radius: 9px;
    color: #9aa9bc;
    display: flex;
    min-height: 42px;
}

.client-search-field {
    flex: 1 1 320px;
    gap: .55rem;
    padding: 0 .85rem;
}

.client-select-field {
    min-width: 150px;
    padding: 0 .65rem 0 .85rem;
}

.client-search-field input,
.client-select-field select,
.client-page-size select {
    background: transparent;
    border: 0;
    color: #4a5870;
    font: inherit;
    outline: 0;
    width: 100%;
}

.client-select-field select {
    appearance: none;
    padding-right: 1rem;
}

.client-filter-note {
    color: #96a3b8;
    font-size: .78rem;
    margin: .85rem 0 0;
}

.client-filter-note i,
.client-filter-note strong,
.client-reset-btn,
.client-side-card h2 i,
.client-tip-card h2,
.client-tip-card a {
    color: #5145e5;
}

.client-reset-btn {
    background: transparent;
    border: 0;
    font-weight: 700;
    padding: .55rem .25rem;
}

.client-table-card {
    margin-bottom: 0;
}

.client-check-line {
    color: #65758c;
    font-size: .82rem;
    gap: .55rem;
    margin: 0;
}

.client-table-tools {
    gap: .65rem;
}

.client-table-tools button {
    align-items: center;
    background: transparent;
    border: 0;
    color: #65758c;
    display: inline-flex;
    font-size: .82rem;
    font-weight: 700;
    gap: .3rem;
}

.client-table-tools span {
    background: #dfe7f1;
    height: 18px;
    width: 1px;
}

.client-table th:first-child,
.client-table td:first-child {
    width: 42px;
}

.client-identity {
    gap: .75rem;
}

.client-identity strong {
    color: #263246;
    font-weight: 800;
}

.client-type-icon {
    height: 34px;
    width: 34px;
}

.client-type-pill,
.client-status {
    border-radius: 999px;
    display: inline-flex;
    font-size: .75rem;
    font-weight: 800;
    line-height: 1;
    padding: .35rem .65rem;
}

.client-type-pill.is-blue {
    background: #dceaff;
    color: #2f6ff1;
}

.client-type-pill.is-violet {
    background: #eee3ff;
    color: #8247e5;
}

.client-type-pill.is-amber {
    background: #fff0be;
    color: #c97400;
}

.client-type-pill.is-teal {
    background: #c9f8ee;
    color: #178979;
}

.client-mono {
    color: #4a5870;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: .82rem;
}

.client-city,
.client-contact,
.client-status {
    align-items: center;
    gap: .4rem;
}

.client-city i {
    color: #9aa9bc;
    font-size: .78rem;
}

.client-avatar {
    align-items: center;
    border-radius: 50%;
    color: #fff;
    display: inline-flex;
    font-size: .65rem;
    font-weight: 800;
    height: 23px;
    justify-content: center;
    width: 23px;
}

.client-avatar.is-0 { background: #4f46e5; }
.client-avatar.is-1 { background: #0f766e; }
.client-avatar.is-2 { background: #be6b00; }
.client-avatar.is-3 { background: #2563eb; }

.client-status.is-active {
    background: #c9f7df;
    color: #047857;
}

.client-status.is-archived {
    background: #e6edf5;
    color: #66758a;
}

.client-status i {
    background: currentColor;
    border-radius: 50%;
    height: 6px;
    width: 6px;
}

.client-muted {
    color: #92a0b4;
}

.client-row-actions {
    gap: .35rem;
    opacity: 0;
    transition: opacity .15s ease;
}

tr:hover .client-row-actions,
.client-row-actions.is-open {
    opacity: 1;
}

.client-row-actions button {
    background: #f1f5ff;
    border: 0;
    border-radius: 7px;
    color: #5145e5;
    font-size: .72rem;
    font-weight: 800;
    min-height: 28px;
    padding: .25rem .6rem;
}

.client-row-actions button:nth-child(2),
.client-icon-action {
    background: #eef2f7;
    color: #516177;
}

.client-icon-action {
    min-width: 28px;
    padding: 0;
}

.client-empty-row td {
    color: #7b8ca3;
    padding: 2rem;
    text-align: center;
}

.client-table-footer {
    border-top: 1px solid #edf2f7;
    color: #65758c;
    font-size: .86rem;
    justify-content: space-between;
    min-height: 58px;
    padding: .8rem 1rem;
}

.client-pagination {
    gap: .35rem;
}

.client-pagination button {
    background: #fff;
    border: 1px solid #dfe7f1;
    border-radius: 7px;
    color: #54647a;
    font-weight: 700;
    height: 32px;
    min-width: 32px;
}

.client-pagination button.is-active {
    background: #5145e5;
    border-color: #5145e5;
    color: #fff;
}

.client-page-size {
    align-items: center;
    display: flex;
    gap: .5rem;
    margin: 0;
}

.client-page-size select {
    border: 1px solid #dfe7f1;
    border-radius: 7px;
    min-height: 32px;
    padding: 0 1.8rem 0 .65rem;
}

.client-side-card {
    padding-bottom: .8rem;
}

.client-side-card h2,
.client-tip-card h2 {
    align-items: center;
    border-bottom: 1px solid #edf2f7;
    color: #3d4c63;
    display: flex;
    font-size: .86rem;
    font-weight: 900;
    gap: .45rem;
    letter-spacing: .04em;
    margin: 0;
    padding: .95rem 1rem;
    text-transform: uppercase;
}

.client-side-card button {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #eef2f7;
    border-radius: 10px;
    color: #4a5870;
    display: flex;
    font-size: .78rem;
    font-weight: 800;
    gap: .75rem;
    margin: .7rem .8rem;
    min-height: 58px;
    padding: .7rem .85rem;
    text-align: left;
    width: calc(100% - 1.6rem);
}

.client-distribution-row {
    padding: .55rem 1rem;
}

.client-distribution-row div {
    align-items: center;
    color: #65758c;
    display: flex;
    font-size: .8rem;
    justify-content: space-between;
    margin-bottom: .35rem;
}

.client-distribution-row strong {
    color: #43536a;
}

.client-progress {
    background: #edf2f7;
    border-radius: 999px;
    display: block;
    height: 7px;
    overflow: hidden;
}

.client-progress i {
    border-radius: inherit;
    display: block;
    height: 100%;
}

.client-progress .is-blue { background: #3b82f6; }
.client-progress .is-violet { background: #8b5cf6; }
.client-progress .is-amber { background: #f59e0b; }
.client-progress .is-teal { background: #14b8a6; }

.client-tip-card {
    background: #eef2ff;
    border-color: #dce4ff;
    color: #5145e5;
    padding-bottom: 1rem;
}

.client-tip-card h2 {
    border-bottom: 0;
    padding-bottom: .35rem;
    text-transform: none;
}

.client-tip-card p {
    font-size: .82rem;
    font-weight: 600;
    line-height: 1.55;
    margin: 0;
    padding: 0 1rem .8rem;
}

.client-tip-card a {
    display: inline-flex;
    font-size: .82rem;
    font-weight: 900;
    gap: .35rem;
    padding: 0 1rem;
}

@media (max-width: 1199.98px) {
    .client-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .client-content-grid {
        flex-direction: column;
    }

    .client-side-panel {
        flex-basis: auto;
        width: 100%;
    }
}

@media (max-width: 767.98px) {
    .client-page-header {
        align-items: stretch;
        flex-direction: column;
    }

    .client-page-actions,
    .client-page-actions .client-btn {
        width: 100%;
    }

    .client-page-actions {
        flex-direction: column;
    }

    .client-page-actions .client-btn {
        justify-content: center;
    }

    .client-kpi-grid {
        grid-template-columns: 1fr;
    }

    .client-table-footer {
        align-items: flex-start;
        flex-direction: column;
        gap: .8rem;
    }
}