/* swiss — Corporate-Theme nach swissdirektenergie.ch
   Swiss-Rot #FF0000 + Lato + dünne Headlines + Swiss-Cross. Lädt nach dgfe-crm.css + swiss.css. */

:root {
  --dgfe-gold: #FF0000;
  --dgfe-gold-dark: #D60000;
  --dgfe-gold-500: #FF0000;
  --dgfe-gold-600: #D60000;
  --dgfe-gold-700: #161616;     /* Akzent-Text/Tab bleibt dunkel-lesbar */
  --dgfe-gold-soft: #FFECEC;
  --dgfe-gold-50: #FFF5F5;
}

/* --- Typografie: Lato durchgehend, dünne Headlines --- */
body, .font-inter, .font-display, .font-sans {
  font-family: "Lato", system-ui, sans-serif !important;
}
.page-title { font-weight: 300 !important; letter-spacing: -.01em; }
.dgfe-h2, .dgfe-h3, .card-title, .modal-title { font-weight: 700; }

/* --- Roter Akzentstrich statt schwarz --- */
.dgfe-rule-left { border-left-color: #FF0000 !important; border-left-width: 3px; }

/* --- Korporativ: etwas schärfere Ecken --- */
.btn, .card, .input, .select, .textarea, .kpi, .filterbar, .modal-panel { border-radius: 4px; }
.st, .badge { border-radius: 3px; }

/* --- Primär-CTA = Swiss-Rot --- */
.btn-primary { background: #FF0000; }
.btn-primary:hover, .btn-primary:active { background: #D60000; }

/* --- Tab-Active: roter Unterstrich, Text dunkel --- */
.tab[aria-selected="true"] { color: #161616; border-bottom-color: #FF0000; }
.segmented-item[aria-selected="true"], .segmented-item.is-active { background: #FF0000; }

/* --- Swiss-Cross-Marke (Header + Login) --- */
.swiss-cross { position: relative; width: 28px; height: 28px; background: #FF0000;
  border-radius: 3px; flex: none; display: inline-block; }
.swiss-cross::before, .swiss-cross::after { content: ""; position: absolute; background: #fff; }
.swiss-cross::before { left: 12px; top: 6px; width: 4px; height: 16px; }
.swiss-cross::after { top: 12px; left: 6px; height: 4px; width: 16px; }
.swiss-cross.sm { width: 22px; height: 22px; }
.swiss-cross.sm::before { left: 9px; top: 5px; width: 4px; height: 12px; }
.swiss-cross.sm::after { top: 9px; left: 5px; height: 4px; width: 12px; }

/* --- Avatare: korporative Palette (Rot/Ink/Grau) --- */
.avatar { background: #161616; }
.avatar-sky { background: #FF0000; }
.avatar-emerald { background: #161616; }
.avatar-amber { background: #707070; }
.avatar-violet { background: #FF0000; }

/* --- Fokus-Ring rot --- */
.input:focus, .select:focus, .textarea:focus { border-color: #FF0000; }

/* --- Picker: ausgewählte Karte rot statt schwarz --- */
.pick > input:checked + .pick-card { border-color: #FF0000; box-shadow: 0 0 0 2px #FF0000, 0 6px 14px rgba(26,23,20,.10); }
.pick > input:checked + .pick-card::after { background: #FF0000; }