/* PropFlow — IR / Lab / outils fiscaux (extrait de pro-ui-pages) */

.ir-calc-open-link {
    width: 100%;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid var(--pro-border);
    border-radius: var(--pro-radius-sm);
    background: var(--pro-surface-muted);
    color: var(--pro-text);
    font-size: var(--pro-fs-sm);
    font-weight: 600;
    cursor: pointer;
}

.ir-calc-open-link:hover {
    border-color: var(--pro-accent-ring);
    color: var(--pro-accent);
    background: var(--pro-accent-muted);
}

.modal-content--ir-calc {
    max-width: 520px !important;
}

.ir-calc-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.ir-calc-income-blocks {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ir-calc-income-block {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 7px 10px;
    border-radius: var(--pro-radius-sm, 10px);
    border: none;
    background: var(--pro-surface-muted, rgba(255, 255, 255, 0.45));
}

.ir-calc-income-block__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 32px;
}

.ir-calc-income-block .ir-calc-label {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.25;
}

.ir-calc-income-block .ir-calc-input-wrap {
    flex: 0 0 auto;
    width: min(38%, 7.5rem);
    gap: 4px;
}

.ir-calc-income-block .ir-calc-input {
    min-width: 0;
    padding: 5px 8px;
    font-size: 0.875rem;
    text-align: right;
}

.ir-calc-income-block .ir-calc-input-suffix {
    flex-shrink: 0;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--pro-text-muted);
}

.ir-calc-income-block--locked {
    background: color-mix(in srgb, var(--pro-text-muted) 7%, var(--pro-surface-muted));
    border: none;
}

.ir-calc-income-block--locked .ir-calc-label {
    color: var(--pro-text-muted);
}

.ir-calc-income-block--editable {
    background: var(--pro-surface-elevated, #fff);
}

.ir-calc-income-block__meta {
    margin: 0;
    padding-left: 2px;
    font-size: 0.625rem;
    line-height: 1.35;
    color: var(--pro-text-muted);
    font-variant-numeric: tabular-nums;
}

.ir-calc-income-block__meta:empty {
    display: none;
}

html[data-theme="dark"] .ir-calc-income-block--locked {
    background: color-mix(in srgb, var(--pro-text-muted) 14%, rgba(255, 255, 255, 0.04));
    border: none;
}

html[data-theme="dark"] .ir-calc-income-block--editable {
    background: rgba(255, 255, 255, 0.06);
}

.ir-calc-disclaimer {
    margin: 0;
    font-size: var(--pro-fs-xs);
    line-height: 1.45;
    color: var(--pro-text-muted);
}

.ir-calc-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ir-calc-label {
    font-size: var(--pro-fs-sm);
    font-weight: 700;
    color: var(--pro-text);
}

.ir-calc-label--sub {
    margin-top: 4px;
    font-weight: 600;
    color: var(--pro-text-muted);
}

.ir-calc-hint {
    margin: 0;
    font-size: var(--pro-fs-xs);
    line-height: 1.35;
    color: var(--pro-text-muted);
}

.ir-calc-input-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ir-calc-input,
.ir-calc-select {
    flex: 1 1 auto;
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid var(--pro-border);
    border-radius: var(--pro-radius-sm);
    background: var(--pro-surface);
    color: var(--pro-text);
    font-size: var(--pro-fs-md);
    font-variant-numeric: tabular-nums;
}

.ir-calc-input:focus,
.ir-calc-select:focus {
    outline: 2px solid var(--pro-accent-ring);
    outline-offset: 1px;
    border-color: var(--pro-accent-ring);
}

.ir-calc-input--locked {
    background: color-mix(in srgb, var(--pro-text-muted) 10%, var(--pro-surface-muted));
    border-color: color-mix(in srgb, var(--pro-text-muted) 18%, var(--pro-border));
    color: var(--pro-text-muted);
    cursor: not-allowed;
    opacity: 1;
    -webkit-text-fill-color: var(--pro-text-muted);
}

.ir-calc-input--locked:focus {
    outline: none;
    border-color: color-mix(in srgb, var(--pro-text-muted) 22%, var(--pro-border));
    box-shadow: none;
}

html[data-theme="dark"] .ir-calc-input--locked {
    background: color-mix(in srgb, var(--pro-text-muted) 12%, rgba(255, 255, 255, 0.06));
    border-color: color-mix(in srgb, var(--pro-text-muted) 20%, rgba(255, 255, 255, 0.1));
    color: color-mix(in srgb, var(--pro-text) 72%, var(--pro-text-muted));
    -webkit-text-fill-color: color-mix(in srgb, var(--pro-text) 72%, var(--pro-text-muted));
}

.ir-calc-bnc-badge {
    margin: 6px 0 0;
    padding: 6px 10px;
    display: inline-block;
    border-radius: 8px;
    font-size: var(--pro-fs-xs);
    font-weight: 600;
    color: var(--pro-accent);
    background: color-mix(in srgb, var(--pro-accent) 10%, var(--pro-surface-muted));
    border: 1px solid color-mix(in srgb, var(--pro-accent) 22%, var(--pro-border-subtle));
}

.ir-calc-input-suffix {
    flex-shrink: 0;
    font-size: var(--pro-fs-sm);
    font-weight: 600;
    color: var(--pro-text-muted);
}

.ir-calc-check {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 2px;
    font-size: var(--pro-fs-xs);
    line-height: 1.35;
    color: var(--pro-text-muted);
    cursor: pointer;
}

.ir-calc-check input {
    margin-top: 2px;
    flex-shrink: 0;
}

.ir-calc-results {
    border-radius: var(--pro-radius);
    border: 1px solid var(--pro-border-subtle);
    background: color-mix(in srgb, var(--pro-surface-muted) 88%, var(--pro-accent) 12%);
    overflow: hidden;
}

.ir-calc-results__hero {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 14px 14px 12px;
    border-bottom: 1px solid var(--pro-border-subtle);
}

.ir-calc-results__label {
    font-size: var(--pro-fs-xs);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--pro-text-muted);
}

