:root {
    --app-bg: #f5f2ec;
    --app-bg-2: #eef6f4;
    --app-surface: #ffffff;
    --app-surface-2: #fbfaf7;
    --app-border: #ded8cc;
    --app-border-strong: #c8bead;
    --app-text: #1d2329;
    --app-muted: #6f746f;
    --app-ink: #172026;
    --app-primary: #0c7476;
    --app-primary-dark: #07595b;
    --app-primary-soft: #e4f3f1;
    --app-accent: #c7802f;
    --app-accent-soft: #fff0dc;
    --app-success: #29785b;
    --app-warning: #a66713;
    --app-danger: #b33a2f;
    --app-shadow: 0 18px 45px rgba(33, 35, 32, 0.10);
    --app-shadow-soft: 0 10px 28px rgba(33, 35, 32, 0.07);
    --bs-primary: var(--app-primary);
    --bs-primary-rgb: 12, 116, 118;
}

/* Fiche fournisseur : compte lisible et règlements regroupés. */
.supplier-page-header {
    margin-bottom: 1rem;
}

.supplier-profile-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.38fr);
    overflow: hidden;
    background: linear-gradient(135deg, #ffffff 0%, #f7faf8 68%, #edf6f4 100%);
    border: 1px solid var(--app-border);
    border-radius: 14px;
    box-shadow: var(--app-shadow-soft);
}

.supplier-profile-identity {
    display: flex;
    min-width: 0;
    gap: 1.15rem;
    padding: 1.35rem 1.45rem;
    align-items: center;
}

