/* Suzuki-POS - helle Gestaltung - Version 1.1 - Auftrag 007 (Akzent Suzuki-Rot)
   Farbwerte zentral hier oben (Klartext). */
:root{
  --akzent:#DE0039;      /* Suzuki-Rot wie motorrad.suzuki.de (bis v1.0: Blau #003a9b) */
  --schwarz:#111;
  --gruen:#1e7b34;       /* der eine naechste Schritt */
  --gelb:#b45309; --gelb-hell:#fef3c7;
  --rot:#b91c1c;  --rot-hell:#fde8e8;
  --gruen-hell:#e8f5ec; --blau-hell:#e8eefb;
  --linie:#e5e7eb; --flaeche:#f6f7f9; --text:#1f2937; --grau:#6b7280;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--flaeche);color:var(--text);font:15px/1.45 "Segoe UI",Roboto,Helvetica,Arial,sans-serif}
a{color:var(--akzent)}
.kopf{height:56px;background:#fff;border-bottom:3px solid var(--akzent);display:flex;align-items:center;gap:16px;padding:0 20px}
.kopf .marke{font-weight:800;letter-spacing:.12em;color:var(--akzent);font-size:20px}
.kopf .titel{font-weight:600}
.kopf .rechts{margin-left:auto;font-size:14px;color:var(--grau)}
.haupt{max-width:980px;margin:0 auto;padding:28px 16px 60px}
.karte{background:#fff;border:1px solid var(--linie);margin-bottom:18px}
.karte.schmal{max-width:440px;margin:40px auto}
.balken{background:var(--schwarz);color:#fff;padding:10px 16px;font-weight:600;border-bottom:3px solid var(--akzent)}
.inhalt{padding:18px}
.feld{display:flex;flex-direction:column;gap:4px;margin-bottom:14px;font-size:13px;color:var(--grau);font-weight:600}
.feld input{border:1px solid #cbd5e1;padding:10px;border-radius:3px;font:inherit;font-size:15px;color:var(--text);font-weight:400}
.feld input:focus{outline:2px solid var(--akzent);outline-offset:-1px}
.knopf{display:inline-block;border:1px solid var(--linie);background:#fff;padding:10px 18px;cursor:pointer;border-radius:3px;font:inherit;color:var(--text);text-decoration:none}
.knopf.gruen{background:var(--gruen);border-color:var(--gruen);color:#fff;font-weight:600}
.hinweis{padding:10px 12px;border-left:4px solid var(--akzent);background:var(--blau-hell);margin:0 0 14px;font-size:14px}
.hinweis.warn{border-color:var(--gelb);background:var(--gelb-hell)}
.hinweis.fehler{border-color:var(--rot);background:var(--rot-hell)}
.hinweis.ok{border-color:var(--gruen);background:var(--gruen-hell)}
