/* Solisar Cockpit — Basis-Styles (mobil-first) */
:root {
  --farbe-hintergrund: #f4f6f9;
  --farbe-karte: #ffffff;
  --farbe-text: #1c2733;
  --farbe-linie: #dde3ea;
  --farbe-markant: #e8930c;
  --farbe-dunkel: #10222f;
  --farbe-gut: #1d7a4c;
  --farbe-gefahr: #b23a2f;
}

* { box-sizing: border-box; }
body {
  margin: 0; font-family: system-ui, "Segoe UI", sans-serif;
  background: var(--farbe-hintergrund); color: var(--farbe-text); line-height: 1.5;
}
a { color: var(--farbe-dunkel); }
code { background: #eef1f5; padding: .05rem .3rem; border-radius: .25rem; }

/* Kopf & Navigation */
.kopf {
  display: flex; flex-wrap: wrap; align-items: center; gap: .6rem;
  background: var(--farbe-dunkel); color: #fff; padding: .6rem .9rem;
}
.kopf a { color: #fff; text-decoration: none; }
.logo { font-weight: 700; }
.nav { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; font-size: .95rem; }
.rollen-badge {
  background: rgba(255,255,255,.15); border-radius: 999px;
  padding: .1rem .6rem; font-size: .8rem;
}
.link-btn {
  background: none; border: none; color: inherit; cursor: pointer;
  text-decoration: underline; padding: 0; font: inherit;
}
.inline-form { display: inline; }

.inhalt { max-width: 60rem; margin: 0 auto; padding: 1rem; }

/* Meldungen */
.meldungen { list-style: none; padding: 0; }
.meldungen li {
  border-radius: .4rem; padding: .55rem .8rem; margin-bottom: .5rem;
  background: #eaf2ea; border: 1px solid #bcd9bd;
}
.meldungen li.error, .meldungen li.danger { background: #f9ebe9; border-color: #ddb3ae; }
.meldungen li.warning { background: #fdf4e3; border-color: #ecd9ad; }

/* Karten & Seitenkopf */
.karte {
  background: var(--farbe-karte); border: 1px solid var(--farbe-linie);
  border-radius: .6rem; padding: 1rem 1.1rem; margin-bottom: 1rem;
}
.karte.warnung { border-left: 4px solid var(--farbe-markant); background: #fffdf7; }
.seitenkopf {
  display: flex; flex-wrap: wrap; align-items: center;
  justify-content: space-between; gap: .6rem; margin-bottom: .8rem;
}
.seitenkopf h1 { margin: 0; font-size: 1.25rem; }

/* Knöpfe */
.knopf {
  display: inline-block; background: var(--farbe-markant); color: #fff;
  border: none; border-radius: .45rem; padding: .45rem .85rem;
  font-size: .92rem; cursor: pointer; text-decoration: none;
}
.knopf:hover { filter: brightness(1.08); }
.knopf.sekundaer { background: #eef1f5; color: var(--farbe-text); border: 1px solid var(--farbe-linie); }
.knopf.gefahr { background: var(--farbe-gefahr); }
.gefahr-text { color: var(--farbe-gefahr); }

/* Status-Badges */
.status-badge {
  display: inline-block; border-radius: 999px; padding: .12rem .6rem;
  font-size: .78rem; background: #eef1f5; border: 1px solid var(--farbe-linie);
}
.status-badge.status-abgeschlossen, .status-badge.status-genehmigt,
.status-badge.status-freigegeben { background: #e6f4ec; border-color: #a9d8bd; color: var(--farbe-gut); }
.status-badge.status-verloren, .status-badge.status-abgelehnt { background: #f9ebe9; border-color: #ddb3ae; color: var(--farbe-gefahr); }

/* Details-Listen */
dl.details { margin: 0; }
dl.details dt { font-size: .78rem; text-transform: uppercase; color: #667; letter-spacing: .04em; margin-top: .6rem; }
dl.details dd { margin: .1rem 0 0; }

/* Filter / Suche / Listen */
.filter { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .8rem; }
.filter a {
  border: 1px solid var(--farbe-linie); border-radius: 999px;
  padding: .18rem .7rem; text-decoration: none; font-size: .88rem; background: #fff;
}
.filter a.aktiv { background: var(--farbe-dunkel); color: #fff; border-color: var(--farbe-dunkel); }
.suche { margin-bottom: .8rem; }
.suche input {
  width: 100%; padding: .5rem .7rem; border: 1px solid var(--farbe-linie);
  border-radius: .45rem; font: inherit;
}
ul.liste { list-style: none; margin: 0; padding: 0; }
.listen-eintrag {
  background: var(--farbe-karte); border: 1px solid var(--farbe-linie);
  border-radius: .55rem; padding: .65rem .85rem; margin-bottom: .5rem;
}
.listen-eintrag a { text-decoration: none; display: block; }
.leer { color: #667; font-style: italic; list-style: none; }
.sekundaer, .sekundaer-link { color: #667; font-size: .88rem; }
.sekundaer span, span.sekundaer { display: block; }

/* Formulare */
form.formular label, form.karte label, .karte > label { display: block; margin-top: .7rem; font-size: .88rem; }
input:not([type="checkbox"]):not([type="radio"]), select, textarea {
  width: 100%; padding: .5rem .6rem; border: 1px solid var(--farbe-linie);
  border-radius: .45rem; font: inherit; margin-top: .15rem; background: #fff;
}
button[type="submit"] { margin-top: .9rem; }
.form-schmal { max-width: 26rem; }
table.positionen-editor td { padding: .2rem; }

/* Kalender */
.wochen-grid { display: grid; grid-template-columns: repeat(7, minmax(9rem, 1fr)); gap: .5rem; overflow-x: auto; }
.tag-spalte h2 { font-size: .85rem; margin: .2rem 0 .5rem; }
.tag-spalte.heute h2 { color: var(--farbe-markant); }
.termin-karte.art-montage { border-left: 4px solid var(--farbe-markant); }
.termin-karte.art-beratung { border-left: 4px solid #4a90d9; }
.termin-karte.art-service { border-left: 4px solid #7d63c9; }
.fortschritt strong { font-size: 1.1rem; }

/* Checklisten */
.checklisten-punkt { display: flex; align-items: center; gap: .6rem; }
.checklisten-punkt.erledigt .punkt-text { color: #667; text-decoration: line-through; }
.haekchen-btn {
  width: 1.9rem; height: 1.9rem; border-radius: 50%;
  border: 2px solid #99a; background: #fff; cursor: pointer; font-size: 1rem; color: transparent;
}
.haekchen-btn.aktiv { border-color: var(--farbe-gut); background: var(--farbe-gut); color: #fff; }

/* Fotos */
.foto-karte { display: inline-block; margin: 0 .6rem .6rem 0; }
.foto-karte img { max-width: 10rem; max-height: 8rem; border-radius: .4rem; border: 1px solid var(--farbe-linie); }
.foto-meta { font-size: .78rem; color: #667; }

/* Mail-Entwürfe */
.mail-text {
  white-space: pre-wrap; background: #f2f5f9; border: 1px solid var(--farbe-linie);
  border-radius: .35rem; padding: .75rem 1rem; font-family: inherit; font-size: .92rem;
}
.entwurf h2 { font-size: 1rem; }

@media (min-width: 48rem) {
  body { font-size: .98rem; }
}