/* ============================================================
   Markenfarben Aufzugsservice Süd
   ============================================================ */
:root {
  --marke-blau:        #2A56E0;
  --marke-blau-dunkel: #1B3FB0;
  --marke-blau-hell:   #4E76E8;
  --marke-rot:         #E81E25;
  --marke-rot-dunkel:  #B7141A;
  --marke-grau:        #888888;
}

/* Bootstrap-Primary mit Markenfarbe überschreiben */
.bg-primary, .btn-primary { background-color: var(--marke-blau) !important; border-color: var(--marke-blau) !important; }
.btn-primary:hover, .btn-primary:focus { background-color: var(--marke-blau-dunkel) !important; border-color: var(--marke-blau-dunkel) !important; }
.text-primary { color: var(--marke-blau) !important; }
.border-primary { border-color: var(--marke-blau) !important; }
.btn-outline-primary { color: var(--marke-blau); border-color: var(--marke-blau); }
.btn-outline-primary:hover, .btn-outline-primary:focus {
  background-color: var(--marke-blau); border-color: var(--marke-blau); color: #fff;
}
a { color: var(--marke-blau); }
a:hover { color: var(--marke-blau-dunkel); }

/* Tabellen */
.table-anlagen td, .table-anlagen th { vertical-align: middle; }

/* Auftrag/Wartung Kacheln */
.kachel { border-left: 4px solid var(--marke-blau); }