.ir-calc-results__value {
    font-size: clamp(1.5rem, 6vw, 1.875rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
    color: var(--pro-accent);
}

.ir-calc-results__sub {
    font-size: var(--pro-fs-xs);
    color: var(--pro-text-muted);
}

.ir-calc-results__breakdown {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--pro-border-subtle);
}

.ir-calc-results__row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.ir-calc-results__row-k {
    font-size: var(--pro-fs-xs);
    color: var(--pro-text-muted);
}

.ir-calc-results__row-v {
    font-size: var(--pro-fs-sm);
    font-weight: 600;
    color: var(--pro-text);
    font-variant-numeric: tabular-nums;
}

.ir-calc-results__row-rate {
    font-weight: 400;
    opacity: 0.85;
}

.ir-calc-results__row--deductible .ir-calc-results__row-v {
    color: var(--pro-success, #047857);
}

.ir-calc-result-hint {
    margin: 10px 0 0;
}

.ir-calc-stats-section {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--pro-border-subtle);
}

.ir-calc-stats-section__title {
    margin: 0 0 8px;
    font-size: var(--pro-fs-sm);
    font-weight: 700;
    color: var(--pro-text);
}

.ir-calc-field--stats-auto {
    margin-top: 4px;
}

.ir-calc-stats-auto-value {
    font-size: var(--pro-fs-md);
    font-weight: 700;
    color: var(--pro-control);
    font-variant-numeric: tabular-nums;
}

.ir-calc-bracket-guide {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--pro-border-subtle);
}

.ir-calc-bracket-guide__lead {
    margin: 0 0 10px;
    font-size: var(--pro-fs-xs);
    line-height: 1.45;
    color: var(--pro-text-muted);
}

.ir-calc-bracket-guide__list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ir-calc-bracket-guide__row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 10px;
    border-radius: 10px;
    background: var(--pro-surface-elevated, #fff);
    border: 1px solid var(--pro-border-subtle);
}

.ir-calc-bracket-guide__row--inactive {
    opacity: 0.55;
}

.ir-calc-bracket-guide__row--inactive .ir-calc-bracket-guide__slice {
    color: var(--pro-text-muted);
    font-weight: 600;
}

.ir-calc-bracket-guide__range {
    flex: 1 1 auto;
    min-width: 0;
    font-size: var(--pro-fs-xs);
    line-height: 1.35;
    color: var(--pro-text);
}

.ir-calc-bracket-guide__slice {
    flex-shrink: 0;
    font-size: var(--pro-fs-sm);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--pro-accent);
    white-space: nowrap;
}

.ir-calc-bracket-guide__decote {
    margin: 10px 0 0;
    font-size: var(--pro-fs-xs);
    line-height: 1.4;
    color: var(--pro-text-muted);
}

.ir-calc-bracket-guide__empty {
    margin: 0;
    font-size: var(--pro-fs-xs);
    color: var(--pro-text-muted);
}

html[data-theme="dark"] .ir-calc-bracket-guide__row {
    background: color-mix(in srgb, var(--pro-surface-muted) 92%, var(--pro-surface-elevated) 8%);
}

.ir-calc-results__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}

.ir-calc-stat {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--pro-border-subtle);
}

.ir-calc-stat:nth-child(odd) {
    border-right: 1px solid var(--pro-border-subtle);
}

.ir-calc-stat:nth-last-child(-n+2) {
    border-bottom: none;
}

