/* Copyright (c) 2026 Rajesh Krishnasing. Alle rechten voorbehouden. */
/* PrimaPress, module motor: de tabbladen Digitaal en Afwerking en de vensters Printen, Afwerking, Verpakking en
 * Afwerking algemeen (PrimaPress 2.0, pakket W4-ui). Alleen de indeling van deze schermen (klassen m-motor-...); kleur,
 * letter, randen, afronding en schaduw komen uit de componenten van app.css (rooster, zoektabel, kaart, feitenbalk,
 * meldingen) en de tokens van de laag betekenis. */

.m-motor-tab .tabknoppen { flex-wrap: wrap; }
.m-motor-meldingen { margin: var(--pp-r-2) 0 var(--pp-r-3); }
.m-motor-melding { margin-bottom: var(--pp-r-2); }
.m-motor-melding ul { margin: var(--pp-r-1) 0 0; padding-left: var(--pp-r-5); }
.m-motor-knopje { margin-top: var(--pp-r-2); }
.m-motor-stand { margin-top: var(--pp-r-2); }
.m-motor-posten { margin-top: var(--pp-r-3); }
table.m-motor-rooster td .sub { white-space: nowrap; }

/* de prijsafspraak van de calculatie (besluit B-148): in een blik, met de vrije invoer ernaast */
.m-motor-afspraak { margin: 0 0 var(--pp-r-3); }
.m-motor-afspraak .feitenbalk { margin: 0; }
.m-motor-afspraak-invoer { display: flex; flex-wrap: wrap; align-items: center; gap: var(--pp-r-2); margin-top: var(--pp-r-2); }
.m-motor-afspraak-invoer input { width: 180px; max-width: 100%; }
.m-motor-afspraak-invoer .sub { flex: 1 1 260px; }

/* het venster Printen: links de invoer met tabbladen, rechts de uitkomst (een kaart die meeschuift) */
.venster.m-motor-breed { max-width: 1320px; }
.m-motor-venster { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(320px, 1fr); gap: var(--pp-r-4); align-items: start; }
.m-motor-links { min-width: 0; }
.kaart.m-motor-uitkomst { position: sticky; top: 0; min-width: 0; margin: 0; }
.m-motor-uitkomst table.rooster td { min-width: 70px; }
.m-motor-uitkomst table.rooster th.rooster-label { width: 120px; }
.m-motor-paneel { padding-top: var(--pp-r-2); }

/* breedte x hoogte, procent + vast */
.m-motor-samen { display: flex; gap: var(--pp-r-1); align-items: center; }
.m-motor-samen input { min-width: 0; }
.m-motor-tussen { color: var(--pp-tekst-3); }
input.m-motor-getal { width: 90px; }
.m-motor-samen input.m-motor-getal { width: 72px; }

/* de tekening van het drukvel met de indeling ernaast; de lijnen en vlakken van de tekening in de tokens */
.m-motor-indeling { display: flex; gap: var(--pp-r-3); align-items: flex-start; margin: var(--pp-r-1) 0 var(--pp-r-2); }
.m-motor-indeling .m-motor-feiten { flex: 1 1 auto; margin: 0; }
.m-motor-tekening { flex: 0 0 150px; }
svg.m-motor-vel { display: block; width: 100%; height: auto; }
svg.m-motor-vel rect.vel { fill: var(--pp-vlak); stroke: var(--pp-rand-sterk); stroke-width: 2; }
svg.m-motor-vel rect.bruikbaar { fill: var(--pp-vlak-2); stroke: var(--pp-rand); stroke-width: 1; stroke-dasharray: 6 4; }
svg.m-motor-vel rect.afloop { fill: var(--pp-info-vlak); stroke: none; }
svg.m-motor-vel rect.product { fill: var(--pp-vlak); stroke: var(--pp-link); stroke-width: 2; }

/* papier kiezen: het zoekvenster van de kern (zoekvelden, tabel met de gekozen regel) */
.m-motor-zoekrij { display: flex; gap: var(--pp-r-2); align-items: center; margin: var(--pp-r-2) 0; flex-wrap: wrap; }
.m-motor-telling { margin: 0; }
.m-motor-papierlijst .zoekvak-laag { max-height: 260px; }
.zoektabel tr.m-motor-vervallen:not(.gekozen) td { color: var(--pp-tekst-3); }
.m-motor-gekozen { margin: var(--pp-r-2) 0; }
.m-motor-feiten { margin: var(--pp-r-2) 0; }

/* nabewerking en materiaal: een rooster met invoer per regel */
.m-motor-postblok { margin-top: var(--pp-r-3); }
table.m-motor-postentabel td { vertical-align: top; }
table.m-motor-postentabel td input { width: 100%; min-width: 60px; }
table.m-motor-postentabel td:first-child input { min-width: 160px; }
.m-motor-basisproduct { margin-top: var(--pp-r-3); }
/* het voorstel bij Alleen papier doorbelasten en de prijs per tik per oplage */
.m-motor-voorstel ul { margin: var(--pp-r-1) 0 0; padding-left: var(--pp-r-5); }
.m-motor-voorstel li { margin: var(--pp-r-1) 0; }
.m-motor-voorstel li .knop { margin-left: var(--pp-r-1); }
input.m-motor-tabnr { width: 52px; }
table.m-motor-tiktabel th[scope=row] { white-space: nowrap; text-align: left; padding-right: var(--pp-r-2); }
table.m-motor-tiktabel td input { max-width: 120px; }
.m-motor-zonder { margin-bottom: var(--pp-r-1); }
.m-motor-basisproduct ol { margin: var(--pp-r-1) 0 var(--pp-r-2); padding-left: var(--pp-r-5); }

@media (max-width: 900px) {
  .m-motor-venster { grid-template-columns: minmax(0, 1fr); }
  .kaart.m-motor-uitkomst { position: static; }
}
@media (max-width: 760px) {
  .m-motor-indeling { flex-direction: column; }
  .m-motor-tekening { flex-basis: auto; width: 150px; }
}