.dealer-personal-account {
    min-width: 0;
    container-type: inline-size;
}
.dealer-personal-account-page {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}
.dealer-personal-account .card {
    background: #fff;
    border: 1px solid var(--color-neutral-200);
    border-radius: 10px;
    box-shadow: none;
    margin-bottom: 0;
}
.dealer-personal-account-kpis,
.dealer-personal-account-charts,
.dealer-personal-account-bottom {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 1rem;
}
.dealer-personal-account-kpis,
.dealer-personal-account-charts {
    margin-bottom: 1rem;
}
.dealer-personal-account-kpi {
    padding: .5rem 1rem 1rem;
    min-height: 105px;
}
.dealer-personal-account-kpi-body {
    position: relative;
    flex: 1;
}
.dealer-personal-account-kpi-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    min-height: 2.25rem;
}
.dealer-personal-account-label {
    color: var(--bs-secondary-color);
    font-size: .8rem;
    font-weight: normal;
    line-height: 1.4;
    margin: 0;
}
.dealer-personal-account-kpi-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 24px;
    height: 24px;
    border-radius: 6px;
    background: var(--color-mystic);
    color: var(--color-blue);
}
.dealer-personal-account-number {
    font-size: 1.75rem;
    font-weight: 700;
    white-space: nowrap;
}
.dealer-personal-account-charts > .dealer-personal-account-panel {
    grid-column: span 2;
}
.dealer-personal-account-charts > .dealer-personal-account-dynamics {
    grid-column: span 4;
}
.dealer-personal-account-bottom > .dealer-personal-account-panel {
    grid-column: span 3;
}
.dealer-personal-account-panel {
    min-width: 0;
    padding: 18px;
}
.dealer-personal-account-panel-title {
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 14px;
}
.dealer-personal-account-chart-area {
    height: 240px;
}
.dealer-personal-account-dynamics-plot {
    position: relative;
    flex: 1;
    min-height: 240px;
}
.dealer-personal-account-dynamics-plot > .dealer-personal-account-chart-area {
    position: absolute;
    inset: 0;
    height: 100%;
}
.dealer-personal-account-status-content {
    min-height: 264px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    align-items: center;
}
.dealer-personal-account-donut {
    width: 100%;
    aspect-ratio: 1;
    min-width: 0;
    justify-self: center;
    padding: 0 15px
}
.dealer-personal-account-status-legend {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 12px;
}
.dealer-personal-account-status-legend li {
    display: flex;
    align-items: baseline;
    gap: .5rem;
    margin-bottom: 8px;
    overflow-wrap: anywhere;
}
.dealer-personal-account-status-dot {
    display: inline-block;
    flex: 0 0 9px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
}
.dealer-personal-account-table-scroll {
    max-height: 300px;
    overflow: auto;
}
.dealer-personal-account-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}
.dealer-personal-account-table th {
    position: sticky;
    top: 0;
    background: #fff;
    color: var(--bs-secondary-color);
    text-align: left;
    font-weight: 600;
    padding: 6px 8px;
    border-bottom: 1px solid var(--color-neutral-200);
    white-space: nowrap;
}
.dealer-personal-account-table td {
    padding: 8px;
    border-bottom: 1px solid #f0f3f4;
    vertical-align: middle;
}
.dealer-personal-account-table td:first-child {
    overflow-wrap: anywhere;
    min-width: 120px;
}
.dealer-personal-account-conversion {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
}
.dealer-personal-account-conversion-success {
    color: var(--bs-success);
    background: rgba(var(--bs-success-rgb), .12);
}
.dealer-personal-account-conversion-warning {
    color: #a87313;
    background: rgba(var(--bs-warning-rgb), .18);
}
.dealer-personal-account-conversion-danger {
    color: var(--bs-danger);
    background: rgba(var(--bs-danger-rgb), .12);
}
.dealer-personal-account-conversion-secondary {
    color: var(--bs-secondary-color);
    background: var(--color-mystic);
}
.dealer-personal-account-funnel-row {
    margin-bottom: 12px;
}
.dealer-personal-account-funnel-label {
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    margin-bottom: 5px;
}
.dealer-personal-account-funnel-label strong {
    font-size: 13px;
}
.dealer-personal-account-funnel-track {
    height: 9px;
    border-radius: 6px;
    overflow: hidden;
    background: var(--color-mystic);
}
.dealer-personal-account-funnel-fill {
    height: 100%;
    border-radius: inherit;
    background: var(--color-blue);
}
.dealer-personal-account-insights {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 12px;
}
.dealer-personal-account-insights li {
    position: relative;
    padding-left: 12px;
    margin-bottom: 10px;
    line-height: 1.5;
}
.dealer-personal-account-insights li::before {
    content: '';
    position: absolute;
    left: 1px;
    top: .75em;
    width: 5px;
    height: 5px;
    border-top: 1.5px solid var(--color-blue);
    border-right: 1.5px solid var(--color-blue);
    transform: translateY(-50%) rotate(45deg);
}
.dealer-personal-account .dealer-personal-account-filters {
    --dealer-personal-account-filter-height: calc(3.5rem + 2px);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: start;
    gap: 1rem;
    padding: 1rem;
    margin-bottom: 1rem;
}
.dealer-personal-account-filter-fields {
    display: flex;
    flex-wrap: wrap;
    align-items: start;
    gap: 1rem;
    flex: 1;
    min-width: 0;
}
.dealer-personal-account-filter-fields .mb-3 {
    margin-bottom: 0 !important;
}
.dealer-personal-account-date {
    flex: 0 1 155px;
}
.dealer-personal-account-date .form-control {
    height: var(--dealer-personal-account-filter-height);
    min-height: var(--dealer-personal-account-filter-height);
}
.dealer-personal-account-seller-filter {
    flex: 0 1 300px;
    min-width: 180px;
}
.dealer-personal-account-seller-dropdown {
    position: relative;
}
.dealer-personal-account-seller-dropdown summary {
    position: relative;
    height: var(--dealer-personal-account-filter-height);
    padding-top: 1.625rem;
    padding-bottom: .625rem;
    cursor: pointer;
    list-style: none;
}
.dealer-personal-account-seller-caption {
    position: absolute;
    top: .5rem;
    left: .75rem;
    color: var(--bs-secondary-color);
    font-size: .85rem;
}
.dealer-personal-account-seller-dropdown summary::-webkit-details-marker {
    display: none;
}
.dealer-personal-account-seller-options {
    position: absolute;
    top: calc(100% + .25rem);
    left: 0;
    right: 0;
    z-index: 10;
    max-height: 350px;
    overflow: auto;
    padding: 1rem;
    background: #fff;
    border: 1px solid var(--color-neutral-200);
    border-radius: 6px;
    box-shadow: 0 4px 12px #0002;
}
.dealer-personal-account-download-slot {
    display: flex;
    align-items: center;
    height: var(--dealer-personal-account-filter-height);
    margin-left: auto;
}
.dealer-personal-account-download {
    display: inline-flex;
    gap: .5rem;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}
