/* Retter-Portal v1.3.31
   Header ohne künstliche Lücke, kompakter Markenblock, neues Sidebar-Symbol
   und ein klarer, kontrastreicher Whitemode. */

:root{
  --rp31-sidebar-expanded:286px;
  --rp31-sidebar-collapsed:88px;
  --rp31-light-bg:#eef3f8;
  --rp31-light-bg-2:#f7f9fc;
  --rp31-light-card:#ffffff;
  --rp31-light-card-alt:#f8fafc;
  --rp31-light-line:#d8e1eb;
  --rp31-light-text:#172033;
  --rp31-light-muted:#64748b;
}

/* Header: die Feuerwehr-Auswahl beginnt direkt nach Produkt/Version bzw. DEV-Chip. */
@media(min-width:1101px){
  html body .topbar .topbar-desktop-shell{
    grid-template-columns:max-content minmax(360px,620px) minmax(360px,1fr)!important;
    column-gap:12px!important;
  }
  html body .topbar .topbar-title{
    width:max-content!important;
    min-width:0!important;
  }
  html body .topbar .topbar-context{
    width:100%!important;
    min-width:0!important;
  }
}

/* Markenblock: Retter-Portal bleibt bei ausgeklappter Sidebar in einer Zeile. */
html body .sidebar-brand-row{
  position:relative!important;
  display:block!important;
  min-height:72px!important;
  padding-right:46px!important;
}
html body .sidebar .brand{
  width:100%!important;
  min-width:0!important;
  padding-right:0!important;
}
html body .sidebar .brand-logo-wrap,
html body .sidebar .brand-logo{
  width:46px!important;
  min-width:46px!important;
  max-width:46px!important;
  height:46px!important;
  max-height:46px!important;
}
html body .sidebar .brand-text{
  display:block!important;
  min-width:0!important;
  white-space:nowrap!important;
  font-size:1.18rem!important;
  line-height:1.05!important;
  letter-spacing:-.025em!important;
}
html body .sidebar .brand-context,
html body .sidebar .brand-text small{
  margin-top:5px!important;
  font-size:.67rem!important;
  letter-spacing:.052em!important;
  white-space:nowrap!important;
}

