/* Chauffeur-app — wizard-chrome + helpers bovenop de gedeelde monteur m-* layout.
   Bewust GEEN eigen kleuraccent: de chauffeur-app ziet er identiek uit als de
   monteurs-app (donkere header, blauw accent). Alle regels gescoped onder
   body.chauffeur-app; uitsluitend --velza-* tokens (zie design system). De header,
   kaarten en knoppen erven volledig van monteur.css. */

/* Wizard-tabs (zelfde mechaniek + blauw accent als de monteur-opdracht). */
body.chauffeur-app .m-stappen {
    display: flex; background: white; border-bottom: 1px solid var(--velza-lichtgrijs);
    position: sticky; top: 52px; z-index: 99;
}
body.chauffeur-app .m-stap {
    flex: 1; text-align: center; padding: 10px 4px; font-size: 12px; font-weight: 600;
    color: var(--velza-subtekst); border-bottom: 3px solid transparent; cursor: pointer;
}
body.chauffeur-app .m-stap.actief {
    color: var(--velza-blauw); border-bottom-color: var(--velza-blauw);
}

/* Rit-formuliervelden. */
body.chauffeur-app .c-veld { display: block; margin-bottom: 12px; font-size: 14px; color: var(--velza-tekst); }
body.chauffeur-app .c-veld input,
body.chauffeur-app .c-veld textarea {
    display: block; width: 100%; box-sizing: border-box; margin-top: 4px;
    padding: 10px; font-size: 16px; border: 1px solid var(--velza-lichtgrijs); border-radius: 6px;
}

/* Info-tab leesblok. */
body.chauffeur-app .c-info { font-size: 14px; line-height: 1.7; }
body.chauffeur-app .c-info strong { color: var(--velza-blauw); }
body.chauffeur-app .c-liften { margin: 6px 0 0; padding-left: 18px; }
body.chauffeur-app .c-liften li { font-size: 14px; padding: 2px 0; }

/* Status-acties (Onderweg / Geleverd). */
body.chauffeur-app .c-acties { display: flex; gap: 12px; margin-bottom: 16px; }

/* Tijd-/km-rijen (zelfde compacte rij-stijl als de monteur-opdracht). */
body.chauffeur-app .m-tijd-rij {
    display: flex; justify-content: space-between; align-items: center;
    padding: 10px 0; border-bottom: 1px solid var(--velza-lichtgrijs);
}
body.chauffeur-app .m-tijd-rij:last-child { border-bottom: none; }
body.chauffeur-app .m-tijd-rij label { font-size: 14px; }
body.chauffeur-app .m-tijd-input-wrap { display: flex; gap: 6px; align-items: center; }
body.chauffeur-app .m-tijd-input {
    padding: 8px; border: 1px solid var(--velza-lichtgrijs); border-radius: 6px;
    font-size: 16px; width: 110px; text-align: center;
}
body.chauffeur-app .m-tijd-nu {
    padding: 8px 12px; background: var(--velza-lichtgrijs); border: none;
    border-radius: 6px; font-size: 13px; cursor: pointer;
}
body.chauffeur-app .m-km-input {
    width: 100%; padding: 8px; border: 1px solid var(--velza-lichtgrijs);
    border-radius: 6px; font-size: 16px; text-align: center; box-sizing: border-box;
}