.dealer-personal-account-skeleton {
    border-radius: .3rem;
    background: var(--color-neutral-200);
    animation: dealer-personal-account-pulse 1.4s ease-in-out infinite;
}
.dealer-personal-account-number-skeleton {
    position: absolute;
    inset: 0;
    width: 65%;
    height: 100%;
}
.dealer-personal-account-cell-skeleton {
    height: 1rem;
    min-width: 30px;
    margin: .35rem 0;
}
.dealer-personal-account-funnel-skeleton {
    height: 1.7rem;
}
.dealer-personal-account-request-failed [data-loading="show"] {
    display: none !important;
}
.dealer-personal-account-request-failed [data-loading="hide"] {
    display: revert !important;
}
.dealer-personal-account-request-failed .dealer-personal-account-skeleton {
    display: none !important;
}
.dealer-personal-account-request-failed .dealer-personal-account-kpi-content {
    visibility: visible !important;
}
@keyframes dealer-personal-account-pulse {
    50% {
        opacity: .4;
    }
}
@media (prefers-reduced-motion: reduce) {
    .dealer-personal-account-skeleton {
        animation: none;
    }
}

html[data-theme="dark"] .dealer-personal-account .card,
html[data-theme="dark"] .dealer-personal-account-seller-options {
    background: var(--app-theme-surface);
    border-color: var(--app-theme-border);
    color: var(--color-text-primary);
}

html[data-theme="dark"] .dealer-personal-account-seller-caption,
html[data-theme="dark"] .dealer-personal-account-label {
    color: var(--color-text-muted);
}

html[data-theme="dark"] .dealer-personal-account-funnel-track {
    background: var(--color-neutral-300);
}

html[data-theme="dark"] .dealer-personal-account-table th {
    background: transparent;
    border-color: var(--app-theme-border);
    color: var(--color-text-primary);
}

html[data-theme="dark"] .dealer-personal-account-table td {
    border-color: var(--app-theme-border-soft);
}

