/* ═══════════════════════════════════════════════
   IMMORIOR · Zoho Desk Help Center · CSS
   Einfügen in: Setup → Help Center → Customize → CSS
   Bestehenden CSS-Code DARUNTER lassen!
   ═══════════════════════════════════════════════ */
 
/* ── Fonts ── */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;600;700&family=DM+Sans:wght@300;400;500;600&display=swap');
 
:root {
  --imm-navy:    #1B2A47;
  --imm-navy2:   #243355;
  --imm-navy3:   #111D33;
  --imm-orange:  #FF6B00;
  --imm-orange2: #FF8C33;
  --imm-orange3: #FFF0E6;
}
 
/* ── Grundlayout ── */
body {
  font-family: 'DM Sans', sans-serif !important;
  background: #F8F9FC !important;
}
 
/* ── Header Hintergrund ── */
.Header__headerBg,
.Header__bgColor {
  background: var(--imm-navy) !important;
}
 
/* ── Header Menü-Leiste ── */
.Header__menuWrapper {
  background: var(--imm-navy) !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}
 
/* ── Logo-Text (Firmenname) ── */
.Header__logotxt {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #fff !important;
  letter-spacing: 1.5px !important;
}
 
/* ── Navigation Links ── */
.Header__nav .Header__menuList a,
.Header__nav .Header__menuList {
  color: rgba(255,255,255,0.7) !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  transition: color 0.2s !important;
}
.Header__nav .Header__menuList:hover a,
.Header__nav .Header__menuList a:hover {
  color: var(--imm-orange) !important;
}
 
/* ── Aktiver Nav-Tab ── */
.Header__menuList.active a,
.Header__menuList.selected a {
  color: var(--imm-orange) !important;
  border-bottom: 2px solid var(--imm-orange) !important;
}
 
/* ── Hero/Banner Bereich ── */
.Header__titleSearchWrapper {
  background: var(--imm-navy2) !important;
  padding: 32px 24px !important;
}
 
/* ── Willkommenstitel ── */
.Header__welcomeTitle {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: clamp(24px, 4vw, 40px) !important;
  font-weight: 700 !important;
  color: #fff !important;
  letter-spacing: 0.5px !important;
}
 
/* ── Willkommensbeschreibung ── */
.Header__welcomeDescription,
.Header__welcomeDescription * {
  color: rgba(255,255,255,0.65) !important;
  font-size: 14px !important;
  font-family: 'DM Sans', sans-serif !important;
}
 
/* ── Suchfeld ── */
.Header__searchBox input,
[id="searchContainer"] input,
.zd-search-field input {
  border-radius: 8px !important;
  border: 1.5px solid rgba(255,255,255,0.15) !important;
  background: rgba(255,255,255,0.08) !important;
  color: #fff !important;
  font-family: 'DM Sans', sans-serif !important;
  padding: 10px 16px !important;
}
.Header__searchBox input::placeholder {
  color: rgba(255,255,255,0.4) !important;
}
.Header__searchBox input:focus {
  border-color: var(--imm-orange) !important;
  outline: none !important;
  background: rgba(255,255,255,0.12) !important;
}
 
/* ── "+ Neu" Button (Ticket erstellen) ── */
.Header__cdnavtrigger,
.Header__cdstretchynav .Header__cdnavtrigger::before,
.Header__cdstretchynav .Header__cdnavtrigger::after {
  background: var(--imm-orange) !important;
}
 
/* ── Primär-Buttons allgemein ── */
.btn-primary,
button[type="submit"],
.zd-btn-primary,
input[type="submit"] {
  background: var(--imm-orange) !important;
  border-color: var(--imm-orange) !important;
  color: #fff !important;
  font-family: 'DM Sans', sans-serif !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  transition: background 0.2s !important;
}
.btn-primary:hover,
.zd-btn-primary:hover,
button[type="submit"]:hover {
  background: var(--imm-orange2) !important;
  border-color: var(--imm-orange2) !important;
}
 
/* ── Links ── */
a {
  color: var(--imm-orange) !important;
}
a:hover {
  color: var(--imm-orange2) !important;
}
 
/* ── Karten / Artikel-Kacheln ── */
.zd-article-card,
.solution-card,
[class*="card"],
[class*="Card"] {
  border-radius: 10px !important;
  border: 1.5px solid #D0D7E8 !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
}
.zd-article-card:hover,
.solution-card:hover {
  border-color: var(--imm-orange) !important;
  box-shadow: 0 4px 20px rgba(255,107,0,0.1) !important;
}
 
/* ── Breadcrumbs ── */
.zd-breadcrumb,
[class*="breadcrumb"],
[class*="BreadCrumb"] {
  font-family: 'DM Sans', sans-serif !important;
  font-size: 12px !important;
  color: rgba(255,255,255,0.5) !important;
}
 
/* ── Ticket-Status Badges ── */
.status-open   { background: #FFF0E6 !important; color: #FF6B00 !important; }
.status-closed { background: #E8F5E9 !important; color: #2E7D32 !important; }
 
/* ── iOS safe area (Notch) ── */
.Header__menuWrapper {
  padding-top: env(safe-area-inset-top, 0) !important;
}
 
/* ── Mobile Optimierung ── */
@media (max-width: 768px) {
  .Header__titleSearchWrapper {
    padding: 20px 16px !important;
  }
  .Header__welcomeTitle {
    font-size: 22px !important;
  }
  body {
    font-size: 14px !important;
  }
}
 
.hc-hero h1,
.hc-hero h2,
.hc-hero h3,
.hc-banner h1,
.hc-banner h2,
.hc-banner h3,
.hc-search-section h1,
.hc-search-section h2 {
  color: var(--imm-white) !important;
  font-size: 1.9rem !important;
  font-weight: 700 !important;
  margin-bottom: 8px !important;
}