/* Retter-Portal v1.3.26 · Proportionen zwischen Sidebar und Portalinhalt sauberer ausbalanciert */
:root{
  --sidebar-width:298px!important;
  --rp26-line:rgba(148,163,184,.16);
  --rp26-line-soft:rgba(148,163,184,.11);
  --rp26-panel-top:rgba(255,255,255,.045);
  --rp26-panel-blue:rgba(37,99,235,.10);
  --rp26-panel-red:rgba(225,29,72,.08);
  --rp26-panel-bg:linear-gradient(145deg,rgba(10,24,42,.98),rgba(7,19,33,.96))!important;
}

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;}

/* Sidebar größer und typografisch stärker, ohne wieder überladen zu wirken. */
html body .sidebar{
  width:var(--sidebar-width)!important;
  min-width:var(--sidebar-width)!important;
  max-width:var(--sidebar-width)!important;
  padding:15px 15px 24px!important;
}
html body .sidebar .brand{
  display:flex!important;
  align-items:center!important;
  min-height:88px!important;
  margin:0 3px 14px!important;
  padding:6px 8px 16px!important;
  gap:10px!important;
}
html body .sidebar .brand-logo-wrap,
html body .sidebar .brand-logo{
  width:52px!important;
  min-width:52px!important;
  max-width:52px!important;
  height:52px!important;
  max-height:52px!important;
}
html body .sidebar .brand-text{
  flex:1 1 auto!important;
  min-width:0!important;
  font-size:1.46rem!important;
  line-height:1.02!important;
  font-weight:950!important;
  letter-spacing:-.035em!important;
}
html body .sidebar .brand-text small,
html body .sidebar .brand-context{
  margin-top:7px!important;
  font-size:.76rem!important;
  line-height:1.12!important;
  letter-spacing:.045em!important;
  color:#9caabe!important;
}
html body .sidebar .nav-section{
  margin:19px 10px 9px!important;
  font-size:.81rem!important;
}
html body .sidebar nav a.sidebar-nav-link{
  min-height:52px!important;
  padding:10px 13px!important;
  gap:13px!important;
  font-size:20.5px!important;
  line-height:1.16!important;
  font-weight:820!important;
}
html body .sidebar .sidebar-nav-icon{
  width:27px!important;
  min-width:27px!important;
  height:27px!important;
}
html body .sidebar .sidebar-nav-icon svg{width:25px!important;height:25px!important;}
html body .sidebar .nav-count{min-width:31px!important;height:25px!important;font-size:.8rem!important;}

/* Header kompakter und DEV-Organisation einfacher/ruhiger dargestellt. */
html body .topbar{min-height:56px!important;}
html body .topbar .topbar-desktop-shell{
  min-height:56px!important;
  grid-template-columns:minmax(295px,auto) minmax(300px,520px) minmax(380px,1fr)!important;
  padding:6px clamp(16px,1.35vw,22px)!important;
  gap:12px!important;
}
html body .topbar .topbar-title{gap:8px!important;align-items:center!important;}
html body .topbar .topbar-eyebrow{font-size:.88rem!important;}
html body .topbar .topbar-version{font-size:.84rem!important;}
html body .topbar .department-context-switch,
html body .topbar .department-context-static{min-height:38px!important;border-radius:12px!important;}
html body .topbar .theme-switch{min-height:38px!important;}
html body .dev-organization-chip{
  min-height:28px!important;
  padding:0 10px!important;
  border-radius:999px!important;
  border:1px solid rgba(251,113,133,.24)!important;
  background:linear-gradient(135deg,rgba(225,29,72,.15),rgba(10,24,41,.94))!important;
  color:#fecdd3!important;
  font-size:.72rem!important;
  font-weight:900!important;
  letter-spacing:.06em!important;
  text-transform:uppercase!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03)!important;
}
html body .dev-organization-chip__code,
html body .dev-organization-chip__label{display:none!important;}