/* Neues, verständliches Panel-Symbol statt Textpfeil. */
html body .sidebar-collapse-toggle{
  position:absolute!important;
  top:7px!important;
  right:0!important;
  width:40px!important;
  height:40px!important;
  margin:0!important;
  display:grid!important;
  place-items:center!important;
  border-radius:13px!important;
}
html body .sidebar-collapse-toggle__icon{
  width:21px!important;
  height:21px!important;
  display:block!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.7!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
html body .sidebar-collapse-toggle__arrow{
  transform-box:fill-box!important;
  transform-origin:center!important;
  transition:transform .2s ease!important;
}
html body .sidebar-collapse-toggle.is-collapsed .sidebar-collapse-toggle__arrow{
  transform:rotate(180deg)!important;
}

@media(min-width:1101px){
  html body.sidebar-collapsed .sidebar-brand-row{
    position:static!important;
    display:grid!important;
    min-height:0!important;
    padding-right:0!important;
    justify-items:center!important;
  }
  html body.sidebar-collapsed .sidebar-collapse-toggle{
    position:static!important;
    margin:0 auto!important;
  }
  html body.sidebar-collapsed .sidebar .brand-logo-wrap,
  html body.sidebar-collapsed .sidebar .brand-logo{
    width:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    height:46px!important;
    max-height:46px!important;
  }
}

/* Sidebar-Navigation minimal größer, aber weiterhin sauber proportioniert. */
html body .sidebar nav a.sidebar-nav-link{
  font-size:1.015rem!important;
  line-height:1.18!important;
}

/* --------------------------------------------------------------------------
   Whitemode: bewusst kein ausgewaschener Pastell-Look mehr.
   Dunkle Sidebar + klarer heller Arbeitsbereich schaffen stabile Kontraste.
   -------------------------------------------------------------------------- */
body[data-theme="light"]{
  --bg:var(--rp31-light-bg)!important;
  --bg2:var(--rp31-light-bg-2)!important;
  --surface:var(--rp31-light-card)!important;
  --surface-2:var(--rp31-light-card-alt)!important;
  --text:var(--rp31-light-text)!important;
  --muted:var(--rp31-light-muted)!important;
  --muted-2:#8290a3!important;
  --line:var(--rp31-light-line)!important;
  --line-soft:rgba(100,116,139,.13)!important;
  color-scheme:light!important;
  color:var(--rp31-light-text)!important;
  background:linear-gradient(180deg,var(--rp31-light-bg),var(--rp31-light-bg-2))!important;
}
body[data-theme="light"]::before{
  display:none!important;
  content:none!important;
}
body[data-theme="light"] .main{
  background:linear-gradient(180deg,#edf2f7 0%,#f7f9fc 100%)!important;
}

/* Sidebar bleibt auch im Whitemode dunkel und vollständig lesbar. */
body[data-theme="light"] .sidebar{
  color:#e8eef7!important;
  background:
    radial-gradient(circle at 0 -8%,rgba(225,29,72,.16),transparent 20rem),
    linear-gradient(180deg,#091426 0%,#071120 100%)!important;
  border-right-color:rgba(148,163,184,.14)!important;
  box-shadow:14px 0 40px rgba(15,23,42,.15)!important;
}
body[data-theme="light"] .sidebar .logo-light{display:none!important;}
body[data-theme="light"] .sidebar .logo-dark{display:block!important;}
body[data-theme="light"] .sidebar-brand-row{border-bottom-color:rgba(148,163,184,.13)!important;}
body[data-theme="light"] .sidebar .brand-text{color:#f8fafc!important;}
body[data-theme="light"] .sidebar .brand-context,
body[data-theme="light"] .sidebar .brand-text small,
body[data-theme="light"] .sidebar .nav-section{color:#93a3b8!important;}
body[data-theme="light"] .sidebar nav a.sidebar-nav-link{
  color:#d4deeb!important;
  background:transparent!important;
  border-color:transparent!important;
}
body[data-theme="light"] .sidebar nav a.sidebar-nav-link:hover{
  color:#fff!important;
  background:rgba(255,255,255,.055)!important;
  border-color:rgba(148,163,184,.12)!important;
}
body[data-theme="light"] .sidebar nav a.sidebar-nav-link.active{
  color:#fff!important;
  background:linear-gradient(90deg,rgba(225,29,72,.18),rgba(37,99,235,.075))!important;
  border-color:rgba(251,113,133,.27)!important;
  box-shadow:inset 3px 0 0 #ef3154,0 10px 24px rgba(2,6,23,.15)!important;
}
body[data-theme="light"] .sidebar .sidebar-nav-icon{color:#9babc0!important;}
body[data-theme="light"] .sidebar nav a.sidebar-nav-link.active .sidebar-nav-icon{color:#fb7185!important;}
body[data-theme="light"] .sidebar-collapse-toggle{
  color:#dce6f2!important;
  border-color:rgba(148,163,184,.15)!important;
  background:linear-gradient(180deg,rgba(18,38,64,.94),rgba(9,23,41,.92))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 9px 22px rgba(0,0,0,.17)!important;
}
body[data-theme="light"] .nav-count{
  color:#eef4fb!important;
  background:rgba(148,163,184,.20)!important;
  border-color:rgba(148,163,184,.15)!important;
}

/* Header bleibt hell, aber kompakt und kontrastreich. */
body[data-theme="light"] .topbar{
  background:rgba(255,255,255,.96)!important;
  border-bottom-color:var(--rp31-light-line)!important;
  box-shadow:0 5px 18px rgba(15,23,42,.06)!important;
}
body[data-theme="light"] .topbar .topbar-eyebrow{color:#526176!important;}
body[data-theme="light"] .topbar .topbar-version{
  color:#172033!important;
  background:#eef3f8!important;
  border-color:#d8e1eb!important;
}
body[data-theme="light"] .topbar .department-context-switch,
body[data-theme="light"] .topbar .department-context-static{
  background:#f8fafc!important;
  border-color:#d8e1eb!important;
  box-shadow:inset 0 1px 0 #fff!important;
}
body[data-theme="light"] .topbar .department-context-switch span,
body[data-theme="light"] .topbar .department-context-static span{color:#6b7b90!important;}
body[data-theme="light"] .topbar .department-context-switch select{
  color:#172033!important;
  background:#ffffff!important;
  border-color:#d8e1eb!important;
}
body[data-theme="light"] .topbar .department-context-static strong{color:#172033!important;}
body[data-theme="light"] .theme-switch,
body[data-theme="light"] .topbar-account-info,
body[data-theme="light"] .user-chip,
body[data-theme="light"] .topbar .btn:not(.primary){
  color:#172033!important;
  background:#ffffff!important;
  border-color:#d8e1eb!important;
  box-shadow:0 4px 12px rgba(15,23,42,.05)!important;
}

/* Klare, weiße Flächen ohne zusätzliche Farbschleier. */
body[data-theme="light"] .content > :is(.page-head,.page-hero,.card,.toolbar,.pagination,.table-wrap,.data-table-card,.checks-table-wrap,.portal-footer),
body[data-theme="light"] .content :is(.form-subcard,.detail-item,.info-grid>div,.entity-card,.admin-panel,.admin-card,.admin-command-nav,.admin-water-source-row,.billing-status-card,.stat-card),
body[data-theme="light"] .rp55-dashboard :is(.card,.stat-card,.rp-feed-card,.rp-operational-card,.rp-overview-card),
body[data-theme="light"] :is(.feed-card,.feed-list article,.timeline-list article,.v138-feed-item,.dashboard-card,.overview-card){
  color:var(--rp31-light-text)!important;
  background:var(--rp31-light-card)!important;
  background-image:none!important;
  border-color:var(--rp31-light-line)!important;
  box-shadow:0 8px 24px rgba(15,23,42,.07)!important;
}
body[data-theme="light"] .content > :is(.page-head,.page-hero,.card,.toolbar,.pagination,.table-wrap,.data-table-card,.checks-table-wrap,.portal-footer)::before,
body[data-theme="light"] .content > :is(.page-head,.page-hero,.card,.toolbar,.pagination,.table-wrap,.data-table-card,.checks-table-wrap,.portal-footer)::after{
  display:none!important;
  content:none!important;
}
body[data-theme="light"] :is(h1,h2,h3,h4,strong,th,td,.card-head,.page-head,.page-hero){color:var(--rp31-light-text)!important;}
body[data-theme="light"] :is(.muted,.subtle,small,label,.timeline-list small){color:var(--rp31-light-muted)!important;}
body[data-theme="light"] :is(input,select,textarea,.smart-person-picker,.smart-select-field){
  color:var(--rp31-light-text)!important;
  background:#ffffff!important;
  background-image:none!important;
  border-color:#d8e1eb!important;
  box-shadow:inset 0 1px 0 #fff!important;
}
body[data-theme="light"] input::placeholder,
body[data-theme="light"] textarea::placeholder{color:#94a3b8!important;}
body[data-theme="light"] .btn:not(.primary):not(.danger){
  color:#172033!important;
  background:#f8fafc!important;
  background-image:none!important;
  border-color:#d8e1eb!important;
  box-shadow:0 4px 12px rgba(15,23,42,.05)!important;
}
body[data-theme="light"] .table-wrap,
body[data-theme="light"] .card.table-wrap{background:#ffffff!important;}
body[data-theme="light"] table thead th{
  color:#526176!important;
  background:#edf2f7!important;
  background-image:none!important;
  border-bottom-color:#d8e1eb!important;
}
body[data-theme="light"] table tbody tr{background:#ffffff!important;}
body[data-theme="light"] table tbody tr:nth-child(even){background:#f8fafc!important;}
body[data-theme="light"] table tbody tr:hover{background:#eef5fb!important;}
body[data-theme="light"] table td{color:#26364b!important;border-bottom-color:rgba(100,116,139,.14)!important;}
body[data-theme="light"] :is(.pill,.status,.role){
  color:#334155!important;
  background:#eef3f8!important;
  background-image:none!important;
  border-color:#d8e1eb!important;
}
body[data-theme="light"] .portal-footer a{
  color:#334155!important;
  background:#f8fafc!important;
  border-color:#d8e1eb!important;
}

/* Der Benachrichtigungsstreifen behält einen klaren Akzent, ohne Pastellfläche. */
body[data-theme="light"] .dashboard-notification-strip{
  color:#172033!important;
  background:#ffffff!important;
  background-image:linear-gradient(90deg,rgba(225,29,72,.055),rgba(37,99,235,.035))!important;
  border-color:rgba(225,29,72,.24)!important;
  box-shadow:0 7px 20px rgba(15,23,42,.07)!important;
}
body[data-theme="light"] .dashboard-notification-strip__copy small{color:#64748b!important;}
body[data-theme="light"] .dashboard-notification-strip__action{
  color:#172033!important;
  background:#ffffff!important;
  border-color:#d8e1eb!important;
}

/* Tablet und Smartphone: Header und Markenblock bleiben stabil. */
@media(max-width:1100px){
  html body .sidebar-brand-row{
    min-height:72px!important;
    padding-right:0!important;
  }
  html body .sidebar-collapse-toggle{display:none!important;}
  html body .sidebar .brand{
    padding-right:6px!important;
  }
  html body .topbar .topbar-desktop-shell{
    grid-template-columns:auto minmax(0,1fr) auto!important;
  }
}

@media(max-width:760px){
  html body .sidebar .brand-text{
    font-size:1.16rem!important;
    white-space:nowrap!important;
  }
  html body .sidebar .brand-context,
  html body .sidebar .brand-text small{
    font-size:.66rem!important;
    white-space:nowrap!important;
  }
  body[data-theme="light"] .table-wrap table.responsive-table tbody tr{
    color:#172033!important;
    background:#ffffff!important;
    background-image:none!important;
    border-color:#d8e1eb!important;
    box-shadow:0 7px 20px rgba(15,23,42,.07)!important;
  }
  body[data-theme="light"] .table-wrap table.responsive-table tbody td{
    color:#26364b!important;
    border-bottom-color:rgba(100,116,139,.14)!important;
  }
  body[data-theme="light"] .table-wrap table.responsive-table td::before{color:#64748b!important;}
}

/* Semantische Statusfarben bleiben auch im hellen Modus erhalten. */
body[data-theme="light"] :is(.status.Aktiv,.status.Verfügbar,.status.Genehmigt,.status.Bezahlt,.ok){
  color:#047857!important;background:#ecfdf5!important;border-color:#a7f3d0!important;
}
body[data-theme="light"] :is(.status.Defekt,.status.Abgelehnt,.status.Storniert,.danger-text){
  color:#be123c!important;background:#fff1f2!important;border-color:#fecdd3!important;
}
body[data-theme="light"] :is(.status.Offen,.status.Entwurf,.status.In,.status.In.Prüfung){
  color:#92400e!important;background:#fffbeb!important;border-color:#fde68a!important;
}