/* Retter-Portal v1.3.33
   Whitemode als echte helle Variante des Darkmodes und dezenter Sidebar-Schalter. */

:root{
  --rp33-light-bg:#e7edf5;
  --rp33-light-bg-deep:#dfe7f1;
  --rp33-light-surface:#f7faff;
  --rp33-light-surface-2:#eef4fa;
  --rp33-light-surface-3:#e8f0f8;
  --rp33-light-line:rgba(71,85,105,.22);
  --rp33-light-line-soft:rgba(71,85,105,.12);
  --rp33-light-text:#152136;
  --rp33-light-muted:#607087;
  --rp33-light-shadow:0 18px 42px rgba(42,58,79,.10);
}

/* --------------------------------------------------------------------------
   Sidebar-Schalter kleiner und ruhiger.
   -------------------------------------------------------------------------- */
html body .sidebar-brand-row{
  grid-template-columns:minmax(0,1fr) 32px!important;
  column-gap:7px!important;
}
html body .sidebar-collapse-toggle{
  width:32px!important;
  height:32px!important;
  min-width:32px!important;
  min-height:32px!important;
  margin-top:6px!important;
  border-radius:10px!important;
  border-color:rgba(148,163,184,.13)!important;
  background:rgba(15,31,52,.72)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 5px 14px rgba(0,0,0,.12)!important;
  opacity:.88!important;
}
html body .sidebar-collapse-toggle:hover{
  opacity:1!important;
  background:rgba(22,43,69,.92)!important;
  border-color:rgba(148,163,184,.22)!important;
}
html body .sidebar-collapse-toggle__icon{
  width:16px!important;
  height:16px!important;
  stroke-width:1.55!important;
}
@media(min-width:1101px){
  html body.sidebar-collapsed .sidebar-collapse-toggle{
    width:32px!important;
    height:32px!important;
    margin-top:0!important;
  }
}

/* --------------------------------------------------------------------------
   Whitemode: gleiche Tiefe, Struktur und Akzentlogik wie der Darkmode.
   -------------------------------------------------------------------------- */
