/* Copyright (c) 2026 Rajesh Krishnasing. Alle rechten voorbehouden. */
/* PrimaPress, module ordercontrole: alleen de indeling van de eigen schermen (klassen m-ordercontrole-...), met de
 * tokens van de laag betekenis (tokens.css). Knoppen, tabellen, merkjes, meldingen, het skelet en de lege en de
 * fouttoestand komen uit app.css; geen eigen kleuren, maten van letters, afrondingen of schaduwen. */

/* de kopregel van het tabblad Controle: stand, telling, vastgelegd en de knoppen rechts */
.m-ordercontrole-kop { display: flex; align-items: center; gap: var(--pp-r-3); flex-wrap: wrap; margin: var(--pp-r-1) 0 var(--pp-r-2); }
.m-ordercontrole-kop .rechts { margin-left: auto; display: flex; gap: var(--pp-r-2); flex-wrap: wrap; }
.m-ordercontrole-paneel > .let, .m-ordercontrole-paneel > .info { margin: 0 0 var(--pp-r-3); }

/* de tabellen: bovenaan uitlijnen, zodat meerregelige uitleg leesbaar blijft */
.m-ordercontrole-tabel td { vertical-align: top; }
.m-ordercontrole-tabel td .knop { white-space: nowrap; }
.m-ordercontrole-tabel tr.m-ordercontrole-nvt td { color: var(--pp-tekst-3); }

/* Onze status */
.m-ordercontrole-status { display: grid; gap: var(--pp-r-2); max-width: 900px; }
.m-ordercontrole-status .rlabel { display: inline-block; min-width: 80px; margin-right: var(--pp-r-2); }
.m-ordercontrole-knoppen { display: flex; align-items: center; gap: var(--pp-r-3); flex-wrap: wrap; margin-top: var(--pp-r-1); }

/* het venster Afhandelen */
.m-ordercontrole-reden { width: 100%; max-width: 520px; }

/* de signalen van inkoop tegen verkoop naast elkaar */
.m-ordercontrole-signalen { display: inline-flex; flex-wrap: wrap; gap: var(--pp-r-1); }

/* de drie tabellen van de zestien even breed en met dezelfde kolommen onder elkaar */
.m-ordercontrole-zestien { table-layout: fixed; width: 100%; }
.m-ordercontrole-zestien th:nth-child(1) { width: 38px; }
.m-ordercontrole-zestien th:nth-child(2) { width: 17%; }
.m-ordercontrole-zestien th:nth-child(3), .m-ordercontrole-zestien th:nth-child(4) { width: 14%; }
.m-ordercontrole-zestien th:nth-child(5) { width: 112px; }
.m-ordercontrole-zestien th:nth-child(7) { width: 190px; }
.m-ordercontrole-zestien td { overflow-wrap: anywhere; }

/* de tabel Klaar voor productie */
.m-ordercontrole-klaar { table-layout: fixed; width: 100%; }
.m-ordercontrole-klaar th:nth-child(1) { width: 38px; }
.m-ordercontrole-klaar th:nth-child(2) { width: 17%; }
.m-ordercontrole-klaar th:nth-child(3) { width: 112px; }
.m-ordercontrole-klaar th:nth-child(5) { width: 15%; }
.m-ordercontrole-klaar th:nth-child(6) { width: 190px; }
.m-ordercontrole-klaar td { overflow-wrap: anywhere; }

/* een telefoon: de vaste kolombreedtes los, de tabel schuift in zijn vak (DESIGNSYSTEEM.md 7.5) */
@media (max-width: 760px) {
  .m-ordercontrole-zestien, .m-ordercontrole-klaar { table-layout: auto; }
}