.supplier-profile-avatar {
    display: grid;
    width: 82px;
    height: 82px;
    flex: 0 0 auto;
    color: #fff;
    background: linear-gradient(135deg, #0b595a, #14928b);
    border: 4px solid #fff;
    border-radius: 20px;
    place-items: center;
    box-shadow: 0 10px 25px rgba(10, 89, 87, 0.18);
    font-size: 1.55rem;
    font-weight: 950;
    letter-spacing: 0.035em;
}

.supplier-profile-copy {
    min-width: 0;
}

.supplier-profile-status {
    display: flex;
    gap: 0.65rem;
    color: var(--app-muted);
    align-items: center;
    flex-wrap: wrap;
    font-size: 0.78rem;
}

.supplier-status-pill {
    display: inline-flex;
    min-height: 26px;
    padding: 0.22rem 0.55rem;
    align-items: center;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 850;
}

.supplier-status-pill.is-active {
    color: #146345;
    background: #e3f4ec;
    border: 1px solid #c5e6d7;
}

.supplier-status-pill.is-inactive {
    color: #66706d;
    background: #eef1f0;
    border: 1px solid #dce2df;
}

.supplier-profile-copy h2 {
    margin: 0.4rem 0 0.7rem;
    color: #173d3b;
    font-size: clamp(1.55rem, 2.5vw, 2.25rem);
    font-weight: 900;
    line-height: 1.05;
    overflow-wrap: anywhere;
}

.supplier-profile-contacts {
    display: flex;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.supplier-profile-contacts > span {
    min-width: 145px;
    padding: 0.55rem 0.68rem;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid #dfe9e6;
    border-radius: 9px;
}

.supplier-profile-contacts > span.is-address {
    min-width: min(100%, 250px);
}

.supplier-profile-contacts small,
.supplier-profile-contacts strong {
    display: block;
}

.supplier-profile-contacts small {
    margin-bottom: 0.1rem;
    color: var(--app-muted);
    font-size: 0.67rem;
    font-weight: 800;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

.supplier-profile-contacts strong {
    color: var(--app-text);
    font-size: 0.86rem;
    overflow-wrap: anywhere;
}

.supplier-profile-balance {
    display: flex;
    min-height: 160px;
    padding: 1.35rem 1.5rem;
    flex-direction: column;
    justify-content: center;
    border-left: 1px solid rgba(255, 255, 255, 0.16);
}

.supplier-profile-balance.is-due {
    color: #fff;
    background: linear-gradient(135deg, #7e2831, #ad3a45);
}

.supplier-profile-balance.is-settled {
    color: #fff;
    background: linear-gradient(135deg, #126347, #1b8a63);
}

.supplier-profile-balance.is-credit {
    color: #fff;
    background: linear-gradient(135deg, #075d65, #12848a);
}

.supplier-profile-balance span {
    color: rgba(255, 255, 255, 0.76);
    font-size: 0.74rem;
    font-weight: 850;
    letter-spacing: 0.065em;
    text-transform: uppercase;
}

.supplier-profile-balance strong {
    margin: 0.4rem 0 0.3rem;
    font-size: clamp(1.8rem, 3.2vw, 2.7rem);
    font-weight: 950;
    line-height: 1;
}

.supplier-profile-balance small {
    color: rgba(255, 255, 255, 0.78);
}

.supplier-profile-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow: hidden;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid var(--app-border);
    border-radius: 12px;
    box-shadow: var(--app-shadow-soft);
}

.supplier-profile-metrics > div {
    min-width: 0;
    padding: 0.85rem 1rem;
    border-right: 1px solid var(--app-border);
}

.supplier-profile-metrics > div:last-child {
    border-right: 0;
}

.supplier-profile-metrics span,
.supplier-profile-metrics strong,
.supplier-profile-metrics small {
    display: block;
}

.supplier-profile-metrics span {
    color: var(--app-muted);
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.supplier-profile-metrics strong {
    margin-top: 0.2rem;
    color: #203b39;
    font-size: 1.08rem;
    font-weight: 900;
}

.supplier-profile-metrics strong.is-success {
    color: var(--app-success);
}

.supplier-profile-metrics strong.is-warning {
    color: #a56910;
}

.supplier-profile-metrics small {
    margin-top: 0.1rem;
    overflow: hidden;
    color: var(--app-muted);
    font-size: 0.72rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.supplier-account-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(310px, 390px);
    gap: 1rem;
    align-items: start;
}

.supplier-account-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    min-width: 0;
    gap: 1rem;
}

.supplier-account-side {
    min-width: 0;
}

.supplier-section-header {
    display: flex;
    gap: 1rem;
    padding: 1.05rem 1.15rem;
    align-items: flex-end;
    justify-content: space-between;
    background: linear-gradient(180deg, #fff, #fbfcfb);
    border-bottom: 1px solid var(--app-border);
}

.supplier-section-header h2,
.supplier-payment-panel-head h2 {
    margin: 0.1rem 0 0.2rem;
    color: #203331;
    font-size: 1.05rem;
    font-weight: 900;
}

.supplier-section-header p {
    margin: 0;
    color: var(--app-muted);
    font-size: 0.8rem;
}

.supplier-section-kicker {
    color: var(--app-primary);
    font-size: 0.66rem;
    font-weight: 900;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

.supplier-ledger-search {
    display: flex;
    min-width: min(100%, 430px);
    gap: 0.4rem;
}

.supplier-ledger-search .form-control {
    min-width: 180px;
}

.supplier-ledger-list {
    padding: 0.2rem 1.1rem 1rem;
}

.supplier-ledger-entry {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 0.75rem;
    padding: 1rem 0;
    border-bottom: 1px solid #e7ecea;
}

.supplier-ledger-entry:last-child {
    border-bottom: 0;
}

.supplier-ledger-marker {
    display: grid;
    width: 42px;
    height: 42px;
    color: #fff;
    background: #70817d;
    border-radius: 11px;
    place-items: center;
}

.supplier-ledger-marker .nav-ic {
    width: 21px;
    height: 21px;
}

.supplier-ledger-entry.is-payment .supplier-ledger-marker {
    background: linear-gradient(135deg, #0b6d6d, #17948d);
}

.supplier-ledger-entry.is-purchase .supplier-ledger-marker {
    color: #80500c;
    background: #f8e8c9;
}

.supplier-ledger-content {
    min-width: 0;
}

.supplier-ledger-head {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    justify-content: space-between;
}

.supplier-ledger-type {
    color: var(--app-muted);
    font-size: 0.65rem;
    font-weight: 850;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.supplier-ledger-head h3 {
    margin: 0.12rem 0 0.25rem;
    color: #213b39;
    font-size: 0.98rem;
    font-weight: 900;
}

.supplier-ledger-head h3 a {
    color: inherit;
    text-decoration: none;
}

.supplier-ledger-head h3 a:hover {
    color: var(--app-primary);
    text-decoration: underline;
}

.supplier-ledger-meta {
    display: flex;
    gap: 0.35rem 0.8rem;
    color: var(--app-muted);
    flex-wrap: wrap;
    font-size: 0.75rem;
}

.supplier-ledger-amount {
    flex: 0 0 auto;
    text-align: right;
}

.supplier-ledger-amount span,
.supplier-ledger-amount small {
    display: block;
    color: var(--app-muted);
    font-size: 0.68rem;
}

.supplier-ledger-amount strong {
    display: block;
    margin: 0.08rem 0;
    font-size: 1.05rem;
    font-weight: 900;
}

.supplier-ledger-amount.is-payment strong {
    color: #167250;
}

.supplier-ledger-amount.is-purchase strong {
    color: #b33e49;
}

.supplier-ledger-chips {
    display: flex;
    gap: 0.35rem;
    margin-top: 0.55rem;
    flex-wrap: wrap;
}

.supplier-ledger-chips > span {
    display: inline-flex;
    min-height: 25px;
    padding: 0.2rem 0.48rem;
    color: #4d605d;
    background: #f2f6f5;
    border: 1px solid #e0e8e6;
    border-radius: 999px;
    align-items: center;
    font-size: 0.69rem;
    font-weight: 750;
}

.supplier-ledger-status.is-success {
    color: #176444;
    background: #e4f4ec;
    border-color: #c8e8d8;
}

.supplier-ledger-status.is-warning {
    color: #80520b;
    background: #fff2d8;
    border-color: #efd9a9;
}

.supplier-ledger-status.is-danger {
    color: #9d323c;
    background: #fce9eb;
    border-color: #f1cdd1;
}

.supplier-payment-allocations {
    margin-top: 0.65rem;
    overflow: hidden;
    background: #f8faf9;
    border: 1px solid #e0e7e5;
    border-radius: 9px;
}

.supplier-payment-allocations summary {
    display: flex;
    padding: 0.55rem 0.7rem;
    align-items: center;
    justify-content: space-between;
    color: #38504d;
    cursor: pointer;
    font-size: 0.75rem;
    font-weight: 800;
    list-style: none;
}

.supplier-payment-allocations summary::-webkit-details-marker {
    display: none;
}

.supplier-payment-allocations summary span {
    color: var(--app-primary);
    font-size: 0.69rem;
}

.supplier-payment-allocations[open] summary {
    border-bottom: 1px solid #e0e7e5;
}

.supplier-payment-allocations > div {
    padding: 0.35rem 0.7rem;
}

.supplier-payment-allocations a {
    display: flex;
    gap: 1rem;
    padding: 0.48rem 0;
    align-items: center;
    justify-content: space-between;
    color: var(--app-text);
    border-bottom: 1px solid #e5ebe9;
    text-decoration: none;
}

.supplier-payment-allocations a:last-child {
    border-bottom: 0;
}

.supplier-payment-allocations a span,
.supplier-payment-allocations a small {
    display: block;
}

.supplier-payment-allocations a small {
    color: var(--app-muted);
    font-size: 0.7rem;
}

.supplier-ledger-comment {
    margin: 0.55rem 0 0;
    color: var(--app-muted);
    font-size: 0.78rem;
}

.supplier-ledger-empty {
    display: grid;
    min-height: 155px;
    color: var(--app-muted);
    place-content: center;
    text-align: center;
}

.supplier-ledger-empty strong {
    color: var(--app-text);
}

.supplier-section-header.is-compact {
    align-items: center;
}

.supplier-section-count {
    padding: 0.35rem 0.6rem;
    color: var(--app-muted);
    background: #f1f4f2;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 800;
}

.supplier-purchases-table {
    min-width: 790px;
}

.supplier-purchases-table th {
    color: #58625f;
    background: #f5f1e9;
    font-size: 0.7rem;
    font-weight: 850;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.supplier-purchases-table tbody td {
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
}

.supplier-purchases-table tbody tr.has-balance {
    box-shadow: inset 3px 0 0 #d8a34c;
}

.supplier-purchases-table td:first-child small {
    display: block;
    margin-top: 0.1rem;
    color: var(--app-muted);
    font-size: 0.72rem;
}

.supplier-purchase-status {
    display: inline-flex;
    padding: 0.24rem 0.5rem;
    border-radius: 999px;
    font-size: 0.69rem;
    font-weight: 850;
}

.supplier-purchase-status.is-paye {
    color: #176444;
    background: #e3f3eb;
}

.supplier-purchase-status.is-partiel {
    color: #7e5009;
    background: #ffefcf;
}

.supplier-purchase-status.is-non_paye {
    color: #9c343d;
    background: #fbe8ea;
}

.supplier-payment-panel {
    position: sticky;
    top: 88px;
    padding: 1.05rem;
    scroll-margin-top: 90px;
}

.supplier-payment-panel-head {
    display: flex;
    gap: 0.75rem;
    padding-bottom: 0.85rem;
    align-items: center;
    border-bottom: 1px solid var(--app-border);
}

.supplier-payment-panel-icon {
    display: grid;
    width: 42px;
    height: 42px;
    color: var(--app-primary);
    background: var(--app-primary-soft);
    border-radius: 11px;
    place-items: center;
}

.supplier-payment-due {
    display: flex;
    margin: 0.85rem 0;
    padding: 0.75rem;
    align-items: center;
    justify-content: space-between;
    color: #71323a;
    background: #fff2f2;
    border: 1px solid #f0d3d5;
    border-radius: 9px;
}

.supplier-payment-due span {
    font-size: 0.76rem;
    font-weight: 800;
}

.supplier-payment-due strong {
    font-size: 1rem;
    font-weight: 900;
}

.supplier-payment-due.is-settled,
.supplier-payment-due.is-credit {
    color: #175d58;
    background: #edf8f5;
    border-color: #cde8e1;
}

.supplier-payment-due.is-credit {
    color: #0b6269;
    background: #eaf7f8;
    border-color: #c4e4e7;
}

.supplier-payment-panel .treasury-extra-fields {
    margin: 0 0 0.85rem;
}

.supplier-payment-trace-note {
    display: grid;
    gap: 0.15rem;
    margin: 0.9rem 0;
    padding: 0.7rem;
    color: #315653;
    background: #edf7f5;
    border: 1px solid #d3e9e5;
    border-radius: 9px;
    font-size: 0.74rem;
}

.supplier-payment-trace-note strong {
    color: #155f5c;
}

.supplier-payment-advance-remainder {
    padding: 0.55rem 0;
    color: #0b6269;
    font-size: 0.74rem;
}

.supplier-payment-settled {
    display: grid;
    min-height: 170px;
    color: var(--app-muted);
    place-content: center;
    text-align: center;
}

.supplier-payment-settled .nav-ic {
    width: 34px;
    height: 34px;
    margin: 0 auto 0.5rem;
    color: var(--app-success);
}

.supplier-payment-settled strong,
.supplier-payment-settled span {
    display: block;
}

.supplier-payment-settled strong {
    color: var(--app-success);
}

/* Consultation transversale des paiements fournisseurs. */
.supplier-payments-page-icon .nav-ic {
    width: 25px;
    height: 25px;
}

.supplier-payments-page-actions .btn {
    display: inline-flex;
    gap: 0.4rem;
    align-items: center;
}

.supplier-payments-page-actions .nav-ic {
    width: 18px;
    height: 18px;
}

.supplier-payment-shortcuts {
    display: flex;
    gap: 0.45rem;
    flex-wrap: wrap;
}

.supplier-payment-shortcuts a {
    display: inline-flex;
    min-height: 34px;
    padding: 0.35rem 0.72rem;
    align-items: center;
    color: #38504d;
    background: #fff;
    border: 1px solid var(--app-border);
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 800;
    text-decoration: none;
}

.supplier-payment-shortcuts a:hover,
.supplier-payment-shortcuts a:focus,
.supplier-payment-shortcuts a.is-active {
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border-color: color-mix(in srgb, var(--app-primary) 38%, var(--app-border));
}

.supplier-payment-filters {
    display: grid;
    grid-template-columns: 132px 132px minmax(210px, 1.2fr) minmax(140px, 0.72fr) minmax(130px, 0.68fr) minmax(220px, 1.15fr) auto;
    gap: 0.65rem;
    align-items: end;
}

.supplier-payment-filters > div {
    min-width: 0;
}

.supplier-payment-filter-actions {
    display: flex;
    gap: 0.4rem;
}

.supplier-payment-metrics .metric-card {
    min-width: 0;
}

.supplier-payment-total-card {
    border-top: 3px solid var(--app-primary);
    background: linear-gradient(180deg, #fff, #f5fbfa);
}

.supplier-payments-panel {
    overflow: hidden;
}

.supplier-payments-panel-header {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
}

.supplier-payments-panel-header > strong {
    color: var(--app-primary-dark);
    font-size: 1.05rem;
    white-space: nowrap;
}

.supplier-payments-table {
    min-width: 1260px;
}

.supplier-payments-table th {
    color: #59635f;
    font-size: 0.7rem;
    font-weight: 850;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.supplier-payments-table td {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.supplier-payment-number {
    color: var(--app-primary-dark);
    font-weight: 900;
    white-space: nowrap;
}

.supplier-payment-documents,
.supplier-payments-table td small {
    display: block;
}

.supplier-payment-documents {
    max-width: 270px;
    color: #354b48;
    font-size: 0.78rem;
    line-height: 1.35;
}

.supplier-payments-table td small {
    margin-top: 0.16rem;
    color: var(--app-muted);
    font-size: 0.69rem;
}

.supplier-payment-mode {
    display: inline-flex;
    gap: 0.35rem;
    align-items: center;
    color: #294a47;
    font-size: 0.8rem;
    font-weight: 800;
}

.supplier-payment-mode .nav-ic,
.supplier-payment-mobile-meta .nav-ic {
    width: 17px;
    height: 17px;
    color: var(--app-primary);
}

.supplier-payment-mobile-list {
    padding: 0.8rem;
    background: #f5f8f7;
}

.supplier-payment-mobile-card {
    padding: 0.85rem;
    background: #fff;
    border: 1px solid var(--app-border);
    border-radius: 10px;
    box-shadow: var(--app-shadow-soft);
}

.supplier-payment-mobile-card + .supplier-payment-mobile-card {
    margin-top: 0.65rem;
}

.supplier-payment-mobile-head {
    display: flex;
    gap: 0.8rem;
    align-items: flex-start;
    justify-content: space-between;
}

.supplier-payment-mobile-head > div,
.supplier-payment-mobile-head span,
.supplier-payment-mobile-head a {
    display: block;
    min-width: 0;
}

.supplier-payment-mobile-head span {
    margin-bottom: 0.12rem;
    color: var(--app-muted);
    font-size: 0.7rem;
}

.supplier-payment-mobile-head a {
    color: var(--app-text);
    font-size: 0.93rem;
    font-weight: 900;
    overflow-wrap: anywhere;
}

.supplier-payment-mobile-head > strong {
    flex: 0 0 auto;
    color: var(--app-primary-dark);
    font-size: 1rem;
    font-weight: 950;
    white-space: nowrap;
}

.supplier-payment-mobile-meta {
    display: flex;
    gap: 0.35rem 0.65rem;
    margin-top: 0.65rem;
    align-items: center;
    flex-wrap: wrap;
    color: #405552;
    font-size: 0.72rem;
    font-weight: 750;
}

.supplier-payment-mobile-meta > span:not(.badge) {
    display: inline-flex;
    gap: 0.25rem;
    align-items: center;
}

.supplier-payment-mobile-card p,
.supplier-payment-mobile-card > small {
    margin: 0.55rem 0 0;
    color: var(--app-muted);
    font-size: 0.72rem;
    line-height: 1.35;
}

.supplier-payment-mobile-card > small {
    display: block;
}

.supplier-payment-empty {
    padding: 2rem 1rem;
    color: var(--app-muted);
    text-align: center;
}

@media (max-width: 1399.98px) {
    .supplier-payment-filters {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .supplier-payment-filter-supplier,
    .supplier-payment-filter-search {
        grid-column: span 2;
    }
}

@media (max-width: 767.98px) {
    .supplier-payments-page-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }

    .supplier-payments-page-actions .btn {
        min-width: 0;
        justify-content: center;
    }

    .supplier-payments-page-actions .btn:first-child:last-child,
    .supplier-payments-page-actions .btn:last-child:nth-child(odd) {
        grid-column: 1 / -1;
    }

    .supplier-payment-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .supplier-payment-filter-supplier,
    .supplier-payment-filter-search,
    .supplier-payment-filter-actions {
        grid-column: 1 / -1;
    }

    .supplier-payment-filter-actions .btn {
        flex: 1 1 0;
    }

    .supplier-payments-panel-header {
        align-items: flex-start;
        flex-direction: column;
    }
}

.sales-payment-cell {
    min-width: 11rem;
}

.sales-payment-lines {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .3rem;
}

.sales-payment-line {
    display: flex;
    align-items: center;
    gap: .35rem;
    line-height: 1.2;
    white-space: nowrap;
}

.sales-payment-line .sales-payment-mode,
.sales-payment-line > span:first-child {
    color: #64748b;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .035em;
}

.sales-payment-line strong {
    color: #1f2937;
    font-size: .86rem;
}

.sales-payment-advance strong {
    color: #0f766e;
}

.sales-payment-cancel {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.sales-payment-cancel .nav-ic {
    width: .95rem;
    height: .95rem;
}

.sales-payment-due {
    padding: .38rem .55rem;
    cursor: pointer;
}

.sales-payment-due:hover,
.sales-payment-due:focus-visible {
    filter: brightness(.92);
}

@media (max-width: 479.98px) {
    .supplier-payments-page-actions,
    .supplier-payment-filters {
        grid-template-columns: 1fr;
    }

    .supplier-payments-page-actions .btn,
    .supplier-payment-filter-supplier,
    .supplier-payment-filter-search,
    .supplier-payment-filter-actions {
        grid-column: auto;
    }

    .supplier-payment-shortcuts {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .supplier-payment-shortcuts a {
        justify-content: center;
        text-align: center;
    }

    .supplier-payment-mobile-head {
        align-items: stretch;
        flex-direction: column;
    }

    .supplier-payment-mobile-head > strong {
        white-space: normal;
    }
}

@media (max-width: 1199.98px) {
    .supplier-profile-hero {
        grid-template-columns: minmax(0, 1fr) minmax(270px, 0.42fr);
    }

    .supplier-account-layout {
        grid-template-columns: minmax(0, 1fr) 320px;
    }

    .supplier-profile-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .supplier-profile-metrics > div:nth-child(2) {
        border-right: 0;
    }

    .supplier-profile-metrics > div:nth-child(-n + 2) {
        border-bottom: 1px solid var(--app-border);
    }
}

@media (max-width: 991.98px) {
    .supplier-profile-hero,
    .supplier-account-layout {
        grid-template-columns: 1fr;
    }

    .supplier-profile-balance {
        min-height: auto;
        border-top: 1px solid rgba(255, 255, 255, 0.16);
        border-left: 0;
    }

    .supplier-payment-panel {
        position: static;
    }

    .supplier-account-side {
        grid-row: 1;
    }
}

@media (max-width: 767.98px) {
    .supplier-profile-identity,
    .supplier-section-header,
    .supplier-ledger-head {
        align-items: stretch;
        flex-direction: column;
    }

    .supplier-profile-avatar {
        width: 68px;
        height: 68px;
        border-radius: 17px;
        font-size: 1.25rem;
    }

    .supplier-profile-metrics {
        grid-template-columns: 1fr;
    }

    .supplier-profile-metrics > div,
    .supplier-profile-metrics > div:nth-child(2) {
        border-right: 0;
        border-bottom: 1px solid var(--app-border);
    }

    .supplier-profile-metrics > div:last-child {
        border-bottom: 0;
    }

    .supplier-ledger-search {
        width: 100%;
        min-width: 0;
        flex-wrap: wrap;
    }

    .supplier-ledger-search .form-control {
        width: 100%;
        min-width: 0;
    }

    .supplier-ledger-amount {
        text-align: left;
    }
}

@media (max-width: 479.98px) {
    .supplier-profile-identity {
        padding: 1rem;
    }

    .supplier-profile-contacts > span,
    .supplier-profile-contacts > span.is-address {
        width: 100%;
        min-width: 0;
    }

    .supplier-ledger-list {
        padding-right: 0.75rem;
        padding-left: 0.75rem;
    }

    .supplier-ledger-entry {
        grid-template-columns: 38px minmax(0, 1fr);
        gap: 0.55rem;
    }

    .supplier-ledger-marker {
        width: 36px;
        height: 36px;
        border-radius: 9px;
    }

    .supplier-payment-allocations summary {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.15rem;
    }
}

/* Fiche réception fournisseur */
.purchase-detail-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(270px, 0.34fr);
    overflow: hidden;
    color: #fff;
    border: 1px solid rgba(12, 81, 82, 0.28);
    border-radius: 12px;
    background: linear-gradient(125deg, #163f40 0%, var(--app-primary) 72%, #138b83 100%);
    box-shadow: var(--app-shadow);
}

.purchase-detail-hero-main {
    padding: 1.4rem 1.55rem;
}

.purchase-detail-eyebrow {
    margin-bottom: 0.3rem;
    color: rgba(255, 255, 255, 0.68);
    font-size: 0.75rem;
    font-weight: 850;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.purchase-detail-hero h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(1.35rem, 2.2vw, 2rem);
    font-weight: 900;
}

.purchase-detail-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.7rem;
    margin-top: 1.15rem;
}

.purchase-detail-meta > div {
    min-width: 0;
    padding: 0.65rem 0.75rem;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.08);
}

.purchase-detail-meta span,
.purchase-detail-meta strong {
    display: block;
}

.purchase-detail-meta span {
    margin-bottom: 0.2rem;
    color: rgba(255, 255, 255, 0.65);
    font-size: 0.7rem;
    font-weight: 750;
    text-transform: uppercase;
}

.purchase-detail-meta strong {
    overflow: hidden;
    color: #fff;
    font-size: 0.92rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.purchase-detail-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-top: 0.9rem;
}

.purchase-detail-tags span {
    display: inline-flex;
    gap: 0.35rem;
    align-items: center;
    padding: 0.28rem 0.58rem;
    color: #fff;
    font-size: 0.76rem;
    font-weight: 800;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.1);
}

.purchase-detail-tags .nav-ic {
    width: 15px;
    height: 15px;
}

.purchase-detail-hero-total {
    display: flex;
    min-height: 185px;
    padding: 1.35rem;
    align-items: flex-end;
    justify-content: center;
    flex-direction: column;
    text-align: right;
    border-left: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(0, 0, 0, 0.1);
}

.purchase-detail-hero-total span,
.purchase-detail-hero-total small {
    color: rgba(255, 255, 255, 0.68);
}

.purchase-detail-hero-total span {
    font-size: 0.76rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.purchase-detail-hero-total strong {
    margin: 0.38rem 0;
    color: #fff;
    font-size: clamp(1.75rem, 3vw, 2.65rem);
    font-weight: 950;
    line-height: 1;
}

.purchase-payment-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.purchase-payment-metrics .metric-card {
    min-height: 142px;
}

.purchase-payment-metrics .metric-value {
    font-size: clamp(1.45rem, 2.4vw, 2rem);
}

.purchase-payment-metrics .metric-card.is-paid {
    border-color: rgba(29, 158, 117, 0.34);
}

.purchase-payment-metrics .metric-card.is-partial {
    border-color: rgba(186, 117, 23, 0.38);
}

.purchase-payment-metrics .metric-card.is-unpaid {
    border-color: rgba(226, 75, 74, 0.3);
}

.purchase-payment-progress {
    height: 6px;
    margin-top: 0.8rem;
    overflow: hidden;
    border-radius: 999px;
    background: #e7e2d9;
}

.purchase-payment-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--app-success);
}

.purchase-detail-lines-panel {
    overflow: hidden;
}

.purchase-detail-lines-panel > .app-panel-header {
    background: linear-gradient(180deg, #fff, #faf8f4);
}

.purchase-detail-lines-table th {
    white-space: nowrap;
}

.purchase-detail-lines-table tbody td {
    padding-top: 0.8rem;
    padding-bottom: 0.8rem;
}

.purchase-unit-badge,
.purchase-payment-mode {
    display: inline-flex;
    padding: 0.24rem 0.5rem;
    color: #4d5956;
    font-size: 0.76rem;
    font-weight: 800;
    border: 1px solid #ddd7cd;
    border-radius: 999px;
    background: #f7f4ee;
}

.purchase-unit-badge.is-bulk {
    color: #0e6667;
    border-color: rgba(12, 116, 118, 0.24);
    background: var(--app-primary-soft);
}

.purchase-empty-payments {
    display: flex;
    gap: 0.9rem;
    min-height: 142px;
    padding: 1.25rem;
    align-items: center;
}

.purchase-empty-payments-icon {
    display: inline-grid;
    width: 46px;
    height: 46px;
    flex: 0 0 auto;
    place-items: center;
    color: var(--app-muted);
    border-radius: 12px;
    background: #f1eee7;
}

.purchase-audit-list {
    padding: 0.45rem 1.1rem 0.8rem;
}

.purchase-audit-list > div {
    display: flex;
    gap: 1rem;
    padding: 0.68rem 0;
    align-items: baseline;
    justify-content: space-between;
    border-bottom: 1px solid var(--app-border);
}

.purchase-audit-list > div:last-child {
    border-bottom: 0;
}

.purchase-audit-list dt {
    color: var(--app-muted);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.purchase-audit-list dd {
    margin: 0;
    font-weight: 750;
    text-align: right;
}

.purchase-audit-list .is-comment {
    display: block;
}

.purchase-audit-list .is-comment dd {
    margin-top: 0.35rem;
    color: var(--app-muted);
    font-weight: 500;
    text-align: left;
}

#regler-fournisseur {
    scroll-margin-top: 6rem;
}

@media (max-width: 991.98px) {
    .purchase-detail-hero {
        grid-template-columns: minmax(0, 1fr) 245px;
    }

    .purchase-detail-meta {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .purchase-detail-hero,
    .purchase-payment-metrics {
        grid-template-columns: 1fr;
    }

    .purchase-detail-hero-main {
        padding: 1.15rem;
    }

    .purchase-detail-hero-total {
        min-height: auto;
        padding: 1.1rem 1.15rem;
        align-items: flex-start;
        text-align: left;
        border-top: 1px solid rgba(255, 255, 255, 0.18);
        border-left: 0;
    }
}

/* Historique client unifié */
.client-history-page {
    --client-history-line: #dce8e5;
    --client-history-ink: #183332;
    --client-history-soft: #f3f8f7;
}

.client-history-header {
    margin-bottom: 1rem;
}

.client-history-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(170px, 0.55fr) minmax(210px, 0.65fr);
    gap: 1px;
    margin-bottom: 1rem;
    overflow: hidden;
    color: #fff;
    background: linear-gradient(135deg, #0b5352 0%, #117f7c 58%, #178f87 100%);
    border: 1px solid rgba(7, 71, 69, 0.22);
    border-radius: 16px;
    box-shadow: 0 16px 35px rgba(12, 76, 74, 0.17);
}

.client-history-identity,
.client-history-hero-stat,
.client-history-hero-balance {
    display: flex;
    min-width: 0;
    min-height: 126px;
    padding: 1.25rem 1.4rem;
    flex-direction: column;
    justify-content: center;
    background: rgba(255, 255, 255, 0.045);
}

.client-history-identity strong {
    margin: 0.2rem 0 0.35rem;
    overflow: hidden;
    font-size: clamp(1.35rem, 2vw, 1.8rem);
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.client-history-identity > span:last-child,
.client-history-hero-stat small,
.client-history-hero-balance small {
    color: rgba(255, 255, 255, 0.78);
}

.client-history-kicker,
.client-history-hero-stat > span,
.client-history-hero-balance > span {
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.client-history-hero-stat strong,
.client-history-hero-balance strong {
    margin: 0.18rem 0;
    font-size: clamp(1.45rem, 2vw, 2rem);
    line-height: 1.1;
}

.client-history-hero-balance.is-debit {
    background: rgba(105, 18, 37, 0.28);
}

.client-history-hero-balance.is-credit {
    background: rgba(7, 85, 61, 0.36);
}

.client-history-panel {
    overflow: hidden;
}

.client-history-toolbar {
    display: flex;
    gap: 1rem;
    padding: 1.1rem 1.25rem 0.95rem;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--app-border);
}

.client-history-toolbar p {
    font-size: 0.86rem;
}

.client-history-range {
    flex: 0 0 auto;
    padding: 0.42rem 0.7rem;
    color: var(--app-muted);
    background: var(--client-history-soft);
    border: 1px solid var(--client-history-line);
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
}

.client-history-filters {
    display: flex;
    gap: 0.55rem;
    padding: 0.85rem 1.25rem;
    overflow-x: auto;
    background: #fbfcfc;
    border-bottom: 1px solid var(--app-border);
    scrollbar-width: thin;
}

.client-history-filter {
    flex: 0 0 auto;
    padding: 0.55rem 0.82rem;
    color: #465553;
    background: #fff;
    border: 1px solid #d9e2df;
    border-radius: 10px;
    font-size: 0.82rem;
    font-weight: 750;
    text-decoration: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.client-history-filter:hover {
    color: var(--app-primary-dark);
    border-color: var(--app-primary);
    box-shadow: 0 5px 14px rgba(15, 128, 124, 0.1);
    transform: translateY(-1px);
}

.client-history-filter.is-active {
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary-dark), var(--app-primary));
    border-color: transparent;
    box-shadow: 0 7px 16px rgba(15, 128, 124, 0.2);
}

.client-history-timeline {
    position: relative;
    padding: 1rem 1.25rem 1.4rem;
}

.client-history-timeline::before {
    position: absolute;
    top: 2.8rem;
    bottom: 1.5rem;
    left: 2.53rem;
    width: 2px;
    content: "";
    background: var(--client-history-line);
}

.client-history-day {
    position: relative;
    z-index: 1;
    display: flex;
    margin: 0.25rem 0 0.7rem;
    align-items: center;
}

.client-history-day:not(:first-child) {
    margin-top: 1.35rem;
}

.client-history-day span {
    padding: 0.34rem 0.65rem;
    color: #48615e;
    background: #eaf3f1;
    border: 1px solid #d6e8e4;
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.025em;
}

.client-history-event {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 2.55rem minmax(0, 1fr);
    gap: 0.85rem;
    margin-bottom: 0.85rem;
}

.client-history-marker {
    display: grid;
    width: 2.55rem;
    height: 2.55rem;
    color: #fff;
    background: #247d79;
    border: 4px solid #fff;
    border-radius: 50%;
    place-items: center;
    box-shadow: 0 0 0 1px #cfe2de, 0 5px 12px rgba(24, 72, 70, 0.12);
    font-size: 0.63rem;
    font-weight: 900;
    letter-spacing: 0.03em;
}

.client-history-event.is-order .client-history-marker {
    background: #b87816;
}

.client-history-event.is-receipt .client-history-marker {
    background: #25865e;
}

.client-history-event.is-account .client-history-marker {
    color: #42514f;
    background: #dfe7e5;
}

.client-history-card {
    min-width: 0;
    padding: 1rem 1.05rem;
    background: #fff;
    border: 1px solid #dde5e3;
    border-left: 4px solid #298e89;
    border-radius: 12px;
    box-shadow: 0 7px 18px rgba(32, 61, 59, 0.06);
}

.client-history-event.is-order .client-history-card {
    border-left-color: #c9861e;
}

.client-history-event.is-receipt .client-history-card {
    border-left-color: #2b966a;
}

.client-history-event.is-account .client-history-card {
    border-left-color: #9aa9a6;
    background: #fcfdfd;
}

.client-history-card-head,
.client-history-card-foot {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    justify-content: space-between;
}

.client-history-card-head h3 {
    margin: 0.08rem 0 0;
    color: var(--client-history-ink);
    font-size: 1rem;
    font-weight: 850;
}

.client-history-event-type {
    color: #62726f;
    font-size: 0.69rem;
    font-weight: 800;
    letter-spacing: 0.065em;
    text-transform: uppercase;
}

.client-history-primary-amount {
    flex: 0 0 auto;
    text-align: right;
}

.client-history-primary-amount span {
    display: block;
    color: var(--app-muted);
    font-size: 0.7rem;
    font-weight: 700;
}

.client-history-primary-amount strong {
    display: block;
    color: var(--client-history-ink);
    font-size: 1.05rem;
}

.client-history-primary-amount.is-credit strong {
    color: #16714c;
}

.client-history-primary-amount.is-debit strong {
    color: #ac3943;
}

.client-history-meta {
    display: flex;
    gap: 0.45rem 0.8rem;
    margin-top: 0.45rem;
    color: #6c7977;
    flex-wrap: wrap;
    font-size: 0.76rem;
}

.client-history-meta span:not(:last-child)::after,
.client-history-meta time::after {
    margin-left: 0.8rem;
    color: #bdc9c6;
    content: "•";
}

.client-history-description {
    margin: 0.7rem 0 0.8rem;
    overflow: hidden;
    color: #3f4d4b;
    font-size: 0.86rem;
    line-height: 1.45;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.client-history-chips {
    display: flex;
    gap: 0.4rem;
    min-width: 0;
    flex-wrap: wrap;
}

.client-history-chip {
    display: inline-flex;
    min-height: 1.65rem;
    padding: 0.22rem 0.48rem;
    color: #50615e;
    background: #f1f5f4;
    border: 1px solid #e0e8e6;
    border-radius: 7px;
    align-items: center;
    font-size: 0.7rem;
    font-weight: 700;
}

.client-history-chip.is-success {
    color: #176243;
    background: #e5f5ed;
    border-color: #c9e9da;
}

.client-history-chip.is-warning,
.client-history-chip.is-accent {
    color: #79500f;
    background: #fff3d9;
    border-color: #f3dfb4;
}

.client-history-chip.is-danger {
    color: #9b2f38;
    background: #fce9eb;
    border-color: #f3cfd3;
}

.client-history-chip.is-secondary {
    color: #56625f;
    background: #eef1f0;
}

.client-history-chip.is-strong {
    color: #183e3b;
    background: #e8f1ef;
    border-color: #d2e3df;
}

.client-history-card-foot {
    align-items: center;
}

.client-history-card-foot .btn {
    flex: 0 0 auto;
}

.client-history-empty {
    padding: 4rem 1.25rem;
    text-align: center;
}

.client-history-empty > span {
    display: grid;
    width: 3.7rem;
    height: 3.7rem;
    margin: 0 auto 0.9rem;
    color: #327a75;
    background: #e7f2f0;
    border: 1px solid #cfe3df;
    border-radius: 15px;
    place-items: center;
    font-weight: 900;
}

.client-history-footer {
    display: flex;
    gap: 1rem;
    padding: 0.9rem 1.25rem;
    color: var(--app-muted);
    background: #fafcfb;
    border-top: 1px solid var(--app-border);
    align-items: center;
    justify-content: space-between;
    font-size: 0.8rem;
}

@media (max-width: 900px) {
    .client-history-hero {
        grid-template-columns: minmax(0, 1fr) minmax(145px, 0.48fr);
    }

    .client-history-identity {
        grid-column: 1 / -1;
        min-height: 105px;
    }

    .client-history-hero-stat,
    .client-history-hero-balance {
        min-height: 100px;
    }
}

@media (max-width: 640px) {
    .client-history-hero {
        grid-template-columns: 1fr;
    }

    .client-history-identity,
    .client-history-hero-stat,
    .client-history-hero-balance {
        min-height: auto;
        padding: 1rem;
        grid-column: auto;
    }

    .client-history-toolbar,
    .client-history-card-head,
    .client-history-card-foot,
    .client-history-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .client-history-range {
        align-self: flex-start;
    }

    .client-history-timeline {
        padding-right: 0.8rem;
        padding-left: 0.8rem;
    }

    .client-history-timeline::before {
        left: 2.08rem;
    }

    .client-history-event {
        grid-template-columns: 2.55rem minmax(0, 1fr);
        gap: 0.55rem;
    }

    .client-history-primary-amount {
        text-align: left;
    }

    .client-history-description {
        display: -webkit-box;
        overflow: hidden;
        white-space: normal;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .client-history-card-foot .btn {
        width: 100%;
    }
}

/* Fiche caisse : lecture métier, rapprochement et mouvements. */
/* Fin historique client unifié */

.cash-detail-page-header {
    margin-bottom: 1rem;
}

.cash-status-pill,
.cash-gap-pill,
.cash-flow-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 850;
    white-space: nowrap;
}

.cash-status-pill {
    padding: 0.28rem 0.65rem;
}

.cash-status-pill.is-open {
    color: #176047;
    background: #e4f4ed;
    border: 1px solid #b9dfcf;
}

.cash-status-pill.is-closed {
    color: #59615d;
    background: #f0f1ef;
    border: 1px solid #d6dad6;
}

.cash-status-dot {
    width: 0.48rem;
    height: 0.48rem;
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 0 3px rgba(41, 120, 91, 0.10);
}

.cash-detail-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(250px, 0.34fr);
    align-items: stretch;
    overflow: hidden;
    color: #fff;
    border-radius: 12px;
    box-shadow: var(--app-shadow);
}

.cash-detail-hero.is-open {
    background: linear-gradient(125deg, #123e3f 0%, var(--app-primary) 72%, #138b83 100%);
}

.cash-detail-hero.is-closed {
    background: linear-gradient(125deg, #253038 0%, #46545c 72%, #607078 100%);
}

.cash-detail-hero-main {
    padding: 1.45rem 1.55rem;
}

.cash-detail-eyebrow {
    display: block;
    margin-bottom: 0.4rem;
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.74rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.cash-detail-hero h2 {
    margin: 0;
    color: #ffffff;
    font-size: clamp(1.35rem, 2vw, 1.9rem);
    font-weight: 900;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.28);
}

.cash-detail-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1.5rem;
    margin-top: 1.1rem;
}

.cash-detail-meta span {
    display: grid;
    gap: 0.16rem;
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.86rem;
}

.cash-detail-meta strong {
    color: rgba(255, 255, 255, 0.62);
    font-size: 0.68rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.cash-detail-hero-total {
    display: flex;
    min-height: 165px;
    padding: 1.35rem;
    align-items: flex-end;
    justify-content: center;
    flex-direction: column;
    text-align: right;
    background: rgba(0, 0, 0, 0.16);
    border-left: 1px solid rgba(255, 255, 255, 0.18);
}

.cash-detail-hero-total span,
.cash-detail-hero-total small {
    color: rgba(255, 255, 255, 0.68);
}

.cash-detail-hero-total span {
    font-size: 0.76rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.cash-detail-hero-total strong {
    margin: 0.4rem 0;
    font-size: clamp(1.75rem, 3vw, 2.65rem);
    font-weight: 950;
    line-height: 1;
    white-space: nowrap;
}

.cash-equation-panel {
    overflow: hidden;
}

.cash-equation {
    display: grid;
    grid-template-columns: minmax(150px, 1fr) auto minmax(150px, 1fr) auto minmax(150px, 1fr) auto minmax(170px, 1.08fr);
    gap: 0.7rem;
    padding: 1rem;
    align-items: stretch;
}

.cash-equation-card {
    display: flex;
    min-height: 122px;
    padding: 1rem;
    justify-content: center;
    flex-direction: column;
    border: 1px solid var(--app-border);
    border-radius: 10px;
    background: var(--app-surface-2);
}

.cash-equation-card.is-entry {
    background: #edf8f2;
    border-color: #c8e5d7;
}

.cash-equation-card.is-exit {
    background: #fff5ea;
    border-color: #efd8bb;
}

.cash-equation-card.is-result {
    color: #fff;
    background: linear-gradient(145deg, var(--app-primary-dark), var(--app-primary));
    border-color: transparent;
}

.cash-equation-label {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 850;
    text-transform: uppercase;
}

.cash-equation-card.is-result .cash-equation-label,
.cash-equation-card.is-result small {
    color: rgba(255, 255, 255, 0.72);
}

.cash-equation-card strong {
    margin: 0.35rem 0 0.45rem;
    color: var(--app-ink);
    font-size: clamp(1.25rem, 1.8vw, 1.7rem);
    font-weight: 950;
    line-height: 1;
    white-space: nowrap;
}

.cash-equation-card.is-entry strong {
    color: var(--app-success);
}

.cash-equation-card.is-exit strong {
    color: var(--app-warning);
}

.cash-equation-card.is-result strong {
    color: #fff;
}

.cash-equation-card small {
    color: var(--app-muted);
    line-height: 1.25;
}

.cash-equation-operator {
    display: grid;
    width: 1.65rem;
    place-items: center;
    color: var(--app-muted);
    font-size: 1.35rem;
    font-weight: 900;
}

.cash-close-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.cash-close-card {
    overflow: hidden;
}

.cash-close-body {
    padding: 0.35rem 1.1rem 1.1rem;
}

.cash-close-row {
    display: flex;
    min-height: 52px;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid var(--app-border);
}

.cash-close-row span {
    color: var(--app-muted);
}

.cash-close-row strong {
    color: var(--app-ink);
    font-size: 1.05rem;
    white-space: nowrap;
}

.cash-close-total {
    margin-top: 0.75rem;
    padding: 0.8rem;
    border: 0;
    border-radius: 9px;
    background: #f1f3f1;
}

.cash-close-total.is-ok,
.cash-gap-pill.is-ok {
    color: #176047;
    background: #e4f4ed;
}

.cash-close-total.is-danger,
.cash-gap-pill.is-danger {
    color: #8e2d26;
    background: #fbe9e7;
}

.cash-close-total.is-warning,
.cash-gap-pill.is-warning {
    color: #83500b;
    background: #fff0dc;
}

.cash-close-total.is-report {
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
}

.cash-close-total.is-report strong {
    color: var(--app-primary-dark);
    font-size: 1.35rem;
}

.cash-gap-pill {
    padding: 0.34rem 0.72rem;
}

.cash-live-note {
    display: flex;
    padding: 1rem 1.15rem;
    align-items: center;
    gap: 0.85rem;
    color: #175948;
    background: #e9f6f1;
    border: 1px solid #c3e3d7;
    border-radius: 10px;
}

.cash-live-note p {
    color: #4a7165;
    font-size: 0.88rem;
}

.cash-live-pulse {
    width: 0.72rem;
    height: 0.72rem;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--app-success);
    box-shadow: 0 0 0 0 rgba(41, 120, 91, 0.28);
    animation: cash-live-pulse 2s infinite;
}

@keyframes cash-live-pulse {
    70% { box-shadow: 0 0 0 8px rgba(41, 120, 91, 0); }
    100% { box-shadow: 0 0 0 0 rgba(41, 120, 91, 0); }
}

.cash-movements-panel {
    overflow: hidden;
}

.cash-movement-count {
    display: grid;
    min-width: 2.25rem;
    height: 2.25rem;
    padding: 0 0.55rem;
    place-items: center;
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 900;
}

.cash-movement-table {
    min-width: 860px;
}

.cash-movement-table thead th {
    padding: 0.8rem 0.9rem;
    color: var(--app-muted);
    background: #f5f4f0;
    border-bottom-color: var(--app-border-strong);
    font-size: 0.7rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.cash-movement-table tbody td {
    padding: 0.85rem 0.9rem;
}

.cash-movement-table tbody tr:hover td {
    background: #fbfaf7;
}

.cash-movement-date {
    color: var(--app-muted);
    font-size: 0.84rem;
    white-space: nowrap;
}

.cash-history-datetime {
    display: inline-flex;
    align-items: center;
    gap: 0.42rem;
    color: inherit;
    font-style: normal;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.cash-history-date {
    color: #303936;
    font-size: 0.88rem;
    font-weight: 800;
}

.cash-history-time {
    display: inline-flex;
    min-width: 3.2rem;
    padding: 0.24rem 0.46rem;
    align-items: center;
    justify-content: center;
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border: 1px solid rgba(12, 116, 118, 0.10);
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 900;
    line-height: 1;
}

.cash-history-pending {
    display: inline-flex;
    padding: 0.3rem 0.58rem;
    align-items: center;
    color: #7a4b0d;
    background: var(--app-accent-soft);
    border: 1px solid rgba(199, 128, 47, 0.18);
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 900;
    white-space: nowrap;
}

.cash-history-report td.text-end {
    white-space: nowrap;
}

.cash-flow-pill {
    min-width: 4.7rem;
    padding: 0.28rem 0.55rem;
}

.cash-flow-pill.is-entry {
    color: #176047;
    background: #e4f4ed;
}

.cash-flow-pill.is-exit {
    color: #8a4f0c;
    background: #fff0dc;
}

.cash-movement-reason {
    min-width: 220px;
    color: var(--app-ink);
    font-weight: 700;
}

.cash-movement-amount,
.cash-movement-balance {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.cash-movement-amount {
    font-weight: 900;
}

.cash-movement-amount.is-entry {
    color: var(--app-success);
}

.cash-movement-amount.is-exit {
    color: var(--app-danger);
}

.cash-movement-balance {
    color: var(--app-ink);
    font-weight: 850;
}

.cash-empty-state {
    display: flex;
    min-height: 180px;
    padding: 2rem;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0.3rem;
    color: var(--app-muted);
    text-align: center;
}

.cash-empty-state > span {
    display: grid;
    width: 3.2rem;
    height: 3.2rem;
    margin-bottom: 0.35rem;
    place-items: center;
    color: var(--app-primary);
    background: var(--app-primary-soft);
    border-radius: 50%;
    font-size: 1.4rem;
}

.cash-empty-state strong {
    color: var(--app-ink);
}

@media (max-width: 1199.98px) {
    .cash-detail-hero {
        grid-template-columns: minmax(0, 1fr) 260px;
    }

    .cash-equation {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cash-equation-operator {
        display: none;
    }
}

@media (max-width: 767.98px) {
    .cash-detail-hero,
    .cash-close-grid,
    .cash-equation {
        grid-template-columns: 1fr;
    }

    .cash-detail-hero-total {
        min-height: auto;
        align-items: flex-start;
        text-align: left;
        border-top: 1px solid rgba(255, 255, 255, 0.18);
        border-left: 0;
    }

    .cash-detail-meta {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cash-equation-card {
        min-height: 105px;
    }

    .cash-close-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.25rem;
        padding: 0.75rem 0;
    }

    .cash-close-total {
        padding: 0.8rem;
    }
}

* {
    letter-spacing: 0;
}

.app-body {
    min-height: 100vh;
    color: var(--app-text);
    background:
        radial-gradient(circle at 8% 0%, rgba(199, 128, 47, 0.13), transparent 30rem),
        radial-gradient(circle at 88% 6%, rgba(12, 116, 118, 0.12), transparent 26rem),
        linear-gradient(180deg, var(--app-bg-2) 0, var(--app-bg) 25rem, #f8f6f1 100%);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.app-body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(23, 32, 38, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(23, 32, 38, 0.03) 1px, transparent 1px);
    background-size: 44px 44px;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.72), transparent 34rem);
}

.app-main {
    max-width: 1500px;
}

.page-shell {
    max-width: 1160px;
}

.app-navbar {
    position: sticky;
    top: 0;
    z-index: 1030;
    background: rgba(23, 32, 38, 0.96);
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
    box-shadow: 0 12px 32px rgba(15, 20, 24, 0.18);
    backdrop-filter: blur(14px);
}

.app-brand {
    display: inline-flex;
    align-items: center;
    gap: 0.72rem;
    min-height: 42px;
    font-weight: 800;
    text-decoration: none;
}

.app-brand-mark {
    display: inline-grid;
    width: 38px;
    height: 38px;
    place-items: center;
    color: #fff8ed;
    background: linear-gradient(135deg, var(--app-accent), var(--app-primary));
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 8px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.24);
    font-size: 0.82rem;
}

.app-brand-copy {
    display: grid;
    min-width: 90px;
    line-height: 1;
}

.app-brand-copy small {
    margin-bottom: 0.18rem;
    color: rgba(255, 255, 255, 0.58);
    font-size: 0.58rem;
    font-weight: 850;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.app-brand-text {
    display: block;
    max-width: 160px;
    color: #fff;
    overflow: hidden;
    font-size: 1.08rem;
    font-weight: 900;
    letter-spacing: 0.035em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 575.98px) {
    .app-brand {
        gap: 0.5rem;
        margin-right: 0.45rem;
    }

    .app-brand-text {
        max-width: 90px;
        font-size: 0.92rem;
    }

    .app-brand-copy {
        min-width: 72px;
    }

    .app-brand-copy small {
        font-size: 0.5rem;
    }
}

.app-navbar .nav-link {
    color: rgba(255, 255, 255, 0.78);
    border: 1px solid transparent;
    border-radius: 8px;
    padding: 0.62rem 0.82rem;
    font-weight: 700;
}

.app-navbar .nav-link:hover,
.app-navbar .nav-link:focus {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.08);
}

.app-navbar .nav-link.active {
    color: #fff;
    background: rgba(12, 116, 118, 0.42);
    border-color: rgba(147, 220, 213, 0.28);
}

.app-cash-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 44px;
    padding: 0.45rem 0.8rem;
    border: 1px solid transparent;
    border-radius: 10px;
    font-weight: 700;
    font-size: 0.92rem;
    text-decoration: none;
    white-space: nowrap;
    transition: filter 0.15s ease;
}

.app-cash-chip:hover {
    filter: brightness(1.08);
}

.app-cash-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex: 0 0 auto;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.08);
}

.app-cash-chip.is-open {
    color: #e8fff6;
    background: rgba(41, 120, 91, 0.32);
    border-color: rgba(134, 220, 184, 0.25);
}

.app-cash-chip.is-open .app-cash-dot {
    background: #46d39a;
}

.app-cash-chip.is-closed {
    color: #ffe9df;
    background: rgba(179, 58, 47, 0.22);
    border-color: rgba(255, 172, 150, 0.25);
}

.app-cash-chip.is-closed .app-cash-dot {
    background: #ff7a63;
}

.app-cash-chip--compact {
    min-height: 38px;
    margin-left: auto;
    margin-right: 0.5rem;
    font-size: 0.85rem;
}

.app-icon-quick {
    padding-left: 0.6rem;
    padding-right: 0.6rem;
}

.app-user-toggle {
    gap: 0.55rem;
}

.app-user-toggle::after {
    margin-left: 0.1rem;
}

.app-user-avatar {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--app-accent), var(--app-primary));
    color: #fff;
    font-size: 0.78rem;
    font-weight: 800;
    flex: 0 0 auto;
}

.nav-ic {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
}

.app-quicknav,
.app-nav-right {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
}

.app-quick {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 48px;
    padding: 0.5rem 0.85rem;
    color: rgba(255, 255, 255, 0.82);
    background: transparent;
    border: 1px solid transparent;
    border-radius: 10px;
    font-weight: 700;
    font-size: 0.95rem;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.app-quick:hover,
.app-quick:focus {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.08);
}

.app-quick.active {
    color: #fff;
    background: rgba(12, 116, 118, 0.42);
    border-color: rgba(147, 220, 213, 0.28);
}

.app-quick-primary,
.app-quick-primary.active {
    color: #fff;
    background: linear-gradient(135deg, var(--app-accent), var(--app-primary));
    border-color: rgba(255, 255, 255, 0.22);
}

.app-quick-primary:hover,
.app-quick-primary:focus {
    color: #fff;
    background: linear-gradient(135deg, var(--app-accent), var(--app-primary-dark));
    border-color: rgba(255, 255, 255, 0.30);
}

.app-quick .nav-ic {
    width: 22px;
    height: 22px;
    flex: 0 0 auto;
}

.app-navbar .app-user-name {
    cursor: default;
}

.app-menu-list {
    min-width: 264px;
    padding: 0.4rem;
}

.app-menu-list .dropdown-header {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 0.45rem 0.6rem 0.2rem;
}

.app-menu-list .dropdown-item {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.62rem 0.6rem;
    border-radius: 8px;
    font-weight: 600;
}

.app-menu-list .dropdown-item .nav-ic {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
    color: var(--app-primary);
}

.app-menu-list .dropdown-item:active,
.app-menu-list .dropdown-item:active .nav-ic {
    color: #fff;
}

/* Identité visuelle par point de vente : badge du nom + bandeau test. */
.app-instance-badge {
    display: inline-flex;
    align-items: center;
    margin-left: 0.55rem;
    padding: 0.12rem 0.5rem;
    border-radius: 6px;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    background: var(--app-primary);
    color: #fff;
    line-height: 1.4;
}

.app-instance-badge.is-test {
    background: #b91c1c;
}

.app-test-banner {
    background: #b91c1c;
    color: #fff;
    text-align: center;
    font-weight: 700;
    font-size: 0.82rem;
    letter-spacing: 0.02em;
    padding: 0.35rem 1rem;
}

/* Méga-menu « Plus » : colonnes thématiques (opérationnel uniquement). */
.app-megamenu {
    width: min(640px, calc(100vw - 1rem));
    max-width: none;
    max-height: min(78vh, 680px);
    padding: 0.55rem;
    overflow-y: auto;
}

/* Menu du compte (administration) : liste unique, bornée en hauteur. */
.app-account-menu {
    max-height: min(80vh, 560px);
    overflow-y: auto;
}

.app-megamenu-cols {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
}

.app-megamenu-col {
    min-width: 0;
    padding: 0.35rem;
    background: #fbfaf7;
    border: 1px solid #e8e2d8;
    border-radius: 10px;
}

.app-megamenu .dropdown-header {
    padding: 0.28rem 0.45rem 0.32rem;
}

.app-megamenu .dropdown-item {
    min-height: 39px;
    padding: 0.48rem 0.45rem;
    font-size: 0.9rem;
}

.app-megamenu .dropdown-item:hover,
.app-megamenu .dropdown-item:focus {
    background: var(--app-primary-soft);
}

@media (max-width: 1199.98px) {
    .app-megamenu {
        width: min(640px, calc(100vw - 24px));
        max-width: calc(100vw - 24px);
        max-height: min(68vh, 620px);
    }

    .app-megamenu-cols {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .app-megamenu-cols {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1199.98px) {
    .app-quicknav,
    .app-nav-right {
        width: 100%;
        margin-top: 0.5rem;
    }

    .app-quicknav .app-quick,
    .app-nav-right .app-cash-chip,
    .app-nav-right .app-user-menu {
        flex: 1 1 auto;
        justify-content: center;
    }

    .app-user-menu .app-user-toggle {
        width: 100%;
        justify-content: center;
    }
}

/* Barre d'actions du bas : visible sur mobile et tablette (sous xl). */
.app-bottomnav {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1035;
    display: flex;
    justify-content: space-around;
    gap: 0.25rem;
    padding: 0.35rem 0.4rem;
    padding-bottom: calc(0.35rem + env(safe-area-inset-bottom, 0px));
    background: rgba(23, 32, 38, 0.98);
    border-top: 1px solid rgba(255, 255, 255, 0.10);
    box-shadow: 0 -8px 24px rgba(15, 20, 24, 0.22);
    backdrop-filter: blur(14px);
}

.app-bottom-item {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    min-height: 52px;
    padding: 0.3rem 0.2rem;
    color: rgba(255, 255, 255, 0.7);
    background: transparent;
    border: 0;
    border-radius: 10px;
    font-size: 0.72rem;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
}

.app-bottom-item .nav-ic {
    width: 24px;
    height: 24px;
}

.app-bottom-item:hover,
.app-bottom-item:focus,
.app-bottom-item.active {
    color: #fff;
}

.app-bottom-item.active .nav-ic {
    color: #46c7c9;
}

.app-bottom-primary .nav-ic {
    color: #46c7c9;
}

/* Espace pour ne pas masquer le contenu derriere la barre du bas. */
@media (max-width: 1199.98px) {
    .app-body.is-authenticated {
        padding-bottom: 64px;
    }
}

@media (min-width: 1200px) {
    .app-bottomnav {
        display: none !important;
    }
}

.app-footer {
    color: var(--app-muted);
    font-size: 0.82rem;
    padding: 0 0 1.2rem;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--app-text);
    font-weight: 800;
}

.text-muted {
    color: var(--app-muted) !important;
}

.app-page-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.35rem;
    padding: 1.15rem 1.25rem;
    background: rgba(255, 255, 255, 0.68);
    border: 1px solid rgba(222, 216, 204, 0.82);
    border-radius: 8px;
    box-shadow: var(--app-shadow-soft);
    backdrop-filter: blur(12px);
}

.app-page-title {
    display: flex;
    align-items: center;
    gap: 0.85rem;
}

.app-page-icon {
    display: inline-grid;
    width: 44px;
    height: 44px;
    flex: 0 0 auto;
    place-items: center;
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border: 1px solid rgba(12, 116, 118, 0.15);
    border-radius: 8px;
    font-weight: 900;
}

.app-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.55rem;
}

.app-header-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
}

.header-stat {
    padding-left: 0.85rem;
    border-left: 3px solid var(--app-primary);
}

.header-stat-label {
    color: var(--app-muted);
    font-size: 0.74rem;
    font-weight: 800;
    text-transform: uppercase;
}

.header-stat-value {
    color: var(--app-ink);
    font-size: 1.35rem;
    font-weight: 900;
    line-height: 1.2;
}

.app-panel,
.bg-white.border,
.card,
.modal-content,
.dropdown-menu {
    background: var(--app-surface) !important;
    border-color: var(--app-border-strong) !important;
    box-shadow: var(--app-shadow);
}

.app-panel {
    border: 1px solid var(--app-border);
    border-radius: 8px;
}

.app-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 1rem 1.1rem;
    border-bottom: 1px solid var(--app-border);
}

.app-toolbar {
    padding: 0.9rem;
    margin-bottom: 1rem;
    background: rgba(255, 255, 255, 0.76);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    box-shadow: 0 8px 22px rgba(33, 35, 32, 0.05);
}

.rounded,
.card,
.modal-content,
.dropdown-menu,
.alert,
.form-control,
.form-select,
.input-group-text,
.btn {
    border-radius: 8px !important;
}

.table-responsive {
    scrollbar-width: thin;
    scrollbar-color: var(--app-border-strong) transparent;
}

.table {
    --bs-table-color: var(--app-text);
    --bs-table-hover-bg: #f4f8f6;
    margin-bottom: 0;
    font-size: 0.93rem;
}

.table > :not(caption) > * > * {
    padding: 0.84rem 0.9rem;
    border-bottom-color: #ece5da;
}

.table-light {
    --bs-table-bg: #f5f0e7;
    --bs-table-color: #4d514d;
}

/* Vente annulée : la ligne doit se lire comme annulée au premier coup d'œil,
   sans avoir à repérer le badge. Fond éteint + liseré rouge + montant barré. */
.table > tbody > tr.table-row-canceled {
    /* Surface secondaire du thème : assez claire pour ne pas imiter le fond de
       page, assez distincte du blanc des lignes actives. */
    --bs-table-bg: var(--app-surface-2);
    --bs-table-hover-bg: #f0ece4;
    --bs-table-color: var(--app-muted);
    --bs-table-hover-color: var(--app-muted);
}

.table > tbody > tr.table-row-canceled > td {
    color: var(--app-muted);
}

/* Repère latéral visible de loin sur un écran de comptoir. */
.table > tbody > tr.table-row-canceled > td:first-child {
    border-left: 3px solid var(--app-danger);
}

/* Ni le gras ni les liens ne doivent rester à pleine intensité. */
.table > tbody > tr.table-row-canceled a:not(.btn),
.table > tbody > tr.table-row-canceled .fw-semibold {
    color: var(--app-muted);
    font-weight: 600;
}

/* Les badges d'une ligne annulée redeviennent neutres : ils restent cliquables
   (consulter le ticket d'une vente annulée est légitime) mais ne doivent plus
   attirer l'œil comme une opération en cours. Le badge « Annulée » garde son
   rouge : c'est lui qui porte l'information.
   !important est indispensable ici : les classes .text-bg-* de Bootstrap
   déclarent color et background-color en !important, donc aucune spécificité
   ne suffit à les surcharger. */
.table > tbody > tr.table-row-canceled .badge:not(.text-bg-danger) {
    background-color: #e2ddd4 !important;
    color: #5c574f !important;
}

/* Même logique pour les boutons d'action restants. */
.table > tbody > tr.table-row-canceled .btn-outline-primary {
    --bs-btn-color: #5c574f;
    --bs-btn-border-color: #c9c2b8;
    --bs-btn-hover-color: var(--app-ink);
    --bs-btn-hover-bg: #e2ddd4;
    --bs-btn-hover-border-color: #b8b0a4;
}

.table thead th {
    font-size: 0.74rem;
    font-weight: 800;
    text-transform: uppercase;
    white-space: nowrap;
}

.table tbody tr:last-child > * {
    border-bottom-width: 0;
}

.table strong {
    font-weight: 800;
}

.form-label {
    color: #3b403c;
    font-size: 0.86rem;
    font-weight: 800;
}

.form-control,
.form-select {
    border-color: #d1c8ba;
    background-color: rgba(255, 255, 255, 0.92);
}

.form-control:hover,
.form-select:hover {
    border-color: var(--app-border-strong);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--app-primary);
    box-shadow: 0 0 0 0.22rem rgba(12, 116, 118, 0.16);
}

.input-group-lg > .form-control,
.input-group-lg > .btn {
    min-height: 3.15rem;
}

.btn {
    border-width: 1px;
    font-weight: 800;
    box-shadow: none !important;
}

.btn-primary {
    --bs-btn-bg: var(--app-primary);
    --bs-btn-border-color: var(--app-primary);
    --bs-btn-hover-bg: var(--app-primary-dark);
    --bs-btn-hover-border-color: var(--app-primary-dark);
    --bs-btn-active-bg: var(--app-primary-dark);
    --bs-btn-active-border-color: var(--app-primary-dark);
}

.btn-outline-primary {
    --bs-btn-color: var(--app-primary-dark);
    --bs-btn-border-color: rgba(12, 116, 118, 0.46);
    --bs-btn-hover-bg: var(--app-primary);
    --bs-btn-hover-border-color: var(--app-primary);
}

.btn-outline-secondary {
    --bs-btn-color: #4d514d;
    --bs-btn-border-color: #c7bcad;
    --bs-btn-hover-bg: #f0e8dc;
    --bs-btn-hover-border-color: #b9ad9c;
    --bs-btn-hover-color: #252a27;
}

.btn-outline-danger {
    --bs-btn-color: var(--app-danger);
    --bs-btn-border-color: rgba(179, 58, 47, 0.42);
    --bs-btn-hover-bg: var(--app-danger);
    --bs-btn-hover-border-color: var(--app-danger);
}

/* Caisse : ouverture du jour et saisie du fond initial. */
.cash-opening-notice {
    display: flex;
    padding: 0.9rem 1rem;
    align-items: flex-start;
    gap: 0.8rem;
    color: #704716;
    background: linear-gradient(105deg, #fff2df 0%, #fff8ed 100%);
    border: 1px solid #efd6b2;
    border-radius: 10px;
    box-shadow: 0 8px 20px rgba(112, 71, 22, 0.06);
}

.cash-opening-notice-icon {
    display: grid;
    width: 2rem;
    height: 2rem;
    flex: 0 0 auto;
    place-items: center;
    color: #ffffff;
    background: var(--app-accent);
    border-radius: 50%;
    font-weight: 950;
    box-shadow: 0 5px 12px rgba(199, 128, 47, 0.24);
}

.cash-opening-notice div > strong,
.cash-opening-notice div > span {
    display: block;
}

.cash-opening-notice strong {
    margin-bottom: 0.1rem;
    color: #5d380c;
    font-size: 0.92rem;
    font-weight: 900;
}

.cash-opening-notice div > span {
    color: #765321;
    font-size: 0.9rem;
}

.app-panel.cash-opening-panel {
    overflow: hidden;
    border-radius: 14px;
    box-shadow: 0 24px 55px rgba(23, 32, 38, 0.13);
}

.cash-opening-intro {
    position: relative;
    display: flex;
    min-height: 142px;
    padding: 1.45rem 1.55rem;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    overflow: hidden;
    color: #ffffff;
    background:
        radial-gradient(circle at 86% 0%, rgba(255, 255, 255, 0.18), transparent 16rem),
        linear-gradient(120deg, #0a3d3f 0%, var(--app-primary) 65%, #149189 100%);
}

.cash-opening-intro::after {
    content: "";
    position: absolute;
    width: 210px;
    height: 210px;
    right: -74px;
    bottom: -148px;
    border: 1px solid rgba(255, 255, 255, 0.20);
    border-radius: 50%;
    box-shadow:
        0 0 0 28px rgba(255, 255, 255, 0.04),
        0 0 0 58px rgba(255, 255, 255, 0.025);
}

.cash-opening-intro-copy,
.cash-opening-status {
    position: relative;
    z-index: 1;
}

.cash-opening-kicker {
    display: block;
    margin-bottom: 0.38rem;
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.cash-opening-intro h2 {
    margin: 0;
    color: #ffffff;
    font-size: clamp(1.4rem, 2.3vw, 2rem);
    font-weight: 950;
    letter-spacing: -0.025em;
}

.cash-opening-intro p {
    max-width: 720px;
    margin: 0.45rem 0 0;
    color: rgba(255, 255, 255, 0.80);
    font-size: 0.94rem;
}

.cash-opening-status {
    display: inline-flex;
    padding: 0.55rem 0.78rem;
    align-items: center;
    gap: 0.48rem;
    color: #ffffff;
    background: rgba(3, 45, 46, 0.34);
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 850;
    white-space: nowrap;
    backdrop-filter: blur(6px);
}

.cash-opening-status > span {
    width: 0.54rem;
    height: 0.54rem;
    border-radius: 50%;
    background: #ffd38f;
    box-shadow: 0 0 0 4px rgba(255, 211, 143, 0.12);
}

.cash-opening-form {
    padding: 1.4rem 1.55rem 1.5rem;
    background:
        linear-gradient(90deg, rgba(12, 116, 118, 0.025) 1px, transparent 1px),
        linear-gradient(rgba(12, 116, 118, 0.025) 1px, transparent 1px),
        var(--app-surface);
    background-size: 28px 28px;
}

.cash-opening-label-row {
    display: flex;
    margin-bottom: 0.55rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.cash-opening-label-row .form-label {
    color: var(--app-ink);
    font-size: 1rem;
    font-weight: 900;
}

.cash-opening-label-row > span {
    color: var(--app-muted);
    font-size: 0.78rem;
    font-weight: 750;
}

.cash-opening-control-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
    gap: 0.8rem;
}

.cash-opening-input-shell,
.cash-closing-input-shell {
    display: grid;
    min-width: 0;
    min-height: 64px;
    grid-template-columns: minmax(0, 1fr) auto;
    overflow: hidden;
    background: #ffffff;
    border: 2px solid #b9c8c4;
    border-radius: 12px;
    box-shadow:
        0 10px 24px rgba(23, 32, 38, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.85);
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.cash-opening-input-shell:hover,
.cash-closing-input-shell:hover {
    border-color: #7ca7a2;
}

.cash-opening-input-shell:focus-within,
.cash-closing-input-shell:focus-within {
    border-color: var(--app-primary);
    box-shadow:
        0 0 0 0.26rem rgba(12, 116, 118, 0.14),
        0 12px 30px rgba(23, 32, 38, 0.10);
    transform: translateY(-1px);
}

.cash-closing-input-shell.is-expected-applied {
    border-color: var(--app-success);
    box-shadow:
        0 0 0 0.26rem rgba(31, 132, 92, 0.13),
        0 12px 30px rgba(23, 32, 38, 0.10);
}

.cash-opening-amount.form-control,
.cash-closing-amount.form-control {
    min-width: 0;
    min-height: 60px;
    padding: 0.65rem 1rem;
    color: #102729;
    background: transparent;
    border: 0;
    border-radius: 0 !important;
    box-shadow: none;
    font-size: clamp(1.45rem, 2.2vw, 1.8rem);
    font-weight: 950;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.01em;
}

.cash-opening-amount.form-control:focus,
.cash-closing-amount.form-control:focus {
    border: 0;
    box-shadow: none;
}

.cash-opening-currency,
.cash-closing-currency {
    display: grid;
    min-width: 4.6rem;
    padding: 0 1rem;
    place-items: center;
    align-self: stretch;
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border-left: 1px solid rgba(12, 116, 118, 0.16);
    font-size: 1rem;
    font-weight: 950;
}

.cash-closing-form {
    background:
        linear-gradient(90deg, rgba(12, 116, 118, 0.02) 1px, transparent 1px),
        linear-gradient(rgba(12, 116, 118, 0.02) 1px, transparent 1px),
        var(--app-surface);
    background-size: 28px 28px;
}

.cash-closing-layout {
    align-items: stretch;
}

.cash-expected-card {
    border-color: rgba(12, 116, 118, 0.24);
    background:
        linear-gradient(135deg, rgba(12, 116, 118, 0.055), rgba(255, 255, 255, 0) 58%),
        rgba(255, 255, 255, 0.9);
}

.cash-expected-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
}

.cash-use-expected-button.btn {
    display: inline-flex;
    min-height: 34px;
    padding: 0.38rem 0.65rem;
    align-items: center;
    justify-content: center;
    gap: 0.38rem;
    color: var(--app-primary-dark);
    background: #ffffff;
    border: 1px solid rgba(12, 116, 118, 0.3);
    border-radius: 999px !important;
    font-size: 0.75rem;
    font-weight: 900;
    line-height: 1;
    box-shadow: 0 5px 14px rgba(12, 116, 118, 0.09) !important;
}

.cash-use-expected-button.btn:hover,
.cash-use-expected-button.btn:focus {
    color: #ffffff;
    background: var(--app-primary);
    border-color: var(--app-primary);
    transform: translateY(-1px);
}

.cash-use-expected-button.btn.is-applied {
    color: #ffffff;
    background: var(--app-success);
    border-color: var(--app-success);
}

.cash-use-expected-button.btn:disabled {
    color: var(--app-muted);
    background: #eef1ef;
    border-color: var(--app-border);
    box-shadow: none !important;
}

.cash-use-expected-icon {
    display: grid;
    width: 1.1rem;
    height: 1.1rem;
    place-items: center;
    color: #ffffff;
    background: var(--app-primary);
    border-radius: 50%;
    font-size: 0.68rem;
    font-weight: 950;
}

.cash-use-expected-button:hover .cash-use-expected-icon,
.cash-use-expected-button:focus .cash-use-expected-icon,
.cash-use-expected-button.is-applied .cash-use-expected-icon {
    color: var(--app-success);
    background: #ffffff;
}

.cash-billetage-panel {
    height: 100%;
    padding: 0.95rem;
    background: rgba(247, 245, 240, 0.88);
    border: 1px solid var(--app-border);
    border-radius: 12px;
}

.cash-billetage-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.7rem;
}

.cash-billetage-heading .form-label {
    color: #47504b;
    font-size: 0.9rem;
}

.cash-billetage-badge {
    padding: 0.26rem 0.5rem;
    color: #66706a;
    background: #e8ebe8;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 850;
    text-transform: uppercase;
}

.cash-billetage-panel > p {
    margin: 0.08rem 0 0.75rem;
    color: var(--app-muted);
    font-size: 0.76rem;
}

.cash-billetage-panel .input-group {
    flex-wrap: nowrap;
}

.cash-denomination-label.input-group-text {
    min-width: 6.35rem;
    padding-right: 0.5rem;
    padding-left: 0.5rem;
    color: #36433f;
    background: #eef2f0;
    font-size: 0.8rem;
    font-weight: 800;
}

.cash-denomination-quantity.form-control {
    min-width: 0;
    padding-right: 0.55rem;
    padding-left: 0.55rem;
    color: #46514c;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.cash-closing-main {
    display: flex;
    height: 100%;
    padding: 0.2rem 0.15rem;
    flex-direction: column;
    justify-content: center;
}

.cash-closing-label-row {
    display: flex;
    margin-bottom: 0.55rem;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.cash-closing-label-row .form-label {
    color: var(--app-ink);
    font-size: 1rem;
    font-weight: 900;
}

.cash-closing-label-row > span {
    color: var(--app-muted);
    font-size: 0.78rem;
    font-weight: 750;
}

.cash-closing-hint {
    display: flex;
    min-height: 1.35rem;
    margin-top: 0.7rem;
    align-items: flex-start;
    gap: 0.5rem;
    color: var(--app-muted);
    font-size: 0.86rem;
    line-height: 1.4;
}

.cash-closing-note.alert {
    margin: 1rem 0 0.8rem;
    padding: 0.82rem 1rem;
    border: 1px solid rgba(12, 116, 118, 0.10);
    border-radius: 11px !important;
    line-height: 1.4;
}

.cash-closing-submit.btn {
    min-height: 52px;
    border-radius: 11px !important;
    font-size: 0.98rem;
    font-weight: 900;
    box-shadow: 0 11px 22px rgba(12, 116, 118, 0.18) !important;
}

.cash-opening-submit.btn {
    min-height: 64px;
    min-width: 228px;
    padding: 0.75rem 1.25rem;
    border-radius: 12px !important;
    font-size: 1rem;
    font-weight: 900;
    box-shadow: 0 12px 24px rgba(12, 116, 118, 0.22) !important;
}

.cash-opening-submit::after {
    content: "\2192";
    display: inline-block;
    margin-left: 0.65rem;
    font-size: 1.22rem;
    line-height: 0;
    transition: transform 0.18s ease;
}

.cash-opening-submit:hover::after,
.cash-opening-submit:focus::after {
    transform: translateX(3px);
}

.cash-opening-hint {
    display: flex;
    margin-top: 0.7rem;
    align-items: flex-start;
    gap: 0.5rem;
    color: var(--app-muted);
    font-size: 0.86rem;
    line-height: 1.4;
}

.cash-opening-hint strong {
    color: #3d4b48;
    font-weight: 900;
}

.cash-opening-hint-icon {
    display: grid;
    width: 1.2rem;
    height: 1.2rem;
    margin-top: 0.04rem;
    flex: 0 0 auto;
    place-items: center;
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border-radius: 50%;
    font-size: 0.7rem;
    font-weight: 950;
}

@media (max-width: 767.98px) {
    .cash-opening-intro {
        min-height: 0;
        padding: 1.25rem;
        align-items: flex-start;
        flex-direction: column;
        gap: 1rem;
    }

    .cash-opening-form {
        padding: 1.2rem;
    }

    .cash-opening-label-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.15rem;
    }

    .cash-closing-label-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.15rem;
    }

    .cash-billetage-panel {
        padding: 0.85rem;
    }

    .cash-closing-main {
        padding: 0.15rem 0;
    }

    .cash-opening-control-row {
        grid-template-columns: 1fr;
    }

    .cash-opening-submit.btn {
        width: 100%;
        min-width: 0;
    }
}

.badge {
    border-radius: 6px;
    font-weight: 800;
    padding: 0.45em 0.62em;
}

.text-bg-success {
    color: #fff !important;
    background-color: var(--app-success) !important;
}

.text-bg-warning {
    color: #3f2c0a !important;
    background-color: #f1bf5a !important;
}

.text-bg-danger {
    color: #fff !important;
    background-color: var(--app-danger) !important;
}

.alert {
    border-color: transparent;
    box-shadow: 0 10px 24px rgba(33, 35, 32, 0.06);
}

.alert-info {
    color: #134d4e;
    background: var(--app-primary-soft);
}

.alert-warning {
    color: #5f3b08;
    background: var(--app-accent-soft);
}

.alert-danger {
    color: var(--app-danger);
    background: #fff0ed;
}

.alert-success {
    color: #16533d;
    background: #e8f5ef;
}

.metric-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
    margin-bottom: 1rem;
}

.dashboard-metric-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.metric-card {
    min-height: 128px;
    padding: 1.05rem;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.86);
    box-shadow: var(--app-shadow-soft);
}

.metric-label {
    color: var(--app-muted);
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: uppercase;
}

.metric-value {
    margin-top: 0.45rem;
    color: var(--app-ink);
    font-size: 2rem;
    font-weight: 900;
    line-height: 1;
}

.metric-note {
    margin-top: 0.72rem;
    color: var(--app-muted);
    font-size: 0.86rem;
}

.recouvrement-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 767.98px) {
    .recouvrement-metrics {
        grid-template-columns: 1fr;
    }
}

.quick-actions {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
}

.dashboard-quick-actions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.quick-action {
    display: block;
    min-height: 138px;
    padding: 1.05rem;
    color: var(--app-text);
    text-decoration: none;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.95), rgba(250, 247, 241, 0.95));
    box-shadow: var(--app-shadow-soft);
}

.quick-action:hover,
.quick-action:focus {
    color: var(--app-text);
    border-color: rgba(12, 116, 118, 0.34);
    transform: translateY(-1px);
}

.quick-action-primary {
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary-dark), var(--app-primary));
    border-color: rgba(12, 116, 118, 0.44);
}

.quick-action-primary:hover,
.quick-action-primary:focus {
    color: #fff;
}

.quick-action-primary span,
.quick-action-primary strong {
    color: #fff;
}

.quick-action strong {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 1.02rem;
}

.quick-action span {
    color: var(--app-muted);
    font-size: 0.9rem;
}

.metric-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
}

.metric-icon,
.quick-action-icon {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border-radius: 11px;
}

.metric-icon .nav-ic,
.quick-action-icon .nav-ic {
    width: 22px;
    height: 22px;
}

.metric-card .metric-value {
    margin-top: 0.7rem;
}

.metric-accent-green .metric-icon {
    color: #0f6e56;
    background: rgba(29, 158, 117, 0.14);
}

.metric-accent-red .metric-icon {
    color: #a32d2d;
    background: rgba(226, 75, 74, 0.13);
}

.metric-accent-amber .metric-icon {
    color: #854f0b;
    background: rgba(186, 117, 23, 0.16);
}

.quick-action-icon {
    margin-bottom: 0.7rem;
}

.quick-action-primary .quick-action-icon {
    color: #fff;
    background: rgba(255, 255, 255, 0.18);
}

.dashboard-kpi-grid {
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.metric-link {
    display: block;
    color: inherit;
    text-decoration: none;
    transition: border-color 0.15s ease, transform 0.15s ease;
}

.metric-link:hover,
.metric-link:focus {
    color: inherit;
    border-color: rgba(12, 116, 118, 0.34);
    transform: translateY(-1px);
}

.panel-icon {
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    flex: 0 0 auto;
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border-radius: 9px;
}

.panel-icon .nav-ic {
    width: 18px;
    height: 18px;
}

.panel-icon-warn {
    color: #854f0b;
    background: rgba(186, 117, 23, 0.16);
}

.panel-icon-accent {
    color: #0f6e56;
    background: rgba(29, 158, 117, 0.14);
}

/* Dashboard (accueil comptoir) — bandeau et cartes KPI dediees pour la presentation. */
.dashboard-hero {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, var(--app-primary-dark) 0%, var(--app-primary) 70%, #0a8385 100%);
    border-color: transparent;
    box-shadow: 0 18px 40px rgba(7, 89, 91, 0.28);
}

.dashboard-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle at 92% -10%, rgba(255, 255, 255, 0.16), transparent 55%);
    pointer-events: none;
}