.ir-calc-stat__k {
    font-size: 0.625rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--pro-text-muted);
}

.ir-calc-stat__v {
    font-size: var(--pro-fs-sm);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--pro-text);
}

.ir-calc-breakdown {
    padding: 8px 12px 12px;
    border-top: 1px solid var(--pro-border-subtle);
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.ir-calc-breakdown__row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    font-size: var(--pro-fs-xs);
    color: var(--pro-text);
}

.ir-calc-breakdown__row--muted {
    color: var(--pro-text-muted);
}

.ir-calc-breakdown__row span:last-child {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

html[data-theme="dark"] .ir-calc-results {
    background: color-mix(in srgb, var(--pro-surface-muted) 92%, var(--pro-accent) 8%);
}

/* Firms — après impôt (page Firms uniquement) */
.propfirm-card__net-row {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
}

.propfirm-card__net--after-tax {
    font-size: var(--pro-fs-sm);
    font-weight: 600;
    color: var(--pro-text-muted);
}

.propfirm-card__net--after-tax strong {
    color: var(--pro-success);
    font-weight: 700;
}

.propfirm-card__net--after-tax.propfirm-card__net--negative strong {
    color: var(--pro-danger);
}

.propfirm-flow-bar--before-tax:not(.propfirm-flow-bar--roi-negative) .propfirm-flow-bar__fill {
    background: var(--pro-accent, #6366f1);
}

.propfirm-flow-bar--after-tax:not(.propfirm-flow-bar--roi-negative) .propfirm-flow-bar__fill {
    background: linear-gradient(90deg, #0d9488, #14b8a6);
}

.propfirm-flow-bar--after-tax.propfirm-flow-bar--roi-negative .propfirm-flow-bar__fill {
    background: var(--pro-danger, #ef4444) !important;
}

/* —— Header : annule le legacy empilé (main + responsive + desktop) —— */
html body .app-container .app-top-chrome {
    padding: 0 !important;
    margin: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: none !important;
}

html body .app-container .app-top-chrome .header,
html body .app-container .app-top-chrome .header.mobile-only,
html body .app-container .app-top-chrome .header.app-header-unified {
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
    max-height: none !important;
    height: auto !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

html body .app-container .app-top-chrome .header.mobile-only .header-content:not(.app-header-toolbar-wrap),
html body .app-container .app-top-chrome .header-text,
html body .app-container .app-top-chrome .app-header-brand {
    padding: 0 !important;
    margin: 0 !important;
    margin-bottom: 0 !important;
    min-height: 0 !important;
    max-height: none !important;
    height: auto !important;
    gap: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    justify-content: flex-start !important;
    text-align: left !important;
    background: transparent !important;
    box-shadow: none !important;
    text-shadow: none !important;
    line-height: 1.15 !important;
}

@media (max-width: 1023px) {
    html.is-mobile-shell body .app-container .app-top-chrome {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        margin: 0 !important;
        padding-top: 0 !important;
        background: var(--pro-header-bg, var(--pro-surface-elevated, #fff)) !important;
    }

    html.is-mobile-shell body .app-container .content {
        padding-top: 8px !important;
    }

    html:not(.is-mobile-shell) body .app-container .app-top-chrome {
        position: fixed !important;
        left: 0 !important;
        right: 0 !important;
        top: 0 !important;
        width: 100% !important;
        z-index: 1001 !important;
        margin: 0 !important;
        padding-top: 0 !important;
        background: var(--pro-header-bg, var(--pro-surface-elevated, #fff)) !important;
        border-bottom: 1px solid var(--pro-header-border, var(--pro-border-subtle, rgba(55, 48, 107, 0.1))) !important;
        box-shadow: var(--pro-header-shadow, 0 4px 20px rgba(55, 48, 107, 0.06)) !important;
    }

    html:not(.is-mobile-shell) body .app-container .content {
        padding-top: var(--pro-mobile-header-offset, 48px) !important;
    }
}

@media (max-width: 1023px) {
    html body .app-container .app-top-chrome .app-header-toolbar-wrap.header-content,
    html body .app-container .app-top-chrome .header-content.app-header-toolbar-wrap {
        padding: 8px max(16px, env(safe-area-inset-right)) 8px max(16px, env(safe-area-inset-left)) !important;
    }

    html.is-webview body .app-container .app-top-chrome .app-header-toolbar-wrap.header-content,
    html.is-webview body .app-container .app-top-chrome .header-content.app-header-toolbar-wrap {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }

    html:not(.is-webview) body .app-container .app-top-chrome .app-header-toolbar-wrap.header-content,
    html:not(.is-webview) body .app-container .app-top-chrome .header-content.app-header-toolbar-wrap {
        padding-top: max(8px, env(safe-area-inset-top, 0px)) !important;
    }
}

@media (max-width: 1023px) {
    html body .app-container .app-top-chrome .header h1,
    html body .app-container .app-top-chrome #headerTitle,
    html body .app-container .app-top-chrome .propflow-brand-title {
        font-size: var(--pro-header-title-fs) !important;
        line-height: 1.2 !important;
        color: var(--pro-text) !important;
        text-shadow: none !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: unset !important;
    }
}

@media (max-width: 480px), (max-width: 360px) {
    html body .app-container .app-top-chrome .header,
    html body .app-container .app-top-chrome .header.app-header-unified,
    html body .app-container .app-top-chrome .header.mobile-only {
        padding: 0 !important;
        min-height: 0 !important;
        max-height: none !important;
        height: auto !important;
    }
}

/* Modale ajout rapide — croix compacte en overlay (sans header) */
#quickModal .modal-content--quick {
    position: relative;
    padding-top: 20px !important;
}

#quickModal .quick-modal-close {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 3;
    width: 30px;
    height: 30px;
    min-width: 30px;
    min-height: 30px;
    padding: 0;
    margin: 0;
    font-size: 1.05rem;
    line-height: 1;
    flex-shrink: 0;
    border: none !important;
    border-radius: 8px !important;
    background: color-mix(in srgb, var(--pro-accent) 8%, transparent) !important;
    color: var(--pro-text-muted) !important;
}

#quickModal .quick-modal-close:hover,
#quickModal .quick-modal-close:focus-visible {
    background: color-mix(in srgb, var(--pro-accent) 14%, transparent) !important;
    color: var(--pro-accent) !important;
    outline: none !important;
}

#quickModal .quick-type-selector,
#editModal .quick-type-selector {
    display: flex;
    gap: 8px;
    padding-right: 28px;
    box-sizing: border-box;
}

#quickModal .quick-type-btn,
#editModal .quick-type-btn {
    flex: 1 1 0;
    border: none !important;
    background: color-mix(in srgb, var(--pro-accent) 5%, var(--pro-surface-muted)) !important;
    color: var(--pro-text-secondary) !important;
    box-shadow: none !important;
}

#quickModal .quick-type-btn.active,
#editModal .quick-type-btn.active {
    border: none !important;
    color: var(--pro-success, #047857) !important;
    background: color-mix(in srgb, var(--pro-success, #047857) 12%, var(--pro-surface-elevated)) !important;
    box-shadow: none !important;
}

#quickModal .quick-type-btn.active.expense,
#editModal .quick-type-btn.active.expense {
    border: none !important;
    color: var(--pro-danger, #b91c1c) !important;
    background: color-mix(in srgb, var(--pro-danger, #b91c1c) 12%, var(--pro-surface-elevated)) !important;
}

#quickModal .quick-form-label,
#editModal .quick-form-label,
#quickModal label,
#editModal label {
    font-size: 0.75rem !important;
    font-weight: 650 !important;
    color: var(--pro-text-muted) !important;
    letter-spacing: 0.01em;
    margin-bottom: 6px !important;
}

#editModal .modal-header {
    border-bottom: none !important;
}

/* Modale ajout / édition — centrée sur mobile, légèrement aérée */
@media (max-width: 1023px) {
    html.is-mobile-shell #quickModal.modal,
    html.is-mobile-shell #editModal.modal,
    #quickModal.modal,
    #editModal.modal {
        align-items: center !important;
        justify-content: center !important;
        padding: max(14px, env(safe-area-inset-top, 0px)) 16px max(14px, env(safe-area-inset-bottom, 0px)) !important;
    }

    #quickModal .modal-content,
    #editModal .modal-content {
        width: 100% !important;
        max-width: min(420px, calc(100vw - 32px)) !important;
        margin: auto !important;
        max-height: min(86dvh, calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 28px)) !important;
        padding: 20px 20px 22px !important;
        border-radius: 24px !important;
        border: none !important;
        overflow-y: auto !important;
        box-sizing: border-box !important;
        box-shadow: var(--pro-shadow-float) !important;
    }

    #editModal .modal-header {
        margin-bottom: 16px !important;
        padding-bottom: 0 !important;
        border-bottom: none !important;
    }

    #editModal .modal-title {
        font-size: 1.08rem !important;
        gap: 8px !important;
    }

    #editModal .modal-title .icon-sm {
        width: 18px !important;
        height: 18px !important;
    }

    #editModal .close-btn {
        width: 34px !important;
        height: 34px !important;
        font-size: 1rem !important;
    }

    #quickModal .quick-modal-close {
        top: 8px !important;
        right: 8px !important;
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        min-height: 32px !important;
    }

    #quickModal .quick-type-selector,
    #editModal .quick-type-selector {
        gap: 10px !important;
        margin-bottom: 16px !important;
        padding-right: 28px !important;
    }

    #quickModal .quick-type-btn,
    #editModal .quick-type-btn {
        padding: 14px 12px !important;
        min-height: 54px !important;
        gap: 6px !important;
        font-size: 0.875rem !important;
        border-radius: 14px !important;
    }

    #quickModal .quick-type-btn .icon-md,
    #editModal .quick-type-btn .icon-md {
        width: 22px !important;
        height: 22px !important;
    }

    #quickModal .quick-form-row,
    #editModal .quick-form-row {
        gap: 12px !important;
        margin-bottom: 14px !important;
    }

    #quickModal .quick-form-group,
    #editModal .quick-form-group {
        min-width: 0 !important;
        flex: 1 1 auto !important;
    }

    #quickModal .quick-form-row > .quick-form-group:only-child,
    #editModal .quick-form-row > .quick-form-group:only-child,
    #quickModal .quick-form-group[style*="width: 100%"],
    #editModal .quick-form-group[style*="width: 100%"] {
        width: 100% !important;
        flex: 1 1 100% !important;
    }

    #quickModal .quick-form-input,
    #editModal .quick-form-input {
        padding: 13px 15px !important;
        min-height: 50px !important;
        font-size: 16px !important;
        border-radius: 12px !important;
        border: none !important;
    }

    #quickModal select.quick-form-input,
    #editModal select.quick-form-input {
        padding-right: 36px !important;
        background-size: 14px !important;
        background-position: right 12px center !important;
    }

    #quickModal #quickCurrency,
    #editModal #editCurrency {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        padding-left: 10px !important;
        padding-right: 2rem !important;
        text-align: center !important;
    }

    #quickModal .quick-form-group--currency,
    #editModal .quick-form-group--currency {
        flex: 0 0 5.25rem !important;
        width: 5.25rem !important;
        min-width: 5.25rem !important;
        max-width: 5.25rem !important;
    }

    #quickModal .quick-form-row--amount,
    #editModal .quick-form-row--amount {
        flex-wrap: nowrap !important;
    }

    #quickModal .quick-form-row--amount .quick-form-group--amount,
    #editModal .quick-form-row--amount .quick-form-group--amount {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        max-width: calc(100% - 5.75rem) !important;
    }

    #quickModal .quick-form-row--amount .quick-form-group--currency,
    #editModal .quick-form-row--amount .quick-form-group--currency {
        flex: 0 0 5.25rem !important;
        width: 5.25rem !important;
        min-width: 5.25rem !important;
        max-width: 5.25rem !important;
    }

    #quickModal #quickQuantityAccountRow .quick-form-group,
    #editModal #editQuantityAccountRow .quick-form-group,
    #quickModal #quickQuantityAccountRow .quick-form-group--full,
    #editModal #editQuantityAccountRow .quick-form-group--full {
        flex: 1 1 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    /* Prop firm + plan catalogue — même ligne, plan discret */
    #quickModal .quick-form-row--firm-plan,
    #editModal .quick-form-row--firm-plan {
        flex-wrap: nowrap !important;
        gap: 8px !important;
        align-items: stretch;
    }

    #quickModal .quick-form-group--firm,
    #editModal .quick-form-group--firm {
        flex: 1 1 0 !important;
        min-width: 0 !important;
    }

    #quickModal .quick-form-group--plan,
    #editModal .quick-form-group--plan {
        flex: 0 1 42% !important;
        max-width: 11.5rem !important;
        min-width: 6.5rem !important;
    }

    #quickModal .quick-form-group--plan[hidden],
    #editModal .quick-form-group--plan[hidden] {
        display: none !important;
    }

    #quickModal #quickCatalogPlan,
    #editModal #editCatalogPlan {
        font-size: 0.875rem !important;
        padding-left: 10px !important;
        padding-right: 28px !important;
        color: var(--pro-text-muted, #6b7280);
    }

    #quickModal #quickCatalogPlan:not([value=""]),
    #quickModal #quickCatalogPlan:valid,
    #editModal #editCatalogPlan:not([value=""]),
    #editModal #editCatalogPlan:valid {
        color: var(--pro-text, #1f1a33);
    }

    #quickModal .submit-btn,
    #editModal .submit-btn {
        padding: 15px 16px !important;
        min-height: 52px !important;
        margin-top: 8px !important;
        font-size: 1rem !important;
        border-radius: 14px !important;
        border: none !important;
        box-shadow: none !important;
    }
}

