/* pw.tbw.ch — neuer TBW-Auftritt (2026-09-19), Regelwerk tbw-orga\TBW-Brand\BRAND.md.
   Override-Schicht NACH styles.css; styles.css bleibt unveraendert. Rueckbau = <link> entfernen.
   Tokens wie url.tbw.ch / Theme tbw-intranet. Keine Rastertoene der Sekundaerfarben. */

@font-face { font-family: "dmsans"; src: url("fonts/DMSans-Light.ttf") format("truetype");    font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "dmsans"; src: url("fonts/DMSans-SemiBold.ttf") format("truetype"); font-weight: 600; font-style: normal; font-display: swap; }

:root {
  --tbw-schwarz: #000;
  --tbw-weiss: #fff;
  --tbw-moosgruen: #0F3C28;
  --tbw-apricot: #DC6446;
  --tbw-sand: #E9D9C4;
  --tbw-schwarz-30: rgba(0, 0, 0, .3);
  --tbw-schwarz-55: rgba(0, 0, 0, .55);
  --tbw-schwarz-4: rgba(0, 0, 0, .04);
  --tbw-grau-text: #4a4a4a;
  --tbw-font-sans: "dmsans", Arial, sans-serif;
}

body {
  font-family: var(--tbw-font-sans); font-weight: 300; letter-spacing: .01em;
  background: var(--tbw-weiss); color: var(--tbw-schwarz);
  -webkit-font-smoothing: antialiased;
}
b, strong { font-weight: 600; }
input, select, textarea, button { font-family: inherit; }

.container { border-radius: 0; box-shadow: none; border: 1px solid var(--tbw-schwarz-30); }
/* Logo: Breite wie bisher (200 px), Schutzzone X = 10.5 % der Logobreite (BRAND.md 2.3) */
.logo { margin: 21px auto 41px; display: block; }
h2 { color: var(--tbw-schwarz); font-weight: 300; font-size: 1.9rem; }
h3 { font-weight: 600; }

input[type="text"], textarea, select {
  border: 1px solid var(--tbw-schwarz-55); border-radius: 0;
  background: var(--tbw-weiss); color: var(--tbw-schwarz); font-weight: 300;
}
input[type="text"]:focus, textarea:focus, select:focus {
  outline: none; border-color: var(--tbw-schwarz); box-shadow: 0 0 0 1px var(--tbw-schwarz);
}
label { color: var(--tbw-schwarz); font-weight: 600; }

button {
  background: var(--tbw-schwarz); color: var(--tbw-weiss);
  border: 1px solid var(--tbw-schwarz); border-radius: 0; font-weight: 600;
}
button:hover { background: var(--tbw-moosgruen); border-color: var(--tbw-moosgruen); }
button:focus-visible { outline: 2px solid var(--tbw-schwarz); outline-offset: 2px; }

/* Umschalter Text / Datei als Pills */
.tab {
  background: var(--tbw-weiss); color: var(--tbw-schwarz);
  border: 1px solid var(--tbw-schwarz); border-radius: 50000px; font-weight: 300;
}
.tab:hover { background: var(--tbw-schwarz); color: var(--tbw-weiss); border-color: var(--tbw-schwarz); }
.tab.active, .tab.active:hover { background: var(--tbw-schwarz); color: var(--tbw-weiss); border-color: var(--tbw-schwarz); font-weight: 600; }

.hint { color: var(--tbw-grau-text); }

.link-box, .pin-box { background: var(--tbw-sand); color: var(--tbw-schwarz); border-radius: 0; }
.secret-box { background: var(--tbw-weiss); color: var(--tbw-schwarz); border: 1px solid var(--tbw-moosgruen); border-left: 4px solid var(--tbw-moosgruen); border-radius: 0; }
.warn-box  { background: var(--tbw-sand); color: var(--tbw-schwarz); border: 0; border-left: 4px solid var(--tbw-apricot); border-radius: 0; }
.info-box  { color: var(--tbw-schwarz); }
.error-box { background: var(--tbw-schwarz-4); color: var(--tbw-schwarz); border-left: 4px solid var(--tbw-apricot); border-radius: 0; box-shadow: none; font-weight: 600; }

.backlink { color: var(--tbw-schwarz); text-decoration: underline; text-underline-offset: .2em; text-decoration-thickness: 1px; }
.backlink:hover { text-decoration-thickness: 2px; }