.dashboard-hero .app-page-icon {
    color: #fff;
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(255, 255, 255, 0.24);
}

.dashboard-hero h1 {
    color: #fff;
}

.dashboard-hero-date {
    color: rgba(255, 255, 255, 0.82);
    font-weight: 600;
}

.btn-hero-primary {
    color: var(--app-primary-dark);
    font-weight: 800;
    background: #fff;
    border: 1px solid #fff;
}

.btn-hero-primary:hover,
.btn-hero-primary:focus {
    color: var(--app-primary-dark);
    background: rgba(255, 255, 255, 0.9);
}

.btn-hero-outline {
    color: #fff;
    font-weight: 800;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.55);
}

.btn-hero-outline:hover,
.btn-hero-outline:focus {
    color: #fff;
    background: rgba(255, 255, 255, 0.14);
    border-color: #fff;
}

.dashboard-kpi-grid .metric-card {
    position: relative;
    overflow: hidden;
    animation: dashboard-card-in 0.45s ease both;
}

.dashboard-kpi-grid .metric-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--app-primary);
}

.dashboard-kpi-grid .metric-accent-green::before {
    background: #1d9e75;
}

.dashboard-kpi-grid .metric-accent-red::before {
    background: var(--app-danger);
}

.dashboard-kpi-grid .metric-accent-amber::before {
    background: var(--app-accent);
}

.dashboard-kpi-grid .metric-card:nth-child(1) { animation-delay: 0.02s; }
.dashboard-kpi-grid .metric-card:nth-child(2) { animation-delay: 0.08s; }
.dashboard-kpi-grid .metric-card:nth-child(3) { animation-delay: 0.14s; }
.dashboard-kpi-grid .metric-card:nth-child(4) { animation-delay: 0.2s; }
.dashboard-kpi-grid .metric-card:nth-child(5) { animation-delay: 0.26s; }
.dashboard-kpi-grid .metric-card:nth-child(6) { animation-delay: 0.32s; }

@keyframes dashboard-card-in {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.metric-trend {
    display: inline-block;
    margin-left: 0.4rem;
    font-weight: 800;
}

.metric-trend-up {
    color: #0f6e56;
}

.metric-trend-down {
    color: #a32d2d;
}

.app-management-links {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.sale-search-panel {
    position: relative;
}

#productResults {
    position: absolute;
    right: 1rem;
    left: 1rem;
    z-index: 20;
    overflow: hidden;
    border: 1px solid var(--app-border-strong);
    border-radius: 8px;
    box-shadow: var(--app-shadow);
}

#productResults .list-group-item {
    border-color: #eee6da;
}

.client-picker {
    position: relative;
}

.client-picker #clientResults {
    position: absolute;
    right: 0;
    left: 0;
    z-index: 21;
    overflow: hidden;
    margin-top: 0.45rem;
    border: 1px solid var(--app-border-strong);
    border-radius: 8px;
    box-shadow: var(--app-shadow);
}

.client-result-item {
    display: flex;
    flex-direction: column;
    gap: 0.18rem;
}

.client-modal-results {
    margin-top: 0.75rem;
    overflow: hidden;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    box-shadow: var(--app-shadow-soft);
}

.selected-client-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-height: 56px;
    padding: 0.55rem 0.6rem 0.55rem 0.78rem;
    background: #f8f4ec;
    border: 1px solid var(--app-border);
    border-radius: 8px;
}

.selected-client-main {
    min-width: 0;
}

