/* Formulare web_forms. Werte nach ewikon-ng-ui, tokens/_colors.scss: accent, focus-border, control-border, control-invalid. Nur innerhalb der Formulare, die Website bleibt unberuehrt. */
.rfq-form,.invoice-form{--ewi-accent:#a90432;--ewi-focus-border:#bf4365;--ewi-control-border:#868e96;--ewi-control-invalid:#ff5b57;--ewi-invalid-stripe:4px;--ewi-green:#005857}
fieldset{border:var(--bs-border-width) solid var(--bs-border-color);padding:5px 10px;display:block;border-radius:.375rem}
.btn-add,.btn-delete{width:250px}
/* Feldgrenzen kraeftiger als der Website-Standard, Kontrast 3:1 (ewikon-ng-ui control-border) */
.rfq-form fieldset,.invoice-form fieldset,.rfq-form .form-control,.invoice-form .form-control,.rfq-form .form-select,.invoice-form .form-select,.rfq-form .form-check-input,.invoice-form .form-check-input,.rfq-form .input-group-text,.invoice-form .input-group-text{border-color:var(--ewi-control-border)}
/* Pflichtangaben: gruener Rahmen mit breitem Streifen links wie bis 2.0.2. Folgt dem required-Zustand, den rfq.js je nach Eingabe umschaltet. Ist das Feld ungueltig, ersetzt der rote Streifen den gruenen an derselben Stelle (Regeln weiter unten). Das linke Padding gleicht die Streifenbreite aus, der Text verrutscht beim Wechsel nicht. */
.rfq-form .form-control:required:not(.is-invalid),.invoice-form .form-control:required:not(.is-invalid),.rfq-form .form-select:required:not(.is-invalid),.invoice-form .form-select:required:not(.is-invalid){border-color:var(--ewi-green);border-left-width:5px;padding-left:calc(.75rem - 5px + var(--bs-border-width))}
.rfq-form fieldset.required:not(.is-invalid),.invoice-form fieldset.required:not(.is-invalid){border-color:var(--ewi-green);border-left-width:5px;padding-left:calc(10px - 5px + var(--bs-border-width))}
.rfq-form .form-control:required:not(.is-invalid):focus,.invoice-form .form-control:required:not(.is-invalid):focus,.rfq-form .form-select:required:not(.is-invalid):focus,.invoice-form .form-select:required:not(.is-invalid):focus{border-color:var(--ewi-focus-border);border-left-color:var(--ewi-green)}
.text-required-hint{color:var(--ewi-green)}
/* Fokus nach Hausregel: Formularelemente faerben nur den Rahmen, ohne Ring nach aussen. Knoepfe zeigen den Tastaturfokus als Rahmen in der Akzentfarbe. */
.rfq-form .form-control:focus,.invoice-form .form-control:focus,.rfq-form .form-select:focus,.invoice-form .form-select:focus,.rfq-form .form-check-input:focus,.invoice-form .form-check-input:focus{border-color:var(--ewi-focus-border);box-shadow:none}
.rfq-form .btn:focus-visible,.invoice-form .btn:focus-visible{outline:2px solid var(--ewi-accent);outline-offset:2px}
/* Ungueltig nach Hausregel: roter Streifen links, sonst normaler Rahmen, kein Symbol, auch bei Fokus. Das linke Padding schrumpft um die zusaetzliche Breite, der Text verrutscht nicht. */
.rfq-form .form-control.is-invalid,.invoice-form .form-control.is-invalid,.rfq-form .form-select.is-invalid,.invoice-form .form-select.is-invalid{border-color:var(--ewi-control-border);border-left:var(--ewi-invalid-stripe) solid var(--ewi-control-invalid);padding-left:calc(.75rem - var(--ewi-invalid-stripe) + var(--bs-border-width));background-image:none;padding-right:.75rem}
.rfq-form .form-select.is-invalid,.invoice-form .form-select.is-invalid{--bs-form-select-bg-icon:none;background-image:var(--bs-form-select-bg-img);padding-right:2.25rem}
.rfq-form .form-control.is-invalid:focus,.invoice-form .form-control.is-invalid:focus,.rfq-form .form-select.is-invalid:focus,.invoice-form .form-select.is-invalid:focus{border-color:var(--ewi-focus-border);border-left-color:var(--ewi-control-invalid);box-shadow:none}
.rfq-form fieldset.is-invalid,.invoice-form fieldset.is-invalid{border-left:var(--ewi-invalid-stripe) solid var(--ewi-control-invalid);padding-left:calc(10px - var(--ewi-invalid-stripe) + var(--bs-border-width))}
.rfq-form .form-check-input.is-invalid,.invoice-form .form-check-input.is-invalid{border-color:var(--ewi-control-border)}
.rfq-form .form-check-input.is-invalid~.form-check-label,.invoice-form .form-check-input.is-invalid~.form-check-label{color:inherit}
.card-header{background-color:#a80532;color:#fff;padding-top:0;padding-bottom:0;display:flex;align-items:center}
.card-header>div{margin:7px 0;font-size:17px;font-weight:bold;height:30px;line-height:30px;flex:1}
.card-header>button{border-radius:50%;height:30px;width:30px;line-height:30px;padding:0;margin-left:5px;background-color:#fff;color:#a90432;border:none;display:inline-flex;align-items:center;justify-content:center}
.card-header>button:hover{background-color:#fff;color:#005857}
.rfq-form .col-form-label,.invoice-form .col-form-label,.rfq-form .form-check-label,.invoice-form .form-check-label{hyphens:auto}
.rfq-form fieldset .form-check:last-child,.rfq-form fieldset .form-check-inline,.invoice-form fieldset .form-check:last-child,.invoice-form fieldset .form-check-inline{min-height:0;margin-bottom:0}
.rfq-form .form-check-input:checked,.invoice-form .form-check-input:checked{background-color:var(--ewi-accent);border-color:var(--ewi-accent)}
.rfq-form .btn-secondary,.invoice-form .btn-secondary{--bs-btn-color:#fff;--bs-btn-bg:#005857;--bs-btn-border-color:#005857;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#004b4a;--bs-btn-hover-border-color:#004646;--bs-btn-focus-shadow-rgb:38,113,112;--bs-btn-active-color:#fff;--bs-btn-active-bg:#004646;--bs-btn-active-border-color:#004241;--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#005857;--bs-btn-disabled-border-color:#005857}
/* Datei-Ablage nach EwikonFileDrop (ewikon-ng-ui, file-drop.scss). Werte aus tokens/_colors.scss: control #fff, control-hover #eff1f3, line #ced4da, text-muted #6c757d, error-text #bf4441. Schriftgroessen und Rundung wie die uebrigen Felder der Website. Symbole aus dem Font Awesome der Website. */
.ewi-file-drop{display:flex;flex-direction:column;gap:8px}
.ewi-file-drop__zone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:100%;padding:24px 16px;border:1px dashed var(--ewi-control-border);border-radius:var(--bs-border-radius);background-color:#fff;text-align:center;cursor:pointer;transition:background-color .1s ease,border-color .1s ease}
.ewi-file-drop__zone:hover{background-color:#eff1f3}
.ewi-file-drop__zone:focus,.ewi-file-drop__zone:focus-visible{outline:0;border-color:var(--ewi-focus-border)}
.ewi-file-drop__zone.dz-drag-hover{border-style:solid;border-color:var(--ewi-accent);background-color:color-mix(in srgb,var(--ewi-accent) 8%,#fff)}
.ewi-file-drop__zone .dz-message{display:flex;flex-direction:column;align-items:center;gap:6px;margin:0}
.ewi-file-drop__icon{color:var(--ewi-accent);font-size:2em}
.ewi-file-drop__hint{font-weight:bold}
.ewi-file-drop__details{color:#6c757d;font-size:.875em}
.ewi-file-drop__rejections,.ewi-file-drop__list{display:flex;flex-direction:column;gap:6px;margin:0;padding:0;list-style:none}
.ewi-file-drop__rejections:empty,.ewi-file-drop__list:empty{display:none}
.ewi-file-drop__rejection{display:flex;align-items:center;gap:6px;color:#bf4441;font-size:.875em}
.ewi-file-drop__item{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid #ced4da;border-radius:var(--bs-border-radius);background-color:#fff}
.ewi-file-drop__item-icon{flex:none;color:#6c757d}
.ewi-file-drop__item-body{display:flex;flex:1;flex-direction:column;gap:4px;min-width:0}
.ewi-file-drop__item-head{display:flex;align-items:baseline;gap:8px;min-width:0}
.ewi-file-drop__item-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ewi-file-drop__item-size{flex:none;color:#6c757d;font-size:.875em}
.ewi-file-drop__progress{height:4px;border-radius:2px;background-color:#ced4da;overflow:hidden}
.ewi-file-drop__progress-bar{width:0;height:100%;background-color:var(--ewi-accent);transition:width .1s linear}
.ewi-file-drop__remove{display:inline-flex;flex:none;align-items:center;justify-content:center;width:22px;height:22px;padding:0;border:none;border-radius:var(--bs-border-radius);background:transparent;color:#6c757d;cursor:pointer}
.ewi-file-drop__remove:hover{background-color:#eff1f3}
.ewi-file-drop__remove:focus-visible{outline:2px solid var(--ewi-accent);outline-offset:2px}
.ewi-file-drop__empty{margin:0;color:#6c757d;font-size:.875em}
.ewi-file-drop:has(.ewi-file-drop__item) .ewi-file-drop__empty{display:none}
/* Fehlerliste ueber dem Absende-Knopf, Streifen wie bei ungueltigen Feldern, Schrift in error-text (ewikon-ng-ui) */
.ewi-error-summary{display:table;max-width:100%;margin:0 auto 12px;padding:8px 12px;border-left:var(--ewi-invalid-stripe) solid var(--ewi-control-invalid);background-color:#fff;color:#bf4441;text-align:left}
.ewi-error-summary[hidden]{display:none}
.ewi-error-summary__head{margin:0 0 4px;font-weight:bold}
.ewi-error-summary__list{margin:0;padding-left:1.2em}
.ewi-error-summary__list a{color:#bf4441;text-decoration:underline}
.rfq-form .btn:disabled,.invoice-form .btn:disabled{cursor:progress}
/* Hoehen nach ewikon-ng-ui (tokens/_sizing.scss): field-height 30px, field-radius 4px, Kontrollkaestchen und Optionsfeld 20px. Die Bibliothek rechnet mit 12px Schrift (12 x 1,5 + 2 x 5 + 2 = 30). Die Formulare stehen in der Website mit 14px, deshalb Schrift 14px und Innenabstand 3,5px: 14 x 1,5 + 2 x 3,5 + 2 = 30. */
.rfq-form,.invoice-form{--ewi-field-height:30px;--ewi-field-radius:4px}
.rfq-form .form-control,.invoice-form .form-control,.rfq-form .form-select,.invoice-form .form-select,.rfq-form .input-group-text,.invoice-form .input-group-text,.rfq-form .btn:not(.btn-add):not(.btn-delete),.invoice-form .btn{font-size:14px;line-height:1.5;padding-top:3.5px;padding-bottom:3.5px;border-radius:var(--ewi-field-radius)}
.rfq-form .form-control:not(textarea),.invoice-form .form-control:not(textarea),.rfq-form .form-select,.invoice-form .form-select,.rfq-form .input-group-text,.invoice-form .input-group-text,.rfq-form .input-group>.btn,.invoice-form .input-group>.btn,.rfq-form #rfq-action-submit,.invoice-form #invoice-action-submit{height:var(--ewi-field-height)}
/* Eingabegruppen: Rundung nur an den Aussenkanten, wie Bootstrap, mit dem kleineren Radius */
.rfq-form .input-group>:not(:last-child),.invoice-form .input-group>:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}
.rfq-form .input-group>:not(:first-child),.invoice-form .input-group>:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}
.rfq-form .form-check-input,.invoice-form .form-check-input{width:20px;height:20px;margin-top:.5px}
.rfq-form .form-check-input[type=checkbox],.invoice-form .form-check-input[type=checkbox]{border-radius:var(--ewi-field-radius)}
.rfq-form .form-check,.invoice-form .form-check{padding-left:25px}
.rfq-form .form-check .form-check-input,.invoice-form .form-check .form-check-input{margin-left:-25px}
/* Einzeilige Auswahlgruppen auf Feldhoehe, damit sie mit den Feldern daneben fluchten */
.rfq-form fieldset,.invoice-form fieldset{padding-top:3.5px;padding-bottom:3.5px;border-radius:var(--ewi-field-radius)}
.rfq-form .col-form-label,.invoice-form .col-form-label{padding-top:4.5px;padding-bottom:4.5px}
