/* Uniquement les blocs explicitement sélectionnés par listes-11336.js. */
.operational-list {min-width:0;max-width:100%;align-content:start}
.operational-list.operational-overflow {
  max-height:min(var(--operational-height),70vh);
  overflow-y:auto;
  overscroll-behavior-y:contain;
  scrollbar-gutter:stable;
  scrollbar-color:#7893ad var(--soft);
}
.operational-overflow::-webkit-scrollbar {width:14px;height:14px}
.operational-overflow::-webkit-scrollbar-track {background:var(--soft)}
.operational-overflow::-webkit-scrollbar-thumb {background:#7893ad;border:3px solid var(--soft);border-radius:8px}
.operational-list:focus-visible {outline:2px solid var(--primary);outline-offset:2px}
.operational-table > table {width:100%;min-width:0}
.operational-table > table > thead {position:sticky;top:0;z-index:2;background:var(--surface)}
.operational-table > table > thead th {background:var(--primary);color:var(--on-primary)}
.operational-table :is(th,td) {white-space:normal;overflow-wrap:anywhere}
.operational-table :is(td,th) > :is(button,input,select) {max-width:100%;min-width:0}
.operational-table .actions {display:flex;flex-wrap:wrap;gap:8px}
.operational-table button {max-width:100%;white-space:normal}
.operational-table .reception-line-details {min-width:0;max-width:100%}
@media(max-width:700px) {
  /* Les tableaux larges deviennent des fiches, avec leurs libellés, sans couper les actions. */
  .operational-table > table:not(.shop-invoices-table),
  .operational-table > table:not(.shop-invoices-table) > tbody {display:block;width:100%}
  .operational-table > table:not(.shop-invoices-table) > thead {display:block;width:100%;background:var(--primary);color:var(--on-primary)}
  .operational-table > table:not(.shop-invoices-table) > thead > tr {display:flex;flex-wrap:wrap;gap:4px 12px;padding:8px}
  .operational-table > table:not(.shop-invoices-table) > thead th {border:0;padding:0;font-size:11px}
  body[data-role="admin"] .operational-table > table > thead,
  body[data-role="admin"] .operational-table > table > thead > tr {background:var(--primary-soft);color:var(--text)}
  .operational-table > table:not(.shop-invoices-table) > tbody > tr {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-bottom:1px solid var(--border);padding:8px;gap:8px}
  .operational-table > table:not(.shop-invoices-table) > tbody > tr > td {display:block;min-width:0;border:0;padding:4px;text-align:start}
  .operational-table > table:not(.shop-invoices-table) > tbody > tr > td:last-child {grid-column:1/-1}
  .operational-table td[data-list-label]::before {content:attr(data-list-label);display:block;font-size:11px;font-weight:600;color:var(--muted);margin-bottom:4px}
  .operational-table > table:not(.shop-invoices-table) colgroup {display:none}
  .operational-list.replenishment-order-lines .replenishment-order-line {grid-template-columns:minmax(0,1fr);min-width:0}
}
@media print {
  .operational-list.operational-overflow {max-height:none;overflow:visible;scrollbar-gutter:auto}
  .operational-table > table > thead {position:static;display:table-header-group}
}
@media(max-width:650px) {
  /* Conserver les fiches Factures existantes, en rendant leur en-tête visible et fixe. */
  body:not([data-role="admin"]) #content[data-page="invoices"] .operational-table .shop-invoices-table thead {
    display:block;position:sticky;top:0;width:100%;height:auto;overflow:visible;clip-path:none;
  }
  body:not([data-role="admin"]) #content[data-page="invoices"] .operational-table .shop-invoices-table thead tr {
    display:flex;flex-wrap:wrap;gap:6px 12px;padding:10px;margin:0;border:0;border-radius:0;background:var(--primary);
  }
  body:not([data-role="admin"]) #content[data-page="invoices"] .operational-table .shop-invoices-table thead th {
    padding:0;font-size:11px;border:0;
  }
}