.selected-client-card strong {
    display: block;
    overflow: hidden;
    max-width: 18rem;
    color: var(--app-text);
    font-size: 1rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.selected-client-balance {
    display: block;
    margin-top: 1px;
    font-size: 0.78rem;
    font-weight: 800;
}

.selected-client-balance.is-debit {
    color: var(--app-danger);
}

.selected-client-balance.is-credit {
    color: var(--app-success);
}

.selected-client-actions {
    display: flex;
    flex: 0 0 auto;
    gap: 0.4rem;
}

.client-modal .modal-header {
    align-items: flex-start;
}

.client-profile {
    overflow: hidden;
}

.client-profile-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(440px, 540px);
    gap: 1rem;
    align-items: stretch;
    padding: 1rem;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(248, 244, 236, 0.96));
}

.client-profile-main {
    display: flex;
    min-width: 0;
    gap: 1rem;
    align-items: center;
}

.client-avatar {
    display: inline-grid;
    width: 86px;
    height: 86px;
    flex: 0 0 auto;
    place-items: center;
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary-dark), var(--app-accent));
    border: 1px solid rgba(23, 32, 38, 0.08);
    border-radius: 8px;
    font-size: 1.85rem;
    font-weight: 900;
}

.client-profile-info {
    min-width: 0;
}

.client-status-row,
.client-contact-line {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem 1rem;
    align-items: center;
}

.client-profile-info h2 {
    margin: 0.3rem 0 0.5rem;
    color: var(--app-primary-dark);
    font-size: 2rem;
    line-height: 1.05;
    overflow-wrap: anywhere;
}

.client-contact-line {
    color: var(--app-muted);
    font-size: 0.95rem;
}

.client-contact-line strong {
    color: var(--app-text);
}

.client-profile-side {
    display: grid;
    grid-template-columns: minmax(180px, 0.8fr) minmax(230px, 1.2fr);
    gap: 0.75rem;
}

.client-identity-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}

.client-identity-grid > div {
    min-height: 0;
    padding: 0.65rem;
    background: #fff;
    border: 1px solid var(--app-border);
    border-radius: 8px;
}

.client-identity-grid span,
.client-balance span {
    display: block;
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.client-identity-grid strong {
    display: block;
    margin-top: 0.25rem;
    overflow-wrap: anywhere;
}

.client-balance {
    display: grid;
    padding: 0.75rem;
    align-content: center;
    color: var(--app-text);
    background: #fff;
    border: 1px solid var(--app-border);
    border-radius: 8px;
}

.client-balance strong {
    display: block;
    margin-top: 0.2rem;
    font-size: 1.65rem;
    font-weight: 900;
    line-height: 1;
}

.client-balance small {
    display: block;
    margin-top: 0.25rem;
    color: var(--app-muted);
    font-weight: 800;
}

.client-balance.is-debit strong {
    color: var(--app-danger);
}

.client-balance.is-credit strong {
    color: var(--app-success);
}

.client-quick-pay {
    padding: 0.85rem 1rem 1rem;
    border-top: 1px solid var(--app-border);
    scroll-margin-top: 88px;
}

.client-quick-pay-heading {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.85rem;
}

.client-quick-pay .client-payment-form {
    grid-template-columns: minmax(280px, 410px) minmax(0, 1fr);
    gap: 0.75rem 1rem;
    align-items: end;
}

.client-quick-pay .client-payment-form-heading,
.client-quick-pay .client-payment-form > .treasury-extra-fields,
.client-quick-pay .client-payment-form > [data-cash-only],
.client-quick-pay .client-payment-form > .client-settlement-discount {
    grid-column: 1 / -1;
}

.client-quick-pay .client-payment-form-heading {
    padding-bottom: 0.65rem;
}

.client-quick-pay .client-payment-balance,
.client-quick-pay [data-fill-client-balance] {
    display: none;
}

.client-quick-pay .client-payment-amount {
    max-width: none;
}

.client-quick-pay .client-payment-mode {
    min-height: 62px;
    padding: 0.55rem 0.65rem;
    gap: 0.55rem;
    border-width: 1px;
    border-radius: 8px;
}

.client-quick-pay .client-payment-mode-icon {
    width: 34px;
    height: 34px;
    border-radius: 8px;
}

.client-quick-pay .client-payment-mode-icon .nav-ic {
    width: 19px;
    height: 19px;
}

.client-quick-pay .client-payment-mode strong {
    font-size: 0.9rem;
}

.client-quick-pay .client-payment-mode small {
    margin-top: 0.05rem;
    font-size: 0.7rem;
}

.client-quick-pay .client-payment-mode-check {
    width: 20px;
    height: 20px;
}

.client-quick-pay .client-settlement-discount {
    padding: 0.7rem 0.8rem;
}

.client-quick-pay .client-payment-preview {
    grid-column: 1;
    min-height: 44px;
}

.client-quick-pay .client-payment-submit-row {
    grid-column: 2;
    align-self: stretch;
    padding-top: 0;
    border-top: 0;
}

.client-quick-pay .client-payment-submit-row > p {
    display: none;
}

.client-profile-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 1rem;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.86);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    box-shadow: var(--app-shadow-soft);
}

.client-profile-stats > div {
    min-width: 0;
    padding: 0.65rem 0.85rem;
    border-right: 1px solid var(--app-border);
}

.client-profile-stats > div:last-child {
    border-right: 0;
}

.client-profile-stats span,
.client-profile-stats strong {
    display: block;
}

.client-profile-stats span {
    color: var(--app-muted);
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

.client-profile-stats strong {
    margin-top: 0.15rem;
    overflow: hidden;
    font-size: 1rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.client-profile-stats .is-warning {
    box-shadow: inset 3px 0 0 var(--app-warning);
}

.client-profile-stats .is-warning strong {
    color: #8a570d;
}

.client-quick-pay-form {
    display: grid;
    grid-template-columns: minmax(180px, 260px) minmax(0, 1fr);
    gap: 0.8rem;
    align-items: end;
}

.client-payment-form {
    display: grid;
    gap: 1rem;
}

.client-payment-page-icon .nav-ic {
    width: 24px;
    height: 24px;
}

.client-payment-page-actions .btn,
.client-payment-change-client {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
}

.client-payment-page-actions .nav-ic,
.client-payment-change-client .nav-ic {
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
}

.client-payment-form-heading,
.client-payment-submit-row,
.client-payment-selected-client,
.client-payment-client-summary,
.client-payment-step-heading,
.client-payment-choice-head,
.client-payment-client-choice {
    display: flex;
    align-items: center;
}

.client-payment-form-heading,
.client-payment-submit-row,
.client-payment-selected-client,
.client-payment-choice-head,
.client-payment-client-choice {
    justify-content: space-between;
}

.client-payment-form-heading {
    gap: 1rem;
    padding-bottom: 0.9rem;
    border-bottom: 1px solid var(--app-border);
}

.client-payment-balance {
    flex: 0 0 auto;
    text-align: right;
}

.client-payment-balance span,
.client-payment-client-summary span,
.client-payment-choice-balance small {
    display: block;
    color: var(--app-muted);
    font-size: 0.75rem;
    font-weight: 900;
    text-transform: uppercase;
}

.client-payment-balance strong {
    display: block;
    color: var(--app-danger);
    font-size: 1.45rem;
}

.client-payment-amount {
    max-width: 760px;
}

/* Même gabarit que les autres sections de la page d'encaissement. */
.client-payment-recent {
    max-width: 1040px;
    margin-right: auto;
    margin-left: auto;
    padding: 1.15rem;
}

.client-recent-payments-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.client-payment-recent .table > :not(caption) > * > * {
    padding: 0.6rem 0.75rem;
}

.client-payment-recent td:first-child,
.client-payment-recent th:first-child {
    white-space: nowrap;
}

/* Compteurs natifs masqués : sur un montant, un clic accidentel sur la petite
   flèche change la somme sans que l'opérateur s'en aperçoive. La saisie au
   clavier reste inchangée. */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type="number"] {
    -moz-appearance: textfield;
    appearance: textfield;
}

/* Label et raccourci « Tout solder » sur la même ligne, au-dessus du champ :
   le raccourci ne doit pas être aligné avec la saisie comme un bouton d'action. */
.client-payment-amount-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
    /* Aligné sur la largeur du champ, pas sur celle du bloc : sinon le raccourci
       part à l'autre bout de la page et perd tout lien visuel avec la saisie. */
    max-width: 560px;
    margin-bottom: 0.45rem;
}

.client-payment-amount-head > .form-label {
    margin-bottom: 0;
    font-weight: 850;
}

.client-payment-amount-entry {
    display: grid;
    grid-template-columns: minmax(280px, 560px);
    gap: 0.65rem;
    align-items: stretch;
}

.client-payment-amount-entry > .input-group {
    min-width: 0;
}

.client-payment-amount-entry .form-control {
    min-width: 0;
    font-size: clamp(1.2rem, 2vw, 1.5rem);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.01em;
}

/* Raccourci de saisie, volontairement discret : il remplit le champ, il ne
   valide rien. */
.client-payment-fill-balance {
    font-weight: 700;
    white-space: nowrap;
}

.client-payment-mode-fieldset {
    margin: 0;
    padding: 0;
    border: 0;
    container-type: inline-size;
}

.client-payment-mode-fieldset legend {
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
    font-weight: 800;
}

.client-payment-modes {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
}

.client-payment-mode {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
    min-height: 86px;
    padding: 0.9rem;
    border: 2px solid var(--app-border);
    border-radius: 11px;
    background: #fff;
    cursor: pointer;
    transition: border-color 120ms ease, background-color 120ms ease, box-shadow 120ms ease;
}

.client-payment-mode-control {
    position: absolute;
    z-index: 2;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}

.client-payment-mode:hover {
    border-color: color-mix(in srgb, var(--app-primary) 48%, var(--app-border));
}

.client-payment-mode.is-selected {
    border-color: var(--app-primary);
    background: var(--app-primary-soft);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--app-primary) 12%, transparent);
}

.client-payment-mode:focus-within {
    outline: 3px solid color-mix(in srgb, var(--app-primary) 24%, transparent);
    outline-offset: 2px;
}

.client-payment-mode-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    color: var(--app-primary);
    background: color-mix(in srgb, var(--app-primary-soft) 72%, #fff);
    border-radius: 10px;
}

.client-payment-mode-icon .nav-ic {
    width: 24px;
    height: 24px;
}

.client-payment-mode strong,
.client-payment-mode small {
    display: block;
}

.client-payment-mode strong {
    color: var(--app-text);
    font-size: 1rem;
}

.client-payment-mode small {
    margin-top: 0.2rem;
    color: var(--app-muted);
    line-height: 1.25;
}

.client-payment-mode-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    color: #fff;
    background: var(--app-primary);
    border-radius: 50%;
    opacity: 0;
}

.client-payment-mode.is-selected .client-payment-mode-check {
    opacity: 1;
}

@container (max-width: 37.5rem) {
    .client-payment-modes {
        grid-template-columns: 1fr;
        gap: 0.55rem;
    }

    .client-payment-mode {
        min-height: 70px;
        padding: 0.7rem 0.8rem;
    }

    .client-payment-mode small {
        margin-top: 0.1rem;
    }
}

.sale-payment-modes,
.sale-payment-mode-alternatives {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.55rem;
}

.sale-payment-modes .client-payment-mode {
    min-height: 70px;
    padding: 0.7rem 0.8rem;
}

.sale-payment-mode-alternatives[hidden] {
    display: none;
}

.client-payment-submit-row {
    gap: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--app-border);
}

.client-payment-submit-row .btn {
    min-width: 260px;
}

.client-payment-workspace,
.client-payment-picker {
    max-width: 1040px;
    margin-right: auto;
    margin-left: auto;
    padding: 1.15rem;
}

.client-payment-workspace {
    background: linear-gradient(180deg, #fff 0%, #fff 82%, rgba(238, 250, 246, 0.46) 100%) !important;
}

.client-payment-selected-client {
    max-width: 1040px;
    margin-right: auto;
    margin-left: auto;
    padding: 1rem 1.15rem;
    gap: 1rem;
    border-left: 4px solid var(--app-primary) !important;
    background: linear-gradient(110deg, #fff 0%, #fff 62%, rgba(230, 246, 243, 0.72) 100%) !important;
}

.client-payment-step-heading {
    gap: 0.8rem;
}

.client-payment-step-heading > span {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: #fff;
    background: var(--app-primary);
    border-radius: 50%;
    font-size: 1rem;
    font-weight: 900;
}

.client-payment-client-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(150px, 1fr)) auto;
    gap: 0.65rem;
    align-items: stretch;
}

.client-payment-summary-metric {
    min-width: 0;
    padding: 0.65rem 0.75rem;
    border: 1px solid var(--app-border);
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.88);
}

.client-payment-client-summary strong,
.client-payment-client-summary small {
    display: block;
}

.client-payment-client-summary strong {
    font-size: 1.15rem;
    font-variant-numeric: tabular-nums;
}

.client-payment-summary-metric small {
    margin-top: 0.12rem;
    color: var(--app-muted);
    font-size: 0.76rem;
}

.client-payment-summary-metric.is-debit {
    border-color: color-mix(in srgb, var(--app-danger) 24%, var(--app-border));
    background: color-mix(in srgb, #fff 92%, #fff0ef);
}

.client-payment-summary-metric.is-debit strong {
    color: var(--app-danger);
}

.client-payment-summary-metric.is-credit {
    border-color: color-mix(in srgb, var(--app-success) 24%, var(--app-border));
    background: color-mix(in srgb, #fff 90%, #eefaf6);
}

.client-payment-summary-metric.is-credit strong,
.client-payment-summary-metric.is-settled strong {
    color: var(--app-success);
}

.client-payment-change-client {
    align-self: stretch;
}

.client-payment-client-search {
    max-width: 760px;
    margin: 1.25rem 0;
}

.client-payment-choice-head {
    gap: 1rem;
    margin-bottom: 0.55rem;
}

.client-payment-client-results {
    display: grid;
    gap: 0.55rem;
}

.client-payment-client-choice {
    gap: 1rem;
    min-height: 68px;
    padding: 0.75rem 0.9rem;
    color: var(--app-text);
    border: 1px solid var(--app-border);
    border-radius: 9px;
    background: #fff;
    text-decoration: none;
}

.client-payment-client-choice:hover,
.client-payment-client-choice:focus {
    color: var(--app-text);
    border-color: var(--app-primary);
    background: var(--app-primary-soft);
}

.client-payment-client-choice > span:first-child strong,
.client-payment-client-choice > span:first-child small,
.client-payment-choice-balance strong {
    display: block;
}

.client-payment-client-choice > span:first-child small {
    margin-top: 0.15rem;
    color: var(--app-muted);
}

.client-payment-choice-balance {
    flex: 0 0 auto;
    text-align: right;
}

.client-payment-choice-balance.is-debit strong {
    color: var(--app-danger);
}

.client-payment-choice-balance.is-credit strong {
    color: var(--app-success);
}

.client-payment-empty {
    padding: 1.25rem;
    color: var(--app-muted);
    border: 1px dashed var(--app-border);
    border-radius: 9px;
    text-align: center;
}

.client-payment-buttons {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.55rem;
}

.client-payment-buttons .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 48px;
    white-space: normal;
}

.client-payment-buttons .btn .nav-ic {
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
}

.client-quick-pay-note {
    padding: 0.85rem 1rem;
    color: #134d4e;
    background: var(--app-primary-soft);
    border-radius: 8px;
    font-weight: 800;
}

/* Trésorerie : écrans courts et lisibles, adaptés au comptoir. */
.treasury-extra-fields {
    margin-top: 0.75rem;
    padding: 0.85rem;
    border: 1px solid var(--app-border);
    border-radius: 10px;
    background: #f8fafb;
}

.client-quick-pay-form > .treasury-extra-fields,
.client-quick-pay-form > [data-cash-only],
.client-quick-pay-form > .client-settlement-discount,
.client-quick-pay-form > .client-payment-preview,
.client-quick-pay-form > [data-client-payment-submit] {
    grid-column: 1 / -1;
}

.client-settlement-discount {
    padding: 0.9rem;
    border: 1px solid color-mix(in srgb, var(--app-primary) 24%, var(--app-border));
    border-radius: 10px;
    background: color-mix(in srgb, var(--app-primary-soft) 48%, #fff);
}

.client-settlement-discount summary {
    color: var(--app-primary);
    font-weight: 800;
    cursor: pointer;
}

.client-settlement-discount-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.client-settlement-discount-head strong,
.client-settlement-discount-head span {
    display: block;
}

.client-settlement-discount-head span {
    color: var(--app-muted);
    font-size: 0.8rem;
}

.client-payment-preview {
    min-height: 46px;
    padding: 0.75rem 0.9rem;
    border: 1px solid var(--app-border);
    border-radius: 9px;
    background: #f8fafb;
    color: var(--app-muted);
    font-weight: 750;
}

.client-payment-preview.is-debit,
.client-payment-preview.is-warning {
    color: #7a4d08;
    border-color: #e6c98c;
    background: #fff7e7;
}

.client-payment-preview.is-credit,
.client-payment-preview.is-settled {
    color: #135c4c;
    border-color: #acd8cb;
    background: #eefaf6;
}

.client-quick-pay-form > [data-client-payment-submit] {
    justify-self: end;
    min-width: min(100%, 280px);
}

.bank-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.bank-account-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.bank-account-card {
    padding: 1.1rem;
}

.bank-form {
    max-width: 920px;
    padding: 1.25rem;
}

.bank-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.65rem;
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid var(--app-border);
}

.bank-account-card.is-inactive {
    opacity: 0.68;
}

.bank-account-head,
.bank-account-balance,
.bank-account-meta,
.bank-account-actions {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
}

.bank-account-head {
    align-items: flex-start;
}

.bank-account-head span,
.bank-account-balance span,
.bank-account-meta {
    color: var(--app-muted);
    font-size: 0.82rem;
}

.bank-account-head h2 {
    margin: 0.15rem 0 0;
    font-size: 1.05rem;
}

.bank-account-balance {
    align-items: end;
    margin: 1rem 0;
    padding: 0.9rem;
    border-radius: 10px;
    background: var(--app-primary-soft);
}

.bank-account-balance strong {
    font-size: 1.35rem;
}

.bank-account-meta {
    flex-direction: column;
    gap: 0.2rem;
}

.bank-account-actions {
    justify-content: flex-end;
    margin-top: 1rem;
}

.bank-empty {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 2rem;
    text-align: center;
}

.bank-detail-hero,
.bank-deposit-balance {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 1.4rem;
    color: #fff;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--app-primary), var(--app-primary-dark));
}

.bank-detail-hero strong,
.bank-deposit-balance strong {
    font-size: clamp(1.8rem, 4vw, 2.7rem);
}

.bank-detail-hero small,
.bank-deposit-balance small {
    opacity: 0.82;
}

.bank-status-tabs {
    display: flex;
    gap: 0.55rem;
    overflow-x: auto;
}

.bank-status-tab {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    min-width: max-content;
    padding: 0.65rem 0.9rem;
    color: var(--app-text);
    text-decoration: none;
    border: 1px solid var(--app-border);
    border-radius: 999px;
    background: #fff;
}

.bank-status-tab strong {
    display: grid;
    place-items: center;
    min-width: 1.55rem;
    height: 1.55rem;
    padding: 0 0.35rem;
    border-radius: 999px;
    background: #eef1f3;
}

.bank-status-tab.is-active {
    color: #fff;
    border-color: var(--app-primary);
    background: var(--app-primary);
}

.bank-status-tab.is-active strong {
    color: var(--app-primary-dark);
    background: #fff;
}

.bank-filter-row {
    display: flex;
    align-items: end;
    gap: 0.75rem;
    padding: 1rem 1rem 0;
}

.bank-filter-row > div {
    min-width: 190px;
}

.bank-cheque-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.4rem;
}

.bank-deposit-layout {
    display: grid;
    grid-template-columns: minmax(260px, 0.8fr) minmax(320px, 1.2fr);
    gap: 1rem;
    align-items: start;
}

.bank-deposit-form {
    padding: 1.25rem;
}

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

@media (max-width: 767.98px) {
    .bank-metrics,
    .bank-account-grid,
    .bank-deposit-layout {
        grid-template-columns: 1fr;
    }

    .bank-filter-row {
        align-items: stretch;
        flex-direction: column;
    }

    .bank-filter-row > div,
    .bank-filter-row .btn {
        width: 100%;
    }

    .bank-cheque-actions {
        flex-direction: column;
    }
}

.client-lines-cell {
    max-width: 34rem;
    color: #3d433f;
    font-size: 0.86rem;
    line-height: 1.35;
}

.client-metric-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.sale-table td {
    vertical-align: middle;
}

.sale-table .sale-return-row > td {
    background: #fff7db;
    border-color: #f0d784;
}

.sale-table .sale-return-row .quantity-input {
    color: #9a3412;
    font-weight: 700;
    border-color: #e5a93d;
    background: #fffdf5;
}

.sale-table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}

.sale-table th:nth-child(1),
.sale-table td:nth-child(1) {
    width: 29%;
}

.sale-table th:nth-child(2),
.sale-table td:nth-child(2) {
    width: 12%;
}

.sale-table th:nth-child(3),
.sale-table td:nth-child(3) {
    width: 18%;
}

.sale-table th:nth-child(4),
.sale-table td:nth-child(4),
.sale-table th:nth-child(5),
.sale-table td:nth-child(5),
.sale-table th:nth-child(6),
.sale-table td:nth-child(6) {
    width: 10%;
}

.sale-table th:nth-child(7),
.sale-table td:nth-child(7) {
    width: 11%;
}

.sale-input {
    width: 100%;
    min-width: 0;
    text-align: left;
}

.sale-quantity-cell {
    min-width: 0;
}

.quantity-stepper {
    display: grid;
    grid-template-columns: 30px minmax(64px, 1fr) 30px;
    gap: 0.3rem;
    align-items: center;
}

.quantity-stepper .btn {
    width: 30px;
    height: 34px;
    padding: 0;
    font-size: 1rem;
    line-height: 1;
}

.quantity-stepper .quantity-input {
    min-width: 0;
}

.sale-input[type="number"] {
    appearance: textfield;
}

.sale-input[type="number"]::-webkit-outer-spin-button,
.sale-input[type="number"]::-webkit-inner-spin-button {
    margin: 0;
    appearance: none;
}

.delivery-choices,
.delivery-more-panel {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.delivery-more-panel {
    margin-top: 0.6rem;
}

.delivery-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.7rem;
    min-width: 13rem;
    padding: 0.6rem 0.9rem;
    border: 1.5px solid var(--app-border);
    border-radius: 0.85rem;
    background: var(--app-surface);
    color: var(--app-text);
    text-align: left;
    transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
}

.delivery-chip:hover {
    border-color: var(--app-border-strong);
    background: var(--app-surface-2);
}

.delivery-chip:focus-visible {
    outline: none;
    border-color: var(--app-primary);
    box-shadow: 0 0 0 3px rgba(12, 116, 118, 0.18);
}

.delivery-chip.is-active {
    border-color: var(--app-primary);
    background: var(--app-primary-soft);
    box-shadow: var(--app-shadow-soft);
}

.delivery-chip-ic {
    display: inline-grid;
    place-items: center;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    border-radius: 0.7rem;
    background: var(--app-primary-soft);
    color: var(--app-primary);
}

.delivery-chip-ic .nav-ic {
    width: 22px;
    height: 22px;
}

.delivery-chip-ic-store {
    background: var(--app-accent-soft);
    color: var(--app-accent);
}

.delivery-chip.is-active .delivery-chip-ic {
    background: var(--app-primary);
    color: #fff;
}

.delivery-chip.is-active .delivery-chip-ic-store {
    background: var(--app-accent);
    color: #fff;
}

.delivery-chip-body {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.delivery-chip-title {
    font-weight: 600;
}

.delivery-chip-sub {
    font-size: 0.8rem;
    color: var(--app-muted);
}

.delivery-chip-more {
    border-style: dashed;
}

.delivery-chip-more.is-open .delivery-chip-ic {
    background: var(--app-primary);
    color: #fff;
}

@media (max-width: 575.98px) {
    .delivery-chip {
        min-width: 100%;
    }
}

.sale-summary {
    position: sticky;
    top: 5.6rem;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(250, 247, 241, 0.96)) !important;
}

.sale-total-box {
    padding: 1rem;
    color: #fff;
    background: linear-gradient(135deg, var(--app-ink), var(--app-primary-dark));
    border-radius: 8px;
    transition: background 160ms ease, box-shadow 160ms ease;
}

.sale-total-box span,
.sale-total-box strong {
    color: #fff;
}

.sale-total-box.is-client-credit {
    background: linear-gradient(135deg, #573511, #875c17);
    box-shadow: inset 4px 0 #f5bd45;
}

.sale-total-box.is-balanced-exchange {
    background: linear-gradient(135deg, #274c46, #397067);
}

.sale-total-hint {
    margin-top: 0.35rem;
    color: rgba(255, 255, 255, 0.86);
    font-size: 0.82rem;
    line-height: 1.35;
}

.sale-exchange-client-alert {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.sale-exchange-client-alert .btn {
    flex: 0 0 auto;
    white-space: nowrap;
}

@media (max-width: 575.98px) {
    .sale-exchange-client-alert {
        align-items: stretch;
        flex-direction: column;
    }
}

.sale-global-discount-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.45rem 0.75rem;
    padding-block: 0.15rem;
}

.sale-global-discount-line .form-label {
    font-weight: 700;
}

.sale-global-discount-input {
    width: 142px;
}

.sale-global-discount-input .form-control {
    min-width: 0;
    font-size: 1rem;
}

.sale-global-discount-line #globalDiscountError {
    grid-column: 1 / -1;
    margin-top: -0.15rem;
    text-align: right;
}

.sale-credit-summary {
    padding: 0.85rem 0.95rem;
    border: 1px solid color-mix(in srgb, var(--app-success) 28%, var(--app-border));
    border-radius: 10px;
    background: color-mix(in srgb, #e9f7ef 72%, #fff);
}

.audit-detail-cell {
    max-width: 22rem;
}

.audit-detail-cell summary {
    cursor: pointer;
    font-size: 0.85rem;
}

.audit-detail-body {
    margin-top: 0.35rem;
    padding: 0.5rem 0.65rem;
    font-size: 0.82rem;
    line-height: 1.4;
    word-break: break-word;
    background: #f8f4ec;
    border: 1px solid var(--app-border);
    border-radius: 8px;
}

.login-shell {
    min-height: calc(100vh - 11rem);
    display: grid;
    align-items: center;
}

.login-card {
    overflow: hidden;
}

.login-card-header {
    padding: 1.2rem;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(23, 32, 38, 0.98), rgba(12, 116, 118, 0.92)),
        var(--app-ink);
}

.modal-header {
    background: #fbfaf7;
    border-bottom-color: var(--app-border);
}

.modal-body {
    background: #fffdf9;
}

.product-catalog-dialog {
    --bs-modal-width: min(1280px, calc(100vw - 2rem));
}

.product-catalog-modal {
    overflow: hidden;
}

.product-catalog-modal .modal-header {
    align-items: flex-start;
    padding: 1.15rem 1.25rem;
}

.product-catalog-modal .modal-header .text-muted {
    margin-top: 0.18rem;
    font-size: 0.9rem;
}

.product-catalog-modal .modal-body {
    padding: 1rem 1.25rem 1.25rem;
}

.catalog-filter-bar {
    padding: 1rem;
    background:
        linear-gradient(135deg, rgba(12, 116, 118, 0.035), transparent 55%),
        #f8f4ec;
    border: 1px solid var(--app-border);
    border-radius: 12px;
}

.catalog-status-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    margin-bottom: 0.65rem;
}

.product-catalog-table-wrap {
    max-height: min(58vh, 560px);
    overflow: auto;
    border: 1px solid var(--app-border);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(23, 32, 38, 0.06);
}

.product-catalog-table {
    min-width: 820px;
    table-layout: fixed;
}

.product-catalog-table > :not(caption) > * > * {
    padding: 0.78rem 0.85rem;
}

