/* GlasERP – Programm-Arbeitsbereich (v7.12.2: ein gemeinsamer, ruhiger Stil für Wasserstrahl und
   MaschinenCenter). Leitgedanke: Der Rahmen des ERP ist Beiwerk, die Arbeitsfläche ist die Hauptsache.
   Auf kleinen Bildschirmen wurde der Kopf vorher über 300 px hoch – vom Programm blieb nichts übrig. */
.pg-workspace{display:flex;flex-direction:column;gap:10px;min-width:0}
.pg-workspace .page-head{margin-bottom:0}
.pg-workspace h1{margin:0;font-size:19px;font-weight:500;letter-spacing:-.2px}
.pg-subline{font-size:11.5px;color:var(--muted,#6b7076);margin-top:3px;line-height:1.45}

/* Kopfzeile: Position wählen + Werkzeuge in EINER Zeile, damit die Arbeitsfläche Platz behält */
.pg-controls{display:grid;grid-template-columns:minmax(150px,220px) minmax(260px,1fr) auto;gap:8px;
  background:#fff;padding:9px 10px;border:1px solid var(--line,#e4e4e4);border-radius:7px;align-items:end}
.pg-controls label{font-size:10.5px;font-weight:500;color:var(--muted,#6b7076);display:flex;flex-direction:column;gap:3px;text-transform:none}
.pg-controls input,.pg-controls select{min-width:0;width:100%;height:32px;margin:0;padding:5px 8px;
  border:1px solid #dcdee1;border-radius:5px;background:#fff;font-size:12px}
.pg-controls>button{height:32px}

.pg-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.pg-tabs,.pg-actions{display:flex;gap:4px;flex-wrap:wrap}
.pg-tabs button,.pg-actions button{font-size:12px;font-weight:500;padding:6px 10px;border:1px solid #dcdee1;
  border-radius:5px;background:#fff;color:#333;cursor:pointer;line-height:1.3}
.pg-tabs button.active{background:#171717;color:#fff;border-color:#171717}
.pg-actions button.primary{background:#171717;color:#fff;border-color:#171717}

/* Meldungszeile: eine Zeile, ausklappbar – vorher bis zu vier Zeilen fester Text über der Arbeitsfläche */
/* v7.12.3: eine Zeile mit Auslassungspunkten statt eines Schnitts. Eine feste max-height schnitt die
   folgende Zeile mitten durch die Buchstaben – und weil overflow:hidden erst am Innenrand kappt, blieb
   auch mit -webkit-line-clamp ein Streifen der nächsten Zeile im Innenabstand stehen. Das sah nach
   Fehler aus, nicht nach Absicht. Der ganze Text erscheint beim Überfahren; Meldungen, die man lesen
   MUSS (Fehler, Warnung, Erfolg), stehen ohnehin vollständig da. */
.pg-message{font-size:11.5px;padding:6px 10px;border-left:2px solid #c9ccd0;background:#fafafa;
  line-height:1.45;color:#55595f;border-radius:0 5px 5px 0;cursor:pointer;position:relative;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-message:hover{white-space:pre-line;text-overflow:clip}
.pg-message.error{border-color:#ba4545;background:#fff4f4;color:#7e2f2f;white-space:pre-line;text-overflow:clip}
.pg-message.warn{border-color:#c79f48;background:#fffaf0;color:#6d5418;white-space:pre-line;text-overflow:clip}
.pg-message.ok{border-color:#4c806b;background:#f3f9f6;color:#2f5a49}
.pg-message:empty{display:none}
.pg-stamp{font:11px ui-monospace,monospace;color:#8a8f96}

/* Arbeitsfläche: nimmt, was übrig bleibt – nicht eine feste Restrechnung */
.pg-frame{width:100%;flex:1 1 auto;height:auto;min-height:clamp(420px,calc(100vh - 250px),1200px);
  border:1px solid var(--line,#e4e4e4);border-radius:7px;background:#fff;display:block}
.pg-empty{padding:48px 22px;text-align:center;background:#fff;border:1px solid var(--line,#e4e4e4);border-radius:7px;color:#6b7076}
.pg-history{overflow:auto;max-height:260px;background:#fff;border:1px solid var(--line,#e4e4e4);border-radius:6px;padding:8px}
.pg-history table{width:100%;font-size:12px;border-collapse:collapse}
.pg-history td,.pg-history th{text-align:left;padding:7px 8px;border-bottom:1px solid #eee;font-weight:400}
.pg-history th{font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:#8a8f96}
.pg-files{display:flex;gap:7px;flex-wrap:wrap;font-size:11.5px}
.pg-files a{padding:4px 8px;background:#fff;border:1px solid #dcdee1;border-radius:4px;color:#222;text-decoration:none}

.pg-workspace:fullscreen{background:#f5f5f5;padding:12px;overflow:auto}
.pg-workspace:fullscreen .pg-frame{min-height:calc(100vh - 150px)}

/* Kleine Bildschirme: der Kopf schrumpft, das Programm bekommt die Höhe.
   Vorher standen Titel, Untertitel, Suche, Auswahl, Reiter, Aktionen und Meldung übereinander –
   auf einem 13-Zoll-Bildschirm blieben vom Programm rund 200 px. */
@media(max-width:1200px){
  .pg-controls{grid-template-columns:minmax(0,1fr) auto;gap:7px}
  .pg-controls>label:first-child{display:none}            /* Suchfeld: die Auswahlliste genügt */
  .pg-frame{min-height:clamp(420px,calc(100vh - 210px),1200px)}
}
/* Flache Bildschirme (Notebook 13–14 Zoll, 720–800 px hoch): Der Kopf bestand aus sieben Zeilen und
   war 384 px hoch – vom Programm blieb auf 720 px nur ein Drittel sichtbar. Hier wird verdichtet:
   Titelzeile entfällt (der Reiter oben nennt das Programm), Feldbeschriftungen werden zu Platzhaltern,
   der Speicherstempel wandert in die Werkzeugzeile. Ergebnis rund 250 px. */
@media(max-width:900px),(max-height:820px){
  /* Auf flachen Bildschirmen rückt der ganze Inhaltsbereich näher zusammen: die ERP-Kopfleiste wird
     flacher, die Bereichsreiter und der Seitenabstand kleiner. Das gilt nur, solange ein Programm
     offen ist (body.pg-open) – die übrigen Ansichten bleiben unverändert. */
  body.pg-open .topbar{height:52px}
  body.pg-open #area-tabs{padding-top:6px;padding-bottom:0}
  body.pg-open #area-tabs button{padding:5px 10px;font-size:12px}
  body.pg-open .content{padding-top:10px}
  .pg-workspace{gap:6px}
  .pg-workspace>.page-head{display:none}
  .pg-controls{padding:6px 8px;grid-template-columns:minmax(0,1fr) auto;align-items:center}
  .pg-controls>label{gap:0}
  .pg-controls>label>span,.pg-controls>label{font-size:0}          /* Beschriftung aus – Platzhalter genügt */
  .pg-controls>label>:is(input,select){font-size:12px}
  .pg-controls>label:first-child{display:none}                     /* Suchfeld: die Auswahlliste genügt */
  .pg-tabs button,.pg-actions button{padding:5px 8px;font-size:11.5px}
  /* Speicherstempel und Meldung teilen sich eine Zeile statt zwei */
  .pg-msgrow{display:flex;align-items:center;gap:8px}
  .pg-msgrow .pg-message{flex:1 1 auto;min-width:0;padding:5px 9px;font-size:11px}
  .pg-msgrow .pg-stamp{flex:0 0 auto;font-size:10px;white-space:nowrap}
  .pg-frame{min-height:clamp(380px,calc(100vh - 200px),1200px)}
}
@media(max-width:650px){
  .pg-controls{grid-template-columns:1fr}
  .pg-controls>button{grid-column:auto;width:100%}
  .pg-tools{align-items:stretch;flex-direction:column}
  .pg-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}
  .pg-frame{min-height:min(78vh,760px)}
}

/* ======================================================================================
   v7.12.3 – EINE HÜLLE FÜR ALLE VIER PROGRAMME
   Vorher sass die gleiche Leiste auf jedem Reiter anders hoch: Wasserstrahl und
   MaschinenCenter 103 px, Glasoptimierung 143 px, CAD 291 px – dazu drei verschiedene
   Knopfgrössen und im CAD zusätzlich eine eigene Markenzeile im Editor.
   Ab hier gilt für alle vier dieselbe Formsprache und derselbe flache Kopf (body.pg-open).
   ====================================================================================== */

/* Gleiche Knopf- und Feldform in allen Programmen */
body.pg-open .ow-workspace .btn,
body.pg-open .og-workspace .btn,
body.pg-open .pg-tabs button, body.pg-open .pg-actions button {
  font-size:12px; font-weight:500; padding:6px 10px; min-height:30px; border-radius:5px; line-height:1.3;
}
body.pg-open .og-workspace label:not(.ow-check),
body.pg-open .ow-workspace label:not(.ow-check) { font-size:10.5px; font-weight:500; }
body.pg-open .og-workspace label>input:not([type=checkbox]),
body.pg-open .og-workspace label>select,
body.pg-open .ow-workspace label>input:not([type=checkbox]),
body.pg-open .ow-workspace label>select { padding:6px 8px; border-radius:5px; font-size:12px; margin-top:3px; }

/* Kopfaktionen oben rechts sehen in allen vier Programmen gleich aus (weiss, dünn umrandet) */
body.pg-open .ow-head-actions .btn { border:1px solid #dcdee1; background:#fff; color:#333; }

/* Glasoptimierung: derselbe ruhige Kopf wie bei den anderen drei */
body.pg-open .ow-head { margin-bottom:10px; gap:10px; }
body.pg-open .ow-head h2 { font-size:20px; font-weight:500; letter-spacing:-.2px; }
body.pg-open .ow-eyebrow { font-size:10px; letter-spacing:.09em; }
body.pg-open .ow-runbar { padding:8px 10px; margin-bottom:10px; gap:10px; border-top-width:1px; border-radius:7px; }

/* CAD: die Zeichenfläche nimmt die Fensterhöhe, ohne dass die Seite scrollen muss. Der Editor hat
   drei eigene Zeilen (Aktionen, Werkzeugleiste, Statuszeile); der Abzug ist auf 1280x720, 1366x768,
   1600x1000 und 1920x1080 nachgemessen, nicht geschätzt. */
#cad-frame.pg-frame { min-height:clamp(420px,calc(100vh - 292px),1400px); }

/* Flache Bildschirme: der Reiter oben nennt das Programm – der Titel im Blatt entfällt.
   Das galt bisher nur für .pg-workspace; die Glasoptimierung behielt ihren 27-px-Titel. */
@media(max-width:900px),(max-height:820px){
  body.pg-open .ow-head>div:first-child { display:none; }
  body.pg-open .ow-head { margin-bottom:6px; justify-content:flex-end; }
  body.pg-open .ow-runbar { padding:6px 9px; margin-bottom:7px; gap:8px; }
  body.pg-open .ow-runbar>label { flex-basis:220px; }
  body.pg-open .og-workspace .btn,
  body.pg-open .ow-workspace .btn { padding:5px 8px; min-height:28px; font-size:11.5px; }
  /* Nachgemessen auf 1280x720: mit 185 px Abzug blieben 26 px unter dem Fensterrand – der Editor
     hätte doch gescrollt werden müssen. Mit 215 px passt er ganz aufs Bild. */
  #cad-frame.pg-frame { min-height:clamp(380px,calc(100vh - 215px),1400px); }
}

/* 7.11.2026 (Nachprüfung Codex, Befund 1): Wasserstrahl mit gebundener Position. Auf Tablet quer stand die Zeichnung erst bei Y 615,
   sichtbar blieben 129 px. Position neu übernehmen, Meldung, Stempel und Aktionen teilen sich jetzt eine Zeile. Nichts fällt weg. */
.pg-wj .pg-controls,.pg-wj .pg-tools{display:none}
.kcw-content>.pg-workspace.pg-wj .pg-msgrow{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
.kcw-content>.pg-workspace.pg-wj .pg-msgrow .pg-message{flex:1 1 100px;min-width:0}
.pg-workspace.pg-wj .pg-msgrow .pg-stamp{flex:0 1 150px;min-width:0;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pg-wj .pg-actions{margin-left:auto;flex:none;flex-wrap:nowrap}
/* Datei und Verlauf bekommen nur dann eine eigene Zeile, wenn es sie gibt */
.pg-wj .pg-files{order:8;flex:1 1 100%}
.pg-wj .pg-files:empty{display:none}
.pg-wj .pg-files a{padding:2px 8px}
.pg-wj .pg-history{flex:1 0 100%;order:9}
@media(min-width:1200px){.pg-workspace.pg-wj .pg-msgrow .pg-stamp{flex-basis:360px}}
body.pg-open:has(.pg-wj) .topbar{height:52px}
.kcw-workbench:has(.pg-wj){gap:6px}
.kcw-workbench:has(.pg-wj) .kcw-head{align-items:center;padding-bottom:4px}
.kcw-workbench:has(.pg-wj) .kcw-titleblock p{display:none}
.kcw-workbench:has(.pg-wj) #kcw-full{display:none}
body.pg-open:has(.pg-wj) .content{padding-top:10px;padding-bottom:12px}
/* Vollbild: das Programmfenster legt sich über das ganze ERP und kehrt auf Knopfdruck zurück, die Seite im Fenster lädt nicht neu */
body.pg-wj-vollbild .pg-wj .pg-frame{position:fixed;inset:0;z-index:1000;width:100vw;height:100dvh!important;min-height:0;border:0;border-radius:0}