/* ===== TABS STYLING ===== */
.processing-tabs-container {
    display: flex;
    width: 100%;
    background: var(--bs-gray-100, #f8f9fa);
    border-radius: 0.75rem;
    padding: 4px;
    gap: 4px;
    border: 1px solid var(--bs-gray-200, #e9ecef);
}

.processing-tab {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.625rem 1rem;
    border: 1px solid var(--bs-gray-300, #dee2e6);
    background: #fff;
    border-radius: 0.625rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--bs-gray-700, #495057);
    transition: all 0.2s ease;
    cursor: pointer;
    gap: 0.5rem;
}

.processing-tab:hover:not(.active) {
    background: var(--bs-gray-50, #f9fafb);
    border-color: var(--bs-gray-400, #ced4da);
    color: var(--bs-gray-900, #212529);
}

.processing-tab.active {
    background: #fff;
    color: #8e44ad;
    border-color: #8e44ad;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.processing-tab i {
    font-size: 1.125rem;
}

.processing-tab .tab-label {
    display: none;
}

.processing-tab .tab-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    font-size: 0.75rem;
    font-weight: 600;
    background: var(--bs-gray-200, #e9ecef);
    border-radius: 6px;
    color: var(--bs-gray-700, #495057);
}

.processing-tab.active .tab-count {
    background: #8e44ad;
    color: #fff;
}

/* ===== PAGE CARD ===== */
.processing-page-card {
    max-width: 100%;
    min-width: 0;
}

.processing-page-card .card-body {
    max-width: 100%;
    min-width: 0;
}

/* ===== TABLE STYLING ===== */
.processing-table-wrapper {
    width: 100%;
    max-width: 100%;
    border-radius: 0.5rem;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
}

.processing-table {
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    min-width: 58rem;
    table-layout: fixed;
}

.processing-table thead th {
    background: var(--bs-gray-50, #f9fafb);
    border-bottom: 1px solid var(--bs-gray-200, #e9ecef);
    padding: 0.75rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--bs-gray-600, #6c757d);
    white-space: nowrap;
}

.processing-table tbody tr {
    transition: background-color 0.15s ease;
}

.processing-table tbody tr:hover {
    background-color: var(--bs-gray-50, #f9fafb);
}

.processing-table tbody tr.table-active {
    background-color: rgba(142, 68, 173, 0.05);
}

.processing-table tbody td {
    padding: 0.75rem;
    vertical-align: middle;
    border-bottom: 1px solid var(--bs-gray-100, #f1f3f5);
}

.processing-table .col-checkbox {
    width: 40px;
    text-align: center;
}

.processing-table .col-name {
    width: 22%;
    min-width: 0;
}

.processing-table .col-company {
    width: 16%;
    min-width: 0;
}

.processing-table .col-doc-date {
    width: 11%;
    white-space: nowrap;
    font-size: 0.8125rem;
}

.processing-table .col-updated {
    width: 9%;
    white-space: nowrap;
    font-size: 0.8125rem;
}

.processing-table .col-total {
    width: 10%;
    white-space: nowrap;
}

.processing-table .col-source {
    width: 9%;
    white-space: nowrap;
}

.processing-table .col-status {
    width: 13%;
    white-space: nowrap;
}

.processing-table .col-actions {
    width: 12rem;
    min-width: 12rem;
    text-align: right;
    overflow: visible;
}

.processing-table thead th:not(.col-actions),
.processing-table tbody td:not(.col-actions) {
    overflow: hidden;
}

.processing-table thead th.col-actions,
.processing-table tbody td.col-actions {
    overflow: visible;
    position: relative;
}

.processing-table .processing-row-actions,
.processing-table .dropstart {
    position: static;
}

.doc-info {
    min-width: 0;
    flex: 1;
}

.doc-name {
    max-width: 100%;
    font-size: 0.875rem;
}

.doc-icon {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bs-gray-100, #f8f9fa);
    border-radius: 6px;
}

/* ===== STATUS BADGES ===== */
.status-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.625rem;
    font-size: 0.75rem;
    font-weight: 500;
    border-radius: 4px;
    color: #fff !important;
}

/* Ensure status badges in processing page have white text (not source badges) */
.processing-table .status-badge,
.processing-table .badge:not(.document-source-badge),
.processing-table-wrapper ~ .d-md-none .badge:not(.document-source-badge) {
    color: #fff !important;
}

/* ===== ACTION BUTTONS ===== */
.action-buttons {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 4px;
    max-width: 100%;
}

.action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border: none;
    background: transparent;
    border-radius: 6px;
    color: var(--bs-gray-600, #6c757d);
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.15s ease;
    text-decoration: none;
}

.action-btn:hover {
    background: var(--bs-gray-100, #f1f3f5);
    color: var(--bs-gray-800, #343a40);
}

.action-btn-primary {
    color: #8e44ad;
}

.action-btn-primary:hover {
    background: rgba(142, 68, 173, 0.1);
    color: #8e44ad;
}

.action-btn-warning {
    color: var(--bs-warning, #ffc107);
}

.action-btn-warning:hover {
    background: rgba(var(--bs-warning-rgb), 0.15);
    color: #cc9a06;
}

.action-btn-success {
    color: var(--bs-success, #198754);
}

.action-btn-success:hover {
    background: rgba(25, 135, 84, 0.12);
    color: var(--bs-success, #198754);
}

.action-btn-more {
    color: var(--bs-gray-500, #adb5bd);
}

.action-btn-more:hover {
    background: var(--bs-gray-100, #f1f3f5);
    color: var(--bs-gray-700, #495057);
}

.action-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ===== DROPDOWN MENU ===== */
.processing-page-card .dropdown-menu,
.processing-table-wrapper .dropdown-menu,
.invoice-mailbox-card .dropdown-menu,
.dropdown-menu.processing-dropdown-menu--portal {
    min-width: 12.5rem;
    padding: 0.5rem;
    border: 1px solid var(--bs-gray-200, #e9ecef);
    border-radius: 0.5rem;
    z-index: 2600 !important;
    box-shadow: 0 0.5rem 1rem rgba(15, 23, 42, 0.12);
}

.processing-table-wrapper .dropdown-item {
    padding: 0.5rem 0.75rem;
    border-radius: 0.375rem;
    font-size: 0.875rem;
}

.processing-table-wrapper .dropdown-item:hover {
    background: var(--bs-gray-100, #f8f9fa);
}
.processing-table tbody tr.table-success td {
    background-color: rgba(25, 135, 84, 0.08) !important; /* soft green */
}

.processing-table tbody tr.table-warning td {
    background-color: rgba(255, 140, 0, 0.08) !important;
}

.processing-table tbody tr.table-danger td {
    background-color: rgba(220, 53, 69, 0.08) !important; /* soft red */
}
.processing-table tbody tr.table-success:hover td {
    background-color: rgba(25, 135, 84, 0.12) !important;
}

.processing-table tbody tr.table-warning:hover td {
    background-color: rgba(255, 193, 7, 0.14) !important;
}

.processing-table tbody tr.table-danger:hover td {
    background-color: rgba(220, 53, 69, 0.12) !important;
}
/* ===== RESPONSIVE ===== */
/* ===== MOBILE DROPDOWN STYLING ===== */
.d-md-none .dropdown-menu {
    min-width: 200px;
    padding: 0.5rem;
    border: 1px solid var(--bs-gray-200, #e9ecef);
    border-radius: 0.5rem;
    z-index: 1100;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.d-md-none .dropdown-item {
    padding: 0.5rem 0.75rem;
    border-radius: 0.375rem;
    font-size: 0.875rem;
}

.d-md-none .dropdown-item:hover {
    background: var(--bs-gray-100, #f8f9fa);
}

.d-md-none .dropdown-toggle::after {
    display: none;
}

@media (min-width: 576px) {
    .processing-tab .tab-label {
        display: inline;
    }
}

@media (min-width: 768px) {
    .processing-table-wrapper {
        overflow-y: visible;
        overflow-x: auto;
    }
}

@media (min-width: 992px) {
    .processing-tab {
        padding: 0.75rem 1.25rem;
    }
}

/* ===== INVOICE MAILBOX (Vente / Achat) ===== */
.accounting-shell .accounting-main-content:has(.invoice-mailbox-card) {
    background-color: #f3f4f7 !important;
}

.invoice-mailbox-card {
    border: 1px solid #e9ecef;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
    overflow: visible;
    background: #fff;
}

.invoice-mailbox-card > .card-header {
    background: #fff;
    border-bottom: 1px solid #e9ecef;
    padding: 1.5rem 1.5rem;
}

.invoice-mailbox-table-wrap {
    overflow: auto !important;
}

.invoice-mailbox-table {
    margin-bottom: 0;
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
    --bs-table-bg: #fff;
    --bs-table-hover-bg: #fff;
    --bs-table-border-color: #eeeeee;
}

.invoice-mailbox-table > :not(caption) > * > * {
    padding: 4px 15px !important;
    box-shadow: none !important;
}

.invoice-mailbox-table thead th {
    background-color: #f8f9fa !important;
    color: #212529;
    font-size: 0.875rem;
    font-weight: 600;
    border-top: none;
    border-bottom: 1px solid #e9ecef !important;
    border-left: none;
    border-right: none;
    vertical-align: middle;
    white-space: nowrap;
    position: sticky;
    top: 0;
    z-index: 2;
}

.invoice-mailbox-table tbody td {
    font-size: 0.875rem;
    color: #212529;
    border-top: none;
    border-bottom: 1px solid #eeeeee !important;
    border-left: none;
    border-right: none;
    vertical-align: middle;
    background: #fff !important;
}

.invoice-mailbox-table tbody tr:hover td {
    background: #fff !important;
}

.invoice-mailbox-table tbody tr:last-child td {
    border-bottom: none !important;
}

.invoice-mailbox-table .col-total,
.invoice-mailbox-table thead th.col-total {
    text-align: right;
}

.invoice-mailbox-table .col-pages,
.invoice-mailbox-table thead th.col-pages {
    text-align: center;
}

.invoice-mailbox-table .col-source,
.invoice-mailbox-table .col-payment,
.invoice-mailbox-table .col-type,
.invoice-mailbox-table thead th.col-source,
.invoice-mailbox-table thead th.col-payment,
.invoice-mailbox-table thead th.col-type {
    text-align: center;
}

.invoice-mailbox-table thead th.col-actions,
.invoice-mailbox-table tbody td.col-actions {
    overflow: visible;
    text-align: right;
    white-space: nowrap;
    width: 1%;
}

/* thead th.col-actions a plus de spécificité que .invoice-mailbox-table thead th (2 classes contre
   1) : son position:relative — nécessaire seulement pour ancrer le menu ⋯ des cellules du corps —
   écrasait silencieusement le position:sticky posé sur tous les autres en-têtes. Résultat : la
   colonne Actions seule défilait au scroll pendant que le reste de la ligne d'en-tête restait fixe. */
.invoice-mailbox-table thead th.col-actions {
    position: sticky;
    top: 0;
    z-index: 2;
}

.invoice-mailbox-table tbody td.col-actions {
    position: relative;
}

.invoice-mailbox-footer {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    padding: 0.5rem 1.5rem;
    border-top: 1px solid #eeeeee;
    background: #fff;
    position: relative;
    /* Au-dessus de .table-responsive (z-index:10 dans AccountingLayout) pour que le menu
       Actions groupées ne passe pas sous le tableau. */
    z-index: 20;
    overflow: visible;
}

.invoice-mailbox-mobile {
    padding: 1.5rem;
}

.invoice-mailbox-header-btn {
    border-radius: 6px;
    font-weight: 500;
    padding: 0.4rem 0.85rem;
    gap: 0.35rem;
    min-width: 7.5rem;
    justify-content: center;
}

.invoice-mailbox-header-btn i {
    font-size: 1.125rem;
    line-height: 1;
}

/* Boutons d'action par ligne — standard app-wide (référence : boîte aux lettres).
   Une nuance distincte par action ; taille/icône figées pour homogénéité partout. */
.mbx-act {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 2rem !important;
    height: 2rem !important;
    min-width: 2rem !important;
    padding: 0 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 0.375rem;
    font-size: 1rem;
    line-height: 1;
    box-shadow: none;
}
.mbx-act i,
.mbx-act .bx,
.mbx-act .bxs {
    font-size: 1rem !important;
    line-height: 1;
    color: inherit;
}
.mbx-act:hover, .mbx-act:focus, .mbx-act:active {
    color: #fff !important;
}
.mbx-act:disabled,
.mbx-act.disabled {
    opacity: 0.35;
    cursor: not-allowed;
    pointer-events: none;
}

/* Wrapper : reçoit le survol / title quand le bouton interne est disabled. */
.mbx-act-wrap {
    display: inline-flex;
    line-height: 0;
}

/* Bloqué mais lisible : garde la couleur d'action, atténue sans devenir « transparent ». */
.mbx-act.mbx-act--blocked:disabled,
.mbx-act.workflow-act.mbx-act--blocked:disabled {
    opacity: 0.72;
    filter: grayscale(0.25);
}
.mbx-act--pay      { background-color: #0d9488; }  /* teal   — paiement */
.mbx-act--pay:hover{ background-color: #0f766e; }
.mbx-act--view     { background-color: #2563eb; }  /* bleu   — aperçu */
.mbx-act--view:hover{ background-color: #1d4ed8; }
.mbx-act--download { background-color: #16a34a; }  /* vert   — télécharger */
.mbx-act--download:hover{ background-color: #15803d; }
.mbx-act--edit     { background-color: #6366f1; }  /* indigo — modifier */
.mbx-act--edit:hover{ background-color: #4f46e5; }
.mbx-act--delete   { background-color: #dc2626; }  /* rouge  — supprimer */
.mbx-act--delete:hover{ background-color: #b91c1c; }
.mbx-act--split    { background-color: #ea580c; }  /* orange — diviser */
.mbx-act--split:hover{ background-color: #c2410c; }
.mbx-act--process  { background-color: #9333ea; }  /* violet — extraction IA / retry */
.mbx-act--process:hover{ background-color: #7e22ce; }
.mbx-act--send     { background-color: #d97706; }  /* ambre  — envoyer */
.mbx-act--send:hover{ background-color: #b45309; }
.mbx-act--restore  { background-color: #0891b2; }  /* cyan   — restaurer */
.mbx-act--restore:hover{ background-color: #0e7490; }
.mbx-act--validate { background-color: #059669; }  /* émeraude — valider */
.mbx-act--validate:hover{ background-color: #047857; }
.mbx-act--post     { background-color: #0284c7; }  /* ciel   — comptabiliser */
.mbx-act--post:hover{ background-color: #0369a1; }
.mbx-act--more     { background-color: #64748b; }  /* ardoise — menu … */
.mbx-act--more:hover{ background-color: #475569; }

.invoice-mailbox-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 5.5rem;
    padding: 0.28rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.2;
    border-radius: 999px;
    color: #fff !important;
    white-space: nowrap;
}

.invoice-mailbox-source-badge--manual {
    background: #12b5b0;
}

.invoice-mailbox-source-badge--email {
    background: #845adf;
}

.invoice-mailbox-source-badge--api {
    background: #e6832f;
}

.invoice-mailbox-source-badge--peppol {
    background: #49b6f5;
}

.invoice-mailbox-source-badge--import {
    background: #6c757d;
}

.invoice-mailbox-pay-badge--paid {
    background: #26bf94;
}

.invoice-mailbox-pay-badge--unpaid {
    background: #e6533c;
}

.invoice-mailbox-pay-badge--partial {
    background: #f5a623;
}

.invoice-bulk-btn {
    border-radius: 6px;
    font-weight: 500;
    padding: 0.4rem 0.9rem;
}

.invoice-bulk-btn.btn-outline-primary {
    color: #845adf;
    border-color: #845adf;
}

.invoice-bulk-btn.btn-outline-primary:hover:not(:disabled),
.invoice-bulk-btn.btn-outline-primary:focus:not(:disabled) {
    background: rgba(132, 90, 223, 0.08);
    color: #845adf;
    border-color: #845adf;
}

.invoice-bulk-btn.btn-outline-danger {
    color: #e6533c;
    border-color: #e6533c;
}

.invoice-bulk-btn.btn-outline-danger:hover:not(:disabled),
.invoice-bulk-btn.btn-outline-danger:focus:not(:disabled) {
    background: rgba(230, 83, 60, 0.08);
    color: #e6533c;
    border-color: #e6533c;
}

/* ===== MISCELLANEOUS type badges (same pill style as invoice mailbox) ===== */
.misc-mailbox-type-badge {
    min-width: 4.75rem;
}

.misc-mailbox-type-badge--bilan {
    background: #845adf;
}

.misc-mailbox-type-badge--note {
    background: #49b6f5;
}

.misc-mailbox-type-badge--scan {
    background: #6c757d;
}

.misc-mailbox-type-badge--annexe {
    background: #26bf94;
}

.misc-mailbox-type-badge--releve {
    background: #f5a623;
}

.misc-mailbox-type-badge--contrat {
    background: #e6533c;
}

.misc-mailbox-mobile {
    padding: 1.5rem;
}

/* ===== PROCESSING VALIDATION (En traitement) ===== */
.processing-validation-card {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 0.5rem;
    overflow: visible;
}

.processing-validation-header {
    background: #fff !important;
    border-bottom: 1px solid #e9ecef !important;
    padding: 1.25rem 1.5rem !important;
}

.processing-validation-header .card-title {
    gap: 0;
}

.processing-validation-accent {
    display: inline-block;
    width: 4px;
    height: 1.35rem;
    background: #00c853;
    border-radius: 2px;
    margin-right: 0.65rem;
    flex-shrink: 0;
}

.processing-validation-status {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
    color: #6c757d;
    white-space: nowrap;
}

.processing-validation-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #f5a623;
    flex-shrink: 0;
}

.processing-validation-header-actions {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.5rem;
}

.processing-validation-header-buttons {
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.5rem;
}

.processing-validation-header-buttons .btn {
    white-space: nowrap;
}

.processing-validation-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    padding: 0 1.5rem;
    border-bottom: 1px solid #e9ecef;
    background: #fff;
}

.processing-validation-tab {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 1.25rem;
    border: none;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: #6c757d;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    margin-bottom: -1px;
    transition: color 0.15s ease, border-color 0.15s ease;
}

.processing-validation-tab:hover:not(.active) {
    color: #495057;
}

.processing-validation-tab.active {
    color: #2979ff;
    border-bottom-color: #2979ff;
}

.processing-validation-tab .tab-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.35rem;
    height: 1.35rem;
    padding: 0 0.35rem;
    border-radius: 999px;
    font-size: 0.6875rem;
    font-weight: 600;
    background: #e9ecef;
    color: #6c757d;
}

.processing-validation-tab.active .tab-count {
    background: #2979ff;
    color: #fff;
}

.invoice-mailbox-unpaid-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
    background: #f8f9fa;
}

.invoice-mailbox-unpaid-filter {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.75rem;
    border: 1px solid #dee2e6;
    border-radius: 999px;
    background: #fff;
    color: #6c757d;
    font-size: 0.8125rem;
    font-weight: 500;
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
}

.invoice-mailbox-unpaid-filter:hover:not(.active) {
    color: #495057;
    border-color: #ced4da;
}

.invoice-mailbox-unpaid-filter.active {
    color: #2979ff;
    border-color: #2979ff;
    background: #eef4ff;
}

.invoice-mailbox-unpaid-filter .tab-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.2rem;
    height: 1.2rem;
    padding: 0 0.3rem;
    border-radius: 999px;
    font-size: 0.6875rem;
    font-weight: 600;
    background: #e9ecef;
    color: #6c757d;
}

.invoice-mailbox-unpaid-filter.active .tab-count {
    background: #2979ff;
    color: #fff;
}

.processing-validation-table-wrap {
    overflow: visible !important;
}

.processing-validation-table {
    margin-bottom: 0;
    width: 100%;
    min-width: 0;
    border-collapse: collapse;
    --bs-table-bg: #fff;
    --bs-table-hover-bg: #fff;
    --bs-table-border-color: #eeeeee;
}

.processing-validation-table--compact > :not(caption) > * > * {
    padding: 0.45rem 0.55rem !important;
    box-shadow: none !important;
}

.processing-validation-table > :not(caption) > * > * {
    padding: 0.45rem 0.55rem !important;
    box-shadow: none !important;
}

.processing-validation-table thead th {
    background-color: #f8f9fa !important;
    color: #495057;
    font-size: 0.75rem;
    font-weight: 600;
    border-top: none;
    border-bottom: 1px solid #e9ecef !important;
    vertical-align: middle;
    white-space: nowrap;
}

.processing-validation-table tbody td {
    font-size: 0.8125rem;
    color: #212529;
    border-bottom: 1px solid #eeeeee !important;
    vertical-align: middle;
    background: #fff !important;
}

.processing-validation-table tbody tr:hover td {
    background: #fff !important;
}

.processing-validation-table .col-total,
.processing-validation-table thead th.col-total {
    text-align: right;
    white-space: nowrap;
    width: 1%;
}

.processing-validation-table tbody td:nth-child(2) {
    max-width: 11rem;
}

.processing-validation-table tbody td:nth-child(6),
.processing-validation-table tbody td:nth-child(7) {
    max-width: 7rem;
    font-size: 0.75rem;
}

.processing-validation-table .col-type,
.processing-validation-table thead th.col-type {
    text-align: center;
    width: 1%;
    white-space: nowrap;
}

.processing-validation-table .processing-commercial-type-badge {
    min-width: 0;
    padding: 0.22rem 0.55rem;
    font-size: 0.6875rem;
}

.processing-commercial-type-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 5.5rem;
    padding: 0.28rem 0.75rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

.processing-commercial-type-badge--invoice {
    background: #eef2f7;
    color: #495057;
}

.processing-commercial-type-badge--credit-note {
    background: #e67e22;
    color: #fff !important;
}

.processing-validation-table .col-source,
.processing-validation-table .col-extraction-status,
.processing-validation-table .col-validated,
.processing-validation-table .col-payment,
.processing-validation-table thead th.col-source,
.processing-validation-table thead th.col-extraction-status,
.processing-validation-table thead th.col-validated,
.processing-validation-table thead th.col-payment {
    text-align: center;
    width: 1%;
    white-space: nowrap;
}

.processing-validation-table .col-extraction-status,
.processing-validation-table thead th.col-extraction-status {
    min-width: 5.5rem;
}

/* Canal / source — pill badges (Codabox, E-mail, Importé) */
.processing-validation-table .processing-validation-pill,
.processing-validation-table .invoice-mailbox-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 4.75rem;
    padding: 0.22rem 0.6rem;
    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1.2;
    border-radius: 999px;
    color: #fff !important;
    white-space: nowrap;
}

.processing-validation-table .invoice-mailbox-source-badge--import {
    background: #2979ff;
}

.processing-validation-table .invoice-mailbox-source-badge--email {
    background: #845adf;
}

.processing-validation-table .invoice-mailbox-source-badge--manual,
.processing-validation-table .invoice-mailbox-source-badge--peppol,
.processing-validation-table .invoice-mailbox-source-badge--api {
    background: #00c853;
}

.processing-validation-table .invoice-mailbox-pay-badge--paid {
    background: #26bf94;
}

.processing-validation-table .invoice-mailbox-pay-badge--unpaid {
    background: #e6533c;
}

.processing-validation-table .invoice-mailbox-pay-badge--partial {
    background: #f5a623;
}

.processing-validation-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: 100%;
    min-width: 4.75rem;
    padding: 0.22rem 0.6rem;
    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1.2;
    border-radius: 999px;
    white-space: nowrap;
    color: #fff !important;
}

.processing-validation-table .processing-validation-status-badge.bg-warning {
    background-color: #f5a623 !important;
    color: #fff !important;
}

.processing-validation-table thead th.col-actions,
.processing-validation-table tbody td.col-actions {
    width: 1%;
    min-width: 8.5rem;
    white-space: nowrap;
    text-align: right;
    overflow: visible;
}

.processing-validation-table .action-buttons {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 1px;
    max-width: none;
}

.processing-validation-table .action-buttons .action-btn {
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    font-size: 0.875rem;
}

.processing-validation-table .action-buttons,
.processing-validation-table .processing-row-actions {
    position: static;
}

.processing-validated-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    flex-shrink: 0;
}

.processing-validation-table .processing-validated-icon {
    width: 1.125rem;
    height: 1.125rem;
}

.processing-validated-icon--yes {
    background: #00c853;
    color: #fff;
    font-size: 0.75rem;
    line-height: 1;
}

.processing-validated-icon--yes .bx-check {
    font-weight: 700;
}

.processing-validated-icon--pending {
    background: transparent;
    border: 2px solid #f5a623;
}

.processing-validated-icon--no {
    background: transparent;
    border: 2px solid #f5a623;
    box-sizing: border-box;
}

.processing-validation-footer {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding: 1rem 1.5rem;
    border-top: 1px solid #eeeeee;
    background: #fff;
}

.processing-validation-footer .processing-pending-count {
    margin-left: auto;
    font-size: 0.875rem;
    color: #6c757d;
}

.processing-validate-btn {
    background-color: #00c853 !important;
    border-color: #00c853 !important;
    color: #fff !important;
    border-radius: 6px;
    font-weight: 500;
    padding: 0.4rem 0.9rem;
}

.processing-validate-btn:disabled,
.processing-validate-btn.disabled {
    background-color: #00c853 !important;
    border-color: #00c853 !important;
    color: #fff !important;
    opacity: 1;
}

.processing-validate-btn:hover:not(:disabled),
.processing-validate-btn:focus:not(:disabled) {
    background-color: #00b248 !important;
    border-color: #00b248 !important;
    color: #fff !important;
}

.processing-reject-btn {
    border-radius: 6px;
    font-weight: 500;
    padding: 0.4rem 0.9rem;
    color: #e6533c !important;
    border-color: #e6533c !important;
}

.processing-reject-btn:hover:not(:disabled),
.processing-reject-btn:focus:not(:disabled) {
    background: rgba(230, 83, 60, 0.08) !important;
    color: #e6533c !important;
    border-color: #e6533c !important;
}

/* ============================================================
   HISTORY PAGE — chrome partagé avec Archives (archive-*).
   Styles spécifiques restants : statut, tri, mobile, pagination.
   ============================================================ */
.history-page {
    width: 100%;
    min-width: 0;
}

.history-sort-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0;
    border: none;
    background: transparent;
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
    cursor: pointer;
}

.history-sort-btn i {
    font-size: 0.875rem;
    opacity: 0.65;
}

.history-empty {
    color: #94a3b8;
}

.history-status-text,
.history-status-badge {
    font-size: 0.875rem;
    font-weight: 500;
    white-space: nowrap;
}

.history-status-badge {
    display: inline;
    padding: 0;
    border: none;
    background: transparent;
    border-radius: 0;
    min-height: 0;
}

.history-status-text--annotate,
.history-status-badge--annotate { color: #ea580c; }

.history-status-text--send,
.history-status-badge--send { color: #2563eb; }

.history-status-text--deleted,
.history-status-badge--deleted { color: #dc2626; }

.history-table .col-actions {
    text-align: center;
}

.history-mobile-list {
    padding: 0.75rem;
}

.history-mobile-card {
    border: 1px solid #e2e8f0;
    border-radius: 0.375rem;
    padding: 0.75rem;
    margin-bottom: 0.5rem;
    background: #fff;
}

.history-mobile-card:last-child {
    margin-bottom: 0;
}

.history-mobile-card__title {
    font-size: 0.8125rem;
    font-weight: 600;
    margin-bottom: 0.625rem;
    word-break: break-word;
    display: block;
    text-align: left;
}

.history-mobile-card__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem 0.75rem;
    margin-bottom: 0.625rem;
}

.history-mobile-card__label {
    display: block;
    font-size: 0.6875rem;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    margin-bottom: 0.125rem;
}

.history-table__footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.85rem 1.25rem;
    border-top: 1px solid #e5e7eb;
    background: #fff;
    overflow: visible;
    position: relative;
    z-index: 5;
}

.history-table__footer > .card-footer {
    width: auto;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    overflow: visible;
    font-size: 0.8125rem;
}

.history-table__footer .dropdown-menu {
    z-index: 1060;
}

.history-table__range {
    font-size: 0.8125rem;
    font-weight: 400;
    color: #94a3b8;
    white-space: nowrap;
}

/* ==========================================================================
   Filtre workflow documentaire (spéc Amélie 1.1)
   Statuts exclusifs : la somme des compteurs égale celui de « Tous ».
   Couleur stable par statut dans toute l'application. Le vert est réservé
   aux confirmations et au paiement effectué : aucun statut ne l'utilise.
   ========================================================================== */

.invoice-workflow-filters {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem 0.75rem;
    padding: 0.35rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
    background: #fff;
}

.invoice-workflow-filters__title {
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
}

.invoice-workflow-filters__list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.invoice-workflow-filter {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.25rem 0.6rem;
    border: 1px solid transparent;
    border-radius: 0.5rem;
    background: transparent;
    color: #6c757d;
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.invoice-workflow-filter:hover:not(.active) {
    background: #f1f3f5;
    color: #495057;
}

.invoice-workflow-filter .tab-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.1rem;
    height: 1.1rem;
    padding: 0 0.3rem;
    border-radius: 999px;
    font-size: 0.625rem;
    font-weight: 600;
    background: #e9ecef;
    color: #6c757d;
}

/* Couleur du statut : discrète au repos, pleine une fois le filtre actif. */
.invoice-workflow-filter.active {
    color: #fff;
}

.invoice-workflow-filter.active .tab-count {
    background: rgba(255, 255, 255, 0.28);
    color: #fff;
}

/* « Tous » n'est pas un statut : il reste neutre. */
.invoice-workflow-filter.active:not([class*="workflow-badge--"]) {
    background: #495057;
    border-color: #495057;
}

.invoice-workflow-filter.workflow-badge--deposited i { color: #64748b; }
.invoice-workflow-filter.workflow-badge--to-approve i { color: #f59e0b; }
.invoice-workflow-filter.workflow-badge--to-account i { color: #7c3aed; }
.invoice-workflow-filter.workflow-badge--accounted i { color: #2979ff; }
.invoice-workflow-filter.workflow-badge--rejected i { color: #dc2626; }

.invoice-workflow-filter.workflow-badge--deposited.active { background: #64748b; border-color: #64748b; }
.invoice-workflow-filter.workflow-badge--to-approve.active { background: #f59e0b; border-color: #f59e0b; }
.invoice-workflow-filter.workflow-badge--to-account.active { background: #7c3aed; border-color: #7c3aed; }
.invoice-workflow-filter.workflow-badge--accounted.active { background: #2979ff; border-color: #2979ff; }
.invoice-workflow-filter.workflow-badge--rejected.active { background: #dc2626; border-color: #dc2626; }

.invoice-workflow-filter.active i { color: #fff; }

/* Badge de statut dans le tableau : même code couleur, en pastille pleine claire. */
.workflow-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.workflow-badge--deposited { background: #f1f5f9; color: #475569; }
.workflow-badge--to-approve { background: #fef3c7; color: #b45309; }
.workflow-badge--to-account { background: #ede9fe; color: #6d28d9; }
.workflow-badge--accounted { background: #e0edff; color: #1d4ed8; }
.workflow-badge--rejected { background: #fee2e2; color: #b91c1c; }

@media (max-width: 767.98px) {
    .invoice-workflow-filters {
        padding: 0.75rem 1rem;
    }

    .invoice-workflow-filters__list {
        overflow-x: auto;
        flex-wrap: nowrap;
        width: 100%;
    }
}

/* Actions du workflow documentaire sur une ligne.
   Fond plein comme les autres .mbx-act : la classe de base impose color:#fff
   et ne fournit aucun fond, une icone sans modificateur serait invisible.
   Le vert de l'approbation est une confirmation, pas un statut. */
.mbx-act--more     { background-color: #64748b; }  /* ardoise — autres actions */
.mbx-act--more:hover{ background-color: #475569; }

/* !important : .btn Bootstrap peut gagner sur un fond non prioritaire → icône blanche
   (.mbx-act { color:#fff }) sur fond transparent = bouton « Comptabiliser » invisible. */
.workflow-act--approve            { background-color: #16a34a !important; }
.workflow-act--approve:hover      { background-color: #15803d !important; }
.workflow-act--reject             { background-color: #dc2626 !important; }
.workflow-act--reject:hover       { background-color: #b91c1c !important; }
.workflow-act--account            { background-color: #0284c7 !important; }
.workflow-act--account:hover      { background-color: #0369a1 !important; }
.workflow-act--sendtoapproval     { background-color: #f59e0b !important; }
.workflow-act--sendtoapproval:hover{ background-color: #d97706 !important; }
.workflow-act--sendtoaccounting   { background-color: #7c3aed !important; }
.workflow-act--sendtoaccounting:hover{ background-color: #6d28d9 !important; }
.workflow-act--returnforcorrection{ background-color: #f59e0b !important; }
.workflow-act--returnforcorrection:hover{ background-color: #d97706 !important; }
.workflow-act--redeposit          { background-color: #0891b2 !important; }
.workflow-act--redeposit:hover    { background-color: #0e7490 !important; }
.workflow-act--reverse            { background-color: #64748b !important; }
.workflow-act--reverse:hover      { background-color: #475569 !important; }

/* Dans le menu deroulant, ces memes classes ne doivent pas peindre la ligne.
   !important requis : les fonds .workflow-act--* ci-dessus l'utilisent aussi. */
.dropdown-item.workflow-act--approve,
.dropdown-item.workflow-act--reject,
.dropdown-item.workflow-act--account,
.dropdown-item.workflow-act--sendtoapproval,
.dropdown-item.workflow-act--sendtoaccounting,
.dropdown-item.workflow-act--returnforcorrection,
.dropdown-item.workflow-act--redeposit,
.dropdown-item.workflow-act--reverse {
    background-color: transparent !important;
    color: inherit !important;
}

.dropdown-item.workflow-act--approve i  { color: #16a34a !important; }
.dropdown-item.workflow-act--reject i   { color: #dc2626 !important; }
.dropdown-item.workflow-act--account i  { color: #0284c7 !important; }
.dropdown-item.workflow-act--sendtoapproval i,
.dropdown-item.workflow-act--returnforcorrection i { color: #f59e0b !important; }
.dropdown-item.workflow-act--sendtoaccounting i { color: #7c3aed !important; }
.dropdown-item.workflow-act--redeposit i { color: #0891b2 !important; }
.dropdown-item.workflow-act--reverse i { color: #64748b !important; }


/* Type du document (facture / note de crédit) — pastille neutre.
   Ne réutilise pas .invoice-mailbox-badge, qui impose color:#fff et tient son
   fond d'une classe modificatrice : sans modificateur, le texte est invisible. */
.document-type-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    background: #eef1f5;
    color: #475569;
}

/* ── Filtre « Statut de paiement » ────────────────────────────────────────────
   Même barre que le workflow, à un modificateur près : ce sont deux dimensions
   de même rang, la spéc demande de les distinguer, pas d'en subordonner une.
   Le vert reste réservé au paiement effectué. */
.invoice-payment-filters {
    border-bottom: 1px solid #e9ecef;
}

.invoice-payment-filter.payment-badge--to-pay i { color: #d97706; }
.invoice-payment-filter.payment-badge--paid i { color: #16a34a; }

.invoice-payment-filter.payment-badge--to-pay.active { background: #d97706; border-color: #d97706; }
.invoice-payment-filter.payment-badge--paid.active { background: #16a34a; border-color: #16a34a; }

/* ── Barre de recherche de la liste documentaire ──────────────────────────────
   Même bandeau que les barres de filtre : l'écran empile en-tête, recherche,
   paiement, workflow et types, chacun sur une ligne de même facture. */
.invoice-filter-bar {
    padding: 0.875rem 1.5rem;
    border-bottom: 1px solid #e9ecef;
    background: #fff;
}

.invoice-filter-bar__top {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.invoice-filter-bar__actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

/* La recherche prend la place restante : c'est le critère le plus utilisé. */
.invoice-search {
    position: relative;
    flex: 1 1 18rem;
    min-width: 12rem;
    max-width: 32rem;
}

.invoice-search i {
    position: absolute;
    top: 50%;
    left: 0.65rem;
    transform: translateY(-50%);
    color: #adb5bd;
    font-size: 1rem;
    pointer-events: none;
}

.invoice-search .form-control {
    padding-left: 2.1rem;
    border-radius: 0.5rem;
    background: #f8f9fa;
    border-color: #e9ecef;
}

.invoice-search .form-control:focus {
    background: #fff;
}

.invoice-filter-toggle,
.invoice-filter-reset {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border-radius: 0.5rem;
    white-space: nowrap;
}

.invoice-filter-toggle .tab-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    height: 1.25rem;
    padding: 0 0.3rem;
    border-radius: 999px;
    background: #495057;
    color: #fff;
    font-size: 0.6875rem;
    font-weight: 600;
}

.invoice-filter-bar__fields {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 0.75rem;
}

.invoice-filter-field {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1 1 12rem;
    min-width: 9rem;
    margin-bottom: 0;
}

/* Les dates n'ont pas besoin de la largeur d'un nom de tiers. */
.invoice-filter-field--date {
    flex: 0 1 9.5rem;
}

.invoice-filter-field__label {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
}

.invoice-filter-field .form-select,
.invoice-filter-field .form-control {
    border-radius: 0.5rem;
    border-color: #e9ecef;
}

@media (max-width: 767.98px) {
    .invoice-filter-bar {
        padding: 0.75rem 1rem;
    }

    .invoice-filter-bar__actions {
        margin-left: 0;
        width: 100%;
    }

    .invoice-search {
        flex-basis: 100%;
        max-width: none;
    }

    .invoice-filter-field,
    .invoice-filter-field--date {
        flex: 1 1 100%;
    }
}

/* ── Bouton unique « Déposer un document » ────────────────────────────────────
   Le violet est celui de l'action principale de l'écran ; le reste de l'en-tête
   reste neutre pour qu'il n'y ait qu'un seul point d'entrée coloré. */
.invoice-drop-group .invoice-drop-btn {
    gap: 0.4rem;
    background: #7c3aed;
    border-color: #7c3aed;
    border-top-left-radius: 0.5rem;
    border-bottom-left-radius: 0.5rem;
    font-weight: 500;
}

.invoice-drop-group .invoice-drop-caret {
    background: #7c3aed;
    border-color: #7c3aed;
    border-top-right-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
}

.invoice-drop-group .invoice-drop-btn:hover,
.invoice-drop-group .invoice-drop-caret:hover,
.invoice-drop-group .invoice-drop-caret:focus,
.invoice-drop-group .invoice-drop-caret.show {
    background: #6d28d9;
    border-color: #6d28d9;
}

/* Sépare le chevron du libellé sans casser le bloc de couleur. */
.invoice-drop-group .invoice-drop-caret {
    border-left: 1px solid rgba(255, 255, 255, 0.25);
}

/* ── Actions groupées du pied de liste ────────────────────────────────────────
   Le compteur de sélection reste toujours là et s'éteint à vide : le voir
   disparaître ferait sauter la barre à chaque case cochée. */
.invoice-bulk__count {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #495057;
    white-space: nowrap;
}

.invoice-bulk__count--empty {
    color: #adb5bd;
    font-weight: 500;
}

.invoice-bulk__menu,
.dropdown-menu.processing-dropdown-menu--portal.invoice-bulk__menu {
    min-width: 15rem;
    /* Menu Actions groupées : au-dessus du tableau ; défile si trop long. */
    max-height: min(50vh, 20rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    z-index: 30 !important;
}

.invoice-bulk__menu .dropdown-item {
    font-size: 0.8125rem;
}

/* ── Carte de filtre à soulignement (Achats) ──────────────────────────────────
   Reprend la carte de l'écran Ventes ; seul l'état actif change. Un fond plein
   effacerait la couleur du statut portée par l'icône, qui est justement ce qui
   distingue « Déposé » de « Rejeté » d'un coup d'œil. */
.mbx-axis--underline .sales-chip {
    position: relative;
    border-color: transparent;
    border-radius: 0.5rem 0.5rem 0 0;
}

.mbx-axis--underline .sales-chip.active {
    background: transparent;
    border-color: transparent;
    color: #1e293b;
    font-weight: 600;
}

.mbx-axis--underline .sales-chip.active::after {
    content: "";
    position: absolute;
    left: 0.35rem;
    right: 0.35rem;
    bottom: -0.4rem;
    height: 3px;
    border-radius: 3px;
    background: #6d28d9;
}

/* La carte doit laisser respirer le trait, sinon il touche la bordure basse. */
.mbx-axis--underline .sales-filter-axis__list {
    padding-bottom: 0.4rem;
}

/* Phrase qui dit ce que le filtre de paiement montre. */
.invoice-filter-hint {
    font-size: 0.75rem;
    color: #64748b;
}

/* ── Icône de format dans la colonne Document ─────────────────────────────────
   Rouge pour le PDF, vert pour le XML : les couleurs des lecteurs usuels, pour
   que la distinction se fasse sans lire l'infobulle. */
.doc-file-icon--pdf { color: #dc2626; }
.doc-file-icon--xml { color: #16a34a; }
.doc-file-icon--other { color: #94a3b8; }

/* ── Colonne d'actions à emplacements fixes ───────────────────────────────────
   Toutes les actions sont rendues sur chaque ligne, ouvertes ou non, pour qu'on
   vise le même bouton d'une ligne à l'autre sans relire la colonne.

   Un emplacement fermé devient gris plein plutôt que sa couleur atténuée : sur du
   blanc, un aplat coloré ramené à 30 % d'opacité disparaît complètement, et la
   rangée semble avoir perdu un bouton au lieu d'en montrer un inactif.

   Bloqué ≠ fermé : une action bloquée existe mais sa précondition n'est pas
   remplie. Elle est donc exclue d'ici et garde sa couleur atténuée, l'infobulle
   disant ce qui manque. */
.mbx-actions .mbx-act:disabled:not(.mbx-act--blocked),
.mbx-actions .mbx-act-wrap > .mbx-act:disabled:not(.mbx-act--blocked) {
    background-color: #eef1f5 !important;
    color: #b6bec9 !important;
    opacity: 1;
    filter: none;
    cursor: default;
}

/* Le survol ne doit rien promettre sur une action fermée. */
.mbx-actions .mbx-act:disabled:hover {
    transform: none;
    box-shadow: none;
}

/* ── Rechargement en place ────────────────────────────────────────────────────
   Les lignes restent affichées pendant qu'on recharge : les remplacer par le
   spinner vidait la table à chaque clic sur une action, et la page sautait sous
   le curseur au moment où l'on visait le bouton suivant. Elles s'atténuent et
   cessent de répondre, le temps que la réponse arrive. */
.mbx-table--refreshing {
    position: relative;
    opacity: 0.55;
    pointer-events: none;
    transition: opacity 0.12s ease-out;
}

/* Un liseré en tête dit que quelque chose se passe, sans déplacer une ligne. */
.mbx-table--refreshing::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    z-index: 3;
    background: linear-gradient(90deg, transparent, #6d28d9, transparent);
    animation: mbx-refresh-sweep 0.9s linear infinite;
}

@keyframes mbx-refresh-sweep {
    from { transform: translateX(-100%); }
    to { transform: translateX(100%); }
}