/* Hauptbereich optisch stärker aus derselben Designfamilie wie die Sidebar. */
html body .content{padding:18px clamp(16px,1.55vw,26px) 30px!important;}
html body .content > .page-head,
html body .content > .page-hero,
html body .card,
html body .toolbar,
html body .pagination,
html body .portal-footer,
html body .table-wrap,
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{
  position:relative!important;
  border:1px solid var(--rp26-line)!important;
  background:
    linear-gradient(180deg,var(--rp26-panel-top),transparent 32%),
    radial-gradient(circle at 100% 0,var(--rp26-panel-blue),transparent 25rem),
    radial-gradient(circle at 0 0,var(--rp26-panel-red),transparent 22rem),
    linear-gradient(145deg,rgba(10,24,42,.98),rgba(7,19,33,.96))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.024),0 18px 44px rgba(1,7,18,.22)!important;
}
html body .content > .page-head::before,
html body .content > .page-hero::before,
html body .card::before,
html body .toolbar::before,
html body .portal-footer::before,
html body .table-wrap::before{
  content:""!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  top:0!important;
  height:1px!important;
  background:linear-gradient(90deg,rgba(251,113,133,.28),rgba(148,163,184,.07) 28%,rgba(37,99,235,.22) 100%)!important;
  pointer-events:none!important;
}
html body .content > .page-head,
html body .content > .page-hero{
  min-height:108px!important;
  padding:18px clamp(20px,1.8vw,28px)!important;
  border-radius:20px!important;
}
html body .content > .page-head h1,
html body .content > .page-hero h1{font-size:clamp(1.95rem,2.15vw,2.55rem)!important;letter-spacing:-.05em!important;}
html body .content > .page-head .muted,
html body .content > .page-hero .muted,
html body .card .muted,
html body .toolbar .muted,
html body .portal-footer .muted{color:#9eacc0!important;}
html body .content :is(.page-head,.page-hero,.card) .eyebrow{color:#fb7185!important;}
html body .card{border-radius:20px!important;}
html body .toolbar{padding:13px!important;border-radius:18px!important;gap:10px!important;}
html body .portal-footer,
html body .pagination{border-radius:18px!important;}

/* Eingaben, Buttons, Tabellen und Badges bekommen dieselbe Konturensprache. */
html body input,
html body select,
html body textarea,
html body .smart-person-picker,
html body .smart-select-field{
  border:1px solid var(--rp26-line)!important;
  border-radius:12px!important;
  background:linear-gradient(180deg,rgba(6,18,32,.92),rgba(7,19,33,.86))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.022)!important;
}
html body input,
html body select{min-height:41px!important;}
html body .btn{
  min-height:41px!important;
  border-radius:12px!important;
  background:linear-gradient(180deg,rgba(17,38,63,.94),rgba(10,24,41,.92))!important;
}
html body .btn.primary{background:linear-gradient(135deg,#ef3154,#c8102e)!important;}

html body .table-wrap,
html body .card.table-wrap{overflow:hidden!important;padding:0!important;border-radius:19px!important;}
html body table thead th{
  padding-top:14px!important;
  padding-bottom:14px!important;
  background:linear-gradient(180deg,rgba(37,54,77,.86),rgba(23,39,61,.8))!important;
  color:#b6c3d5!important;
  font-size:.73rem!important;
  letter-spacing:.11em!important;
}
html body table tbody tr{background:linear-gradient(90deg,rgba(9,22,39,.92),rgba(8,20,35,.88))!important;}
html body table tbody tr:nth-child(even){background:linear-gradient(90deg,rgba(11,27,46,.92),rgba(9,24,41,.88))!important;}
html body table tbody tr:hover{background:linear-gradient(90deg,rgba(20,39,62,.94),rgba(15,34,54,.90))!important;}
html body table td{padding-top:14px!important;padding-bottom:14px!important;border-bottom:1px solid var(--rp26-line-soft)!important;}
html body .pill,
html body .status,
html body .role{
  border-radius:999px!important;
  border:1px solid rgba(148,163,184,.18)!important;
  background:linear-gradient(180deg,rgba(16,32,53,.90),rgba(13,28,47,.82))!important;
  color:#edf3fb!important;
}

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"] .pagination,
body[data-theme="light"] .portal-footer,
body[data-theme="light"] .table-wrap{
  background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(244,248,252,.95))!important;
}
body[data-theme="light"] .dev-organization-chip{background:linear-gradient(135deg,#fff1f2,#fff)!important;color:#9f1239!important;border-color:#fecdd3!important;}

@media(max-width:1320px){
  :root{--sidebar-width:290px!important;}
  html body .sidebar nav a.sidebar-nav-link{font-size:19.5px!important;}
  html body .topbar .topbar-desktop-shell{grid-template-columns:minmax(280px,auto) minmax(290px,480px) minmax(360px,1fr)!important;}
}

@media(max-width:1100px){
  :root{--sidebar-width:320px!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:19px!important;}
  html body .topbar .topbar-desktop-shell{grid-template-columns:minmax(0,1fr) auto!important;grid-template-areas:"title actions" "context context"!important;row-gap:10px!important;}
  html body .topbar .topbar-title{grid-area:title!important;}
  html body .topbar .topbar-context{grid-area:context!important;}
  html body .topbar .topbar-actions{grid-area:actions!important;}
}

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

@media(max-width:430px){
  :root{--sidebar-width:308px!important;}
  html body .sidebar .brand-text{font-size:1.36rem!important;}
  html body .sidebar .brand-text small,
  html body .sidebar .brand-context{font-size:.72rem!important;}
  html body .sidebar nav a.sidebar-nav-link{font-size:18px!important;}
}