body[data-theme="light"]{
  --bg:var(--rp33-light-bg)!important;
  --bg2:var(--rp33-light-bg-deep)!important;
  --surface:var(--rp33-light-surface)!important;
  --surface-2:var(--rp33-light-surface-2)!important;
  --text:var(--rp33-light-text)!important;
  --muted:var(--rp33-light-muted)!important;
  --muted-2:#7d8da2!important;
  --line:var(--rp33-light-line)!important;
  --line-soft:var(--rp33-light-line-soft)!important;
  color-scheme:light!important;
  color:var(--rp33-light-text)!important;
  background:
    radial-gradient(circle at 8% -8%,rgba(225,29,72,.085),transparent 32rem),
    radial-gradient(circle at 94% -4%,rgba(37,99,235,.10),transparent 38rem),
    linear-gradient(135deg,var(--rp33-light-bg),#edf3f9 58%,var(--rp33-light-bg-deep))!important;
}
body[data-theme="light"]::before{
  display:block!important;
  content:""!important;
  position:fixed!important;
  inset:0!important;
  pointer-events:none!important;
  background-image:
    linear-gradient(rgba(82,101,125,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(82,101,125,.035) 1px,transparent 1px)!important;
  background-size:48px 48px!important;
  mask-image:linear-gradient(to bottom,#000,transparent 88%)!important;
}
body[data-theme="light"] .main{
  color:var(--rp33-light-text)!important;
  background:
    radial-gradient(circle at 11% 0,rgba(225,29,72,.055),transparent 27rem),
    radial-gradient(circle at 95% 0,rgba(37,99,235,.075),transparent 34rem),
    linear-gradient(135deg,#e8eef5,#f0f5fa 56%,#e4ecf5)!important;
}

/* Dunkle Sidebar bleibt in beiden Modi identisch und kontrastreich. */
body[data-theme="light"] .sidebar{
  color:#edf3fb!important;
  background:
    radial-gradient(circle at 0 -8%,rgba(225,29,72,.17),transparent 20rem),
    radial-gradient(circle at 120% 35%,rgba(37,99,235,.10),transparent 22rem),
    linear-gradient(180deg,#091426 0%,#071120 100%)!important;
  border-right-color:rgba(148,163,184,.15)!important;
  box-shadow:16px 0 42px rgba(15,23,42,.18)!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-text{color:#f8fafc!important;}
body[data-theme="light"] .sidebar .brand-context,
body[data-theme="light"] .sidebar .brand-text small{color:#9baabd!important;}
body[data-theme="light"] .sidebar .nav-section{color:#8e9eb3!important;}
body[data-theme="light"] .sidebar nav a.sidebar-nav-link{
  color:#d6e0ec!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,.13)!important;
}
body[data-theme="light"] .sidebar nav a.sidebar-nav-link.active{
  color:#fff!important;
  background:linear-gradient(90deg,rgba(225,29,72,.19),rgba(37,99,235,.08))!important;
  border-color:rgba(251,113,133,.28)!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:#9dacc0!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:#cbd7e6!important;
  background:rgba(14,31,52,.74)!important;
  border-color:rgba(148,163,184,.13)!important;
}

/* Header nicht reinweiß, sondern als helle Glasfläche mit Darkmode-Tiefe. */
body[data-theme="light"] .topbar{
  background:rgba(239,245,251,.94)!important;
  border-bottom:1px solid rgba(71,85,105,.18)!important;
  box-shadow:0 7px 22px rgba(42,58,79,.09)!important;
  backdrop-filter:blur(20px) saturate(1.15)!important;
}
body[data-theme="light"] .topbar .topbar-eyebrow{color:#526176!important;}
body[data-theme="light"] .topbar .topbar-version{
  color:#172033!important;
  background:#e6edf5!important;
  border-color:rgba(71,85,105,.18)!important;
}
body[data-theme="light"] .topbar :is(.department-context-switch,.department-context-static){
  color:var(--rp33-light-text)!important;
  background:linear-gradient(180deg,#f7faff,#eaf1f8)!important;
  border-color:var(--rp33-light-line)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.88),0 5px 14px rgba(42,58,79,.06)!important;
}
body[data-theme="light"] .topbar :is(.department-context-switch,.department-context-static) span{color:#68798f!important;}
body[data-theme="light"] .topbar .department-context-switch select,
body[data-theme="light"] .topbar .department-context-static strong{color:var(--rp33-light-text)!important;}
body[data-theme="light"] .topbar .department-context-switch select{
  background:#f8fbff!important;
  border-color:rgba(71,85,105,.17)!important;
}
body[data-theme="light"] .topbar :is(.theme-switch,.topbar-account-info,.user-chip,.btn:not(.primary)){
  color:var(--rp33-light-text)!important;
  background:linear-gradient(180deg,#f9fbfe,#eaf1f8)!important;
  border-color:rgba(71,85,105,.18)!important;
  box-shadow:inset 0 1px 0 #fff,0 5px 14px rgba(42,58,79,.06)!important;
}

/* Alle normalen Portalflächen wie der Darkmode, nur hell übersetzt. */
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(.rp55-dash-hero,.card,.rp55-kpi-card,.rp55-focus-card,.rp55-own-card,.rp55-table-card),
body[data-theme="light"] :is(.feed-card,.dashboard-card,.overview-card){
  color:var(--rp33-light-text)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.72),transparent 34%),
    radial-gradient(circle at 100% 0,rgba(37,99,235,.07),transparent 22rem),
    radial-gradient(circle at 0 0,rgba(225,29,72,.045),transparent 18rem),
    linear-gradient(145deg,var(--rp33-light-surface),var(--rp33-light-surface-2))!important;
  border-color:var(--rp33-light-line)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.88),var(--rp33-light-shadow)!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"] .content > :is(.page-head,.page-hero){
  background:
    linear-gradient(180deg,rgba(255,255,255,.78),transparent 35%),
    radial-gradient(circle at 100% 0,rgba(37,99,235,.085),transparent 25rem),
    radial-gradient(circle at 0 0,rgba(225,29,72,.06),transparent 20rem),
    linear-gradient(145deg,#f9fbfe,#edf4fa)!important;
}
body[data-theme="light"] .content > .toolbar{
  background:linear-gradient(145deg,#f3f7fb,#e8f0f7)!important;
}
body[data-theme="light"] .content > :is(.pagination,.portal-footer){
  background:linear-gradient(145deg,#f5f9fd,#eaf1f8)!important;
}
body[data-theme="light"] :is(h1,h2,h3,h4,h5,strong,th,.card-head,.page-head,.page-hero,.rp55-dash-hero){color:var(--rp33-light-text)!important;}
body[data-theme="light"] :is(.muted,.subtle,small,label,.timeline-list small,.rp55-kpi-card small){color:var(--rp33-light-muted)!important;}

/* Entitätskarten und Dashboard-Elemente mit klarer Hierarchie. */
body[data-theme="light"] .entity-card,
body[data-theme="light"] .department-card,
body[data-theme="light"] .rp55-kpi-card,
body[data-theme="light"] .stat-card{
  background:
    linear-gradient(180deg,rgba(255,255,255,.82),transparent 35%),
    linear-gradient(145deg,#f8fbff,#eaf2f9)!important;
  border-color:var(--rp33-light-line)!important;
  box-shadow:inset 0 1px 0 #fff,0 14px 32px rgba(42,58,79,.09)!important;
}
body[data-theme="light"] .timeline-item,
body[data-theme="light"] .feed-list article,
body[data-theme="light"] .v138-feed-item{
  color:var(--rp33-light-text)!important;
  background:linear-gradient(145deg,#f8fbff,#edf3f9)!important;
  border:1px solid var(--rp33-light-line)!important;
  box-shadow:inset 0 1px 0 #fff,0 5px 16px rgba(42,58,79,.06)!important;
}
body[data-theme="light"] .timeline-item:hover,
body[data-theme="light"] .feed-list article:hover{background:linear-gradient(145deg,#f4f8fc,#e7eef6)!important;}
body[data-theme="light"] .rp55-dash-tags span,
body[data-theme="light"] .rp55-focus-grid article,
body[data-theme="light"] .rp55-own-metrics article,
body[data-theme="light"] .rp55-priority-list a,
body[data-theme="light"] .department-chip{
  color:#304157!important;
  background:linear-gradient(180deg,#f9fbfe,#eaf1f8)!important;
  border-color:var(--rp33-light-line)!important;
  box-shadow:inset 0 1px 0 #fff,0 4px 12px rgba(42,58,79,.05)!important;
}

/* Formulare und Tabellen nicht mehr flach weiß. */
body[data-theme="light"] :is(input,select,textarea,.smart-person-picker,.smart-select-field){
  color:var(--rp33-light-text)!important;
  background:linear-gradient(180deg,#fbfdff,#eef4f9)!important;
  background-image:linear-gradient(180deg,#fbfdff,#eef4f9)!important;
  border-color:var(--rp33-light-line)!important;
  box-shadow:inset 0 1px 0 #fff!important;
}
body[data-theme="light"] :is(input,select,textarea):hover{border-color:rgba(71,85,105,.32)!important;}
body[data-theme="light"] :is(input,select,textarea):focus{
  border-color:rgba(225,29,72,.42)!important;
  box-shadow:0 0 0 3px rgba(225,29,72,.09),inset 0 1px 0 #fff!important;
}
body[data-theme="light"] input::placeholder,
body[data-theme="light"] textarea::placeholder{color:#8796a9!important;}
body[data-theme="light"] select option,
body[data-theme="light"] select optgroup{color:#142033!important;background:#f8fbff!important;}
body[data-theme="light"] .btn:not(.primary):not(.danger){
  color:#203047!important;
  background:linear-gradient(180deg,#f9fbfe,#e8eff7)!important;
  border-color:var(--rp33-light-line)!important;
  box-shadow:inset 0 1px 0 #fff,0 5px 13px rgba(42,58,79,.06)!important;
}
body[data-theme="light"] .btn:not(.primary):not(.danger):hover{
  background:linear-gradient(180deg,#f4f8fc,#dde7f1)!important;
}
body[data-theme="light"] .table-wrap,
body[data-theme="light"] .card.table-wrap{
  background:linear-gradient(145deg,#f7faff,#edf3f9)!important;
  border-color:var(--rp33-light-line)!important;
}
body[data-theme="light"] table thead th{
  color:#4a5b71!important;
  background:linear-gradient(180deg,#e4ecf4,#dbe5ef)!important;
  border-bottom-color:var(--rp33-light-line)!important;
}
body[data-theme="light"] table tbody tr{background:#f8fbff!important;}
body[data-theme="light"] table tbody tr:nth-child(even){background:#eef4fa!important;}
body[data-theme="light"] table tbody tr:hover{background:#e4edf6!important;}
body[data-theme="light"] table td{color:#26374d!important;border-bottom-color:var(--rp33-light-line-soft)!important;}
body[data-theme="light"] :is(.pill,.status,.role){
  color:#33455b!important;
  background:linear-gradient(180deg,#edf3f9,#e2eaf3)!important;
  border-color:var(--rp33-light-line)!important;
  box-shadow:inset 0 1px 0 #fff!important;
}
body[data-theme="light"] .portal-footer,
body[data-theme="light"] .portal-footer a{color:#34465c!important;}
body[data-theme="light"] .portal-footer a{
  background:linear-gradient(180deg,#f8fbfe,#e8eff7)!important;
  border-color:var(--rp33-light-line)!important;
}

/* Benachrichtigungen passen in beiden Modi zur Oberfläche. */
body[data-theme="light"] .dashboard-notification-strip{
  color:var(--rp33-light-text)!important;
  background:
    linear-gradient(90deg,rgba(225,29,72,.08),rgba(37,99,235,.075)),
    linear-gradient(145deg,#f9fbfe,#eaf1f8)!important;
  border-color:rgba(225,29,72,.24)!important;
  box-shadow:inset 0 1px 0 #fff,0 10px 24px rgba(42,58,79,.08)!important;
}
body[data-theme="light"] .dashboard-notification-strip__copy small{color:var(--rp33-light-muted)!important;}
body[data-theme="light"] .dashboard-notification-strip__action{
  color:var(--rp33-light-text)!important;
  background:linear-gradient(180deg,#f9fbfe,#e8eff7)!important;
  border-color:var(--rp33-light-line)!important;
}

/* Semantische Statusfarben bleiben bewusst klar. */
body[data-theme="light"] :is(.status.Aktiv,.status.Verfügbar,.status.Genehmigt,.status.Bezahlt,.ok){
  color:#047857!important;background:#e7f8f1!important;border-color:#a7e8cf!important;
}
body[data-theme="light"] :is(.status.Defekt,.status.Abgelehnt,.status.Storniert,.danger-text){
  color:#be123c!important;background:#fff0f3!important;border-color:#f7bdc9!important;
}
body[data-theme="light"] :is(.status.Offen,.status.Entwurf,.status.In,.status.In.Prüfung){
  color:#92400e!important;background:#fff8e7!important;border-color:#f4dc92!important;
}

@media(max-width:1100px){
  html body .sidebar-brand-row{
    display:block!important;
    padding-right:0!important;
  }
  html body .sidebar-collapse-toggle{display:none!important;}
}

@media(max-width:760px){
  body[data-theme="light"] .table-wrap table.responsive-table tbody tr{
    color:var(--rp33-light-text)!important;
    background:
      linear-gradient(180deg,rgba(255,255,255,.78),transparent 32%),
      linear-gradient(145deg,#f8fbff,#eaf2f9)!important;
    border-color:var(--rp33-light-line)!important;
    box-shadow:inset 0 1px 0 #fff,0 10px 24px rgba(42,58,79,.08)!important;
  }
  body[data-theme="light"] .table-wrap table.responsive-table tbody td{
    color:#26374d!important;
    border-bottom-color:var(--rp33-light-line-soft)!important;
  }
  body[data-theme="light"] .table-wrap table.responsive-table td::before{color:#66778d!important;}
}