:root { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
body { margin: 0; background: #f6f7f9; color: #111; }
.container { max-width: 1100px; margin: 0 auto; padding: 16px; }
.topbar { background: #111; color: #fff; }
.topbar__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.brand { display: flex; align-items: center; gap: 10px; }
.brand__logo { width: 34px; height: 34px; border-radius: 10px; background: #fff; color: #111; display:flex; align-items:center; justify-content:center; font-weight: 900; }
.brand__name { font-weight: 900; }
.brand__sub { font-size: 12px; opacity: 0.85; }
.nav { display: flex; align-items: center; gap: 10px; }
.nav__link { color: #fff; text-decoration: none; opacity: 0.9; }
.nav__link:hover { opacity: 1; text-decoration: underline; }
.btn { display:inline-block; padding: 10px 12px; border-radius: 10px; text-decoration:none; border: 1px solid rgba(255,255,255,0.2); color:#fff; }
.btn--primary { background: #2563eb; border-color: #2563eb; }
.card { background:#fff; border-radius: 14px; padding: 16px; box-shadow: 0 8px 24px rgba(0,0,0,0.06); }
.footer { padding: 18px 0; color: #444; }
.footer__inner { display:flex; justify-content: space-between; gap: 16px; font-size: 13px; }
.muted { color: #666; }
/* =========================
BEGIN PATCH /volume1/docker/glassuite/web/app/static/app.css : Topbar Widget
========================= */
.brand__widget {
  margin-top: 6px;
  font-size: 12px;
  opacity: 0.9;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  line-height: 1.2;
}

.brand__widget .bw__sep {
  opacity: 0.6;
}

.brand__widget .bw__time {
  font-weight: 800;
}
/* =========================
END PATCH
========================= */
/* =========================
BEGIN PATCH /volume1/docker/glassuite/web/app/static/app.css : Topbar Widget Feinschliff
========================= */
.brand__widget {
  margin-top: 6px;
  font-size: 12px;
  opacity: 0.95;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  line-height: 1.2;
}

.brand__widget .bw__sep {
  opacity: 0.55;
}

.brand__widget .bw__time {
  font-weight: 900;
  font-size: 14px; /* groesser */
}

.brand__widget .bw__date {
  font-size: 13px;
}
/* =========================
END PATCH
========================= */



/* ===== BEGIN Widget-Feinschliff (Topbar) ===== */
.brand__widget {
  margin-top: 6px;
  font-size: 12px;
  opacity: 0.95;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  line-height: 1.2;
}

.brand__widget .bw__sep { opacity: 0.55; }

.brand__widget .bw__time {
  font-weight: 900;
  font-size: 14px;
}

.brand__widget .bw__date { font-size: 13px; }
/* ===== END Widget-Feinschliff ===== */

/* ===== BEGIN Override: Uhr groesser ===== */
.brand__widget .bw__time {
  font-size: 16px;
}
/* ===== END Override ===== */

/* ===== BEGIN Override: Uhr groesser ===== */
.brand__widget .bw__time {
  font-size: 16px;
}
/* ===== END Override ===== */

/* ===== BEGIN Logo SVG ===== */
.brand__logo svg { display: block; }
.brand__logo svg path { fill: currentColor; }
/* ===== END Logo SVG ===== */

/* ===== BEGIN Logo SVG ===== */
.brand__logo svg { display: block; }
.brand__logo svg path { fill: currentColor; }
/* ===== END Logo SVG ===== */

/* ===== BEGIN PATCH: Form Layout (ohne Redesign) ===== */
.form { max-width: 900px; }
.form h2 { margin: 18px 0 10px; }
.form h3 { margin: 14px 0 8px; }

.row { margin-top: 12px; }
.row label { display: block; font-weight: 700; margin-bottom: 6px; color: inherit; }

.row input[type="text"],
.row input[type="email"],
.row input[type="tel"],
.row input[type="number"],
.row input[type="search"],
.row input[type="url"],
.row input[type="password"],
.row select,
.row textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,0.18);
  background: #fff;
  color: #111;
}

.row input:focus,
.row select:focus,
.row textarea:focus {
  outline: none;
  border-color: rgba(37,99,235,0.9);
  box-shadow: 0 0 0 3px rgba(37,99,235,0.18);
}

.actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}
/* ===== END PATCH: Form Layout ===== */

/* ===== BEGIN PATCH: Topbar sticky (bleibt beim Scrollen) ===== */
.topbar {
  position: sticky;
  top: 0;
  z-index: 1000;
}

/* damit Content nicht "unter" den Banner rutscht (minimal) */
main.container { padding-top: 16px; }
/* ===== END PATCH: Topbar sticky ===== */

/* ===== BEGIN PATCH: Topbar FIXED (zu 100% sticky) ===== */
:root { --topbar-h: 140px; } /* Fallback */

.topbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2000;
}

/* Content muss unter den Banner rutschen -> Abstand dynamisch */
main.container {
  padding-top: calc(var(--topbar-h) + 16px);
}
/* ===== END PATCH: Topbar FIXED ===== */

/* ===== BEGIN PATCH: Kundenformular 3-Spalten Grid (scoped) ===== */
.customer-form .form-grid-3 {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr; /* z.B. Strasse breit, Hausnr/Postfach schmaler */
  gap: 8px 12px;
}

.customer-form .form-colspan-3 { grid-column: 1 / -1; }

@media (max-width: 880px) {
  .customer-form .form-grid-3 { grid-template-columns: 1fr; }
  .customer-form .form-colspan-3 { grid-column: auto; }
}
/* ===== END PATCH: Kundenformular 3-Spalten Grid ===== */