/* Retter-Portal v1.3.24 · größere Sidebar-Schrift, einheitliche Portalflächen und eindeutige DEV-Kennzeichnung */
:root{
  --sidebar-width:266px!important;
  --rp24-sidebar:#07111f;
  --rp24-sidebar-deep:#050c17;
  --rp24-surface:rgba(8,20,36,.84);
  --rp24-surface-strong:rgba(10,24,42,.95);
  --rp24-surface-soft:rgba(14,30,51,.72);
  --rp24-line:rgba(148,163,184,.145);
  --rp24-line-strong:rgba(148,163,184,.225);
  --rp24-highlight:rgba(255,255,255,.045);
  --rp24-shadow:0 18px 48px rgba(0,0,0,.23);
}

/* Sidebar: minimal breiter, größere Schrift und sauberer Markenbereich. */
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:13px 11px 20px!important;
  background:
    radial-gradient(circle at 5% -8%,rgba(225,29,72,.19),transparent 21rem),
    radial-gradient(circle at 114% 34%,rgba(37,99,235,.105),transparent 21rem),
    linear-gradient(180deg,var(--rp24-sidebar),#081526 48%,var(--rp24-sidebar-deep))!important;
}
html body .sidebar .brand{
  min-height:78px!important;
  margin:0 2px 13px!important;
  padding:4px 7px 15px!important;
  gap:12px!important;
  border-bottom:1px solid rgba(148,163,184,.13)!important;
}
html body .sidebar .brand-logo-wrap{
  width:56px!important;
  min-width:56px!important;
  height:56px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
html body .sidebar .brand-logo-wrap::before,
html body .sidebar .brand-logo-wrap::after{display:none!important;}
html body .sidebar .brand-logo.logo-light,
html body .sidebar .brand-logo.logo-dark{position:static!important;inset:auto!important;margin:0!important;}
html body .sidebar .brand-logo{
  width:56px!important;
  height:56px!important;
  max-width:56px!important;
  max-height:56px!important;
  object-fit:contain!important;
  object-position:center!important;
  filter:drop-shadow(0 10px 20px rgba(0,0,0,.34))!important;
}
html body .sidebar .brand-text{
  min-width:0!important;
  font-size:1.25rem!important;
  line-height:1.08!important;
  font-weight:950!important;
  letter-spacing:-.026em!important;
}
html body .sidebar .brand-text small,
html body .sidebar .brand-context{
  display:block!important;
  margin-top:5px!important;
  font-size:.69rem!important;
  line-height:1.2!important;
  letter-spacing:.075em!important;
  white-space:nowrap!important;
}
html body .sidebar .nav-section{
  margin:16px 9px 7px!important;
  font-size:.73rem!important;
  letter-spacing:.14em!important;
}
html body .sidebar nav a.sidebar-nav-link{
  min-height:48px!important;
  margin:1px 0!important;
  padding:9px 11px!important;
  gap:12px!important;
  border-radius:13px!important;
  font-size:17.25px!important;
  line-height:1.18!important;
  font-weight:790!important;
  letter-spacing:-.012em!important;
}
html body .sidebar .sidebar-nav-icon{
  width:24px!important;
  min-width:24px!important;
  height:24px!important;
}
html body .sidebar .sidebar-nav-icon svg{width:22px!important;height:22px!important;stroke-width:1.95!important;}
html body .sidebar .sidebar-nav-label{min-width:0!important;overflow-wrap:normal!important;word-break:normal!important;}
html body .sidebar .nav-count{min-width:28px!important;height:24px!important;padding-inline:7px!important;font-size:.74rem!important;}

/* DEV wird nur noch oben im Header gezeigt, nicht zusätzlich in der Marke der Sidebar. */
html body .dev-organization-chip{
  min-height:28px!important;
  padding:5px 9px!important;
  border:1px solid rgba(251,113,133,.28)!important;
  border-radius:999px!important;
  background:linear-gradient(135deg,rgba(225,29,72,.15),rgba(127,29,29,.10))!important;
  color:#fecdd3!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important;
  font-size:.69rem!important;
  font-weight:950!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
}

/* Einheitliche Produktsprache: dieselbe Tiefe, Linien und Flächen wie in der Sidebar. */
html body{
  background:
    radial-gradient(circle at 17% -8%,rgba(225,29,72,.095),transparent 34rem),
    radial-gradient(circle at 91% 1%,rgba(37,99,235,.12),transparent 34rem),
    linear-gradient(135deg,#07101d,#0a1728)!important;
}
html body .content{padding:20px clamp(18px,1.8vw,29px) 34px!important;}
html body .content > .page-head,
html body .content > .page-hero,
html body .card,
html body .stat-card,
html body .toolbar,
html body .pagination,
html body .portal-footer,
html body .entity-card,
html body .detail-item,
html body .info-grid > div,
html body .admin-water-source-row{
  border:1px solid var(--rp24-line)!important;
  background:
    linear-gradient(180deg,var(--rp24-highlight),transparent 34%),
    radial-gradient(circle at 100% 0,rgba(37,99,235,.075),transparent 24rem),
    linear-gradient(145deg,var(--rp24-surface-strong),var(--rp24-surface))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),var(--rp24-shadow)!important;
}
html body .content > .page-head,
html body .content > .page-hero{
  min-height:126px!important;
  padding:21px clamp(22px,2.1vw,31px)!important;
  border-radius:18px!important;
}
html body .content > .page-head h1,
html body .content > .page-hero h1{
  font-size:clamp(2.15rem,2.55vw,3rem)!important;
  letter-spacing:-.052em!important;
}
html body .card{border-radius:17px!important;}
html body .stat-card{border-radius:16px!important;}
html body .toolbar{border-radius:16px!important;padding:14px!important;}
html body .pagination{border-radius:16px!important;}
html body .portal-footer{border-radius:17px!important;}
html body .table-wrap{
  overflow:hidden!important;
  border:1px solid var(--rp24-line)!important;
  border-radius:14px!important;
  background:rgba(5,14,27,.52)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 14px 36px rgba(0,0,0,.16)!important;
}
html body table{border-collapse:separate!important;border-spacing:0!important;}
html body table thead th{
  background:linear-gradient(180deg,rgba(34,51,75,.88),rgba(24,40,63,.86))!important;
  border-bottom:1px solid var(--rp24-line)!important;
  color:#aab8ca!important;
}
html body table tbody tr{background:rgba(8,20,36,.52)!important;}
html body table tbody tr:nth-child(even){background:rgba(13,28,48,.58)!important;}
html body table tbody tr:hover{background:rgba(28,47,73,.66)!important;}
html body table td{border-bottom-color:rgba(148,163,184,.09)!important;}
html body input,
html body select,
html body textarea{
  border:1px solid var(--rp24-line)!important;
  border-radius:12px!important;
  background:linear-gradient(180deg,rgba(4,13,25,.78),rgba(6,17,31,.68))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}
html body input:hover,
html body select:hover,
html body textarea:hover{border-color:var(--rp24-line-strong)!important;}
html body input:focus,
html body select:focus,
html body textarea:focus{
  border-color:rgba(251,113,133,.55)!important;
  box-shadow:0 0 0 3px rgba(225,29,72,.10),inset 0 1px 0 rgba(255,255,255,.03)!important;
}
html body .btn{
  border:1px solid var(--rp24-line)!important;
  border-radius:11px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.022))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}