/* —— Bandeau app Android (navigateur hors WebView) —— */
.android-app-banner {
    margin: 0 0 10px;
    padding: 0 2px;
}

.android-app-banner__inner {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 36px;
    padding: 6px 8px 6px 10px;
    border-radius: 12px;
    border: none;
    background: color-mix(in srgb, var(--pro-accent) 8%, var(--pro-surface-elevated));
}

.android-app-banner__icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--pro-accent, #6366f1);
    opacity: 0.9;
}

.android-app-banner__text {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 8px;
    font-size: 0.75rem;
    line-height: 1.25;
    color: var(--pro-text, #374151);
}

.android-app-banner__label {
    font-weight: 500;
    color: var(--pro-text-muted, #6b7280);
}

.android-app-banner__cta {
    flex: 0 0 auto;
    padding: 0;
    border: none;
    background: none;
    font: inherit;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--pro-accent, #6366f1);
    text-decoration: underline;
    text-underline-offset: 2px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

.android-app-banner__cta:hover {
    color: #4f46e5;
}

.android-app-banner__dismiss {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    margin: -4px -2px -4px 0;
    padding: 0;
    border: none;
    border-radius: 8px;
    background: transparent;
    font-size: 1.1rem;
    line-height: 1;
    color: var(--pro-text-muted, #9ca3af);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

.android-app-banner__dismiss:hover {
    background: rgba(99, 102, 241, 0.1);
    color: var(--pro-text, #4b5563);
}

html[data-theme="dark"] .android-app-banner__inner {
    background: linear-gradient(90deg, rgba(99, 102, 241, 0.16), rgba(99, 102, 241, 0.06));
}

/* —— États vides / onboarding (0 transaction) —— */
.stats-welcome-banner {
    margin: 0 0 16px;
    padding: 0 2px;
}

.stats-welcome-banner__inner {
    display: grid;
    gap: 14px;
    padding: 18px 16px;
    border-radius: var(--pro-radius-lg, 16px);
    border: 1px solid var(--pro-accent-ring, rgba(99, 102, 241, 0.22));
    background:
        linear-gradient(145deg, rgba(99, 102, 241, 0.1), rgba(124, 58, 237, 0.05)),
        var(--pro-surface-elevated, #fff);
    box-shadow: var(--pro-shadow-sm, 0 2px 12px rgba(55, 48, 107, 0.06));
}

.stats-welcome-banner__title {
    margin: 0 0 6px;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.3;
    color: var(--pro-text, #1f1b2e);
    letter-spacing: -0.02em;
}

.stats-welcome-banner__subtitle {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.45;
    color: var(--pro-text-muted, #6b7280);
}

.stats-welcome-banner__steps {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 8px;
}

.stats-welcome-banner__steps li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.8125rem;
    line-height: 1.35;
    color: var(--pro-text, #374151);
}

.stats-welcome-banner__step-num {
    flex: 0 0 22px;
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    font-size: 0.6875rem;
    font-weight: 700;
    color: var(--pro-accent, #6366f1);
    background: var(--pro-accent-muted, rgba(99, 102, 241, 0.12));
}

.stats-welcome-banner__cta,
.empty-state-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 44px;
    padding: 10px 16px;
    border: none !important;
    border-radius: 12px;
    font-size: 0.875rem;
    font-weight: 650;
    color: var(--pro-on-accent, #fff) !important;
    background: var(--pro-accent) !important;
    box-shadow: none !important;
    cursor: pointer;
    transition: background 0.15s ease;
}

.submit-btn {
    border: none !important;
    border-radius: 12px !important;
    font-weight: 650 !important;
    color: var(--pro-on-accent, #fff) !important;
    background: var(--pro-accent) !important;
    box-shadow: none !important;
}

.stats-welcome-banner__cta:hover,
.empty-state-cta:hover,
.submit-btn:hover {
    transform: none;
    background: var(--pro-accent-hover, #4f46e5) !important;
    box-shadow: none !important;
}

.empty-state {
    text-align: center;
    padding: 28px 14px !important;
    margin: 0 0 12px;
    border-radius: var(--pro-radius, 12px);
    background: var(--pro-surface-elevated, #f0eef5);
    border: none !important;
    box-shadow: var(--pro-shadow-sm, 0 1px 2px rgba(26, 24, 22, 0.04));
    color: var(--pro-text-muted);
}

.empty-state-icon {
    margin: 0 auto 12px;
    opacity: 0.55;
    display: flex;
    justify-content: center;
    color: var(--pro-text-muted);
}

.empty-state-text {
    font-size: 0.9375rem !important;
    font-weight: 700 !important;
    color: var(--pro-text) !important;
    margin-bottom: 6px !important;
    letter-spacing: -0.01em;
}

.empty-state-subtext {
    font-size: 0.8125rem !important;
    line-height: 1.45 !important;
    color: var(--pro-text-muted) !important;
    opacity: 0.95 !important;
    max-width: 22rem;
    margin: 0 auto !important;
}

.empty-state--rich {
    padding: 28px 16px 24px !important;
    color: var(--pro-text-muted, #6b7280);
}

.empty-state--rich.empty-state--compact {
    padding: 20px 12px 16px !important;
}

.empty-state-visual {
    position: relative;
    width: min(200px, 100%);
    height: 68px;
    margin: 0 auto 14px;
}

.empty-state-visual__chart {
    position: absolute;
    inset: 8px 0 16px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--pro-accent) 7%, transparent);
    border: none;
}

.empty-state-visual__chart::after {
    content: '';
    position: absolute;
    left: 10%;
    right: 8%;
    bottom: 18%;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(
        90deg,
        transparent,
        color-mix(in srgb, var(--pro-accent) 45%, transparent),
        color-mix(in srgb, var(--pro-success) 50%, transparent)
    );
    transform: skewY(-4deg);
}

.empty-state-visual__bars {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    display: flex;
    align-items: flex-end;
    gap: 6px;
    height: 28px;
}

.empty-state-visual__bars span {
    display: block;
    width: 10px;
    border-radius: 4px 4px 2px 2px;
    background: color-mix(in srgb, var(--pro-accent) 18%, transparent);
}

.empty-state-visual__bars span:nth-child(1) { height: 14px; }
.empty-state-visual__bars span:nth-child(2) {
    height: 24px;
    background: color-mix(in srgb, var(--pro-accent) 28%, transparent);
}
.empty-state-visual__bars span:nth-child(3) { height: 18px; }

.empty-state--rich .empty-state-text {
    font-size: 1rem;
    font-weight: 700;
    color: var(--pro-text, #374151);
    margin-bottom: 6px;
}

.empty-state--rich .empty-state-subtext {
    font-size: 0.8125rem;
    line-height: 1.45;
    opacity: 0.92;
    max-width: 28rem;
    margin: 0 auto 14px;
}

.empty-state--rich .empty-state-cta {
    width: auto;
    min-width: min(100%, 240px);
    margin: 0 auto;
}

.chart-empty-overlay[hidden] {
    display: none !important;
}

.chart-empty-overlay {
    position: absolute;
    inset: 36px 0 12px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 12px;
    text-align: center;
    pointer-events: none;
    color: var(--pro-text-muted, #6b7280);
}

.chart-empty-overlay__illus {
    width: min(240px, 90%);
    margin-bottom: 4px;
    color: var(--pro-accent, #6366f1);
    opacity: 0.75;
}

.chart-empty-overlay__illus svg {
    width: 100%;
    height: auto;
    display: block;
}

.chart-empty-overlay__title {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--pro-text, #4b5563);
}

.chart-empty-overlay__hint {
    font-size: 0.75rem;
    line-height: 1.35;
    opacity: 0.85;
}

.chart-metrics-empty {
    padding: 4px 2px 0;
}

.chart-metrics-empty__preview.chart-metrics-compare {
    opacity: 0.85;
}

.chart-metrics-empty__preview .chart-metrics-compare__val .chart-metric__v,
.chart-metrics-empty__preview .chart-metrics-empty__v {
    color: rgba(107, 114, 128, 0.55);
    font-weight: 700;
}

.chart-metrics-empty__card {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px 8px;
    border-radius: 12px;
    border: 1px dashed rgba(99, 102, 241, 0.2);
    background: rgba(99, 102, 241, 0.04);
    min-height: 58px;
}

.chart-metrics-empty__k {
    font-size: 0.625rem;
    line-height: 1.2;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--pro-text-muted, #9ca3af);
}

.chart-metrics-empty__v {
    font-size: 1.05rem;
    font-weight: 700;
    color: rgba(107, 114, 128, 0.55);
}

.chart-metrics-empty__hint {
    margin: 10px 2px 0;
    font-size: 0.75rem;
    line-height: 1.4;
    text-align: center;
    color: var(--pro-text-muted, #9ca3af);
}

body[data-app-empty] .fab-floating {
    animation: fab-empty-pulse 2.6s ease-out infinite;
}

@keyframes fab-empty-pulse {
    0%, 100% {
        box-shadow: 0 8px 24px rgba(99, 102, 241, 0.35);
    }
    50% {
        box-shadow: 0 8px 28px rgba(99, 102, 241, 0.5), 0 0 0 10px rgba(99, 102, 241, 0.12);
    }
}

body[data-app-empty] #historySearchInput {
    opacity: 0.72;
}

html[data-theme="dark"] .stats-welcome-banner__inner {
    background:
        linear-gradient(145deg, rgba(99, 102, 241, 0.16), rgba(124, 58, 237, 0.08)),
        var(--pro-surface-elevated, #1e1b2e);
}

html[data-theme="dark"] .chart-metrics-empty__card {
    background: rgba(99, 102, 241, 0.08);
    border-color: rgba(99, 102, 241, 0.28);
}


/* —— Lab (simulateurs ponctuels) —— */
.lab-page-intro {
    margin: 0 0 12px;
    padding: 0 2px;
    font-size: var(--pro-fs-sm, 0.875rem);
    color: var(--pro-text-muted);
    line-height: 1.35;
}

.lab-card {
    padding: 14px 14px 16px;
}

.lab-card__head {
    margin-bottom: 12px;
}

.lab-card__title {
    margin: 0 0 4px;
    font-size: 1.0625rem;
    font-weight: 700;
    color: var(--pro-text);
    line-height: 1.25;
}

.lab-card__desc {
    margin: 0;
    font-size: 0.75rem;
    line-height: 1.4;
    color: var(--pro-text-muted);
}

.lab-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px 10px;
    margin-bottom: 10px;
}

.lab-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.lab-field--wide {
    grid-column: 1 / -1;
}

.lab-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--pro-text-muted);
}

.lab-input-wrap {
    display: flex;
    align-items: center;
    gap: 4px;
}

.lab-input {
    flex: 1 1 auto;
    min-width: 0;
    padding: 7px 8px;
    border: none;
    border-radius: var(--pro-radius-sm, 8px);
    background: color-mix(in srgb, var(--pro-accent) 4%, var(--pro-surface-muted));
    color: var(--pro-text);
    font-size: 0.9375rem;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.lab-input:focus {
    outline: none;
    border: none;
    background: color-mix(in srgb, var(--pro-accent) 9%, var(--pro-surface-muted));
}

.lab-input-suffix {
    flex-shrink: 0;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--pro-text-muted);
}

.lab-roi-expense-callout {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin: 0 0 12px;
    padding: 10px 12px;
    border-radius: var(--pro-radius-sm, 8px);
    border: 1px solid color-mix(in srgb, var(--pro-accent) 22%, transparent);
    background: color-mix(in srgb, var(--pro-accent) 8%, var(--pro-surface-muted, transparent));
}

.lab-roi-expense-callout__label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--pro-text-muted);
}

.lab-roi-expense-callout__value {
    font-size: 1.25rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: var(--pro-accent);
    line-height: 1.2;
}

.lab-roi-expense-callout__hint {
    font-size: 0.75rem;
    line-height: 1.4;
    color: var(--pro-text-muted);
}

.lab-suggest-btn {
    display: block;
    width: 100%;
    margin: 0 0 14px;
    padding: 8px 10px;
    border: 1px dashed color-mix(in srgb, var(--pro-accent) 35%, transparent);
    border-radius: var(--pro-radius-sm, 8px);
    background: color-mix(in srgb, var(--pro-accent) 6%, transparent);
    color: var(--pro-accent);
    font-size: 0.8125rem;
    font-weight: 600;
    cursor: pointer;
}

.lab-suggest-btn:active {
    transform: scale(0.99);
}

.lab-result__hero {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 8px;
}

.lab-result__label {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--pro-text-muted);
}

.lab-result__value {
    font-size: 1.5rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: var(--pro-text);
    line-height: 1.15;
}

.lab-result__sub {
    font-size: 0.75rem;
    color: var(--pro-text-muted);
    font-variant-numeric: tabular-nums;
}

.lab-result__hint {
    margin: 0 0 10px;
    font-size: 0.75rem;
    line-height: 1.4;
    color: var(--pro-text-muted);
}

.lab-result__rows {
    display: flex;
    flex-direction: column;
    gap: 0;
    border-top: 1px solid var(--pro-border-subtle, rgba(99, 102, 241, 0.12));
}

.lab-result__row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    padding: 7px 0;
    border-bottom: 1px solid var(--pro-border-subtle, rgba(99, 102, 241, 0.08));
    font-size: 0.8125rem;
    font-variant-numeric: tabular-nums;
}

.lab-result__row span:first-child {
    color: var(--pro-text-muted);
    min-width: 0;
}

.lab-result__row span:last-child {
    font-weight: 600;
    color: var(--pro-text);
    text-align: right;
    white-space: nowrap;
}

.lab-result__row--muted span:first-child,
.lab-result__row--muted span:last-child {
    color: var(--pro-text-muted);
    font-weight: 500;
}

.lab-result__row--total span:first-child,
.lab-result__row--total span:last-child {
    font-weight: 700;
    color: var(--pro-text);
}

@media (max-width: 380px) {
    .lab-form {
        grid-template-columns: 1fr;
    }
}