.product-catalog-table thead th {
    position: sticky;
    top: 0;
    z-index: 4;
    background: #f1ebdf;
    box-shadow: inset 0 -1px 0 var(--app-border);
    color: #4d554f;
    font-size: 0.76rem;
    font-weight: 900;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.product-catalog-table th:nth-child(1),
.product-catalog-table td:nth-child(1) {
    width: 38%;
}

.product-catalog-table th:nth-child(2),
.product-catalog-table td:nth-child(2) {
    width: 15%;
}

.product-catalog-table th:nth-child(3),
.product-catalog-table td:nth-child(3) {
    width: 12%;
}

.product-catalog-table th:nth-child(4),
.product-catalog-table td:nth-child(4) {
    width: 23%;
}

.product-catalog-table th:nth-child(5),
.product-catalog-table td:nth-child(5) {
    width: 12%;
}

.product-catalog-table th:last-child {
    position: sticky;
    right: 0;
    z-index: 6;
    background: #f1ebdf;
    box-shadow: -10px 0 16px rgba(33, 35, 32, 0.06), inset 0 -1px 0 var(--app-border);
}

.catalog-product-name strong {
    overflow-wrap: anywhere;
}

.catalog-product-name > strong {
    display: block;
    color: var(--app-ink);
    font-size: 0.98rem;
    font-weight: 900;
    line-height: 1.25;
}

.catalog-product-code {
    display: inline-flex;
    max-width: 100%;
    margin-top: 0.38rem;
    padding: 0.2rem 0.48rem;
    align-items: center;
    gap: 0.15rem;
    overflow: hidden;
    color: #46615d;
    background: #eef5f3;
    border: 1px solid rgba(12, 116, 118, 0.12);
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 850;
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.catalog-product-code > span {
    color: var(--app-primary);
}

.catalog-category {
    color: #4d5752;
    font-size: 0.88rem;
    font-weight: 700;
}

.catalog-price {
    color: #24302d;
    font-weight: 800;
    white-space: nowrap;
}

.catalog-stock {
    display: inline-flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.3rem;
}

.catalog-stock-primary {
    display: inline-flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: 0.35rem;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.catalog-stock-primary strong {
    color: #172b2b;
    font-size: 1.02rem;
    font-weight: 950;
}

.catalog-stock-primary span {
    color: var(--app-muted);
    font-size: 0.7rem;
    font-weight: 750;
}

.catalog-stock-details {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.25rem;
    font-size: 0.69rem;
    line-height: 1.2;
}

.catalog-stock-reserved,
.catalog-stock-free,
.catalog-stock-low {
    display: inline-flex;
    padding: 0.2rem 0.4rem;
    border-radius: 999px;
    font-weight: 850;
    white-space: nowrap;
}

.catalog-stock-reserved,
.catalog-stock-low {
    color: #8a5206;
    background: #fff0d5;
}

.catalog-stock-free {
    color: #176149;
    background: #e8f5ef;
}

.catalog-stock.is-unavailable .catalog-stock-primary strong,
.catalog-stock.is-unavailable .catalog-stock-free {
    color: var(--app-danger);
}

.catalog-stock.is-unavailable .catalog-stock-free {
    background: #fff0ed;
}

.catalog-row-unavailable > td:not(.catalog-actions-cell) {
    background: rgba(179, 58, 47, 0.018);
}

.catalog-row-price-missing > td:not(.catalog-actions-cell) {
    background: rgba(217, 163, 19, 0.045);
}

.sale-table .sale-input[readonly],
.sale-table .sale-input:disabled {
    color: #56605c;
    background: #f3f1eb;
}

.catalog-empty-state {
    padding: 2.8rem 1rem !important;
    text-align: center;
}

.catalog-empty-state strong,
.catalog-empty-state span {
    display: block;
}

.catalog-empty-state strong {
    color: var(--app-ink);
    font-size: 1rem;
}

.catalog-empty-state span {
    margin-top: 0.35rem;
    color: var(--app-muted);
    font-size: 0.86rem;
}

.catalog-empty-state.is-error strong {
    color: var(--app-danger);
}

.catalog-loading-state {
    padding: 2.8rem 1rem !important;
    color: var(--app-muted);
    text-align: center;
}

.catalog-loading-state .spinner-border {
    margin-right: 0.5rem;
    color: var(--app-primary);
}

.catalog-actions-cell {
    position: sticky;
    right: 0;
    z-index: 2;
    background: #fff;
    box-shadow: -10px 0 16px rgba(33, 35, 32, 0.05);
}

.product-catalog-table tbody tr:hover .catalog-actions-cell {
    background: var(--bs-table-hover-bg);
}

.product-catalog-table thead .catalog-actions-cell,
.product-catalog-table thead th:last-child {
    z-index: 5;
}

.catalog-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.35rem;
    min-width: 112px;
}

.catalog-actions .btn {
    min-height: 32px;
    padding: 0.3rem 0.55rem;
    font-size: 0.78rem;
    line-height: 1.15;
    white-space: nowrap;
}

.catalog-actions .btn-outline-primary {
    background: #fff;
}

.catalog-add-warning {
    --bs-btn-bg: var(--app-danger);
    --bs-btn-border-color: var(--app-danger);
    --bs-btn-hover-bg: #8f2d25;
    --bs-btn-hover-border-color: #8f2d25;
}

.catalog-warning-icon {
    display: inline-grid;
    width: 1rem;
    height: 1rem;
    place-items: center;
    margin-right: 0.25rem;
    color: var(--app-danger);
    background: #fff;
    border-radius: 50%;
    font-size: 0.72rem;
    font-weight: 900;
}

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

    .quick-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-metric-grid,
    .dashboard-quick-actions,
    .client-metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .client-profile-side {
        grid-template-columns: minmax(180px, 0.8fr) minmax(230px, 1.2fr);
    }

    .client-quick-pay .client-payment-form {
        grid-template-columns: 1fr;
    }

    .client-quick-pay .client-payment-form > * {
        grid-column: 1;
    }

    .client-profile-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .client-profile-stats > div:nth-child(2) {
        border-right: 0;
    }

    .client-profile-stats > div:nth-child(-n + 2) {
        border-bottom: 1px solid var(--app-border);
    }

    .client-quick-pay-form,
    .client-payment-buttons {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sale-summary {
        position: static;
    }
}

@media (max-width: 767.98px) {
    .app-main {
        padding-right: 0.85rem;
        padding-left: 0.85rem;
    }

    .app-page-header {
        padding: 1rem;
    }

    .app-page-title {
        align-items: flex-start;
    }

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

    .app-actions.client-payment-page-actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        width: 100%;
    }

    .app-actions.client-payment-page-actions .btn {
        width: auto;
        min-height: 44px;
    }

    .metric-grid,
    .quick-actions,
    .client-metric-grid {
        grid-template-columns: 1fr;
    }

    .metric-card,
    .quick-action {
        min-height: auto;
    }

    #productResults {
        position: static;
        margin-top: 0.75rem;
    }

    #clientResults {
        position: static;
    }

    .selected-client-card {
        align-items: stretch;
        flex-direction: column;
    }

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

    .client-profile-header {
        padding: 0.9rem;
    }

    .client-profile-main {
        align-items: stretch;
        flex-direction: column;
    }

    .client-avatar {
        width: 72px;
        height: 72px;
        font-size: 1.45rem;
    }

    .client-profile-info h2 {
        font-size: 1.65rem;
    }

    .client-identity-grid,
    .client-profile-side,
    .client-quick-pay-form,
    .client-payment-buttons,
    .client-payment-modes {
        grid-template-columns: 1fr;
    }

    .client-payment-form-heading,
    .client-payment-submit-row,
    .client-payment-selected-client,
    .client-payment-choice-head {
        align-items: stretch;
        flex-direction: column;
    }

    .client-payment-balance,
    .client-payment-choice-balance {
        text-align: left;
    }

    .client-payment-client-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch;
        width: 100%;
        gap: 0.65rem;
    }

    .client-payment-client-summary .btn,
    .client-payment-submit-row .btn {
        width: 100%;
        min-width: 0;
    }

    .client-payment-client-summary .btn {
        grid-column: 1 / -1;
    }

    .client-payment-amount-entry {
        grid-template-columns: minmax(0, 1fr);
    }

    .client-payment-client-search .input-group {
        flex-wrap: wrap;
    }

    .client-payment-client-search .input-group > .form-control,
    .client-payment-client-search .input-group > .btn {
        width: 100%;
        margin-left: 0;
        border-radius: var(--bs-border-radius-lg);
    }

    .client-payment-client-search .input-group > .btn {
        margin-top: 0.55rem;
    }

    .sale-table {
        min-width: 860px;
    }

    .product-catalog-dialog {
        --bs-modal-width: calc(100vw - 1rem);
        margin-right: 0.5rem;
        margin-left: 0.5rem;
    }

    .product-catalog-modal .modal-body {
        padding: 0.85rem;
    }

    .catalog-status-bar {
        align-items: stretch;
        flex-direction: column;
    }

    .catalog-status-bar .btn {
        width: 100%;
    }

    .product-catalog-table-wrap {
        max-height: 54vh;
        padding: 0.1rem;
        background: transparent;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .product-catalog-table {
        display: block;
        min-width: 0;
        margin: 0;
    }

    .product-catalog-table thead {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }

    .product-catalog-table tbody {
        display: grid;
        gap: 0.65rem;
    }

    .product-catalog-table tbody tr {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "product price"
            "category category"
            "stock action";
        align-items: center;
        gap: 0.55rem 0.75rem;
        overflow: hidden;
        background: #ffffff;
        border: 1px solid var(--app-border);
        border-radius: 11px;
        box-shadow: 0 7px 18px rgba(23, 32, 38, 0.06);
    }

    .product-catalog-table > tbody > tr > td {
        width: auto !important;
        padding: 0;
        background: transparent !important;
        border: 0;
        box-shadow: none;
    }

    .product-catalog-table tbody td:nth-child(1) {
        grid-area: product;
        padding: 0.85rem 0 0 0.85rem;
    }

    .product-catalog-table tbody td:nth-child(2) {
        grid-area: category;
        padding: 0 0 0.7rem 0.85rem;
    }

    .product-catalog-table tbody td:nth-child(3) {
        grid-area: price;
        padding: 0.85rem 0.85rem 0 0;
    }

    .product-catalog-table tbody td:nth-child(4) {
        grid-area: stock;
        padding: 0 0 0.85rem 0.85rem;
        text-align: left !important;
    }

    .product-catalog-table tbody td:nth-child(5) {
        grid-area: action;
        padding: 0 0.85rem 0.85rem 0;
    }

    .product-catalog-table tbody td[colspan] {
        grid-area: 1 / 1 / auto / -1;
        padding: 2rem 1rem !important;
    }

    .catalog-category::before {
        color: var(--app-muted);
        font-weight: 700;
    }

    .catalog-category::before {
        content: "Cat. ";
    }

    .catalog-stock {
        align-items: flex-start;
    }

    .catalog-stock-details {
        justify-content: flex-start;
    }

    .catalog-actions-cell {
        position: static;
    }

    .catalog-actions {
        min-width: 96px;
    }

    .catalog-row-unavailable {
        border-color: rgba(179, 58, 47, 0.24) !important;
    }
}

/* Liste clients : les outils précèdent la liste sans repousser son contenu utile. */
.client-list-overview {
    display: grid;
    grid-template-columns: 0.8fr 0.8fr 1.25fr 1fr;
    margin-bottom: 0.75rem;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    box-shadow: var(--app-shadow-soft);
}

.client-list-overview-item {
    display: grid;
    min-width: 0;
    min-height: 72px;
    padding: 0.7rem 0.9rem;
    align-content: center;
    border-right: 1px solid var(--app-border);
}

.client-list-overview-item:last-child {
    border-right: 0;
}

.client-list-overview-item > span {
    color: var(--app-muted);
    font-size: 0.67rem;
    font-weight: 900;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

.client-list-overview-item > strong {
    margin-top: 0.12rem;
    overflow: hidden;
    color: var(--app-ink);
    font-size: 1.12rem;
    line-height: 1.15;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.client-list-overview-item > small {
    margin-top: 0.12rem;
    overflow: hidden;
    color: var(--app-muted);
    font-size: 0.72rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.client-list-overview-item.is-debit {
    box-shadow: inset 3px 0 0 var(--app-danger);
}

.client-list-overview-item.is-debit > strong {
    color: var(--app-danger);
}

.client-list-overview-item.is-credit {
    box-shadow: inset 3px 0 0 var(--app-success);
}

.client-list-overview-item.is-credit > strong {
    color: var(--app-success);
}

.client-list-filters {
    overflow: hidden;
}

.client-list-filter-form {
    padding: 0.75rem 1rem;
}

.client-list-filter-form .form-label {
    margin-bottom: 0.3rem;
    font-size: 0.75rem;
}

.client-results-counter {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0.3rem 0.65rem;
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border: 1px solid rgba(12, 116, 118, 0.14);
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 900;
    white-space: nowrap;
}

.client-filter-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
}

.client-filter-actions .btn:only-child {
    grid-column: 1 / -1;
}

.client-balance-filter-bar {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    background: #faf9f5;
    border-top: 1px solid var(--app-border);
}

.client-balance-filters {
    display: flex;
    gap: 0.5rem;
    min-width: 0;
    padding: 0.62rem 1rem;
    overflow-x: auto;
    scrollbar-width: thin;
}

.client-balance-filter-bar > .client-results-counter {
    margin-right: 1rem;
}

.client-filter-pill {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 0.55rem;
    min-height: 36px;
    padding: 0.4rem 0.7rem;
    color: var(--app-text);
    background: #fff;
    border: 1px solid var(--app-border-strong);
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 800;
    text-decoration: none;
}

.client-filter-pill span {
    display: inline-grid;
    min-width: 24px;
    min-height: 24px;
    padding: 0 0.35rem;
    place-items: center;
    color: var(--app-muted);
    background: #f1f0eb;
    border-radius: 999px;
    font-size: 0.72rem;
}

.client-filter-pill:hover,
.client-filter-pill.is-active {
    color: #fff;
    background: var(--app-primary-dark);
    border-color: var(--app-primary-dark);
}

.client-filter-pill:hover span,
.client-filter-pill.is-active span {
    color: var(--app-primary-dark);
    background: #fff;
}

.client-filter-pill.is-debit:not(.is-active) {
    color: var(--app-danger);
}

.client-filter-pill.is-credit:not(.is-active) {
    color: var(--app-success);
}

.client-list-panel {
    overflow: hidden;
}

.client-list-panel > .app-panel-header {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.client-list-table {
    min-width: 1100px;
    background: #fff;
}

.client-list-table thead th {
    padding: 0.78rem 0.85rem;
    color: var(--app-muted);
    background: #f5f4ef;
    border-bottom: 1px solid var(--app-border-strong);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}

.client-list-table tbody td {
    padding: 0.9rem 0.85rem;
    background: #fff;
    border-color: var(--app-border);
    vertical-align: middle;
}

.client-list-table tbody tr:hover td {
    background: #f5faf8;
}

.client-list-table .client-list-row td:first-child {
    border-left: 4px solid transparent;
}

.client-list-table .client-list-row.is-debit td:first-child {
    border-left-color: var(--app-danger);
}

.client-list-table .client-list-row.is-credit td:first-child {
    border-left-color: var(--app-success);
}

.client-list-row.is-inactive td {
    background: #f6f6f4;
}

.client-list-row.is-inactive .client-list-avatar {
    filter: grayscale(1);
    opacity: 0.72;
}

.client-list-person {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.75rem;
}

.client-list-avatar {
    display: inline-grid;
    width: 44px;
    height: 44px;
    flex: 0 0 auto;
    place-items: center;
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary-dark), var(--app-accent));
    border-radius: 8px;
    font-size: 0.9rem;
    font-weight: 900;
    letter-spacing: 0.02em;
}

.client-list-person-info {
    min-width: 0;
}

.client-list-name {
    display: block;
    max-width: 260px;
    color: var(--app-ink);
    font-size: 0.96rem;
    font-weight: 900;
    line-height: 1.2;
    overflow-wrap: anywhere;
    text-decoration: none;
}

.client-list-name:hover {
    color: var(--app-primary);
    text-decoration: underline;
}

.client-list-status {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
    margin-top: 0.38rem;
    color: var(--app-muted);
    font-size: 0.72rem;
}

.client-list-status .badge {
    font-size: 0.65rem;
}

.client-list-phone {
    display: block;
    color: var(--app-primary-dark);
    font-size: 0.94rem;
    font-weight: 900;
    text-decoration: none;
}

.client-list-phone:hover {
    text-decoration: underline;
}

.client-list-secondary,
.client-list-missing {
    display: block;
    max-width: 230px;
    margin-top: 0.3rem;
    color: var(--app-muted);
    font-size: 0.76rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.client-list-missing {
    margin-top: 0;
    font-style: italic;
}

.client-list-identity {
    display: block;
    max-width: 210px;
    color: var(--app-text);
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.client-list-balance {
    display: inline-flex;
    min-width: 138px;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.2rem;
}

.client-list-balance span {
    color: var(--app-muted);
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.client-list-balance strong {
    color: var(--app-text);
    font-size: 1rem;
    font-weight: 900;
    white-space: nowrap;
}

.client-list-balance.is-debit strong {
    color: var(--app-danger);
}

.client-list-balance.is-credit strong {
    color: var(--app-success);
}

.client-list-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(72px, 1fr));
    gap: 0.38rem;
    width: 174px;
    margin-left: auto;
}

.client-list-actions .btn {
    padding-right: 0.5rem;
    padding-left: 0.5rem;
}

.client-list-mobile {
    padding: 0.8rem;
    background: #f5f4ef;
}

.client-list-card {
    padding: 0.85rem;
    background: #fff;
    border: 1px solid var(--app-border);
    border-left: 4px solid var(--app-border-strong);
    border-radius: 8px;
    box-shadow: var(--app-shadow-soft);
}

.client-list-card + .client-list-card {
    margin-top: 0.75rem;
}

.client-list-card.is-debit {
    border-left-color: var(--app-danger);
}

.client-list-card.is-credit {
    border-left-color: var(--app-success);
}

.client-list-card.is-inactive {
    background: #f6f6f4;
}

.client-list-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    padding-bottom: 0.8rem;
    border-bottom: 1px solid var(--app-border);
}

.client-list-card-header .client-list-person {
    align-items: flex-start;
}

.client-list-card-header .client-list-person-info .badge {
    margin-top: 0.38rem;
}

.client-list-card-header .client-list-balance {
    min-width: auto;
    flex: 0 0 auto;
}

.client-list-card-contact,
.client-list-card-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
    padding: 0.8rem 0;
}

.client-list-card-meta {
    padding-top: 0;
}

.client-list-card-contact > div,
.client-list-card-meta > div {
    min-width: 0;
}

.client-list-card-contact span,
.client-list-card-meta span {
    display: block;
    margin-bottom: 0.22rem;
    color: var(--app-muted);
    font-size: 0.67rem;
    font-weight: 900;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.client-list-card-contact strong,
.client-list-card-contact a,
.client-list-card-meta strong {
    display: block;
    color: var(--app-text);
    font-size: 0.8rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
    text-decoration: none;
}

.client-list-card-contact a {
    color: var(--app-primary-dark);
}

.client-list-card-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
    padding-top: 0.8rem;
    border-top: 1px solid var(--app-border);
}

.client-list-empty {
    padding: 3.2rem 1rem;
    text-align: center;
}

.client-list-empty-icon {
    display: inline-grid;
    width: 62px;
    height: 62px;
    margin-bottom: 1rem;
    place-items: center;
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border: 1px solid rgba(12, 116, 118, 0.14);
    border-radius: 8px;
    font-size: 1.15rem;
    font-weight: 900;
}

.client-list-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
    color: var(--app-muted);
    background: #faf9f5;
    border-top: 1px solid var(--app-border);
    font-size: 0.8rem;
    font-weight: 800;
}

.client-list-footer .page-link {
    min-width: 34px;
    color: var(--app-primary-dark);
    border-color: var(--app-border-strong);
    text-align: center;
}

.client-list-footer .page-item.active .page-link {
    color: #fff;
    background: var(--app-primary-dark);
    border-color: var(--app-primary-dark);
}

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

    .client-list-overview-item {
        min-height: 66px;
    }

    .client-list-overview-item:nth-child(2) {
        border-right: 0;
    }

    .client-list-overview-item:nth-child(-n + 2) {
        border-bottom: 1px solid var(--app-border);
    }

    .client-balance-filter-bar {
        align-items: stretch;
        flex-direction: column;
    }

    .client-balance-filter-bar > .client-results-counter {
        align-self: flex-start;
        margin: 0 1rem 0.65rem;
    }

    .client-filter-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .client-list-card-header {
        flex-direction: column;
    }

    .client-list-card-header .client-list-balance {
        width: 100%;
        align-items: flex-start;
        padding: 0.65rem;
        background: #faf9f5;
        border-radius: 8px;
    }

    .client-list-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .client-list-footer nav {
        overflow-x: auto;
    }

    .client-list-footer .pagination {
        width: max-content;
    }
}

@media (max-width: 430px) {
    .client-list-card-contact,
    .client-list-card-meta {
        grid-template-columns: 1fr;
    }
}

/* Liste produits : lecture du catalogue et du stock au comptoir. */
.product-list-metrics {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.product-list-metrics .metric-card {
    min-height: 116px;
}

.product-list-metrics .product-threshold-metric {
    border-left: 4px solid var(--app-accent);
}

.product-list-filters,
.product-list-panel {
    overflow: hidden;
}

.product-results-counter {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0.3rem 0.65rem;
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border: 1px solid rgba(12, 116, 118, 0.14);
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 900;
    white-space: nowrap;
}

.product-filter-actions {
    display: grid;
    gap: 0.4rem;
}

.product-filter-actions .btn {
    padding-right: 0.6rem;
    padding-left: 0.6rem;
}

.product-state-filters {
    display: flex;
    gap: 0.5rem;
    padding: 0.8rem 1rem;
    overflow-x: auto;
    background: #faf9f5;
    border-top: 1px solid var(--app-border);
    scrollbar-width: thin;
}

.product-filter-pill {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 0.55rem;
    min-height: 36px;
    padding: 0.4rem 0.7rem;
    color: var(--app-text);
    background: #fff;
    border: 1px solid var(--app-border-strong);
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 800;
    text-decoration: none;
}

.product-filter-pill span {
    display: inline-grid;
    min-width: 24px;
    min-height: 24px;
    padding: 0 0.35rem;
    place-items: center;
    color: var(--app-muted);
    background: #f1f0eb;
    border-radius: 999px;
    font-size: 0.72rem;
}

.product-filter-pill:hover,
.product-filter-pill.is-active {
    color: #fff;
    background: var(--app-primary-dark);
    border-color: var(--app-primary-dark);
}

.product-filter-pill:hover span,
.product-filter-pill.is-active span {
    color: var(--app-primary-dark);
    background: #fff;
}

.product-filter-pill.is-available:not(.is-active) {
    color: var(--app-success);
}

.product-filter-pill.is-out:not(.is-active),
.product-filter-pill.is-missing:not(.is-active) {
    color: var(--app-danger);
}

.product-filter-pill.is-low:not(.is-active) {
    color: #8a5a00;
}

.product-list-table {
    min-width: 1120px;
    background: #fff;
}

.product-list-table thead th {
    padding: 0.78rem 0.85rem;
    color: var(--app-muted);
    background: #f5f4ef;
    border-bottom: 1px solid var(--app-border-strong);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    white-space: nowrap;
}

.product-list-table tbody td {
    padding: 0.9rem 0.85rem;
    background: #fff;
    border-color: var(--app-border);
}

.product-list-table tbody tr:hover td {
    background: #f5faf8;
}

.product-list-table .product-list-row td:first-child {
    border-left: 4px solid transparent;
}

.product-list-table .product-list-row.is-out td:first-child {
    border-left-color: var(--app-danger);
}

.product-list-table .product-list-row.is-low td:first-child {
    border-left-color: #c18422;
}

.product-list-table .product-list-row.is-available td:first-child {
    border-left-color: var(--app-success);
}

.product-list-table .product-list-row.is-inactive td {
    background: #f6f6f4;
}

.product-list-identity {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.75rem;
}

.product-list-avatar {
    display: inline-grid;
    width: 44px;
    height: 44px;
    flex: 0 0 auto;
    place-items: center;
    color: #fff;
    background: linear-gradient(135deg, var(--app-primary-dark), var(--app-accent));
    border-radius: 8px;
    font-size: 0.82rem;
    font-weight: 900;
}

.product-list-main {
    min-width: 0;
}

.product-list-name {
    display: block;
    max-width: 300px;
    color: var(--app-ink);
    font-size: 0.94rem;
    font-weight: 900;
    line-height: 1.25;
    overflow-wrap: anywhere;
    text-decoration: none;
}

.product-list-name:hover {
    color: var(--app-primary);
    text-decoration: underline;
}

.product-list-refs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem 0.65rem;
    margin-top: 0.35rem;
    color: var(--app-muted);
    font-size: 0.72rem;
}

.product-list-refs span {
    overflow-wrap: anywhere;
}

.product-list-secondary {
    display: block;
    margin-top: 0.28rem;
    color: var(--app-muted);
    font-size: 0.75rem;
    line-height: 1.35;
}

.product-list-price {
    color: var(--app-ink);
    font-size: 1rem;
    font-weight: 900;
    white-space: nowrap;
}

.product-price-missing,
.product-threshold-missing {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0.25rem 0.55rem;
    color: var(--app-danger);
    background: #fff0ed;
    border: 1px solid rgba(179, 58, 47, 0.18);
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 900;
    white-space: nowrap;
}

.product-threshold-missing {
    color: #795417;
    background: #fff7e8;
    border-color: rgba(193, 132, 34, 0.2);
}

.product-stock-value {
    display: inline-flex;
    min-width: 118px;
    align-items: baseline;
    justify-content: flex-end;
    gap: 0.3rem;
}

.product-stock-value strong {
    color: var(--app-text);
    font-size: 1.05rem;
    font-weight: 900;
}

.product-stock-value span {
    color: var(--app-muted);
    font-size: 0.72rem;
}

.product-stock-value.is-out strong {
    color: var(--app-danger);
}

.product-stock-value.is-low strong {
    color: #8a5a00;
}

.product-stock-value.is-available strong {
    color: var(--app-success);
}

.product-stock-badge {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0.25rem 0.55rem;
    color: var(--app-text);
    background: #efefec;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 900;
    white-space: nowrap;
}

.product-stock-badge.is-available {
    color: #16533d;
    background: #e8f5ef;
}

.product-stock-badge.is-out {
    color: var(--app-danger);
    background: #fff0ed;
}

.product-stock-badge.is-low {
    color: #795417;
    background: #fff7e8;
}

.product-stock-badge.is-inactive {
    color: #5c6268;
    background: #e9ebed;
}

.product-list-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(80px, 1fr));
    gap: 0.38rem;
    width: 192px;
    margin-left: auto;
}

.product-list-actions form,
.product-list-actions button {
    width: 100%;
}

.product-list-mobile {
    padding: 0.8rem;
    background: #f5f4ef;
}

.product-list-card {
    padding: 0.85rem;
    background: #fff;
    border: 1px solid var(--app-border);
    border-left: 4px solid var(--app-border-strong);
    border-radius: 8px;
    box-shadow: var(--app-shadow-soft);
}

.product-list-card + .product-list-card {
    margin-top: 0.75rem;
}

.product-list-card.is-available {
    border-left-color: var(--app-success);
}

.product-list-card.is-out,
.product-list-card.has-missing-price {
    border-left-color: var(--app-danger);
}

.product-list-card.is-low {
    border-left-color: #c18422;
}

.product-list-card.is-inactive {
    background: #f6f6f4;
}

.product-list-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    padding-bottom: 0.8rem;
    border-bottom: 1px solid var(--app-border);
}

.product-list-card-header .product-list-identity {
    align-items: flex-start;
}

.product-list-card-values {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    padding: 0.85rem 0;
}

.product-list-card-values > div {
    min-width: 0;
    padding: 0.65rem;
    background: #faf9f5;
    border: 1px solid var(--app-border);
    border-radius: 8px;
}

.product-list-card-values span {
    display: block;
    margin-bottom: 0.25rem;
    color: var(--app-muted);
    font-size: 0.66rem;
    font-weight: 900;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.product-list-card-values strong {
    display: block;
    color: var(--app-text);
    font-size: 0.86rem;
    font-weight: 900;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.product-list-card-note {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 0.75rem;
    padding: 0.7rem 0;
    color: var(--app-muted);
    border-top: 1px solid var(--app-border);
    font-size: 0.72rem;
}

.product-list-card-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.45rem;
    padding-top: 0.8rem;
    border-top: 1px solid var(--app-border);
}

.product-list-card-actions form,
.product-list-card-actions button {
    width: 100%;
}

.product-list-empty {
    padding: 3.2rem 1rem;
    text-align: center;
}

.product-list-empty-icon {
    display: inline-grid;
    width: 62px;
    height: 62px;
    margin-bottom: 1rem;
    place-items: center;
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border: 1px solid rgba(12, 116, 118, 0.14);
    border-radius: 8px;
    font-size: 1.15rem;
    font-weight: 900;
}

.product-list-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
    color: var(--app-muted);
    background: #faf9f5;
    border-top: 1px solid var(--app-border);
    font-size: 0.8rem;
    font-weight: 800;
}

@media (max-width: 1399.98px) {
    .product-list-metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .product-list-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .product-list-metrics .metric-card {
        min-height: 104px;
        padding: 0.82rem;
    }

    .product-list-metrics .metric-value {
        font-size: 1.35rem;
    }

    .product-list-metrics .metric-note {
        margin-top: 0.48rem;
        font-size: 0.72rem;
    }

    .product-list-filters .app-panel-header,
    .product-list-card-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .product-list-card-header .product-stock-badge {
        align-self: flex-start;
    }

    .product-list-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .product-list-footer nav {
        overflow-x: auto;
    }
}

@media (max-width: 430px) {
    .product-list-card-values {
        grid-template-columns: 1fr;
    }
}

/* État de stock : contrôle quotidien des produits réellement mouvementés. */
.stock-report-controls,
.stock-report-panel {
    margin-bottom: 1rem;
    overflow: hidden;
}