html[data-theme="dark"] .dealer-personal-account-status-dot.status-draft {
    background-color: #f0f0f0;
}

html[data-theme="dark"] .dealer-personal-account-status-dot.status-pre_review {
    background-color: #ffe5b4;
}

html[data-theme="dark"] .dealer-personal-account-status-dot.status-review {
    background-color: #fff2b5;
}

html[data-theme="dark"] .dealer-personal-account-status-dot.status-under_review {
    background-color: #ffe070;
}

html[data-theme="dark"] .dealer-personal-account-status-dot.status-approved {
    background-color: #c0f0c0;
}

html[data-theme="dark"] .dealer-personal-account-status-dot.status-effecting,
html[data-theme="dark"] .dealer-personal-account-status-dot.status-signing,
html[data-theme="dark"] .dealer-personal-account-status-dot.status-signing_check {
    background-color: #7ab8ff;
}

html[data-theme="dark"] .dealer-personal-account-status-dot.status-issued {
    background-color: #a0d8a0;
}

html[data-theme="dark"] .dealer-personal-account-status-dot.status-refused,
html[data-theme="dark"] .dealer-personal-account-status-dot.status-expired_approval,
html[data-theme="dark"] .dealer-personal-account-status-dot.status-client_canceled {
    background-color: #ffb3b3;
}

html[data-theme="dark"] .dealer-personal-account-status-dot.status-rework {
    background-color: #fadadd;
}
@media (max-width: 1399px) {
    .dealer-personal-account-kpi {
        grid-column: span 2;
    }
}

.dealer-personal-account-compare-switch {
    display: flex;
    align-items: center;
    height: var(--dealer-personal-account-filter-height);
    white-space: nowrap;
}
.dealer-personal-account-compare-switch .form-check {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding-left: 0;
    margin: 0;
}
.dealer-personal-account-compare-switch .form-check-input {
    margin: 0;
    flex-shrink: 0;
}
.dealer-personal-account-compare-switch label {
    margin: 0;
}
.dealer-personal-account-comparison-fields:not([hidden]) {
    display: flex;
    gap: .75rem;
    flex: 1;
}
.dealer-personal-account-comparison-preset {
    flex: 0 0 230px;
}
[data-controller~="dealer-personal-account"] .dealer-personal-account-filters,
[data-controller~="dealer-personal-account"] .dealer-personal-account-filter-fields {
    flex-wrap: nowrap;
    gap: .75rem;
}
[data-controller~="dealer-personal-account"] .dealer-personal-account-date {
    flex: 0 0 132px;
}
[data-controller~="dealer-personal-account"] .dealer-personal-account-seller-filter {
    flex: 0 0 180px;
}
.dealer-personal-account-kpi-comparison {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: .25rem .5rem;
    margin-top: .25rem;
    font-size: .75rem;
}
.dealer-personal-account-delta {
    margin-left: .35rem;
    white-space: nowrap;
}
html[data-theme="dark"] .dealer-personal-account-kpi-comparison .text-success,
html[data-theme="dark"] .dealer-personal-account-delta.text-success {
    color: #75b798 !important;
}
html[data-theme="dark"] .dealer-personal-account-kpi-comparison .text-danger,
html[data-theme="dark"] .dealer-personal-account-delta.text-danger {
    color: #ea868f !important;
}
.dealer-personal-account-dynamics-heading {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 1rem;
    margin-bottom: .75rem;
}
.dealer-personal-account-dynamics-legend {
    display: flex;
    gap: 1.5rem;
    font-size: .75rem;
}
.dealer-personal-account-legend-period,
.dealer-personal-account-legend-caption,
.dealer-personal-account-legend-item {
    display: flex;
    gap: .4rem;
}
.dealer-personal-account-legend-period {
    flex-direction: column;
}
.dealer-personal-account-legend-caption {
    white-space: nowrap;
}
.dealer-personal-account-legend-item {
    align-items: center;
}
.dealer-personal-account-line {
    display: inline-block;
    width: 24px;
    border-top: 2px solid var(--color-blue);
}
.dealer-personal-account-line-1 {
    border-color: var(--color-light-blue);
    border-top-style: dashed;
}
.dealer-personal-account-line-2 {
    border-color: #9AA7AC;
}
.dealer-personal-account-line-3 {
    border-color: #C7CED1;
    border-top-style: dashed;
}
.dealer-personal-account-cards-comparing .dealer-personal-account-status-content {
    display: flex;
    flex-direction: column;
    align-items: stretch;
}
.dealer-personal-account-cards-comparing .dealer-personal-account-donuts {
    display: grid;
    grid-template-columns: repeat(2, 96px);
    justify-content: center;
    gap: 1rem;
}
.dealer-personal-account-cards-comparing .dealer-personal-account-status-legend {
    align-self: center;
}
.dealer-personal-account-cards-comparing .dealer-personal-account-donut {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}
.dealer-personal-account-cards-comparing .dealer-personal-account-donut-chart {
    position: absolute;
    inset: 0;
}
.dealer-personal-account-funnel-comparison {
    margin-top: 3px;
}
.dealer-personal-account-funnel-comparison .dealer-personal-account-funnel-track {
    height: 4px;
}
.dealer-personal-account-funnel-comparison .dealer-personal-account-funnel-fill {
    background: #9AA7AC;
}

