/* Retter-Portal v1.3.25 · lesbare Navigation, sauberer DEV-Status und durchgängig neue Portalflächen */
:root{
  --sidebar-width:284px!important;
  --rp25-sidebar:#06111f;
  --rp25-sidebar-deep:#040c17;
  --rp25-panel:#09192c;
  --rp25-panel-deep:#071425;
  --rp25-panel-soft:#0d2037;
  --rp25-line:rgba(148,163,184,.16);
  --rp25-line-strong:rgba(148,163,184,.25);
  --rp25-text:#f4f7fb;
  --rp25-muted:#9eacc0;
  --rp25-red:#ef3154;
  --rp25-shadow:0 18px 48px rgba(1,7,18,.26);
}

/* Sidebar – Text und Symbolik bewusst näher an der Größe des Inhalts. */
html body .app-shell{grid-template-columns:var(--sidebar-width) minmax(0,1fr)!important;}
html body .main{margin-left:var(--sidebar-width)!important;}
html body .app-shell--navigation-disabled .main{margin-left:0!important;}
html body .sidebar{
  width:var(--sidebar-width)!important;
  min-width:var(--sidebar-width)!important;
  max-width:var(--sidebar-width)!important;
  padding:14px 13px 22px!important;
  border-right:1px solid rgba(148,163,184,.15)!important;
  background:
    radial-gradient(circle at 0 -7%,rgba(225,29,72,.20),transparent 22rem),
    radial-gradient(circle at 115% 34%,rgba(37,99,235,.12),transparent 23rem),
    linear-gradient(180deg,var(--rp25-sidebar),#08172a 51%,var(--rp25-sidebar-deep))!important;
  box-shadow:12px 0 42px rgba(1,6,16,.20)!important;
}
html body .sidebar .brand{
  min-height:84px!important;
  margin:0 2px 14px!important;
  padding:4px 7px 16px!important;
  gap:13px!important;
  border-bottom:1px solid rgba(148,163,184,.14)!important;
}
html body .sidebar .brand-logo-wrap,
html body .sidebar .brand-logo{
  width:60px!important;
  min-width:60px!important;
  max-width:60px!important;
  height:60px!important;
  max-height:60px!important;
}
html body .sidebar .brand-logo-wrap{
  display:grid!important;
  place-items:center!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
html body .sidebar .brand-logo{
  object-fit:contain!important;
  object-position:center!important;
  filter:drop-shadow(0 10px 20px rgba(0,0,0,.36))!important;
}
html body .sidebar .brand-text{
  min-width:0!important;
  color:var(--rp25-text)!important;
  font-size:1.34rem!important;
  line-height:1.06!important;
  font-weight:950!important;
  letter-spacing:-.032em!important;
}
html body .sidebar .brand-text small,
html body .sidebar .brand-context{
  display:block!important;
  margin-top:6px!important;
  color:#9eacc0!important;
  font-size:.74rem!important;
  line-height:1.15!important;
  font-weight:900!important;
  letter-spacing:.064em!important;
  white-space:nowrap!important;
}
html body .sidebar .nav-section{
  margin:18px 10px 8px!important;
  color:#8999af!important;
  font-size:.79rem!important;
  font-weight:950!important;
  letter-spacing:.135em!important;
}
html body .sidebar nav a.sidebar-nav-link{
  min-height:51px!important;
  margin:2px 0!important;
  padding:10px 12px!important;
  gap:13px!important;
  border:1px solid transparent!important;
  border-radius:14px!important;
  color:#d8e1ed!important;
  font-size:19.25px!important;
  line-height:1.18!important;
  font-weight:790!important;
  letter-spacing:-.014em!important;
}
html body .sidebar nav a.sidebar-nav-link:hover{
  color:#fff!important;
  border-color:rgba(148,163,184,.12)!important;
  background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.022))!important;
}
html body .sidebar nav a.sidebar-nav-link.active{
  color:#fff!important;
  border-color:rgba(251,113,133,.28)!important;
  background:
    linear-gradient(90deg,rgba(225,29,72,.17),rgba(37,99,235,.075)),
    rgba(255,255,255,.025)!important;
  box-shadow:inset 3px 0 0 var(--rp25-red),inset 0 1px 0 rgba(255,255,255,.04),0 10px 24px rgba(0,0,0,.13)!important;
}
html body .sidebar .sidebar-nav-icon{
  width:26px!important;
  min-width:26px!important;
  height:26px!important;
  color:#9fb0c5!important;
}
html body .sidebar .sidebar-nav-icon svg{width:24px!important;height:24px!important;stroke-width:1.9!important;}
html body .sidebar nav a.sidebar-nav-link.active .sidebar-nav-icon{color:#fb7185!important;}
html body .sidebar .sidebar-nav-label{min-width:0!important;white-space:normal!important;word-break:normal!important;overflow-wrap:normal!important;}
html body .sidebar .nav-count{
  min-width:30px!important;
  height:25px!important;
  padding-inline:8px!important;
  border:1px solid rgba(148,163,184,.15)!important;
  background:rgba(148,163,184,.16)!important;
  font-size:.78rem!important;
}

/* Kompakter Header; DEV-Kennzeichnung sitzt sauber bei Produkt/Version statt am Organisationsfeld. */
html body .topbar{min-height:60px!important;padding:0!important;background:rgba(5,14,26,.93)!important;}
html body .topbar .topbar-desktop-shell{
  grid-template-columns:minmax(315px,auto) minmax(320px,560px) minmax(400px,1fr)!important;
  min-height:60px!important;
  padding:7px clamp(17px,1.5vw,24px)!important;
  gap:15px!important;
}
html body .topbar .topbar-desktop-shell .topbar-title{gap:10px!important;overflow:visible!important;}
html body .topbar .topbar-desktop-shell .topbar-context{justify-content:flex-start!important;}
html body .topbar .topbar-desktop-shell .department-context-switch,
html body .topbar .topbar-desktop-shell .department-context-static{
  min-height:40px!important;
  max-width:560px!important;
  border-radius:13px!important;
  background:linear-gradient(180deg,rgba(12,29,50,.90),rgba(7,20,36,.86))!important;
  border-color:var(--rp25-line)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}
html body .topbar .topbar-desktop-shell .department-context-switch select{height:32px!important;min-height:32px!important;}
html body .dev-organization-chip{
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  min-height:30px!important;
  padding:3px 9px 3px 4px!important;
  border:1px solid rgba(251,113,133,.25)!important;
  border-radius:10px!important;
  background:linear-gradient(135deg,rgba(225,29,72,.12),rgba(13,28,49,.90))!important;
  color:#ffdbe2!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
  font-size:.69rem!important;
  font-weight:900!important;
  letter-spacing:.035em!important;
  text-transform:none!important;
  white-space:nowrap!important;
}
html body .dev-organization-chip__code{
  display:inline-grid!important;
  place-items:center!important;
  min-width:34px!important;
  height:22px!important;
  padding-inline:6px!important;
  border-radius:7px!important;
  background:linear-gradient(135deg,#e11d48,#b90f32)!important;
  color:#fff!important;
  font-size:.66rem!important;
  font-weight:950!important;
  letter-spacing:.08em!important;
}
html body .dev-organization-chip__label{color:#f8c7d1!important;font-size:.7rem!important;font-weight:900!important;}

/* Die komplette Portaloberfläche verwendet nun dieselbe Flächen- und Konturensprache wie die Sidebar. */
html body{
  background:
    radial-gradient(circle at 17% -10%,rgba(225,29,72,.10),transparent 35rem),
    radial-gradient(circle at 95% 0,rgba(37,99,235,.13),transparent 38rem),
    linear-gradient(135deg,#06101d,#0a182a 58%,#071524)!important;
}
html body .content{padding:20px clamp(18px,1.8vw,30px) 34px!important;}
html body .content > .page-head,
html body .content > .page-hero,
html body .card,
html body .toolbar,
html body .stat-card,
html body .pagination,
html body .portal-footer,
html body .form-subcard,
html body .detail-item,
html body .info-grid > div,
html body .entity-card,
html body .admin-panel,
html body .admin-card,
html body .admin-command-nav,
html body .admin-water-source-row,
html body .v138-filter-card,
html body .v138-task-card,
html body .billing-status-card{
  border:1px solid var(--rp25-line)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.038),transparent 34%),
    radial-gradient(circle at 100% 0,rgba(37,99,235,.085),transparent 26rem),
    linear-gradient(145deg,rgba(11,29,50,.96),rgba(7,20,36,.91))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),var(--rp25-shadow)!important;
}
html body .content > .page-head,
html body .content > .page-hero{
  position:relative!important;
  min-height:118px!important;
  padding:20px clamp(22px,2.05vw,32px)!important;
  border-radius:20px!important;
  overflow:hidden!important;
}
html body .content > .page-head::after,
html body .content > .page-hero::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  border-radius:inherit!important;
  background:linear-gradient(110deg,rgba(225,29,72,.055),transparent 29%,transparent 74%,rgba(37,99,235,.06))!important;
}
html body .content > .page-head > *,
html body .content > .page-hero > *{position:relative!important;z-index:1!important;}
html body .content > .page-head h1,
html body .content > .page-hero h1{font-size:clamp(2.05rem,2.45vw,2.85rem)!important;letter-spacing:-.05em!important;}
html body .content > .page-head .muted,
html body .content > .page-hero .muted{color:#9eacc0!important;}
html body .content :is(.page-head,.page-hero,.card) .eyebrow{
  display:block!important;
  width:auto!important;
  max-width:max-content!important;
  margin:0 0 9px!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#fb7185!important;
  font-size:.73rem!important;
  font-weight:950!important;
  letter-spacing:.15em!important;
}
html body .content :is(.page-head,.page-hero,.card) .eyebrow::before,
html body .content :is(.page-head,.page-hero,.card) .eyebrow::after{display:none!important;}
html body .card{border-radius:19px!important;}
html body .toolbar{padding:14px!important;border-radius:18px!important;gap:11px!important;}
html body .stat-card{border-radius:17px!important;}
html body .pagination{min-height:62px!important;border-radius:18px!important;}
html body .portal-footer{border-radius:18px!important;}
html body .card-head{border-bottom-color:rgba(148,163,184,.10)!important;}

/* Formfelder und Auswahlflächen wirken nicht mehr wie ein altes, separates Design. */
html body input,
html body select,
html body textarea,
html body .smart-person-picker,
html body .smart-select-field{
  border:1px solid var(--rp25-line)!important;
  border-radius:12px!important;
  background:linear-gradient(180deg,rgba(5,16,30,.90),rgba(7,20,36,.82))!important;
  color:var(--rp25-text)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}
html body input,
html body select{min-height:43px!important;}
html body input:hover,
html body select:hover,
html body textarea:hover{border-color:var(--rp25-line-strong)!important;}
html body input:focus,
html body select:focus,
html body textarea:focus{
  border-color:rgba(251,113,133,.52)!important;
  box-shadow:0 0 0 3px rgba(225,29,72,.11),inset 0 1px 0 rgba(255,255,255,.03)!important;
}
html body .btn{
  border:1px solid var(--rp25-line)!important;
  border-radius:11px!important;
  background:linear-gradient(180deg,rgba(20,40,65,.92),rgba(10,25,44,.90))!important;
  color:#f2f6fb!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}
html body .btn:hover{border-color:var(--rp25-line-strong)!important;background:linear-gradient(180deg,rgba(28,51,80,.96),rgba(13,31,53,.94))!important;}
html body .btn.primary{
  border-color:rgba(251,113,133,.34)!important;
  background:linear-gradient(135deg,#ef3154,#c8102e)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 12px 28px rgba(225,29,72,.20)!important;
}

/* Tabellen als echte Portalfläche statt alte flache Datenliste. */
html body .table-wrap,
html body .card.table-wrap{
  overflow:hidden!important;
  padding:0!important;
  border:1px solid var(--rp25-line)!important;
  border-radius:18px!important;
  background:linear-gradient(145deg,rgba(8,22,39,.97),rgba(6,17,31,.94))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 18px 44px rgba(1,7,18,.22)!important;
}
html body .card > .table-wrap{border-radius:14px!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.02)!important;}
html body table{border-collapse:separate!important;border-spacing:0!important;background:transparent!important;}
html body table thead th{
  padding-top:15px!important;
  padding-bottom:15px!important;
  border-bottom:1px solid rgba(148,163,184,.16)!important;
  background:
    linear-gradient(180deg,rgba(40,58,82,.78),rgba(24,42,66,.74))!important;
  color:#aebbd0!important;
  font-size:.72rem!important;
  letter-spacing:.105em!important;
}
html body table tbody tr{background:linear-gradient(90deg,rgba(10,25,43,.86),rgba(9,23,40,.78))!important;}
html body table tbody tr:nth-child(even){background:linear-gradient(90deg,rgba(14,31,52,.90),rgba(11,27,47,.82))!important;}
html body table tbody tr:hover{background:linear-gradient(90deg,rgba(28,48,75,.94),rgba(20,40,66,.88))!important;}
html body table td{padding-top:15px!important;padding-bottom:15px!important;border-bottom:1px solid rgba(148,163,184,.085)!important;}
html body table tbody tr:last-child td{border-bottom:0!important;}
html body table td strong{color:#f5f7fb!important;}
html body .pill,
html body .status,
html body .role{
  border:1px solid rgba(148,163,184,.17)!important;
  background:rgba(15,32,54,.82)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03)!important;
}

/* Eindeutige Freigabeinformation für zentrale Wasserentnahmestellen. */
html body .water-release-badge.organization{
  background:rgba(59,130,246,.12)!important;
  border-color:rgba(96,165,250,.27)!important;
  color:#bfdbfe!important;
}
html body .water-release-badge.operator{
  background:rgba(245,158,11,.12)!important;
  border-color:rgba(245,158,11,.28)!important;
  color:#fcd34d!important;
}

/* Heller Modus mit denselben Proportionen und klarer Flächenhierarchie. */
body[data-theme="light"] .content > .page-head,
body[data-theme="light"] .content > .page-hero,
body[data-theme="light"] .card,
body[data-theme="light"] .toolbar,
body[data-theme="light"] .stat-card,
body[data-theme="light"] .pagination,
body[data-theme="light"] .portal-footer,
body[data-theme="light"] .form-subcard,
body[data-theme="light"] .detail-item,
body[data-theme="light"] .info-grid > div,
body[data-theme="light"] .entity-card,
body[data-theme="light"] .admin-panel,
body[data-theme="light"] .admin-card{
  border-color:rgba(71,85,105,.17)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(242,247,252,.92))!important;
  box-shadow:inset 0 1px 0 #fff,0 16px 38px rgba(15,23,42,.08)!important;
}
body[data-theme="light"] .table-wrap,
body[data-theme="light"] .card.table-wrap{background:#f8fafc!important;border-color:rgba(71,85,105,.17)!important;}
body[data-theme="light"] table thead th{background:linear-gradient(180deg,#eaf0f7,#e3ebf4)!important;color:#536277!important;}
body[data-theme="light"] table tbody tr{background:rgba(255,255,255,.94)!important;}
body[data-theme="light"] table tbody tr:nth-child(even){background:rgba(242,246,251,.96)!important;}
body[data-theme="light"] table tbody tr:hover{background:#edf3fa!important;}
body[data-theme="light"] table td strong{color:#172033!important;}
body[data-theme="light"] input,
body[data-theme="light"] select,
body[data-theme="light"] textarea{background:linear-gradient(180deg,#fff,#f7f9fc)!important;color:#172033!important;border-color:rgba(71,85,105,.18)!important;}
body[data-theme="light"] .dev-organization-chip{background:linear-gradient(135deg,#fff1f2,#fff)!important;color:#9f1239!important;border-color:#fecdd3!important;}
body[data-theme="light"] .dev-organization-chip__label{color:#9f1239!important;}

@media(max-width:1320px){
  :root{--sidebar-width:272px!important;}
  html body .sidebar nav a.sidebar-nav-link{font-size:18px!important;}
  html body .topbar .topbar-desktop-shell{grid-template-columns:minmax(285px,auto) minmax(300px,500px) minmax(370px,1fr)!important;}
}

@media(max-width:1100px){
  :root{--sidebar-width:318px!important;}
  html body .main{margin-left:0!important;}
  html body .sidebar{width:min(91vw,var(--sidebar-width))!important;min-width:min(91vw,var(--sidebar-width))!important;max-width:min(91vw,var(--sidebar-width))!important;}
  html body .sidebar nav a.sidebar-nav-link{font-size:18.25px!important;}
  html body .rp-mobile-header__brand{display:flex!important;align-items:center!important;gap:7px!important;min-width:0!important;}
  html body .dev-organization-chip--mobile{min-height:26px!important;padding:2px 7px 2px 3px!important;}
  html body .dev-organization-chip--mobile .dev-organization-chip__label{display:none!important;}
  html body .dev-organization-chip--mobile .dev-organization-chip__code{min-width:31px!important;height:20px!important;}
}

@media(max-width:760px){
  html body .content > .page-head,
  html body .content > .page-hero{min-height:0!important;padding:19px 17px!important;border-radius:17px!important;}
  html body .card,
  html body .toolbar,
  html body .pagination,
  html body .portal-footer,
  html body .table-wrap,
  html body .card.table-wrap{border-radius:15px!important;}
}

@media(max-width:430px){
  :root{--sidebar-width:306px!important;}
  html body .sidebar nav a.sidebar-nav-link{font-size:17.5px!important;}
  html body .sidebar .brand-text{font-size:1.28rem!important;}
  html body .sidebar .brand-text small,
  html body .sidebar .brand-context{font-size:.70rem!important;letter-spacing:.052em!important;}
}