html body .btn:hover{
  border-color:var(--rp24-line-strong)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.035))!important;
}
html body .btn.primary{
  border-color:rgba(251,113,133,.34)!important;
  background:linear-gradient(135deg,#ef294f,#c8102e)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 12px 28px rgba(225,29,72,.20)!important;
}
html body .pill,
html body .status,
html body .role{
  border:1px solid rgba(148,163,184,.16)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03)!important;
}
html body .flash,
html body .department-chip,
html body .form-info-field,
html body .water-readonly-notice{
  border-radius:14px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}

/* Heller Modus bleibt ebenfalls geschlossen und hochwertig. */
body[data-theme="light"]{
  background:
    radial-gradient(circle at 15% -8%,rgba(200,16,46,.075),transparent 34rem),
    radial-gradient(circle at 94% 0,rgba(37,99,235,.08),transparent 34rem),
    linear-gradient(135deg,#f4f7fb,#eaf0f7)!important;
}
body[data-theme="light"] .content > .page-head,
body[data-theme="light"] .content > .page-hero,
body[data-theme="light"] .card,
body[data-theme="light"] .stat-card,
body[data-theme="light"] .toolbar,
body[data-theme="light"] .pagination,
body[data-theme="light"] .portal-footer,
body[data-theme="light"] .entity-card,
body[data-theme="light"] .detail-item,
body[data-theme="light"] .info-grid > div,
body[data-theme="light"] .admin-water-source-row{
  border-color:rgba(71,85,105,.16)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.78),transparent 38%),
    linear-gradient(145deg,rgba(255,255,255,.96),rgba(243,247,252,.88))!important;
  box-shadow:inset 0 1px 0 #fff,0 16px 38px rgba(15,23,42,.075)!important;
}
body[data-theme="light"] .table-wrap{background:rgba(255,255,255,.84)!important;border-color:rgba(71,85,105,.16)!important;}
body[data-theme="light"] table thead th{background:linear-gradient(180deg,#edf3fa,#e6edf6)!important;color:#536277!important;}
body[data-theme="light"] table tbody tr{background:rgba(255,255,255,.76)!important;}
body[data-theme="light"] table tbody tr:nth-child(even){background:rgba(243,247,252,.84)!important;}
body[data-theme="light"] table tbody tr:hover{background:#eef4fb!important;}
body[data-theme="light"] input,
body[data-theme="light"] select,
body[data-theme="light"] textarea{background:linear-gradient(180deg,#fff,#f8fafc)!important;border-color:rgba(71,85,105,.18)!important;}
body[data-theme="light"] .btn{background:linear-gradient(180deg,#fff,#f4f7fb)!important;border-color:rgba(71,85,105,.17)!important;}
body[data-theme="light"] .dev-organization-chip{color:#9f1239!important;background:linear-gradient(135deg,#fff1f2,#ffe4e6)!important;border-color:#fecdd3!important;}

@media(max-width:1260px){
  :root{--sidebar-width:258px!important;}
  html body .sidebar nav a.sidebar-nav-link{font-size:16.55px!important;}
}

@media(max-width:1100px){
  :root{--sidebar-width:310px!important;}
  html body .main{margin-left:0!important;}
  html body .sidebar{width:min(90vw,var(--sidebar-width))!important;min-width:min(90vw,var(--sidebar-width))!important;max-width:min(90vw,var(--sidebar-width))!important;}
  html body .sidebar nav a.sidebar-nav-link{font-size:17px!important;}
  html body .dev-organization-chip--mobile{justify-self:start!important;max-width:100%!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{border-radius:15px!important;}
}

@media(max-width:430px){
  :root{--sidebar-width:300px!important;}
  html body .sidebar nav a.sidebar-nav-link{font-size:16.6px!important;}
  html body .sidebar .brand-text{font-size:1.22rem!important;}
  html body .sidebar .brand-text small,
  html body .sidebar .brand-context{font-size:.67rem!important;letter-spacing:.065em!important;}
}