.stock-report-filter {
    padding: 1rem 1.1rem 1.1rem;
}

.stock-report-filter .form-label {
    margin-bottom: 0.35rem;
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.stock-report-shortcuts {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.stock-report-metrics .metric-card.is-alert {
    border-color: rgba(179, 58, 47, 0.42);
    background: #fff4f1;
}

.stock-report-metrics .metric-card.is-alert .metric-value,
.stock-report-metrics .metric-card.is-alert .metric-note {
    color: var(--app-danger);
}

.stock-report-rule {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.8rem 1rem;
    margin-bottom: 1rem;
    color: var(--app-text);
    background: var(--app-primary-soft);
    border: 1px solid rgba(12, 116, 118, 0.18);
    border-left: 4px solid var(--app-primary);
    border-radius: 8px;
    font-size: 0.86rem;
}

.stock-report-rule span {
    padding: 0.25rem 0.45rem;
    background: rgba(255, 255, 255, 0.72);
    border-radius: 5px;
    font-weight: 850;
}

.stock-report-rule b {
    color: var(--app-primary-dark);
    font-size: 1rem;
}

.stock-report-rule small {
    margin-left: auto;
    color: var(--app-muted);
}

.stock-report-document-head,
.stock-report-print-foot {
    display: none;
}

.stock-report-table {
    min-width: 820px;
    font-size: 0.86rem;
}

.stock-report-table thead th {
    position: sticky;
    z-index: 2;
    top: 0;
    color: #5f3b08;
    background: var(--app-accent-soft);
    border-bottom: 2px solid var(--app-border-strong);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.035em;
    text-transform: uppercase;
    white-space: nowrap;
}

.stock-report-table tbody tr:nth-child(even) > * {
    background: #f8f7f2;
}

.stock-report-table tbody tr.is-inconsistent > * {
    background: #fff0ed;
}

.stock-report-number {
    width: 52px;
    color: var(--app-muted);
    text-align: center;
}

.stock-report-product {
    color: var(--app-ink);
    font-weight: 900;
    line-height: 1.25;
}

.stock-report-product-meta {
    margin-top: 0.22rem;
    color: var(--app-muted);
    font-size: 0.7rem;
    font-weight: 750;
}

.stock-report-quantity {
    min-width: 92px;
    font-variant-numeric: tabular-nums;
    font-weight: 800;
    white-space: nowrap;
}

.stock-report-quantity.is-entry,
.stock-report-quantity.is-positive {
    color: var(--app-success);
}

.stock-report-quantity.is-exit,
.stock-report-quantity.is-negative {
    color: var(--app-danger);
}

.stock-report-quantity.is-neutral,
.stock-report-zero {
    color: #a4a6a2;
}

.stock-report-closing {
    color: var(--app-ink);
    font-size: 0.96rem;
    font-weight: 950;
}

.stock-report-empty {
    padding: 4rem 1rem !important;
    text-align: center;
}

.stock-report-empty strong,
.stock-report-empty span {
    display: block;
}

.stock-report-empty span {
    margin-top: 0.35rem;
    color: var(--app-muted);
}

@media (max-width: 991.98px) {
    .stock-report-rule {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .stock-report-rule small {
        flex-basis: 100%;
        margin-left: 0;
    }
}

@media (max-width: 767.98px) {
    .stock-report-controls .app-panel-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .stock-report-shortcuts,
    .stock-report-shortcuts .btn {
        width: 100%;
    }

    .stock-report-shortcuts .btn {
        flex: 1 1 90px;
    }

    .stock-report-rule span {
        font-size: 0.76rem;
    }
}

@media print {
    @page {
        size: A4 portrait;
        margin: 10mm 8mm 11mm;
    }

    html,
    body,
    .app-body {
        min-height: auto;
        color: #000 !important;
        background: #fff !important;
    }

    .app-navbar,
    .app-footer,
    .stock-report-screen-only {
        display: none !important;
    }

    main.app-main {
        width: 100%;
        max-width: none;
        padding: 0 !important;
        margin: 0 !important;
    }

    .stock-report-document-head {
        display: block;
        margin-bottom: 8mm;
        text-align: center;
        font-size: 11pt;
        line-height: 1.35;
    }

    .stock-report-document-head h1 {
        margin: 1.5mm 0 0.5mm;
        color: #000;
        font-size: 17pt;
        font-weight: 900;
        letter-spacing: 0.02em;
    }

    .stock-report-shop {
        font-size: 10pt;
        font-weight: 800;
        text-transform: uppercase;
    }

    .stock-report-print-filter {
        margin-top: 1.5mm;
        font-size: 8pt;
    }

    .stock-report-warning {
        padding: 2mm 3mm;
        margin: 0 0 4mm;
        color: #000 !important;
        background: #fff !important;
        border: 1px solid #000 !important;
        font-size: 8pt;
    }

    .stock-report-panel,
    .stock-report-panel.app-panel {
        overflow: visible;
        margin: 0;
        background: #fff !important;
        border: 0 !important;
        border-radius: 0;
        box-shadow: none !important;
    }

    .stock-report-panel .table-responsive {
        overflow: visible !important;
    }

    .stock-report-table {
        width: 100%;
        min-width: 0;
        color: #000;
        border-collapse: collapse;
        font-size: 8pt;
    }

    .stock-report-table thead {
        display: table-header-group;
    }

    .stock-report-table thead th {
        position: static;
        padding: 2.1mm 1.5mm;
        color: #000 !important;
        background: #fff !important;
        border-top: 1px solid #000;
        border-bottom: 1.5px solid #000;
        font-size: 7.3pt;
    }

    .stock-report-table tbody tr {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .stock-report-table tbody tr > *,
    .stock-report-table tbody tr:nth-child(even) > *,
    .stock-report-table tbody tr.is-inconsistent > * {
        padding: 1.6mm 1.5mm;
        color: #000 !important;
        background: #fff !important;
        border-bottom: 0.5px solid #aaa;
    }

    .stock-report-number {
        width: 8mm;
    }

    .stock-report-product {
        color: #000 !important;
        font-size: 8pt;
    }

    .stock-report-product-meta {
        margin-top: 0.5mm;
        color: #444 !important;
        font-size: 6.3pt;
    }

    .stock-report-quantity {
        min-width: 0;
        color: #000 !important;
        font-size: 7.7pt;
    }

    .stock-report-closing {
        font-size: 8pt;
    }

    .stock-report-print-foot {
        display: block;
        padding-top: 3mm;
        color: #555;
        border-top: 1px solid #000;
        font-size: 7pt;
        text-align: right;
    }
}

/* Journal d'activité quotidien : lecture chronologique et détails métier. */
.activity-page {
    max-width: 1480px;
    margin: 0 auto;
}

.activity-page > * {
    scroll-margin-top: 1rem;
}

.activity-filters {
    padding: 1rem 1.1rem;
    margin-bottom: 1rem;
    background:
        linear-gradient(110deg, rgba(228, 243, 241, 0.72), rgba(255, 255, 255, 0.94)) !important;
}

.activity-filters .form-label {
    margin-bottom: 0.35rem;
}

.activity-date-shortcuts {
    display: flex;
    gap: 0.4rem;
    align-items: center;
}

.activity-metrics .metric-card {
    position: relative;
    overflow: hidden;
    min-height: 116px;
}

.activity-metrics .metric-card::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    content: "";
    background: var(--app-primary);
}

.activity-metrics .metric-card:nth-child(2)::before {
    background: var(--app-success);
}

.activity-metrics .metric-card:nth-child(3)::before {
    background: #3f77a7;
}

.activity-metrics .metric-card:nth-child(4)::before {
    background: var(--app-accent);
}

.activity-metrics .metric-value {
    font-size: 1.8rem;
}

.activity-quicknav {
    display: flex;
    gap: 0.5rem;
    overflow-x: auto;
    padding: 0.15rem 0 0.8rem;
    margin-bottom: 0.35rem;
    scrollbar-width: thin;
}

.activity-quicknav a {
    display: inline-flex;
    flex: 0 0 auto;
    gap: 0.5rem;
    align-items: center;
    padding: 0.52rem 0.72rem;
    color: #48504d;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    font-size: 0.83rem;
    font-weight: 800;
    text-decoration: none;
}

.activity-quicknav a:hover,
.activity-quicknav a:focus {
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border-color: rgba(12, 116, 118, 0.38);
}

.activity-quicknav span {
    display: inline-grid;
    min-width: 1.55rem;
    min-height: 1.55rem;
    padding: 0 0.38rem;
    place-items: center;
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border-radius: 999px;
    font-size: 0.74rem;
}

.activity-section {
    margin-bottom: 1.25rem;
}

.activity-section.app-panel {
    overflow: hidden;
}

.activity-section-title {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    margin: 0.3rem 0 0.7rem;
    padding: 0 0.15rem;
}

.activity-section-title h2 {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 900;
}

.activity-section-title p {
    margin: 0.15rem 0 0;
    color: var(--app-muted);
    font-size: 0.84rem;
}

.activity-section-title > span {
    display: inline-grid;
    min-width: 2.15rem;
    min-height: 2.15rem;
    padding: 0 0.55rem;
    place-items: center;
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border: 1px solid rgba(12, 116, 118, 0.16);
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 900;
}

.activity-timeline {
    padding: 0.3rem 1.1rem 0.6rem;
}

.activity-event {
    --activity-event-color: var(--app-primary);
    position: relative;
    display: grid;
    grid-template-columns: 3.25rem 1.1rem minmax(0, 1fr) auto;
    gap: 0.7rem;
    min-height: 66px;
    padding: 0.72rem 0.45rem;
    align-items: center;
    color: var(--app-text);
    border-bottom: 1px solid #eee8df;
    text-decoration: none;
}

.activity-event:last-child {
    border-bottom: 0;
}

.activity-event:hover,
.activity-event:focus {
    color: var(--app-text);
    background: #f8faf8;
}

.activity-event time {
    color: var(--app-muted);
    font-size: 0.78rem;
    font-weight: 850;
    text-align: right;
}

.activity-event-dot {
    position: relative;
    z-index: 1;
    width: 0.72rem;
    height: 0.72rem;
    background: var(--activity-event-color);
    border: 3px solid #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 2px rgba(12, 116, 118, 0.2);
}

.activity-event:not(:last-child) .activity-event-dot::after {
    position: absolute;
    z-index: -1;
    top: 0.7rem;
    left: calc(50% - 1px);
    width: 2px;
    height: 54px;
    content: "";
    background: #ddd8cf;
}

.activity-event.is-delivery {
    --activity-event-color: #3f77a7;
}

.activity-event.is-payment,
.activity-event.is-cash {
    --activity-event-color: var(--app-success);
}

.activity-event.is-purchase,
.activity-event.is-expense {
    --activity-event-color: var(--app-accent);
}

.activity-event.is-stock {
    --activity-event-color: #6b62a6;
}

.activity-event.is-cancel {
    --activity-event-color: var(--app-danger);
}

.activity-event.is-other {
    --activity-event-color: #68716d;
}

.activity-event-content {
    display: grid;
    min-width: 0;
    gap: 0.2rem;
}

.activity-event-head {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 0.65rem;
    align-items: baseline;
}

.activity-event-head b {
    color: var(--activity-event-color);
    font-size: 0.72rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.activity-event-head strong {
    overflow: hidden;
    font-size: 0.9rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.activity-event-meta {
    display: flex;
    min-width: 0;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.3rem 0.55rem;
}

.activity-event-meta > small {
    overflow: hidden;
    color: var(--app-muted);
    font-size: 0.78rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.activity-event-tags {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.activity-event-tag {
    display: inline-flex;
    min-height: 1.45rem;
    padding: 0.18rem 0.5rem;
    align-items: center;
    color: #4f5b56;
    background: #f0f2ef;
    border: 1px solid #dce1dd;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 850;
    line-height: 1;
    white-space: nowrap;
}

.activity-event-tag.is-success {
    color: #176047;
    background: #e7f5ee;
    border-color: #c7e6d7;
}

.activity-event-tag.is-warning {
    color: #83500b;
    background: #fff2df;
    border-color: #efdbba;
}

.activity-event-amount {
    color: var(--app-ink);
    font-size: 0.9rem;
    font-weight: 900;
    white-space: nowrap;
}

.activity-record {
    overflow: hidden;
    margin-bottom: 0.58rem;
    box-shadow: var(--app-shadow-soft) !important;
}

.activity-record > summary {
    display: grid;
    grid-template-columns: 3.45rem minmax(0, 1fr) auto minmax(6.8rem, auto);
    gap: 0.85rem;
    min-height: 72px;
    padding: 0.8rem 1rem;
    align-items: center;
    cursor: pointer;
    list-style: none;
    background: rgba(255, 255, 255, 0.9);
}

.activity-record > summary::-webkit-details-marker,
.activity-stock-group > summary::-webkit-details-marker {
    display: none;
}

.activity-record > summary:hover,
.activity-record > summary:focus,
.activity-record[open] > summary {
    background: #f5faf8;
}

.activity-record[open] > summary {
    border-bottom: 1px solid var(--app-border);
}

.activity-record.is-cancelled {
    opacity: 0.82;
    border-left: 4px solid var(--app-danger);
}

.activity-record-time {
    color: var(--app-muted);
    font-size: 0.8rem;
    font-weight: 850;
}

.activity-record-main {
    display: grid;
    min-width: 0;
    gap: 0.2rem;
}

.activity-record-main strong {
    overflow: hidden;
    color: var(--app-ink);
    font-size: 0.94rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.activity-record-main small {
    overflow: hidden;
    color: var(--app-muted);
    font-size: 0.78rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.activity-record-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    justify-content: flex-end;
}

.activity-record-total {
    color: var(--app-ink);
    font-size: 1rem;
    font-weight: 950;
    text-align: right;
    white-space: nowrap;
}

.activity-record-body {
    padding: 1rem;
    background: #fff;
}

.activity-facts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.55rem;
    margin-bottom: 0.85rem;
}

.activity-facts > div {
    display: grid;
    gap: 0.18rem;
    padding: 0.65rem 0.72rem;
    background: var(--app-surface-2);
    border: 1px solid #e9e2d8;
    border-radius: 7px;
}

.activity-facts span {
    color: var(--app-muted);
    font-size: 0.67rem;
    font-weight: 800;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.activity-facts strong {
    overflow: hidden;
    font-size: 0.86rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.activity-line-table {
    border: 1px solid var(--app-border);
}

.activity-line-table > :not(caption) > * > * {
    padding: 0.58rem 0.7rem;
}

.activity-line-table thead {
    background: #f4f0e9;
}

.activity-line-table tr.is-return > * {
    background: #fff8e8;
}

.activity-record-actions {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.75rem;
}

.activity-cancel-note {
    padding: 0.65rem 0.75rem;
    margin-top: 0.75rem;
    color: #742c27;
    background: #fff0ed;
    border-left: 3px solid var(--app-danger);
    border-radius: 6px;
    font-size: 0.84rem;
}

.activity-payment-table {
    min-width: 840px;
}

.activity-source-badge {
    display: inline-flex;
    padding: 0.28rem 0.48rem;
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border-radius: 6px;
    font-size: 0.72rem;
    font-weight: 850;
    white-space: nowrap;
}

.activity-compact-panel {
    overflow: hidden;
    margin-bottom: 0.65rem;
}

.activity-compact-panel > h3 {
    padding: 0.75rem 0.95rem;
    margin: 0;
    color: #49504c;
    background: #f4f0e9;
    border-bottom: 1px solid var(--app-border);
    font-size: 0.8rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.activity-compact-panel.is-danger > h3 {
    color: #742c27;
    background: #fff0ed;
}

.activity-compact-row {
    display: grid;
    grid-template-columns: 3.25rem minmax(0, 1fr) auto;
    gap: 0.75rem;
    padding: 0.72rem 0.95rem;
    align-items: center;
    border-bottom: 1px solid #eee8df;
}

.activity-compact-row:last-child {
    border-bottom: 0;
}

.activity-compact-row time {
    color: var(--app-muted);
    font-size: 0.76rem;
    font-weight: 850;
}

.activity-compact-row > span {
    display: grid;
    min-width: 0;
    gap: 0.16rem;
}

.activity-compact-row strong {
    overflow: hidden;
    font-size: 0.86rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.activity-compact-row small {
    overflow: hidden;
    color: var(--app-muted);
    font-size: 0.75rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.activity-compact-row > b,
.activity-compact-row > a {
    font-size: 0.84rem;
    font-weight: 900;
    white-space: nowrap;
}

.activity-stock-group {
    border-bottom: 1px solid #eee8df;
}

.activity-stock-group:last-child {
    border-bottom: 0;
}

.activity-stock-group > summary {
    display: grid;
    grid-template-columns: 3.25rem minmax(170px, auto) 1fr;
    gap: 0.75rem;
    padding: 0.75rem 0.95rem;
    align-items: center;
    cursor: pointer;
    list-style: none;
}

.activity-stock-group > summary:hover,
.activity-stock-group[open] > summary {
    background: #faf8f4;
}

.activity-stock-group time,
.activity-stock-group summary span {
    color: var(--app-muted);
    font-size: 0.76rem;
}

.activity-stock-group summary strong {
    font-size: 0.86rem;
}

.activity-stock-rows {
    max-height: 420px;
    overflow-y: auto;
    padding: 0 0.95rem 0.75rem 4.95rem;
}

.activity-stock-rows > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 4.5rem;
    gap: 0.75rem;
    padding: 0.48rem 0.6rem;
    align-items: center;
    border-top: 1px solid #eee8df;
    font-size: 0.8rem;
}

.activity-stock-rows small {
    color: var(--app-muted);
    white-space: nowrap;
}

.activity-stock-rows b {
    text-align: right;
}

.activity-empty {
    display: grid;
    gap: 0.2rem;
    padding: 1.2rem;
    color: var(--app-muted);
    text-align: center;
}

.activity-empty strong {
    color: #535b57;
}

@media (max-width: 991.98px) {
    .activity-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .activity-record > summary {
        grid-template-columns: 3.25rem minmax(0, 1fr) auto;
    }

    .activity-record-badges {
        grid-column: 2;
        grid-row: 2;
        justify-content: flex-start;
    }

    .activity-record-total {
        grid-column: 3;
        grid-row: 1 / span 2;
    }

    .activity-facts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .activity-page .app-page-header {
        align-items: flex-start;
    }

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

    .activity-metrics {
        grid-template-columns: 1fr;
    }

    .activity-metrics .metric-card {
        min-height: 102px;
    }

    .activity-event {
        grid-template-columns: 2.75rem 0.85rem minmax(0, 1fr);
        gap: 0.5rem;
        padding-inline: 0;
    }

    .activity-event-amount {
        grid-column: 3;
        padding-top: 0.15rem;
        text-align: left;
    }

    .activity-event-head strong,
    .activity-event-meta > small {
        white-space: normal;
    }

    .activity-record > summary {
        grid-template-columns: 2.75rem minmax(0, 1fr);
        gap: 0.6rem;
        padding: 0.72rem;
    }

    .activity-record-badges {
        grid-column: 2;
        grid-row: auto;
    }

    .activity-record-total {
        grid-column: 2;
        grid-row: auto;
        text-align: left;
    }

    .activity-record-main strong,
    .activity-record-main small {
        white-space: normal;
    }

    .activity-facts {
        grid-template-columns: 1fr;
    }

    .activity-compact-row {
        grid-template-columns: 2.75rem minmax(0, 1fr);
    }

    .activity-compact-row > b,
    .activity-compact-row > a {
        grid-column: 2;
    }

    .activity-stock-group > summary {
        grid-template-columns: 2.75rem minmax(0, 1fr);
    }

    .activity-stock-group > summary span {
        grid-column: 2;
    }

    .activity-stock-rows {
        padding-left: 0.95rem;
    }

    .activity-stock-rows > div {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .activity-stock-rows b {
        grid-column: 2;
    }
}

@media print {
    .activity-page .app-actions,
    .activity-filters,
    .activity-quicknav,
    .activity-record-actions {
        display: none !important;
    }

    .activity-record,
    .activity-section,
    .activity-compact-panel {
        break-inside: avoid;
        box-shadow: none !important;
    }
}

/* Inventaire instantané : version quantité et version valorisée. */
.inventory-controls,
.inventory-table-panel {
    margin-bottom: 1rem;
    overflow: hidden;
}

.inventory-mode-switch {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    padding: 1rem;
    border-bottom: 1px solid var(--app-border);
}

.inventory-mode-option {
    display: flex;
    min-height: 84px;
    padding: 0.9rem 1rem;
    color: var(--app-text);
    background: #faf9f5;
    border: 1px solid var(--app-border);
    border-left: 4px solid var(--app-border-strong);
    border-radius: 8px;
    flex-direction: column;
    justify-content: center;
    text-decoration: none;
    transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}

.inventory-mode-option:hover {
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border-color: rgba(12, 116, 118, 0.3);
    transform: translateY(-1px);
}

.inventory-mode-option.is-active {
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border-color: rgba(12, 116, 118, 0.35);
    border-left-color: var(--app-primary);
}

.inventory-mode-option.is-disabled {
    color: var(--app-muted);
    background: #f2f1ed;
    cursor: not-allowed;
    opacity: 0.78;
}

.inventory-mode-option strong {
    font-size: 0.96rem;
    font-weight: 900;
}

.inventory-mode-option span {
    margin-top: 0.28rem;
    color: var(--app-muted);
    font-size: 0.78rem;
}

.inventory-filter {
    display: grid;
    grid-template-columns: minmax(260px, 430px) auto;
    align-items: end;
    gap: 0.75rem;
    padding: 1rem;
}

.inventory-filter .form-label {
    margin-bottom: 0.35rem;
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.inventory-valued-metrics .metric-card.is-alert,
.inventory-simple-metrics .metric-card.is-alert {
    color: var(--app-danger);
    background: #fff4f1;
    border-color: rgba(179, 58, 47, 0.42);
}

.inventory-valued-metrics .metric-card.is-alert .metric-value,
.inventory-valued-metrics .metric-card.is-alert .metric-note,
.inventory-simple-metrics .metric-card.is-alert .metric-value,
.inventory-simple-metrics .metric-card.is-alert .metric-note {
    color: var(--app-danger);
}

.inventory-money-value {
    font-size: clamp(1.1rem, 1.8vw, 1.65rem);
    line-height: 1.15;
}

.inventory-price-warning {
    margin-bottom: 1rem;
}

.inventory-category-nav {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.8rem;
    margin-bottom: 1rem;
    overflow-x: auto;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    box-shadow: var(--app-shadow-soft);
    white-space: nowrap;
}

.inventory-category-nav > span {
    margin-right: 0.2rem;
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.inventory-category-nav a {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.55rem;
    color: var(--app-text);
    background: #f4f2ec;
    border: 1px solid var(--app-border);
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 800;
    text-decoration: none;
}

.inventory-category-nav a:hover {
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border-color: rgba(12, 116, 118, 0.28);
}

.inventory-category-nav b {
    color: var(--app-primary-dark);
}

.inventory-print-head,
.inventory-print-foot {
    display: none;
}

.inventory-table-simple {
    min-width: 660px;
}

.inventory-table-valued {
    min-width: 1240px;
}

.inventory-table thead th {
    position: sticky;
    z-index: 3;
    top: 0;
    color: #5f3b08;
    background: var(--app-accent-soft);
    border-bottom: 2px solid var(--app-border-strong);
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.025em;
    text-transform: uppercase;
    white-space: nowrap;
}

.inventory-table tbody tr:not(.inventory-category-row):not(.inventory-subtotal-row):nth-child(odd) > * {
    background: #faf9f5;
}

.inventory-number {
    width: 58px;
    color: var(--app-muted);
    text-align: center;
}

.inventory-product-name {
    color: var(--app-ink);
    font-weight: 900;
    line-height: 1.25;
}

.inventory-product-meta {
    margin-top: 0.2rem;
    color: var(--app-muted);
    font-size: 0.68rem;
    font-weight: 750;
}

.inventory-unit {
    color: var(--app-muted);
    font-size: 0.78rem;
    font-weight: 800;
}

.inventory-stock,
.inventory-money {
    font-variant-numeric: tabular-nums;
    font-weight: 850;
    white-space: nowrap;
}

.inventory-stock {
    color: var(--app-ink);
    font-size: 0.98rem;
    font-weight: 950;
}

.inventory-stock.is-negative,
.inventory-margin.is-negative {
    color: var(--app-danger);
}

.inventory-table tr.has-negative-stock > * {
    background: #fff2ef !important;
}

.inventory-table tr.is-inactive .inventory-product-name {
    color: #676b6b;
    text-decoration: line-through;
}

.inventory-table tr.has-missing-price .inventory-product-meta::after {
    content: " · Prix incomplet";
    color: var(--app-warning);
    font-weight: 900;
}

.inventory-missing {
    color: var(--app-warning);
    font-size: 0.7rem;
    font-weight: 850;
}

.inventory-category-row th {
    padding: 0.72rem 0.9rem !important;
    color: #fff;
    background: var(--app-ink) !important;
    border: 0;
}

.inventory-category-row th span,
.inventory-category-row th small {
    display: inline-block;
}

.inventory-category-row th span {
    font-size: 0.82rem;
    font-weight: 950;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

.inventory-category-row th small {
    margin-left: 0.55rem;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.68rem;
    font-weight: 800;
}

.inventory-subtotal-row > * {
    color: var(--app-ink);
    background: #eeeae1 !important;
    border-top: 1px solid var(--app-border-strong);
    border-bottom: 2px solid var(--app-border-strong) !important;
    font-size: 0.76rem;
    font-weight: 950;
}

.inventory-subtotal-row small,
.inventory-grand-total-row small {
    display: block;
    margin-top: 0.16rem;
    color: var(--app-muted);
    font-size: 0.62rem;
    font-weight: 800;
}

.inventory-grand-total-row > * {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
    color: #fff !important;
    background: var(--app-primary-dark) !important;
    border: 0 !important;
    font-size: 0.82rem;
    font-weight: 950;
}

.inventory-grand-total-row small {
    color: rgba(255, 255, 255, 0.72);
}

.inventory-empty {
    padding: 4rem 1rem !important;
    color: var(--app-muted);
    text-align: center;
}

@media (max-width: 767.98px) {
    .inventory-mode-switch,
    .inventory-filter {
        grid-template-columns: 1fr;
    }

    .inventory-filter .btn {
        width: 100%;
    }
}

@media print {
    .inventory-screen-only,
    .inventory-report-page ~ .app-footer {
        display: none !important;
    }

    .inventory-report-page {
        color: #000;
        background: #fff;
    }

    .inventory-print-head {
        display: block;
        margin-bottom: 5mm;
        color: #000;
        text-align: center;
        line-height: 1.3;
    }

    .inventory-print-head h1 {
        margin: 1mm 0;
        color: #000;
        font-size: 15pt;
        font-weight: 950;
        letter-spacing: 0.025em;
    }

    .inventory-print-shop {
        font-size: 9pt;
        font-weight: 900;
        text-transform: uppercase;
    }

    .inventory-print-meta {
        font-size: 8pt;
    }

    .inventory-confidential {
        display: inline-block;
        padding: 0.7mm 2mm;
        margin-top: 1.5mm;
        border: 1px solid #000;
        font-size: 6.8pt;
        font-weight: 900;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }

    .inventory-price-warning {
        padding: 2mm 3mm;
        margin-bottom: 3mm;
        color: #000 !important;
        background: #fff !important;
        border: 1px solid #000 !important;
        font-size: 7pt;
    }

    .inventory-table-panel,
    .inventory-table-panel.app-panel {
        overflow: visible;
        margin: 0;
        background: #fff !important;
        border: 0 !important;
        border-radius: 0;
        box-shadow: none !important;
    }

    .inventory-table-panel .table-responsive {
        overflow: visible !important;
    }

    .inventory-table {
        width: 100%;
        min-width: 0;
        color: #000;
        border-collapse: collapse;
    }

    .inventory-table-simple {
        font-size: 8.2pt;
    }

    .inventory-table-valued {
        font-size: 6.5pt;
    }

    .inventory-table thead {
        display: table-header-group;
    }

    .inventory-table tfoot {
        display: table-row-group;
    }

    .inventory-table thead th {
        position: static;
        padding: 1.7mm 1.2mm;
        color: #000 !important;
        background: #fff !important;
        border-top: 1px solid #000;
        border-bottom: 1.3px solid #000;
        font-size: 6.5pt;
    }

    .inventory-table tbody tr:not(.inventory-category-row),
    .inventory-table tfoot tr {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .inventory-table tbody tr:not(.inventory-category-row):not(.inventory-subtotal-row) > * {
        padding: 1.35mm 1.2mm;
        color: #000 !important;
        background: #fff !important;
        border-bottom: 0.4px solid #aaa;
    }

    .inventory-table tr.has-negative-stock > * {
        color: #000 !important;
        background: #eee !important;
    }

    .inventory-category-row {
        break-after: avoid;
        page-break-after: avoid;
    }

    .inventory-category-row th {
        padding: 1.7mm 1.3mm !important;
        color: #fff !important;
        background: #222 !important;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }

    .inventory-category-row th span {
        font-size: 7pt;
    }

    .inventory-category-row th small {
        color: #ddd !important;
        font-size: 5.8pt;
    }

    .inventory-product-name {
        color: #000 !important;
        font-size: inherit;
    }

    .inventory-product-meta {
        margin-top: 0.25mm;
        color: #444 !important;
        font-size: 5.5pt;
    }

    .inventory-unit,
    .inventory-missing {
        color: #333 !important;
        font-size: 5.8pt;
    }

    .inventory-number {
        width: 9mm;
    }

    .inventory-stock,
    .inventory-money {
        color: #000 !important;
        font-size: inherit;
    }

    .inventory-subtotal-row > * {
        padding: 1.6mm 1.2mm;
        color: #000 !important;
        background: #e8e8e8 !important;
        border-top: 1px solid #000;
        border-bottom: 1px solid #000 !important;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }

    .inventory-grand-total-row > * {
        padding: 2mm 1.2mm !important;
        color: #000 !important;
        background: #d6d6d6 !important;
        border-top: 2px solid #000 !important;
        border-bottom: 2px solid #000 !important;
        font-size: 7pt;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }

    .inventory-grand-total-row small,
    .inventory-subtotal-row small {
        color: #333 !important;
        font-size: 5.5pt;
    }

    .inventory-print-foot {
        display: block;
        padding-top: 2.5mm;
        margin-top: 3mm;
        color: #333;
        border-top: 1px solid #000;
        font-size: 6.2pt;
        line-height: 1.35;
        text-align: right;
    }
}
/* Mode boutique fermee : consultation visible, operations verrouillees. */
.app-operational-banner {
    background: #8b1e2d;
    color: #fff;
    box-shadow: 0 2px 8px rgba(58, 18, 24, 0.18);
}

.app-operational-banner-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-top: 0.65rem;
    padding-bottom: 0.65rem;
}

.app-operational-banner strong,
.app-operational-banner span {
    display: block;
}

.app-operational-banner span {
    color: rgba(255, 255, 255, 0.88);
    font-size: 0.875rem;
}

.app-quick.is-operational-link-locked,
.app-bottom-item.is-operational-link-locked {
    opacity: 0.78;
}

.app-quick.is-operational-link-locked {
    background: rgba(255, 255, 255, 0.1);
}

.app-quick.is-operational-link-locked::after {
    content: "Fermée";
    margin-left: 0.25rem;
    padding: 0.08rem 0.35rem;
    border: 1px solid currentColor;
    border-radius: 999px;
    font-size: 0.62rem;
    font-weight: 700;
    text-transform: uppercase;
}

.operational-form-locked {
    position: relative;
    opacity: 0.58;
}

.operational-form-locked::before {
    content: "Action verrouillée - ouvrez la caisse";
    display: block;
    margin-bottom: 0.65rem;
    color: #8b1e2d;
    font-size: 0.85rem;
    font-weight: 700;
}

@media (max-width: 767.98px) {
    .app-operational-banner-inner {
        align-items: stretch;
        flex-direction: column;
    }
}

/* File opérationnelle des commandes : remise et échéances visibles d'un coup d'œil. */
.order-queue-tabs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.7rem;
}

.order-queue-tab {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-width: 0;
    padding: 0.85rem 1rem;
    color: var(--app-text);
    text-decoration: none;
    background: #fff;
    border: 1px solid var(--app-border);
    border-radius: 10px;
    box-shadow: 0 3px 12px rgba(33, 35, 32, 0.04);
}

.order-queue-tab:hover {
    color: var(--app-primary);
    border-color: var(--app-primary);
}

.order-queue-tab span {
    overflow: hidden;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.order-queue-tab strong {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    min-width: 2rem;
    height: 2rem;
    padding: 0 0.45rem;
    color: var(--app-primary);
    background: #e9f3f1;
    border-radius: 999px;
}

.order-queue-tab.is-active {
    color: #fff;
    background: var(--app-primary);
    border-color: var(--app-primary);
}

.order-queue-tab.is-active strong {
    color: var(--app-primary-dark);
    background: #fff;
}

.order-queue-tab.is-due:not(.is-active) {
    color: #9f2436;
    border-color: #efc2c9;
    background: #fff8f9;
}

.order-queue-tab.is-due:not(.is-active) strong {
    color: #fff;
    background: #c4384d;
}

.order-queue-tab.is-due.is-active {
    background: #b52f43;
    border-color: #b52f43;
}

.order-deadline-alert,
.order-detail-deadline-alert {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.order-deadline-alert > div,
.order-detail-deadline-alert {
    flex-wrap: wrap;
}

.order-deadline-alert strong,
.order-detail-deadline-alert strong {
    margin-right: 0.35rem;
}

.order-method-badge {
    display: inline-flex;
    align-items: center;
    min-height: 1.75rem;
    padding: 0.28rem 0.62rem;
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 800;
    white-space: nowrap;
}

.order-method-badge.is-delivery {
    color: #075d63;
    background: #dff3f3;
    border: 1px solid #a9d9da;
}

.order-method-badge.is-pickup {
    color: #76500b;
    background: #fff0cf;
    border: 1px solid #e9ca82;
}

.order-deadline {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 0.35rem;
    white-space: nowrap;
}

/* Reste à livrer d'une ligne déjà entamée. La classe .text-warning de Bootstrap
   n'est pas utilisable ici : son jaune vif est illisible sur fond clair. */
.order-line-remaining {
    color: var(--app-warning);
    font-weight: 600;
    white-space: nowrap;
}

.order-row-due > td {
    background: #fff9e9 !important;
}

.order-row-overdue > td {
    background: #fff2f4 !important;
}

.order-row-due > td:first-child {
    box-shadow: inset 4px 0 #d9a313;
}

.order-row-overdue > td:first-child {
    box-shadow: inset 4px 0 #c4384d;
}

@media (max-width: 991.98px) {
    .order-queue-tabs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .order-queue-tabs {
        grid-template-columns: 1fr;
    }

    .order-deadline-alert,
    .order-detail-deadline-alert {
        align-items: stretch;
        flex-direction: column;
    }

    .order-deadline-alert .btn {
        width: 100%;
    }
}

/* Atelier de création du BL : composition orientée document. */
.bl-workspace {
    --bl-accent: #0e7374;
    --bl-accent-bright: #1aa3a0;
    --bl-deep: #123f40;
    --bl-ink: #202a29;
    --bl-paper: #fff;
    --bl-paper-muted: #f7f6f2;
    --bl-line: #ddd8cf;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding-bottom: 0.5rem;
}

.bl-document-hero {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
    gap: 2rem;
    overflow: hidden;
    padding: 1.75rem;
    color: #fff;
    background:
        radial-gradient(circle at 78% 12%, rgba(114, 225, 214, 0.22), transparent 31%),
        linear-gradient(135deg, #103f40 0%, #0c6668 58%, #0c5658 100%);
    border: 1px solid rgba(7, 67, 68, 0.45);
    border-radius: 20px;
    box-shadow: 0 24px 55px rgba(20, 70, 68, 0.21);
}

.bl-document-hero::after {
    position: absolute;
    z-index: -1;
    right: -4rem;
    bottom: -7rem;
    width: 18rem;
    height: 18rem;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 50%;
    box-shadow: 0 0 0 2.7rem rgba(255, 255, 255, 0.035), 0 0 0 5.4rem rgba(255, 255, 255, 0.025);
    content: "";
}

.bl-document-hero-copy,
.bl-document-hero-aside {
    position: relative;
    z-index: 1;
}

.bl-document-kicker {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    margin-bottom: 0.85rem;
    color: rgba(255, 255, 255, 0.76);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.bl-document-mark {
    display: grid;
    width: 3.15rem;
    height: 3.45rem;
    place-content: center;
    color: var(--bl-deep);
    background: #fff;
    border-radius: 7px 13px 7px 7px;
    box-shadow: 0 10px 24px rgba(3, 43, 43, 0.22);
    line-height: 1;
    text-align: center;
}

.bl-document-mark strong {
    font-size: 1rem;
    letter-spacing: -0.02em;
}

.bl-document-mark small {
    margin-top: 0.25rem;
    color: #6c8582;
    font-size: 0.52rem;
    font-weight: 900;
    letter-spacing: 0.12em;
}

.bl-document-hero h1 {
    margin: 0;
    color: #fff;
    font-size: clamp(1.7rem, 2.5vw, 2.45rem);
    font-weight: 850;
    letter-spacing: -0.045em;
}

.bl-document-hero-copy > p {
    max-width: 44rem;
    margin: 0.45rem 0 1.3rem;
    color: rgba(255, 255, 255, 0.73);
    font-size: 0.94rem;
}

.bl-document-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.55rem;
}

.bl-document-meta > span {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    min-width: 0;
    padding: 0.65rem 0.75rem;
    background: rgba(255, 255, 255, 0.09);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 11px;
}

.bl-document-meta .nav-ic {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    color: #86ded6;
}

.bl-document-meta > span > span {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.bl-document-meta small {
    color: rgba(255, 255, 255, 0.56);
    font-size: 0.61rem;
    font-weight: 750;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.bl-document-meta strong {
    overflow: hidden;
    color: #fff;
    font-size: 0.8rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bl-document-hero-aside {
    display: flex;
    align-items: stretch;
    flex-direction: column;
    gap: 0.75rem;
}

.bl-hero-back {
    align-self: flex-end;
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.78rem;
    font-weight: 750;
    text-decoration: none;
}

.bl-hero-back:hover {
    color: #fff;
}

.bl-hero-back span {
    display: inline-grid;
    width: 1.45rem;
    height: 1.45rem;
    margin-right: 0.25rem;
    place-items: center;
    background: rgba(255, 255, 255, 0.11);
    border-radius: 50%;
}

.bl-hero-total {
    display: flex;
    flex: 1 1 auto;
    justify-content: center;
    flex-direction: column;
    padding: 1rem 1.1rem;
    background: rgba(5, 45, 46, 0.24);
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 14px;
}

.bl-hero-total > span {
    color: #9be7df;
    font-size: 0.67rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.bl-hero-total strong {
    margin: 0.2rem 0 0.05rem;
    color: #fff;
    font-size: clamp(1.45rem, 2.1vw, 2rem);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.035em;
}

.bl-hero-total small {
    color: rgba(255, 255, 255, 0.58);
    font-size: 0.7rem;
}

.bl-hero-submit {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.8rem 0.9rem;
    color: var(--bl-deep);
    background: #fff;
    border: 0;
    border-radius: 12px;
    box-shadow: 0 13px 30px rgba(4, 40, 40, 0.2);
    text-align: left;
}

.bl-hero-submit > .nav-ic {
    width: 22px;
    height: 22px;
    color: var(--bl-accent);
}

.bl-hero-submit > span:not(.bl-submit-arrow) {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.bl-hero-submit strong {
    font-size: 0.9rem;
}

.bl-hero-submit small {
    color: #70807e;
    font-size: 0.68rem;
}

.bl-submit-arrow {
    display: grid;
    width: 1.9rem;
    height: 1.9rem;
    place-items: center;
    color: #fff;
    background: var(--bl-accent);
    border-radius: 50%;
    font-size: 1rem;
}

.bl-integrity-note {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    padding: 0.7rem 0.9rem;
    color: #35504d;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid #cfe2dc;
    border-radius: 12px;
    box-shadow: 0 7px 20px rgba(54, 65, 61, 0.05);
}

.bl-integrity-icon {
    display: grid;
    width: 2rem;
    height: 2rem;
    place-items: center;
    color: #fff;
    background: #168477;
    border-radius: 50%;
}

.bl-integrity-icon .nav-ic {
    width: 16px;
    height: 16px;
}

.bl-integrity-note > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.bl-integrity-note strong {
    color: #1e4641;
    font-size: 0.82rem;
}

.bl-integrity-note div span {
    color: #69807d;
    font-size: 0.75rem;
}

.bl-integrity-badge {
    padding: 0.38rem 0.62rem;
    color: #126c62;
    background: #e5f5f1;
    border-radius: 999px;
    font-size: 0.67rem;
    font-weight: 850;
    letter-spacing: 0.045em;
    text-transform: uppercase;
    white-space: nowrap;
}

.bl-editor-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 370px);
    align-items: start;
    gap: 1rem;
}

.bl-editor-main,
.bl-editor-sidebar {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 1rem;
}

.bl-editor-sidebar {
    position: static;
}

.bl-editor-card {
    overflow: hidden;
    background: var(--bl-paper);
    border: 1px solid var(--bl-line);
    border-radius: 16px;
    box-shadow: 0 12px 32px rgba(51, 54, 50, 0.075);
}

.bl-editor-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 4.35rem;
    padding: 0.85rem 1rem;
    background: linear-gradient(180deg, #fff, #fcfbf8);
    border-bottom: 1px solid #ece8e1;
}

.bl-editor-heading {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
}

.bl-editor-icon {
    display: grid;
    width: 2.35rem;
    height: 2.35rem;
    flex: 0 0 auto;
    place-items: center;
    color: var(--bl-accent);
    background: #e7f4f2;
    border-radius: 10px;
}

.bl-editor-icon .nav-ic {
    width: 19px;
    height: 19px;
}

.bl-editor-heading > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.bl-editor-eyebrow {
    color: #82908e;
    font-size: 0.61rem;
    font-weight: 850;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.bl-editor-heading h2,
.bl-summary-card h2 {
    margin: 0.1rem 0 0;
    color: var(--bl-ink);
    font-size: 0.98rem;
    font-weight: 820;
    letter-spacing: -0.015em;
}

.bl-status-pill,
.bl-count-pill {
    flex: 0 0 auto;
    padding: 0.35rem 0.6rem;
    border-radius: 999px;
    font-size: 0.65rem;
    font-weight: 820;
    white-space: nowrap;
}

.bl-status-pill.is-required {
    color: #815f19;
    background: #fff3d5;
}

.bl-status-pill.is-editable {
    color: #0f6f68;
    background: #e3f4f0;
}

.bl-status-pill.is-active {
    color: #70551a;
    background: #fff0c9;
}

.bl-count-pill {
    color: #536865;
    background: #edf1f0;
}

.bl-editor-card-body {
    padding: 1rem;
}

.bl-field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.bl-field-grid.is-single-column {
    grid-template-columns: minmax(0, 1fr);
}

.bl-field.is-wide {
    grid-column: 1 / -1;
}

.bl-field label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.38rem;
    color: #46504f;
    font-size: 0.75rem;
    font-weight: 780;
}

.bl-field label span {
    color: #8a9694;
    font-size: 0.6rem;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.bl-field .form-control,
.bl-field .form-select {
    min-height: 2.85rem;
    padding-right: 0.85rem;
    padding-left: 0.85rem;
    color: #253130;
    background-color: #fbfbf9;
    border-color: #d9d5cd;
    border-radius: 10px;
    box-shadow: inset 0 1px 2px rgba(33, 45, 43, 0.025);
    font-size: 0.87rem;
}

.bl-field .form-control::placeholder {
    color: #a2aaa8;
}

.bl-field .form-control:focus,
.bl-field .form-select:focus {
    background-color: #fff;
    border-color: #30a5a1;
    box-shadow: 0 0 0 0.2rem rgba(24, 146, 143, 0.13);
}

.bl-lines-card {
    min-width: 0;
    border-color: #a9cfca;
    box-shadow: 0 18px 42px rgba(22, 88, 84, 0.12);
}

.bl-lines-card .bl-editor-card-header {
    min-height: 5rem;
    color: #fff;
    background:
        radial-gradient(circle at 92% 0, rgba(95, 213, 201, 0.16), transparent 35%),
        #17494a;
    border-bottom-color: #276061;
}

.bl-lines-card .bl-editor-icon {
    color: #b3eee7;
    background: rgba(255, 255, 255, 0.1);
}

.bl-lines-card .bl-editor-eyebrow {
    color: #80cec5;
}

.bl-lines-card .bl-editor-heading h2 {
    color: #fff;
    font-size: 1.08rem;
}

.bl-lines-metrics {
    display: flex;
    align-items: stretch;
    gap: 0.45rem;
}

.bl-lines-metrics > span {
    display: flex;
    min-width: 4.5rem;
    justify-content: center;
    flex-direction: column;
    padding: 0.48rem 0.65rem;
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 9px;
}

.bl-lines-metrics > span.is-total {
    min-width: 8.5rem;
    background: rgba(104, 219, 207, 0.12);
}

.bl-lines-metrics small {
    color: rgba(255, 255, 255, 0.55);
    font-size: 0.52rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.bl-lines-metrics strong {
    margin-top: 0.1rem;
    color: #fff;
    font-size: 0.78rem;
    font-variant-numeric: tabular-nums;
}

.bl-lines-scroll {
    scrollbar-color: #b8c7c4 transparent;
    scrollbar-width: thin;
}

.bl-lignes-table {
    min-width: 880px;
}

.bl-lignes-table thead th {
    padding: 0.78rem 0.8rem;
    color: #476763;
    background: #edf6f4;
    border-bottom: 1px solid #cfe3df;
    font-size: 0.64rem;
    font-weight: 850;
    letter-spacing: 0.055em;
    text-transform: uppercase;
    white-space: nowrap;
}

.bl-lignes-table tbody td {
    padding: 0.88rem 0.8rem;
    color: #313c3a;
    border-color: #efede8;
    font-size: 0.79rem;
    vertical-align: middle;
}

.bl-lignes-table tbody tr:last-child td {
    border-bottom: 0;
}

.bl-lignes-table tbody tr:hover td {
    background: #f5fbf9;
}

.bl-lignes-table tbody td:first-child {
    border-left: 3px solid #d7ebe7;
}

.bl-lignes-table tbody td:last-child {
    background: #f9fcfb;
}

.bl-product-cell {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-width: 16rem;
}

.bl-product-cell > span {
    display: grid;
    width: 1.8rem;
    height: 1.8rem;
    flex: 0 0 auto;
    place-items: center;
    color: #56716d;
    background: #eaf2f0;
    border-radius: 7px;
    font-size: 0.62rem;
    font-weight: 850;
}

.bl-product-cell strong {
    color: #273331;
    font-size: 0.84rem;
}

.bl-number-cell,
.bl-line-total {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.bl-unit-chip {
    display: inline-flex;
    padding: 0.25rem 0.42rem;
    color: #5b6866;
    background: #f1f2ef;
    border-radius: 5px;
    font-size: 0.65rem;
    font-weight: 750;
    text-transform: uppercase;
    white-space: nowrap;
}

.bl-muted-cell {
    color: #7f8987 !important;
    white-space: nowrap;
}

.bl-line-total {
    color: #0b6968;
    font-size: 0.9rem;
}

.bl-lines-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.65rem 0.85rem;
    color: #84908e;
    background: #fbfbf9;
    border-top: 1px solid #ece9e3;
    font-size: 0.67rem;
}

.bl-lines-footer > span:first-child {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    color: #2c796f;
    font-weight: 780;
}

.bl-lines-footer .nav-ic {
    width: 14px;
    height: 14px;
}

.bl-summary-card {
    position: sticky;
    top: 5.25rem;
    overflow: hidden;
    padding: 1.05rem;
    color: #fff;
    background:
        radial-gradient(circle at 100% 0, rgba(79, 190, 179, 0.18), transparent 34%),
        #173f40;
    border: 1px solid #194d4e;
    border-radius: 17px;
    box-shadow: 0 18px 38px rgba(21, 65, 63, 0.18);
}

.bl-summary-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    color: #8ec8c2;
    font-size: 0.62rem;
    font-weight: 850;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.bl-summary-status {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    padding: 0.25rem 0.4rem;
    color: #a9ebe2;
    background: rgba(128, 225, 213, 0.1);
    border-radius: 999px;
}

.bl-summary-status .nav-ic {
    width: 12px;
    height: 12px;
}

.bl-summary-card h2 {
    margin-top: 0.5rem;
    color: #fff;
    font-size: 1.12rem;
}

.bl-summary-document {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.7rem;
    margin: 1rem 0;
    padding: 0.8rem;
    background: rgba(255, 255, 255, 0.065);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 11px;
}

.bl-summary-document div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.bl-summary-document span {
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.59rem;
    font-weight: 750;
    text-transform: uppercase;
}

.bl-summary-document strong {
    overflow: hidden;
    margin-top: 0.12rem;
    color: #fff;
    font-size: 0.74rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bl-summary-lines {
    padding: 0 0.15rem;
}

.bl-summary-lines > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.34rem 0;
    color: rgba(255, 255, 255, 0.58);
    font-size: 0.75rem;
}

.bl-summary-lines strong {
    color: rgba(255, 255, 255, 0.9);
    font-variant-numeric: tabular-nums;
}

.bl-summary-lines .is-neutral strong {
    color: #92d9cf;
    font-size: 0.68rem;
}

.bl-summary-total {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 0.1rem 0.8rem;
    margin-top: 0.8rem;
    padding: 0.9rem;
    color: var(--bl-deep);
    background: #eaf8f5;
    border-radius: 12px;
}

.bl-summary-total > span {
    font-size: 0.75rem;
    font-weight: 850;
    text-transform: uppercase;
}

.bl-summary-total strong {
    grid-row: span 2;
    font-size: 1.25rem;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.03em;
    white-space: nowrap;
}

.bl-summary-total small {
    color: #6a807c;
    font-size: 0.6rem;
}

.bl-summary-assurance {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-top: 0.8rem;
    color: rgba(255, 255, 255, 0.58);
    font-size: 0.65rem;
    line-height: 1.35;
}

.bl-summary-assurance > .nav-ic {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
    color: #79cec4;
}

.bl-summary-assurance span,
.bl-summary-assurance strong {
    display: block;
}

.bl-summary-assurance strong {
    color: rgba(255, 255, 255, 0.9);
}

.bl-form-actions {
    position: sticky;
    z-index: 20;
    bottom: 0.65rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 0.85rem;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid #d2cec6;
    border-radius: 14px;
    box-shadow: 0 15px 38px rgba(33, 45, 42, 0.16);
    backdrop-filter: blur(14px);
}

.bl-form-ready {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.bl-form-ready-icon {
    display: grid;
    width: 2.3rem;
    height: 2.3rem;
    flex: 0 0 auto;
    place-items: center;
    color: #fff;
    background: #188276;
    border-radius: 10px;
}

.bl-form-ready-icon .nav-ic {
    width: 17px;
    height: 17px;
}

.bl-form-ready > span:last-child {
    display: flex;
    flex-direction: column;
}

.bl-form-ready strong {
    color: #253432;
    font-size: 0.82rem;
}

.bl-form-ready small {
    color: var(--app-muted);
    font-size: 0.7rem;
}

.bl-form-actions-primary {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.bl-form-action-total {
    display: flex;
    align-items: flex-end;
    flex-direction: column;
    min-width: 9rem;
}

.bl-form-action-total span {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 750;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.bl-form-action-total strong {
    color: var(--app-primary-dark);
    font-size: 1.05rem;
    font-variant-numeric: tabular-nums;
}

.bl-form-actions .btn {
    min-height: 2.75rem;
    border-radius: 10px;
    font-size: 0.82rem;
}

.bl-form-actions .btn-primary {
    gap: 0.45rem;
    padding-right: 1rem;
    padding-left: 1rem;
    box-shadow: 0 8px 20px rgba(14, 115, 116, 0.2);
}

@media (prefers-reduced-motion: no-preference) {
    .bl-hero-submit,
    .bl-form-actions .btn-primary {
        transition: transform 160ms ease, box-shadow 160ms ease;
    }

    .bl-hero-submit:hover {
        transform: translateY(-2px);
        box-shadow: 0 17px 34px rgba(4, 40, 40, 0.27);
    }

    .bl-form-actions .btn-primary:hover {
        transform: translateY(-1px);
    }
}

@media (max-width: 1199.98px) {
    .bl-editor-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .bl-editor-sidebar {
        position: static;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: start;
    }

    .bl-summary-card {
        position: static;
    }
}

@media (max-width: 991.98px) {
    .bl-document-hero {
        grid-template-columns: minmax(0, 1fr) minmax(245px, 285px);
        gap: 1rem;
        padding: 1.35rem;
    }

    .bl-document-meta {
        grid-template-columns: minmax(0, 1fr);
    }
}

.product-ht-preview {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.1rem 0.75rem;
    margin-top: 0.65rem;
    padding: 0.65rem 0.75rem;
    color: #155e58;
    background: #edf7f5;
    border: 1px solid #c2e1db;
    border-radius: 8px;
}

.product-ht-preview > span {
    font-size: 0.78rem;
    font-weight: 750;
}

.product-ht-preview strong {
    grid-row: span 2;
    font-size: 1rem;
    white-space: nowrap;
}

.product-ht-preview small {
    color: #607872;
    font-size: 0.7rem;
}

@media (max-width: 767.98px) {
    .bl-workspace {
        gap: 0.75rem;
    }

    .bl-document-hero {
        grid-template-columns: minmax(0, 1fr);
        padding: 1.1rem;
        border-radius: 15px;
    }

    .bl-document-hero-copy > p {
        margin-bottom: 1rem;
    }

    .bl-document-meta {
        gap: 0.4rem;
    }

    .bl-document-hero-aside {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }

    .bl-hero-back {
        position: static;
        justify-self: end;
    }

    .bl-hero-total {
        min-height: 6.5rem;
    }

    .bl-integrity-note {
        grid-template-columns: auto minmax(0, 1fr);
        align-items: start;
    }

    .bl-integrity-badge {
        display: none;
    }

    .bl-editor-sidebar {
        display: flex;
    }

    .bl-field-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .bl-field.is-wide {
        grid-column: auto;
    }

    .bl-editor-card,
    .bl-summary-card {
        border-radius: 13px;
    }

    .bl-editor-card-header {
        min-height: 4rem;
        padding: 0.75rem;
    }

    .bl-lines-card .bl-editor-card-header {
        align-items: stretch;
        flex-direction: column;
    }

    .bl-lines-metrics {
        width: 100%;
    }

    .bl-lines-metrics > span {
        min-width: 0;
        flex: 1 1 0;
    }

    .bl-lines-metrics > span.is-total {
        min-width: 0;
    }

    .bl-editor-card-body {
        padding: 0.85rem;
    }

    .bl-lines-footer {
        align-items: flex-start;
        flex-direction: column;
    }

    .bl-form-actions {
        position: static;
        align-items: stretch;
        flex-direction: column;
    }

    .bl-form-actions-primary {
        align-items: stretch;
        flex-direction: column;
        gap: 0.55rem;
    }

    .bl-form-action-total {
        align-items: flex-start;
    }

    .bl-form-actions .btn {
        flex: 1 1 auto;
        width: 100%;
    }
}

/* Centre de rapports et états de ventes. */
.reports-hub {
    display: grid;
    gap: 1rem;
}

.reports-hub-header {
    margin-bottom: 0;
}

.reports-overview {
    margin-bottom: 0;
}

.reports-overview .metric-card,
.report-sales-metrics .metric-card {
    min-height: 118px;
}

.reports-overview .metric-card.is-alert,
.report-sales-metrics .metric-card.is-alert {
    background: #fff5e8;
    border-color: #efd4ad;
}

.reports-overview .metric-card.is-alert .metric-value,
.report-sales-metrics .metric-card.is-alert .metric-value {
    color: #9a570b;
}

.reports-section-nav,
.report-view-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.reports-section-nav a,
.report-view-tabs a {
    display: inline-flex;
    min-height: 2.55rem;
    padding: 0.55rem 0.85rem;
    align-items: center;
    color: #48514c;
    background: rgba(255, 255, 255, 0.84);
    border: 1px solid var(--app-border);
    border-radius: 9px;
    font-size: 0.82rem;
    font-weight: 850;
    text-decoration: none;
}

.reports-section-nav a:hover,
.reports-section-nav a:focus,
.report-view-tabs a:hover,
.report-view-tabs a:focus,
.report-view-tabs a.is-active {
    color: var(--app-primary-dark);
    background: var(--app-primary-soft);
    border-color: rgba(12, 116, 118, 0.28);
}

.reports-section {
    padding-top: 0.35rem;
    scroll-margin-top: 5.5rem;
}

.reports-section-heading {
    display: flex;
    margin-bottom: 0.8rem;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
}

.reports-section-heading span {
    color: var(--app-primary);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.reports-section-heading h2 {
    margin: 0.18rem 0;
    color: var(--app-ink);
    font-size: 1.18rem;
    font-weight: 900;
}

.reports-section-heading p {
    margin: 0;
    color: var(--app-muted);
    font-size: 0.85rem;
}

.reports-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.7rem;
}

.report-card {
    --report-color: var(--app-primary);
    display: grid;
    grid-template-columns: 2.7rem minmax(0, 1fr) auto;
    min-height: 126px;
    padding: 1rem;
    align-items: start;
    gap: 0.75rem;
    color: var(--app-text);
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid var(--app-border);
    border-radius: 11px;
    box-shadow: var(--app-shadow-soft);
    text-decoration: none;
    transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.report-card:hover,
.report-card:focus {
    color: var(--app-text);
    border-color: color-mix(in srgb, var(--report-color) 36%, var(--app-border));
    box-shadow: 0 13px 30px rgba(33, 35, 32, 0.11);
    transform: translateY(-2px);
}

.report-card.is-success {
    --report-color: var(--app-success);
}

.report-card.is-warning {
    --report-color: #c77a16;
}

.report-card.is-danger {
    --report-color: var(--app-danger);
}

.report-card.is-neutral {
    --report-color: #6e7772;
}

.report-card-mark {
    display: grid;
    width: 2.7rem;
    height: 2.7rem;
    place-items: center;
    color: var(--report-color);
    background: color-mix(in srgb, var(--report-color) 10%, #fff);
    border: 1px solid color-mix(in srgb, var(--report-color) 20%, #fff);
    border-radius: 9px;
    font-size: 0.76rem;
    font-weight: 950;
}

.report-card-body {
    display: grid;
    min-width: 0;
    gap: 0.42rem;
}

.report-card-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.55rem;
}

.report-card-head strong {
    color: var(--app-ink);
    font-size: 0.93rem;
    font-weight: 900;
}

.report-card-head small {
    padding: 0.18rem 0.45rem;
    color: var(--report-color);
    background: color-mix(in srgb, var(--report-color) 9%, #fff);
    border-radius: 999px;
    font-size: 0.64rem;
    font-weight: 900;
}

.report-card-body > span:not(.report-card-head) {
    color: var(--app-muted);
    font-size: 0.78rem;
    line-height: 1.4;
}

.report-card-body > b {
    color: var(--report-color);
    font-size: 0.86rem;
}

.report-card-arrow {
    color: var(--report-color);
    font-size: 1.15rem;
    font-weight: 900;
}

.report-sales-page {
    display: grid;
    gap: 1rem;
}

.report-view-tabs a {
    min-width: 8.7rem;
    justify-content: center;
}

.report-filters {
    margin-bottom: 0;
}

.report-print-heading {
    display: none;
}

.report-sales-table-panel {
    overflow: hidden;
}

.report-sales-table {
    min-width: 820px;
}

.report-sales-table thead th {
    color: #59615d;
    background: #f5f2eb;
    font-size: 0.7rem;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

.report-sales-table td > a {
    color: var(--app-ink);
    text-decoration: none;
}

.report-sales-table td > a:hover {
    color: var(--app-primary);
}

.report-sales-table td > small {
    display: block;
    margin-top: 0.18rem;
    color: var(--app-muted);
    font-size: 0.7rem;
}

.report-sales-table tfoot th {
    color: var(--app-ink);
    background: #edf5f2;
    border-top: 2px solid #bdd9d2;
    font-weight: 900;
}

.report-empty {
    padding: 2.5rem !important;
    color: var(--app-muted);
    text-align: center;
}

@media (max-width: 991.98px) {
    .reports-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .reports-card-grid {
        grid-template-columns: 1fr;
    }

    .report-card {
        min-height: 112px;
    }

    .reports-section-nav a,
    .report-view-tabs a {
        flex: 1 1 auto;
        justify-content: center;
    }
}

@media print {
    .report-sales-page {
        display: block;
        color: #111;
        background: #fff;
    }

    .report-sales-page .report-screen-only,
    .report-sales-page ~ .app-footer,
    body:has(.report-sales-page) .app-navbar,
    body:has(.report-sales-page) .operational-lock-banner {
        display: none !important;
    }

    .report-print-heading {
        display: grid;
        margin-bottom: 7mm;
        gap: 1.2mm;
        text-align: center;
    }

    .report-print-heading strong {
        font-size: 10pt;
        letter-spacing: 0.05em;
        text-transform: uppercase;
    }

    .report-print-heading h1 {
        margin: 0;
        font-size: 16pt;
    }

    .report-print-heading span {
        color: #555;
        font-size: 8.5pt;
    }

    .report-sales-table-panel {
        border: 0 !important;
        box-shadow: none !important;
    }

    .report-sales-table {
        width: 100%;
        min-width: 0;
        font-size: 8pt;
    }

    .report-sales-table thead {
        display: table-header-group;
    }

    .report-sales-table th,
    .report-sales-table td {
        padding: 1.7mm 1.4mm;
        border-color: #cfcfcf;
    }

    .report-sales-table a {
        color: #111 !important;
    }
}

/* Impression homogène des écrans utilisés comme rapports. */
.app-report-print-head,
.app-report-print-foot {
    display: none;
}

.client-list-print-total {
    display: none;
}

.client-list-print-table-wrap {
    display: none;
}

.client-list-print-table {
    table-layout: fixed;
}

.client-list-print-table th:nth-child(1) { width: 24%; }
.client-list-print-table th:nth-child(2) { width: 38%; }
.client-list-print-table th:nth-child(3) { width: 22%; }
.client-list-print-table th:nth-child(4) { width: 16%; }

.client-list-print-table td > strong,
.client-list-print-table td > small {
    display: block;
}

.client-list-print-table td > small {
    margin-top: 2px;
    color: var(--app-muted);
}

.client-list-print-sale-summary {
    line-height: 1.35;
    overflow-wrap: anywhere;
}

/* Aperçu papier : la variante ?impression=1 ressemble déjà au document final. */
body.is-report-preview {
    color: #171a18;
    background: #dfe5e2 !important;
    font-size: 13px;
}

body.is-report-preview .app-navbar,
body.is-report-preview .app-bottomnav,
body.is-report-preview .app-operational-banner,
body.is-report-preview > .app-footer {
    display: none !important;
}

body.is-report-preview main.app-main {
    width: min(1120px, calc(100% - 32px));
    max-width: none;
    min-height: calc(100vh - 32px);
    margin: 16px auto;
    padding: 30px 34px !important;
    background: #fff;
    box-shadow: 0 12px 32px rgba(28, 49, 45, 0.16);
}

body.is-report-preview .app-report-print-head {
    display: block;
    margin-bottom: 24px;
    padding-bottom: 14px;
    border-bottom: 2px solid #1f4541;
    text-align: center;
}

body.is-report-preview .app-report-print-head strong {
    display: block;
    margin-bottom: 4px;
    font-size: 12px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

body.is-report-preview .app-report-print-head h1 {
    margin: 0;
    font-size: 26px;
    font-weight: 900;
}

body.is-report-preview .app-report-print-head p {
    margin: 6px 0 0;
    color: #434946;
}

body.is-report-preview .app-report-print-head span {
    display: block;
    margin-top: 4px;
    color: #69706c;
    font-size: 11px;
}

body.is-report-preview .app-report-print-foot {
    display: flex;
    justify-content: space-between;
    margin-top: 22px;
    padding-top: 9px;
    color: #666;
    border-top: 1px solid #bbb;
    font-size: 10px;
}

body.is-report-preview main > .app-page-header {
    position: fixed;
    z-index: 1080;
    top: 14px;
    right: 14px;
    width: auto;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

body.is-report-preview main > .app-page-header .app-page-title,
body.is-report-preview main > .app-page-header .app-actions > * {
    display: none !important;
}

body.is-report-preview main > .app-page-header .app-actions,
body.is-report-preview main > .app-page-header .app-actions > button {
    display: inline-flex !important;
    width: auto;
}

body.is-report-preview main > .alert,
body.is-report-preview .app-toolbar,
body.is-report-preview .product-list-filters,
body.is-report-preview .client-list-filters,
body.is-report-preview .product-list-mobile,
body.is-report-preview .client-list-mobile,
body.is-report-preview .pagination,
body.is-report-preview form {
    display: none !important;
}

body.is-report-preview .app-panel,
body.is-report-preview .metric-card {
    background: #fff !important;
    border-color: #c8cdca !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

body.is-report-preview .metric-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-bottom: 16px !important;
}

body.is-report-preview .metric-card {
    min-height: 0 !important;
    padding: 12px !important;
}

body.is-report-preview .metric-value {
    font-size: 19px !important;
}

body.is-report-preview .table-responsive {
    overflow: visible !important;
}

body.is-report-preview table {
    width: 100% !important;
    margin-bottom: 0 !important;
    font-size: 11px;
}

body.is-report-preview th,
body.is-report-preview td {
    padding: 6px 5px !important;
    color: #171a18 !important;
    border-color: #d5d8d6 !important;
}

body.is-report-preview thead th,
body.is-report-preview tfoot th {
    background: #edf2f0 !important;
    font-size: 10px;
}

body.is-report-preview a {
    color: #171a18 !important;
    text-decoration: none !important;
}

body.is-report-preview.report-print-products .product-list-metrics,
body.is-report-preview.report-print-clients .client-list-metrics,
body.is-report-preview.report-print-clients .client-list-overview {
    display: none !important;
}

body.is-report-preview.report-print-products .product-list-table-wrap,
body.is-report-preview.report-print-clients .client-list-print-table-wrap {
    display: block !important;
}

body.is-report-preview.report-print-clients .client-list-table-wrap {
    display: none !important;
}

body.is-report-preview.report-print-products .product-list-panel,
body.is-report-preview.report-print-clients .client-list-panel {
    overflow: visible !important;
}

body.is-report-preview.report-print-products .product-list-table,
body.is-report-preview.report-print-clients .client-list-print-table {
    min-width: 0 !important;
    table-layout: fixed;
}

body.is-report-preview.report-print-clients .client-list-print-table td {
    overflow-wrap: anywhere;
}

body.is-report-preview.report-print-clients .client-list-balance {
    white-space: nowrap;
}

body.is-report-preview.report-print-clients .client-list-print-total {
    display: table-footer-group;
}

body.is-report-preview.report-print-products .product-list-panel > .app-panel-header,
body.is-report-preview.report-print-products .product-list-footer,
body.is-report-preview.report-print-clients .client-list-panel > .app-panel-header,
body.is-report-preview.report-print-clients .client-list-footer {
    display: none !important;
}

body.is-report-preview.report-print-products .product-list-table th:last-child,
body.is-report-preview.report-print-products .product-list-table td:last-child,
body.is-report-preview.report-print-clients .client-list-table th:last-child,
body.is-report-preview.report-print-clients .client-list-table td:last-child,
body.is-report-preview.report-print-cash .cash-history-report table th:last-child,
body.is-report-preview.report-print-cash .cash-history-report table td:last-child {
    display: none !important;
}

body.is-report-preview.report-print-products .product-list-avatar,
body.is-report-preview.report-print-clients .client-list-avatar {
    display: none !important;
}

body.is-report-preview.report-print-cash main > :not(.app-report-print-head):not(.app-page-header):not(.cash-history-report):not(.app-report-print-foot) {
    display: none !important;
}

body.is-report-preview.report-print-cash .cash-history-report > .app-panel-header {
    display: none !important;
}

@media (max-width: 767.98px) {
    body.is-report-preview main.app-main {
        width: calc(100% - 12px);
        margin: 6px auto;
        padding: 18px 14px !important;
    }

    body.is-report-preview main > .app-page-header {
        top: 8px;
        right: 8px;
    }
}

/* Détail d'une vente : hiérarchie simple pour le travail au comptoir. */
.sale-detail-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.sale-detail-back {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: var(--app-primary-dark);
    font-weight: 800;
    text-decoration: none;
}

.sale-detail-back:hover,
.sale-detail-back:focus-visible {
    color: var(--app-primary);
    text-decoration: underline;
}

.sale-detail-toolbar .btn,
.sale-detail-primary-actions .btn,
.sale-detail-info-footer .btn,
.sale-detail-document-row .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
}

.sale-detail-hero {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: 1.15rem;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid var(--app-border);
    border-radius: 12px;
    box-shadow: var(--app-shadow-soft);
}

.sale-detail-identity {
    display: flex;
    min-width: 0;
    align-items: flex-start;
    gap: 0.9rem;
    padding: 0.25rem;
}

.sale-detail-identity > div {
    min-width: 0;
}

.sale-detail-eyebrow,
.sale-detail-action-title,
.sale-detail-total > span,
.sale-detail-summary-item > span {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.sale-detail-identity h1 {
    margin: 0.15rem 0 0.35rem;
    color: var(--app-ink);
    font-size: clamp(1.55rem, 2.2vw, 2rem);
    font-weight: 900;
    line-height: 1.1;
}

.sale-detail-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.75rem;
    color: var(--app-muted);
    font-size: 0.88rem;
}

.sale-detail-meta strong {
    color: var(--app-text);
}

.sale-detail-statuses {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.75rem;
}

.sale-detail-status {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0.2rem 0.65rem;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 900;
}

.sale-detail-status.is-success {
    color: #176247;
    background: #e7f5ef;
    border-color: #bfe3d5;
}

.sale-detail-status.is-warning {
    color: #81500e;
    background: #fff2dd;
    border-color: #efd19d;
}

.sale-detail-status.is-danger {
    color: #982f28;
    background: #fff0ee;
    border-color: #efc0bb;
}

.sale-detail-status.is-neutral {
    color: #59615d;
    background: #f2f3f1;
    border-color: #d8dcd8;
}

.sale-detail-action-box {
    min-width: 0;
    padding: 0.9rem;
    background: #f4f9f8;
    border: 1px solid #cfe2df;
    border-radius: 10px;
}

.sale-detail-bottom-actions {
    margin: 1rem 0 1.25rem;
}

.sale-detail-primary-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
    margin-top: 0.55rem;
}

.sale-detail-primary-actions form,
.sale-detail-primary-actions form .btn,
.sale-detail-primary-actions > .btn {
    width: 100%;
    min-width: 0;
}

.sale-detail-primary-actions > :last-child:nth-child(odd) {
    grid-column: 1 / -1;
}

.sale-detail-primary-actions .btn {
    min-height: 48px;
    padding-right: 0.7rem;
    padding-left: 0.7rem;
    font-size: 0.91rem;
    white-space: normal;
}

.sale-detail-print-action {
    box-shadow: 0 8px 18px rgba(12, 116, 118, 0.18);
}

.sale-detail-action-help {
    margin: 0.7rem 0 0;
    color: var(--app-muted);
    font-size: 0.78rem;
    line-height: 1.35;
}

.sale-detail-summary {
    display: grid;
    grid-template-columns: minmax(240px, 1.25fr) repeat(3, minmax(0, 1fr));
    margin-bottom: 1rem;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid var(--app-border);
    border-radius: 10px;
}

.sale-detail-total,
.sale-detail-summary-item {
    display: flex;
    min-width: 0;
    min-height: 112px;
    padding: 1rem 1.1rem;
    flex-direction: column;
    justify-content: center;
}

.sale-detail-total {
    background: linear-gradient(135deg, #0a6567, #0c7c7d);
}

.sale-detail-total > span,
.sale-detail-total small {
    color: rgba(255, 255, 255, 0.78);
}

.sale-detail-total strong {
    margin: 0.25rem 0 0.15rem;
    color: #fff;
    font-size: clamp(1.65rem, 2.5vw, 2.15rem);
    font-weight: 900;
    line-height: 1;
}

.sale-detail-total small,
.sale-detail-summary-item small {
    font-size: 0.78rem;
}

.sale-detail-summary-item {
    border-left: 1px solid var(--app-border);
}

.sale-detail-summary-item strong {
    margin: 0.25rem 0 0.18rem;
    color: var(--app-ink);
    font-size: 1.25rem;
    font-weight: 900;
}

.sale-detail-summary-item strong.is-success {
    color: var(--app-success);
}

.sale-detail-summary-item strong.is-warning {
    color: var(--app-warning);
}

.sale-detail-summary-item strong.is-danger {
    color: var(--app-danger);
}

.sale-detail-summary-item strong.is-neutral,
.sale-detail-summary-item small {
    color: var(--app-muted);
}

.sale-detail-lines-panel .app-panel-header {
    background: #fbfaf7;
}

.sale-detail-lines-panel tbody td {
    padding-top: 0.9rem;
    padding-bottom: 0.9rem;
}

.sale-detail-information-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(310px, 0.75fr);
    gap: 1rem;
}

.sale-detail-information-grid > .app-panel {
    min-width: 0;
}

.sale-detail-panel-total {
    color: var(--app-primary-dark);
    font-size: 1.15rem;
}

.sale-detail-data-list {
    margin: 0;
    padding: 0.65rem 1rem;
}

.sale-detail-data-list > div {
    display: grid;
    grid-template-columns: minmax(105px, 0.85fr) minmax(0, 1.15fr);
    gap: 0.75rem;
    padding: 0.45rem 0;
    border-bottom: 1px solid #ece8df;
}

.sale-detail-data-list > div:last-child {
    border-bottom: 0;
}

.sale-detail-data-list dt {
    color: var(--app-muted);
    font-size: 0.82rem;
    font-weight: 700;
}

.sale-detail-data-list dd {
    min-width: 0;
    margin: 0;
    color: var(--app-text);
    font-size: 0.86rem;
    font-weight: 750;
    overflow-wrap: anywhere;
}

.sale-detail-info-footer {
    padding: 0 1rem 1rem;
}

.sale-detail-exchange-values {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    padding: 1rem;
}

.sale-detail-exchange-values > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.8rem;
    background: #fff8e8;
    border: 1px solid #edd7aa;
    border-radius: 8px;
}

.sale-detail-document-list {
    display: grid;
    gap: 0.65rem;
    padding: 1rem;
}

.sale-detail-document-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.7rem 0.8rem;
    background: #f8faf9;
    border: 1px solid #e2e8e5;
    border-radius: 8px;
}

.sale-detail-document-row > div {
    display: flex;
    flex-direction: column;
}

.sale-detail-document-row span {
    color: var(--app-muted);
    font-size: 0.78rem;
}

@media (max-width: 1199.98px) {
    .sale-detail-hero {
        grid-template-columns: 1fr;
    }

    .sale-detail-information-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .sale-detail-toolbar {
        align-items: stretch;
    }

    .sale-detail-toolbar .btn {
        min-height: 42px;
    }

    .sale-detail-hero {
        padding: 0.85rem;
    }

    .sale-detail-identity {
        gap: 0.7rem;
    }

    .sale-detail-primary-actions {
        grid-template-columns: 1fr;
    }

    .sale-detail-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sale-detail-total {
        grid-column: 1 / -1;
    }

    .sale-detail-summary-item {
        min-height: 98px;
        border-top: 1px solid var(--app-border);
        border-left: 0;
    }

    .sale-detail-summary-item:nth-child(even) {
        border-right: 1px solid var(--app-border);
    }

    .sale-detail-exchange-values {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 479.98px) {
    .sale-detail-toolbar {
        flex-direction: column;
    }

    .sale-detail-summary {
        grid-template-columns: 1fr;
    }

    .sale-detail-total {
        grid-column: auto;
    }

    .sale-detail-summary-item,
    .sale-detail-summary-item:nth-child(even) {
        border-right: 0;
    }

    .sale-detail-data-list > div {
        grid-template-columns: 1fr;
        gap: 0.15rem;
    }

    .sale-detail-document-row {
        align-items: stretch;
        flex-direction: column;
    }
}

@media print {
    body.has-printable-report {
        color: #171a18;
        background: #fff !important;
        font-size: 9pt;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }

    body.has-printable-report .app-navbar,
    body.has-printable-report .app-bottomnav,
    body.has-printable-report .app-operational-banner,
    body.has-printable-report > .app-footer,
    body.has-printable-report main > .app-page-header,
    body.has-printable-report main > .alert,
    body.has-printable-report .app-toolbar,
    body.has-printable-report .activity-filters,
    body.has-printable-report .activity-quicknav,
    body.has-printable-report .product-list-filters,
    body.has-printable-report .client-list-filters,
    body.has-printable-report .product-list-mobile,
    body.has-printable-report .client-list-mobile,
    body.has-printable-report .pagination,
    body.has-printable-report .modal,
    body.has-printable-report .activity-record-actions,
    body.has-printable-report button,
    body.has-printable-report form {
        display: none !important;
    }

    body.has-printable-report main.app-main {
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0 !important;
    }

    body.has-printable-report .app-report-print-head {
        display: block;
        margin-bottom: 6mm;
        padding-bottom: 3mm;
        border-bottom: 1.5pt solid #1f4541;
        text-align: center;
    }

    body.has-printable-report .app-report-print-head strong {
        display: block;
        margin-bottom: 1mm;
        font-size: 9pt;
        letter-spacing: 0.06em;
        text-transform: uppercase;
    }

    body.has-printable-report .app-report-print-head h1 {
        margin: 0;
        font-size: 17pt;
        font-weight: 800;
    }

    body.has-printable-report .app-report-print-head p {
        margin: 1.5mm 0 0;
        color: #434946;
        font-size: 9pt;
    }

    body.has-printable-report .app-report-print-head span {
        display: block;
        margin-top: 1mm;
        color: #69706c;
        font-size: 7.5pt;
    }

    body.has-printable-report .app-report-print-foot {
        display: flex;
        margin-top: 5mm;
        padding-top: 2mm;
        justify-content: space-between;
        color: #666;
        border-top: 0.5pt solid #bbb;
        font-size: 7pt;
    }

    body.has-printable-report .app-panel,
    body.has-printable-report .metric-card {
        background: #fff !important;
        border-color: #c8cdca !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    body.has-printable-report .metric-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 2.5mm !important;
        margin-bottom: 4mm !important;
    }

    body.has-printable-report .metric-card {
        min-height: 0 !important;
        padding: 3mm !important;
        break-inside: avoid;
    }

    body.has-printable-report .metric-value {
        font-size: 13pt !important;
    }

    body.has-printable-report .table-responsive {
        overflow: visible !important;
    }

    body.has-printable-report table {
        width: 100% !important;
        margin-bottom: 0 !important;
        font-size: 7.5pt;
    }

    body.has-printable-report thead {
        display: table-header-group;
    }

    body.has-printable-report tr {
        break-inside: avoid;
    }

    body.has-printable-report th,
    body.has-printable-report td {
        padding: 1.4mm 1.2mm !important;
        color: #171a18 !important;
        border-color: #d5d8d6 !important;
    }

    body.has-printable-report thead th,
    body.has-printable-report tfoot th {
        background: #edf2f0 !important;
        font-size: 7pt;
    }

    body.has-printable-report a {
        color: #171a18 !important;
        text-decoration: none !important;
    }

    body.report-print-products .product-list-metrics,
    body.report-print-clients .client-list-metrics,
    body.report-print-clients .client-list-overview {
        display: none !important;
    }

    body.report-print-products .product-list-table-wrap,
    body.report-print-clients .client-list-print-table-wrap {
        display: block !important;
    }

    body.report-print-clients .client-list-table-wrap {
        display: none !important;
    }

    body.report-print-products .product-list-panel,
    body.report-print-clients .client-list-panel {
        overflow: visible !important;
    }

    body.report-print-products .product-list-table,
    body.report-print-clients .client-list-print-table {
        min-width: 0 !important;
        table-layout: fixed;
    }

    body.report-print-clients .client-list-print-table td {
        overflow-wrap: anywhere;
    }

    body.report-print-clients .client-list-balance {
        white-space: nowrap;
    }

    body.report-print-clients .client-list-print-total {
        display: table-footer-group;
    }

    body.report-print-products .product-list-panel > .app-panel-header,
    body.report-print-products .product-list-footer,
    body.report-print-clients .client-list-panel > .app-panel-header,
    body.report-print-clients .client-list-footer {
        display: none !important;
    }

    body.report-print-products .product-list-table th:last-child,
    body.report-print-products .product-list-table td:last-child,
    body.report-print-clients .client-list-table th:last-child,
    body.report-print-clients .client-list-table td:last-child,
    body.report-print-suppliers table th:last-child,
    body.report-print-suppliers table td:last-child,
    body.report-print-cash .cash-history-report table th:last-child,
    body.report-print-cash .cash-history-report table td:last-child {
        display: none !important;
    }

    body.report-print-products .product-list-avatar,
    body.report-print-clients .client-list-avatar {
        display: none !important;
    }

    body.report-print-cash main > :not(.app-report-print-head):not(.cash-history-report):not(.app-report-print-foot) {
        display: none !important;
    }

    body.report-print-cash .cash-history-report > .app-panel-header {
        display: none !important;
    }

    body.report-print-activity #timeline {
        display: none !important;
    }

    body.report-print-activity details {
        break-inside: auto;
    }

    body.report-print-activity details:not([open]) > :not(summary) {
        display: block !important;
    }

    body.report-print-activity .activity-record,
    body.report-print-activity .activity-section {
        margin-bottom: 3mm !important;
    }

    body.report-print-activity .activity-record-body {
        padding: 2.5mm !important;
    }

    body.report-print-statistics .app-panel,
    body.report-print-payments .app-panel,
    body.report-print-suppliers .app-panel,
    body.report-print-cash .cash-history-report {
        break-inside: auto;
    }
}
.payment-cancel-trigger {
    white-space: nowrap;
}

.payment-cancel-trace {
    max-width: 18rem;
    margin-top: .35rem;
    color: var(--bs-secondary-color);
    font-size: .75rem;
    line-height: 1.35;
}

.payment-cancel-modal .modal-content {
    overflow: hidden;
    border: 0;
    border-radius: 1rem;
    box-shadow: 0 1.5rem 4rem rgba(17, 24, 39, .24);
}

.payment-cancel-modal .modal-header {
    align-items: flex-start;
    padding: 1.25rem 1.35rem 1rem;
    background: linear-gradient(135deg, #fff7ed, #fff);
    border-bottom-color: #fed7aa;
}

.payment-cancel-eyebrow {
    display: block;
    margin-bottom: .2rem;
    color: #b45309;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.payment-cancel-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .2rem 1rem;
    padding: .9rem 1rem;
    margin-bottom: 1rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: .8rem;
}

.payment-cancel-summary strong,
.payment-cancel-summary span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.payment-cancel-summary strong {
    color: #0f172a;
}

.payment-cancel-summary span {
    grid-column: 1;
    color: #64748b;
    font-size: .85rem;
}

.payment-cancel-summary b {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    color: #b91c1c;
    font-size: 1.05rem;
}

.payment-cancel-explanation {
    padding-left: .8rem;
    color: #475569;
    border-left: 3px solid #f59e0b;
    font-size: .9rem;
}

.payment-cancel-confirmation {
    padding: .85rem .85rem .85rem 2.35rem;
    margin-top: 1rem;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: .7rem;
}

@media (max-width: 767.98px) {
    .supplier-payment-mobile-card .payment-cancel-trigger {
        width: 100%;
        margin-top: .75rem;
    }
}

/* Journal des paiements clients */
.client-payment-journal-shortcuts { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .75rem; }
.client-payment-journal-shortcuts a { padding: .4rem .75rem; border: 1px solid var(--bs-border-color); border-radius: 999px; background: var(--bs-body-bg); color: var(--bs-body-color); font-size: .84rem; font-weight: 700; text-decoration: none; }
.client-payment-journal-shortcuts a:hover,
.client-payment-journal-shortcuts a.is-active { border-color: var(--app-primary, #0f7c7b); background: #edf8f7; color: var(--app-primary, #0f7c7b); }
.client-payment-journal-filters { display: grid; grid-template-columns: repeat(2, minmax(140px, .75fr)) repeat(3, minmax(150px, .9fr)) minmax(230px, 1.35fr) auto; gap: .65rem; align-items: end; }
.client-payment-journal-search { min-width: 0; }
.client-payment-journal-filter-actions { display: flex; gap: .45rem; }
.client-payment-journal-metrics { margin-top: 1rem; }
.client-payment-journal-total-card { border-top: 3px solid var(--app-primary, #0f7c7b); }
.client-payment-journal-panel { overflow: hidden; }
.client-payment-journal-panel-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .9rem 1rem; border-bottom: 1px solid var(--bs-border-color); }
.client-payment-journal-panel-header > strong { font-size: 1.05rem; white-space: nowrap; }
.client-payment-journal-table th { white-space: nowrap; }
.client-payment-journal-table td { vertical-align: top; }
.client-payment-journal-receipt,
.client-payment-journal-status { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; }
.client-payment-journal-documents { display: flex; flex-wrap: wrap; gap: .3rem; }
.client-payment-journal-documents a,
.client-payment-journal-allocation { display: inline-flex; padding: .24rem .5rem; border-radius: .45rem; background: #edf8f7; color: var(--app-primary, #0f7c7b); font-size: .78rem; font-weight: 800; text-decoration: none; }
.client-payment-journal-documents a:hover { text-decoration: underline; }
.client-payment-journal-muted { opacity: .68; background: var(--bs-tertiary-bg); }
.client-payment-journal-cancelled-amount { text-decoration-thickness: 2px !important; text-decoration-color: #b91c1c !important; }
.client-payment-journal-pagination { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .75rem; padding: .85rem 1rem; border-top: 1px solid var(--bs-border-color); }

@media (max-width: 1199.98px) {
    .client-payment-journal-filters { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
    .client-payment-journal-search { grid-column: span 2; }
}

@media (max-width: 767.98px) {
    .client-payment-journal-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .client-payment-journal-search,
    .client-payment-journal-filter-actions { grid-column: 1 / -1; }
    .client-payment-journal-filter-actions .btn { flex: 1; }
    .client-payment-journal-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .client-payment-journal-panel-header { align-items: flex-start; }
}

@media (max-width: 479.98px) {
    .client-payment-journal-metrics { grid-template-columns: 1fr; }
}