/* fit.technology/direktanfrage — eigene Regeln, alle mit Praefix fda- (Carl 04.10.2026).
   Baut auf bootstrap.min.css, fit-style.css (--fitblue, --fityellow, Trebuchet) und styleguide.min.css auf.
   Gestaltung: weiss, eckig, feine Rahmen (#e6eaf0 wie serviceTiles), dezente Schatten. */
body.fda { background:#fff; color:#1b2b48; font-family:var(--bs-font-sans-serif); }
.fda a { color:var(--fitblue); }
.fda :focus-visible { outline:2px solid var(--fityellow); outline-offset:2px; }

/* Kopf: Logo, Navigation, Sprache, Zurueck, Neu laden; Burger unter 768 px */
.fda-kopf { position:sticky; top:0; z-index:30; background:#fff; border-bottom:1px solid #e6eaf0; box-shadow:0 1px 4px rgba(37,61,102,.06); }
.fda-kopf-in { max-width:1200px; margin:0 auto; padding:0 16px; min-height:64px; display:flex; align-items:center; gap:18px; }
.fda-logo img { display:block; height:44px; width:auto; }
.fda-nav { display:flex; gap:26px; margin-right:auto; }
.fda-nav a { color:#1b2b48; text-decoration:none; font-size:15px; }
.fda-nav a:hover { color:var(--fitblue); text-decoration:underline; text-decoration-color:var(--fityellow); text-underline-offset:6px; }
.fda-werkzeug { display:flex; align-items:center; gap:8px; }
.fda-sprache { font-size:13px; font-weight:700; text-decoration:none; border:1px solid #e6eaf0; padding:5px 8px; }
.fda-knopf-klein, .fda-burger { font:inherit; font-size:13px; background:#fff; color:#1b2b48; border:1px solid #e6eaf0; padding:5px 10px; border-radius:0; cursor:pointer; }
.fda-knopf-klein:hover, .fda-burger:hover { border-color:var(--fitblue); }
.fda-burger { display:none; font-size:18px; line-height:1; }

/* Fortschritt */
.fda-main { max-width:1200px; margin:0 auto; padding:26px 16px 120px; }
.fda-schritte { list-style:none; display:flex; align-items:center; gap:0; margin:0 0 26px; padding:0; background:transparent; }
.fda-schritt { display:flex; align-items:center; gap:10px; flex:1 1 0; min-width:0; color:#5b6b82; font-size:14px; }
.fda-schritt:not(:last-child)::after { content:""; flex:1 1 auto; height:1px; background:#d5dbe3; margin:0 14px; min-width:12px; }
.fda-nr { flex:0 0 auto; display:inline-grid; place-items:center; width:32px; height:32px; border-radius:50%; border:1.5px solid #c2cad5; background:#fff; font-weight:700; color:#5b6b82; }
.fda-st-aktiv .fda-nr { background:var(--fitblue); border-color:var(--fitblue); color:#fff; }
.fda-st-aktiv .fda-sname { color:var(--fitblue); font-weight:700; }
.fda-st-fertig .fda-nr { background:var(--fitblue); border-color:var(--fitblue); color:#fff; font-size:15px; }
.fda-sname { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.fda-h1 { font-size:clamp(26px, 3.6vw, 38px); font-weight:800; color:var(--fitblue); margin:0 0 6px; text-wrap:balance; }
.fda-unter { color:#5b6b82; font-size:17px; margin:0 0 22px; }

/* Filter */
.fda-filter { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:20px; }
.fda-filterknopf { font:inherit; font-size:14px; background:#fff; color:#1b2b48; border:1px solid #d5dbe3; border-radius:0; padding:8px 20px; cursor:pointer; }
.fda-filterknopf:hover { border-color:var(--fitblue); }
.fda-filterknopf.aktiv { background:var(--fitblue); border-color:var(--fitblue); color:#fff; }

/* Kachelraster: 4 Spalten Desktop, 3 Tablet, 2 Handy */
.fda-raster { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:14px; }
.fda-kachel { font:inherit; text-align:left; background:#fff; border:1px solid #e6eaf0; border-radius:0; padding:0; cursor:pointer;
  display:flex; flex-direction:column; box-shadow:0 1px 2px rgba(37,61,102,.06); transition:border-color .15s, box-shadow .15s; color:#1b2b48; }
.fda-kachel:hover { border-color:#b8c3d2; box-shadow:0 4px 14px rgba(37,61,102,.10); }
.fda-kachel[aria-pressed="true"] { border:2px solid var(--fityellow); box-shadow:0 0 0 2px rgba(252,186,0,.25); }
.fda-kachel[hidden] { display:none; }
.fda-bild { display:block; aspect-ratio:16/10; background:#f4f6f9; overflow:hidden; }
.fda-bild img { width:100%; height:100%; object-fit:cover; display:block; }
.fda-platzhalter { display:grid; place-items:center; height:100%; padding:10px; text-align:center; font-size:13px; color:#8a94a0;
  background:repeating-linear-gradient(135deg, #f4f6f9 0 10px, #eef1f5 10px 20px); border-bottom:1px dashed #c8d0db; }
.fda-text { display:flex; flex-direction:column; gap:2px; padding:10px 12px 12px; }
.fda-titel { font-weight:700; font-size:16px; color:#1b2b48; }
.fda-verf { font-size:13.5px; color:#5b6b82; }
.fda-offen { justify-content:center; align-items:center; text-align:center; background:#fbfcfd; min-height:100%; }
.fda-offen .fda-offen-icon { color:var(--fitblue); margin-top:18px; }
.fda-offen .fda-text { align-items:center; }
.fda-leer { color:#5b6b82; margin:14px 0; }

/* Auswahl-Leiste unten */
.fda-leiste { position:sticky; bottom:0; margin-top:18px; background:#fff; border:1px solid #e6eaf0; box-shadow:0 -2px 10px rgba(37,61,102,.06);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; padding:10px 12px; }
.fda-auswahl { color:#5b6b82; font-size:15px; }
.fda-auswahl b { color:#1b2b48; }
.fda-weiter { background:var(--fityellow); color:#1b2b48 !important; font-weight:700; text-decoration:none; padding:11px 22px; border:0; white-space:nowrap; }
.fda-weiter:hover { background:#e9ac00; }
.fda-weiter[aria-disabled="true"] { background:#f1f3f6; color:#8a94a0 !important; pointer-events:none; }

.fda-hinweis { border:1px solid #e6eaf0; border-left:4px solid var(--fityellow); background:#fffbea; padding:12px 14px; margin:12px 0 18px; max-width:72ch; }
.fda-fehler { border-left-color:#b42318; background:#fdecea; }
.fda-zurueck-link { font-weight:700; text-decoration:none; }

.fda-fuss { max-width:1200px; margin:0 auto; padding:18px 16px 28px; display:flex; flex-wrap:wrap; gap:18px; font-size:13px; color:#5b6b82; border-top:1px solid #e6eaf0; }
.fda-entwicklung { background:#fff4d1; border:1px solid var(--fityellow); padding:1px 8px; color:#6b4d00; margin-right:auto; }

@media (max-width: 991px) { .fda-raster { grid-template-columns:repeat(3, minmax(0,1fr)); } }
@media (max-width: 768px) {
  .fda-burger { display:inline-block; }
  .fda-nav { display:none; position:absolute; left:0; right:0; top:64px; background:#fff; border-bottom:1px solid #e6eaf0; flex-direction:column; gap:0; padding:6px 16px 12px; }
  .fda-nav.offen { display:flex; }
  .fda-nav a { padding:10px 0; border-bottom:1px solid #f0f2f5; }
  .fda-kopf-in { gap:10px; }
  .fda-werkzeug { margin-left:auto; }
  .fda-lbl { display:none; }
  .fda-raster { grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px; }
  .fda-sname { display:none; }
  .fda-st-aktiv .fda-sname { display:inline; overflow:visible; }
  .fda-st-aktiv { flex:2.4 1 0; }
  .fda-schritt:not(:last-child)::after { margin:0 8px; }
  .fda-titel { font-size:15px; }
  .fda-leiste { margin-inline:-4px; }
  .fda-weiter { width:100%; text-align:center; }
}
@media (prefers-reduced-motion: reduce) { .fda-kachel { transition:none; } }

/* ---------- Schritt 2: Details ---------- */
.fda-schritt-link { display:flex; align-items:center; gap:10px; text-decoration:none; color:inherit; min-width:0; }
.fda-s2-kopf { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
.fda-s2-bild { width:180px; max-width:34%; aspect-ratio:16/10; object-fit:cover; border:1px solid #e6eaf0; }
.fda-h2 { font-size:16px; font-weight:700; color:#1b2b48; margin:0 0 10px; }
.fda-s2 { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.5fr); gap:22px; margin-top:6px; }
.fda-upload { border:1px dashed #c8d0db; padding:16px; background:#fbfcfd; align-self:start; }
.fda-ablage { display:flex; flex-direction:column; align-items:center; gap:10px; padding:16px 8px; color:var(--fitblue); border:1px dashed transparent; }
.fda-ablage.ziel { border-color:var(--fityellow); background:#fffbea; }
.fda-knopf-datei { display:inline-block; background:#eef1f5; border:1px solid #c8d0db; color:#1b2b48; padding:9px 18px; cursor:pointer; font-weight:600; }
.fda-knopf-datei:hover { border-color:var(--fitblue); }
.fda-unsichtbar:focus-visible + .fda-ablage-text, .fda-unsichtbar:focus + .fda-ablage-text { outline:2px solid var(--fityellow); }
.fda-unsichtbar { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.fda-ablage-text { font-size:13px; color:#5b6b82; }
.fda-formate { font-size:12.5px; color:#5b6b82; margin:6px 0 0; }
.fda-dateiliste { list-style:none; margin:12px 0 0; padding:0; display:grid; gap:6px; }
.fda-dateiliste li { display:grid; grid-template-columns:minmax(0,1fr) auto auto auto; gap:8px; align-items:center; background:#fff; border:1px solid #e6eaf0; padding:6px 8px; font-size:13.5px; }
.fda-dname { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#1b2b48; }
.fda-dgross { color:#5b6b82; font-size:12.5px; white-space:nowrap; }
.fda-dweg { font:inherit; border:1px solid #e6eaf0; background:#fff; color:#5b6b82; width:28px; height:28px; cursor:pointer; border-radius:0; }
.fda-dweg:hover { color:#b42318; border-color:#b42318; }
.fda-dfortschritt { grid-column:1 / -1; height:4px; background:#eef1f5; }
.fda-dfortschritt span { display:block; height:100%; width:0; background:var(--fityellow); transition:width .2s; }
.fda-dfehler { grid-column:1 / -1; color:#b42318; font-size:12.5px; }
.fda-dweg { grid-column:4; }
.fda-d3d { grid-column:3; font:inherit; font-size:12px; font-weight:700; border:1px solid var(--fitblue); background:#fff; color:var(--fitblue); height:28px; padding:0 9px; cursor:pointer; border-radius:0; }
.fda-d3d:hover, .fda-d3d:focus-visible { background:var(--fitblue); color:#fff; }
/* 3D-Vorschau (fda-3d.js) */
.fda-3d { margin-top:14px; border:1px solid #e6eaf0; background:#fff; }
.fda-3d[hidden], .fda-3d-status[hidden] { display:none; }
.fda-3d-kopf { display:flex; align-items:center; gap:6px; padding:6px 8px 6px 12px; border-bottom:1px solid #e6eaf0; }
.fda-3d-kopf b { flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; color:#1b2b48; }
.fda-3d-knopf { font:inherit; font-size:15px; line-height:1; border:1px solid #e6eaf0; background:#fff; color:var(--fitblue); width:34px; height:34px; cursor:pointer; border-radius:0; }
.fda-3d-knopf:hover { border-color:var(--fitblue); }
.fda-3d-buehne { position:relative; width:100%; aspect-ratio:4 / 3; max-height:62vh; background:#f4f6f9; overflow:hidden; }
.fda-3d-leinwand { display:block; width:100%; height:100%; cursor:grab; }
.fda-3d-leinwand:active { cursor:grabbing; }
.fda-3d-status { position:absolute; inset:0; margin:0; display:flex; align-items:center; justify-content:center; text-align:center; padding:16px; font-size:14px; color:#5b6b82; background:rgba(244,246,249,.88); }
.fda-3d-werte { display:grid; grid-template-columns:auto minmax(0,1fr); gap:5px 14px; margin:0; padding:10px 12px 6px; font-size:13.5px; }
.fda-3d-werte:empty { display:none; }
.fda-3d-werte dt { color:#5b6b82; font-weight:400; }
.fda-3d-werte dd { margin:0; color:#1b2b48; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.fda-3d-werte dd.fda-3d-zeile { grid-column:1 / -1; margin-bottom:3px; }
.fda-3d-werte dd.fda-3d-ok { color:#145c33; font-weight:700; }
.fda-3d-werte dd.fda-3d-warnung { color:#8a5a00; font-weight:700; }
.fda-3d-werte dd.fda-3d-fehler { color:#b42318; font-weight:700; }
.fda-3d-hilfe { margin:0; padding:4px 12px 10px; font-size:12px; color:#5b6b82; }
@media (max-width:480px) { .fda-3d-werte { grid-template-columns:minmax(0,8.5em) minmax(0,1fr); gap:5px 10px; } }
.fda-felder { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:14px 18px; align-content:start; }
.fda-feld { display:flex; flex-direction:column; gap:5px; min-width:0; border:0; padding:0; margin:0; }
.fda-feld > label, .fda-feld > legend { font-size:14px; font-weight:600; color:#1b2b48; margin:0; float:none; width:auto; padding:0; }
.fda-feld input[type=text], .fda-feld input[type=number], .fda-feld input[type=date], .fda-feld select, .fda-feld textarea {
  font:inherit; font-size:15px; color:#1b2b48; background:#fff; border:1px solid #c8d0db; border-radius:0; padding:9px 10px; width:100%; }
.fda-feld textarea { resize:vertical; min-height:96px; }
.fda-feld input:focus, .fda-feld select:focus, .fda-feld textarea:focus { border-color:var(--fitblue); outline:2px solid rgba(252,186,0,.6); outline-offset:0; }
.fda-feld [aria-invalid="true"] { border-color:#b42318; background:#fffafa; }
.fda-breit { grid-column:1 / -1; }
.fda-check { display:flex; align-items:center; gap:8px; font-size:15px; font-weight:400; padding:3px 0; }
.fda-feldfehler { color:#b42318; font-size:13px; margin:0; }
.fda-hinweis ul { margin:6px 0 0; padding-left:18px; }
.fda-s2-knoepfe { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:22px; padding-top:16px; border-top:1px solid #e6eaf0; }
.fda-knopf-zurueck { border:1px solid #c8d0db; padding:11px 28px; text-decoration:none; color:#1b2b48 !important; background:#fff; }
.fda-knopf-zurueck:hover { border-color:var(--fitblue); }
.fda-s2-knoepfe .fda-weiter { border:0; cursor:pointer; font:inherit; font-weight:700; }
.fda-zusammen { border:1px solid #e6eaf0; padding:12px 14px; max-width:60ch; }
.fda-zusammen p { margin:2px 0; }
@media (max-width: 768px) {
  .fda-s2 { grid-template-columns:minmax(0,1fr); }
  .fda-felder { grid-template-columns:minmax(0,1fr); }
  .fda-s2-bild { display:none; }
  .fda-s2-knoepfe { flex-direction:column-reverse; align-items:stretch; }
  .fda-knopf-zurueck { text-align:center; }
}

/* ---------- Schritt 3: Konto, Schritt 4: Pruefen ---------- */
.fda-abmelden { display:flex; align-items:center; gap:8px; margin:0; }
.fda-wer { font-size:13px; color:#5b6b82; max-width:180px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fda-s3 { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:26px; align-items:start; }
.fda-konto { min-width:0; }
.fda-kform { display:grid; gap:12px; max-width:520px; }
.fda-kzwei { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px 14px; }
.fda-registrierung { margin-top:18px; }
.fda-kform-breit { max-width:none; }
.fda-kform .fda-feld input[type=email], .fda-kform .fda-feld input[type=text], .fda-kform .fda-feld input[type=tel], .fda-kform .fda-feld select {
  font:inherit; font-size:15px; color:#1b2b48; background:#fff; border:1px solid #c8d0db; border-radius:0; padding:9px 10px; width:100%; }
.fda-kform .fda-feld input:focus { border-color:var(--fitblue); outline:2px solid rgba(252,186,0,.6); outline-offset:0; }
.fda-voll { width:100%; text-align:center; }
.fda-weiter:disabled, .fda-weiter[aria-disabled="true"] { background:#f1f3f6 !important; color:#8a94a0 !important; cursor:not-allowed; }
.fda-knopf-zweit { font:inherit; display:inline-block; background:#fff; border:1px solid #c8d0db; color:#1b2b48 !important; padding:9px 16px; text-decoration:none; cursor:pointer; border-radius:0; }
.fda-knopf-zweit:hover { border-color:var(--fitblue); }
.fda-zeile { display:flex; flex-wrap:wrap; gap:10px; margin-top:10px; }
.fda-ok { border:1px solid #a3cfbb; background:#e6f4ec; padding:14px 16px; }
.fda-ok .fda-h2 { color:#145c33; }
.fda-ok-kurz { margin:0 0 16px; max-width:72ch; }
.fda-ok-kurz p { margin:0; color:#145c33; }
.fda-klein { font-size:13.5px; color:#5b6b82; margin:4px 0; }
.fda-aside { background:#fbfcfd; border:1px solid #e6eaf0; padding:16px; }
.fda-zus-kopf { display:flex; align-items:center; gap:12px; margin-bottom:10px; }
.fda-zus-kopf img { width:84px; height:56px; object-fit:cover; border:1px solid #e6eaf0; }
.fda-zus { display:grid; grid-template-columns:auto minmax(0,1fr); gap:6px 14px; margin:0 0 8px; font-size:14px; }
.fda-zus dt { color:#5b6b82; font-weight:400; }
.fda-zus dd { margin:0; color:#1b2b48; overflow-wrap:anywhere; }
.fda-aendern { font-size:13px; margin-left:8px; }
.fda-s4 { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:18px; align-items:start; }
.fda-zus-karte { border:1px solid #e6eaf0; padding:16px; background:#fff; }
@media (max-width: 768px) {
  .fda-s3, .fda-s4 { grid-template-columns:minmax(0,1fr); }
  .fda-kzwei { grid-template-columns:minmax(0,1fr); }
  .fda-wer { display:none; }
}

/* ---------- Schritt 4: Absenden, Erfolg ---------- */
.fda-absende-hinweis { flex:1 1 260px; text-align:right; }
.fda-fertig { margin-bottom:16px; }
.fda-fertig .fda-h1 { color:#145c33; font-size:clamp(22px, 3vw, 30px); }
@media (max-width: 768px) { .fda-absende-hinweis { text-align:left; flex:0 0 auto; } }   /* sonst wirken 260px in der Spalte als Hoehe */

/* Phase 7: Preis aus freigegebener Regel bzw. TEST-Anzeige fuer FIT-Mitarbeiter */
.fda-preis { border:1px solid #e6eaf0; border-left:4px solid var(--fitblue, #253D66); background:#fff; padding:14px 16px; margin:16px 0 4px; max-width:72ch; }
.fda-preis-betrag { font-size:1.6rem; font-weight:700; color:#253D66; margin:4px 0; }
.fda-preis-test { border-left-color:#B42318; background:#FDECEA; }
.fda-test-marke { display:inline-block; font-size:.75rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#fff; background:#B42318; padding:2px 8px; margin:0 0 6px; }
.fda-s2-knoepfe .fda-weiter.fda-zweit { background:#fff; border:2px solid var(--fityellow); color:#1b2b48 !important; }
.fda-s2-knoepfe .fda-weiter.fda-zweit:hover { background:#fffbea; }
.fda-vorschau-leiste { background:#FDECEA; border:1px solid #f1aeb5; color:#7a1a12; padding:8px 12px; margin:10px 0 0; font-size:.9rem; }
.fda-vorschau-leiste a { margin-left:8px; }

/* Angaben je Bauteil (Carl 07.10.2026) -------------------------------------
   Die Liste ist jetzt eine Auswahl, nicht nur eine Aufzaehlung: eine Zeile ist
   aktiv, und die Felder oben gehoeren zu ihr. Das muss man sehen koennen. */
.fda-dateiliste li { cursor: pointer; }
.fda-dateiliste li.aktiv {
    background: #eef3fa;
    box-shadow: inset 3px 0 0 #22324d;
}
/* Der Entfernen-Knopf bleibt ein Knopf, kein Teil der Auswahlflaeche */
.fda-dateiliste li .fda-dweg { cursor: pointer; }
/* zweite Zeile: Verfahren, Werkstoff, Nacharbeit, Stueckzahl - gedaempft, damit
   der Dateiname die Zeile anfuehrt */
.fda-dinfo {
    flex: 1 0 100%;
    margin-top: 2px;
    font-size: .86em;
    color: #5a6577;
}
.fda-dinfo:empty { display: none; }
.fda-teil-hinweis {
    margin: 0 0 10px;
    font-size: .92em;
    color: #5a6577;
}