.dealer-personal-account .personal-account-filters {
    --personal-account-date-width: clamp(102px, 9cqi, 132px);
    --personal-account-seller-width: clamp(100px, 10cqi, 160px);
    display: grid;
    grid-template-columns: repeat(2, var(--personal-account-date-width)) var(--personal-account-seller-width) max-content minmax(0, 1fr);
    align-items: stretch;
    gap: .25rem;
    padding: .75rem .5rem .5rem;
    min-width: 0;
}
.dealer-personal-account .personal-account-filters-comparing {
    grid-template-columns: repeat(2, var(--personal-account-date-width)) var(--personal-account-seller-width)
        clamp(297px, 25cqi, 320px) repeat(2, var(--personal-account-date-width)) minmax(156px, 1fr);
}
.personal-account-filters > * {
    grid-column: 1 / -1;
}
.personal-account-filters .dealer-personal-account-filter-fields,
.personal-account-filter-actions {
    display: grid;
    grid-template-columns: subgrid;
    align-items: center;
    gap: .25rem;
}
.personal-account-filters .dealer-personal-account-filter-fields {
    min-height: 64px;
}
.personal-account-filters .dealer-personal-account-date {
    min-width: 0;
}
.personal-account-filters .dealer-personal-account-seller-filter {
    min-width: 0;
    margin: 0;
}
.personal-account-filters .dealer-personal-account-comparison-fields:not([hidden]) {
    display: contents;
}
.personal-account-comparison-controls {
    display: flex;
    align-items: center;
    gap: .25rem;
    height: var(--dealer-personal-account-filter-height);
}
.personal-account-comparison-controls .dealer-personal-account-comparison-preset {
    flex: 1;
    min-width: 0;
}
.personal-account-comparison-controls .form-check {
    flex-direction: column;
    gap: .25rem;
}
.personal-account-filter-info {
    display: flex;
    align-items: baseline;
    gap: .75rem;
    color: var(--color-text-muted);
    font-size: .75rem;
    line-height: 1.25;
    white-space: nowrap;
}
.personal-account-filter-info h2 {
    color: var(--color-text-secondary);
    font-size: .875rem;
}
.personal-account-filters .dealer-personal-account-seller-options {
    min-width: 230px;
    left: 0;
    right: auto;
}
.personal-account-filter-actions {
    min-height: 31px;
}
.personal-account-period-actions {
    display: flex;
    align-items: center;
    gap: .5rem;
    grid-column: 1 / -2;
}
.personal-account-quick-periods:not([hidden]) {
    display: flex;
    flex-shrink: 0;
    gap: .25rem;
}
.personal-account-quick-comparison:not([hidden]) {
    margin-left: auto;
}
.personal-account-quick-periods .btn {
    padding-inline: .25rem;
}
.personal-account-period-warning {
    font-size: .75rem;
    white-space: nowrap;
}
.personal-account-filter-actions .btn {
    white-space: nowrap;
}
.personal-account-filter-actions .dealer-personal-account-download-slot {
    grid-column: -2 / -1;
    height: auto;
    margin: 0;
    justify-content: flex-end;
}
.personal-account-filter-actions .dealer-personal-account-download {
    gap: .25rem;
}
.personal-account-comparison-cell {
    white-space: nowrap;
    font-size: .75rem;
}
.personal-account-comparison-cell small {
    display: block;
}

.form-floating > .personal-account-filter-label,
.personal-account-filters .dealer-personal-account-date input {
    padding-left: .5rem;
    padding-right: .5rem;
}

.form-floating > .personal-account-date-label {
    width: calc(100% / .85);
    padding-right: .25rem;
}