/* Prioritäten */
.prio-4 { color: var(--marke-rot); font-weight: 700; }
.prio-3 { color: #d97706; font-weight: 600; }

/* Alerts */
.alert-success { --bs-alert-bg: #d1e7dd; }
.alert-error, .alert-danger { --bs-alert-bg: #f8d7da; }
.alert-warning { --bs-alert-bg: #fff3cd; }
.alert-info { --bs-alert-bg: #cff4fc; }

/* Logo im Header */
.navbar-brand img.logo { height: 36px; }
@media (max-width: 768px) {
  .navbar-brand { font-size: 1rem; }
  .navbar-brand img.logo { height: 28px; }
}

/* ===== Markenfarbene Navigationsleiste ===== */
.navbar.marke-navbar {
  background-color: var(--marke-blau) !important;
}
.navbar.marke-navbar .navbar-brand,
.navbar.marke-navbar .nav-link,
.navbar.marke-navbar .navbar-text,
.navbar.marke-navbar .nav-item .nav-link {
  color: #ffffff !important;
}
.navbar.marke-navbar .nav-link:hover,
.navbar.marke-navbar .nav-link:focus,
.navbar.marke-navbar .navbar-brand:hover {
  color: #ffe6e6 !important;
}
.navbar.marke-navbar .nav-link .badge { color: inherit; }
.navbar.marke-navbar .navbar-toggler {
  border-color: rgba(255,255,255,0.6);
}
.navbar.marke-navbar .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255,255,255,0.95%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
.navbar.marke-navbar .dropdown-menu {
  background-color: #ffffff;
}
.navbar.marke-navbar .dropdown-menu .dropdown-item { color: #222; }
.navbar.marke-navbar .dropdown-menu .dropdown-item:hover {
  background-color: var(--marke-blau);
  color: #fff;
}
.navbar.marke-navbar form input[type="search"] {
  background: #fff;
  color: #222;
}

/* Akzent-Rot für Notfälle, Stornierung etc. */
.text-marke-rot { color: var(--marke-rot) !important; }
.bg-marke-rot { background-color: var(--marke-rot) !important; color: #fff; }

/* ============================================================
   Mobile Bedienbarkeit nach Apple HIG — Stufe 1
   (Tap-Ziele 44 px, keine Zoom-Falle bei Eingaben, Safe Area)
   ============================================================ */

/* iOS/Safari zoomt beim Antippen in JEDES Eingabefeld hinein, dessen
   Schrift kleiner als 16 px ist — danach ist das Layout verrutscht.
   Darum auf schmalen Geraeten alle Felder auf mindestens 16 px.
   Gilt bewusst fuer alle Rollen, nicht nur fuer Techniker. */
@media (max-width: 991.98px) {
  .form-control, .form-select,
  .form-control-sm, .form-select-sm,
  input[type="text"], input[type="number"], input[type="date"],
  input[type="time"], input[type="datetime-local"], input[type="search"],
  input[type="email"], input[type="password"], input[type="tel"],
  textarea, select {
    font-size: 16px !important;
  }
}

/* Im Vollbild-Modus (vom Home-Bildschirm gestartet) liegt der Inhalt
   unter der Statusleiste bzw. ueber der Home-Anzeige — Platz freihalten. */
/* Im Vollbild-Modus nur unten Platz lassen (Home-Anzeige). Oben braucht
   es keinen Abstand mehr, seit die Statusleiste nicht mehr durchscheinend
   ist — sonst entsteht ein leerer blauer Streifen ueber der Knopfleiste. */
@media (display-mode: standalone) {
  body { padding-bottom: env(safe-area-inset-bottom); }
}

/* ------------------------------------------------------------
   Ab hier nur die Technikeransicht (body.techniker-ui)
   ------------------------------------------------------------ */

/* Doppeltipp-Zoom-Verzoegerung raus, Textgroesse nicht automatisch
   aufblasen (Querformat auf dem iPhone). */
body.techniker-ui { -webkit-text-size-adjust: 100%; }
body.techniker-ui a,
body.techniker-ui .btn,
body.techniker-ui .form-check-input,
body.techniker-ui label { touch-action: manipulation; }

/* HIG-Mindestgroesse fuer alles Antippbare: 44 x 44 px */
/* WICHTIG: hier NICHT auf flex umstellen — viele Knoepfe enthalten
   <strong>…</strong><br><small>…</small>. Als Flex-Container wird das <br>
   ignoriert, die Zeilen stehen nebeneinander und werden abgeschnitten.
   Darum nur Hoehe + Innenabstand, Darstellung bleibt inline-block. */
body.techniker-ui .btn,
body.techniker-ui .page-link {
  min-height: 44px;
  padding-top: .55rem;
  padding-bottom: .55rem;
}
body.techniker-ui .dropdown-item {
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: .45rem;
}
/* Kleine Knoepfe in der Technikeransicht nicht verkleinern */
body.techniker-ui .btn-sm,
body.techniker-ui .btn-group-sm > .btn {
  font-size: 1rem;
  padding: .55rem .9rem;
}
/* Reine Icon-Knoepfe bleiben quadratisch statt in die Breite zu laufen */
body.techniker-ui .btn.btn-icon { min-width: 44px; }

/* Haken in Checklisten: groesser und mit groesserer Trefferflaeche */
body.techniker-ui .form-check-input {
  width: 1.4em;
  height: 1.4em;
  margin-top: .15em;
}
body.techniker-ui .form-check {
  min-height: 44px;
  display: flex;
  align-items: center;
}
body.techniker-ui .form-check .form-check-label { padding-left: .4rem; }

/* Tabellenzeilen luftiger — Zeile als Ganzes ist das Tap-Ziel */
body.techniker-ui .table td,
body.techniker-ui .table th {
  padding-top: .65rem;
  padding-bottom: .65rem;
}

/* Kleinschrift im Keller lesbar halten */
body.techniker-ui .small,
body.techniker-ui small { font-size: .9rem; }

/* Top-Bar: fuenf Punkte (inkl. Zurueck) muessen auch aufs iPhone SE passen */
body.techniker-ui .techniker-nav-icon { min-height: 44px; }
@media (max-width: 400px) {
  .techniker-nav-icon { min-width: 54px; padding-left: 4px; padding-right: 4px; }
  .techniker-nav-icon i { font-size: 1.25rem; }
}

/* Icon-Knoepfe in Tabellen schmaler halten, damit die Spalten nicht
   auseinanderlaufen — die Hoehe von 44 px bleibt. */
body.techniker-ui .table .btn-sm {
  padding-left: .5rem;
  padding-right: .5rem;
}
