@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap");

:root {
  color-scheme: dark;
  --ap-night: #141B4D;
  --ap-light: #489FDF;
  --ap-white: #FFFFFF;
  --ap-bg: #020914;
  --ap-panel: rgba(8, 24, 51, 0.74);
  --ap-card: rgba(9, 28, 61, 0.68);
  --ap-soft: rgba(255, 255, 255, 0.1);
  --ap-border: rgba(72, 159, 223, 0.24);
  --ap-muted: rgba(255, 255, 255, 0.72);
  --ap-glow: 0 0 36px rgba(72, 159, 223, 0.3);
  --ap-shadow: 0 28px 90px rgba(0, 0, 0, 0.42);
  --ap-radius-xl: 28px;
  --ap-radius-lg: 24px;
  --ap-radius-md: 18px;
  --ap-font: "Poppins", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ap-ui-page: #020817;
  --ap-ui-surface: rgba(1, 10, 28, 0.96);
  --ap-ui-surface-strong: rgba(1, 9, 25, 0.98);
  --ap-ui-card: rgba(4, 15, 38, 0.92);
  --ap-ui-card-soft: rgba(8, 22, 50, 0.84);
  --ap-ui-control: rgba(7, 20, 47, 0.9);
  --ap-ui-border: rgba(72, 159, 223, 0.32);
  --ap-ui-border-strong: rgba(101, 189, 255, 0.58);
  --ap-ui-text: #ffffff;
  --ap-ui-muted: rgba(214, 231, 250, 0.72);
  --ap-ui-muted-strong: rgba(228, 239, 252, 0.86);
  --ap-ui-shadow: 0 26px 80px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  --ap-ui-button: linear-gradient(135deg, rgba(72, 159, 223, .98), rgba(37, 119, 190, .86));
  --ap-space-0: 0;
  --ap-space-1: 4px;
  --ap-space-2: 8px;
  --ap-space-3: 12px;
  --ap-space-4: 16px;
  --ap-space-5: 24px;
  --ap-space-6: 32px;
  --ap-space-7: 40px;
  --ap-space-8: 56px;
  --ap-gap-tight: var(--ap-space-2);
  --ap-gap-default: var(--ap-space-4);
  --ap-gap-loose: var(--ap-space-5);
  --ap-card-padding: clamp(18px, 1.8vw, 28px);
  --ap-surface-padding: clamp(22px, 2.4vw, 36px);
  --ap-page-gap: clamp(16px, 1.6vw, 24px);
  --ap-section-gap: clamp(24px, 3vw, 40px);
  --ap-control-height: 50px;
  --ap-z-popover: 10080;
  --ap-ui-panel-padding: var(--ap-surface-padding);
  --ap-ui-card-padding: var(--ap-card-padding);
  --ap-ui-gap: var(--ap-page-gap);
  --portal-bg: var(--ap-ui-page);
  --portal-surface: var(--ap-ui-surface);
  --portal-surface-soft: var(--ap-ui-card-soft);
  --portal-card: var(--ap-ui-card);
  --portal-border: var(--ap-ui-border);
  --portal-border-strong: var(--ap-ui-border-strong);
  --portal-text: var(--ap-ui-text);
  --portal-muted: var(--ap-ui-muted);
  --portal-accent: var(--ap-light);
  --portal-shadow: var(--ap-ui-shadow);
  --portal-glow: 0 0 42px rgba(72, 159, 223, .22);
  --portal-radius-shell: 28px;
  --portal-radius-hero: 28px;
  --portal-radius-surface: 22px;
  --portal-radius-card: 18px;
  --portal-radius-control: 12px;
  --portal-radius-pill: 999px;
  --portal-space-xs: var(--ap-space-2);
  --portal-space-sm: var(--ap-space-3);
  --portal-space-md: var(--ap-space-4);
  --portal-space-lg: var(--ap-space-5);
  --portal-space-xl: var(--ap-space-6);
  --portal-space-2xl: 42px;
  --portal-width-content: 1180px;
  --portal-width-wide: 1440px;
  --portal-width-form: 1180px;
  --ink: var(--ap-white);
  --muted: var(--ap-muted);
  --line: var(--ap-border);
  --surface: var(--ap-panel);
  --field: rgba(255, 255, 255, 0.08);
  --accent: var(--ap-light);
  --accent-strong: var(--ap-light);
  --night: var(--ap-night);
  --sky: var(--ap-light);
  --mid: var(--ap-light);
  --warning: var(--ap-light);
  --danger: var(--ap-light);
  --paid: var(--ap-light);
  --work: var(--ap-light);
  --open: var(--ap-light);
  --portal-sidebar-bg: linear-gradient(180deg, #081a38 0%, #031027 100%);
  --portal-sidebar-border: rgba(111, 184, 236, 0.22);
  --portal-workspace-bg: linear-gradient(145deg, #eef7fd 0%, #f8fbfe 48%, #e8f3fb 100%);
  --portal-surface-muted: rgba(239, 247, 252, 0.78);
  --portal-surface-default: rgba(248, 252, 255, 0.86);
  --portal-surface-active: rgba(255, 255, 255, 0.96);
  --portal-surface-border: rgba(43, 119, 173, 0.18);
  --portal-surface-border-active: rgba(38, 137, 203, 0.4);
  --portal-text-primary: #0a1b36;
  --portal-text-secondary: #304c68;
  --portal-text-muted: #526b82;
  --portal-accent-soft: rgba(72, 159, 223, 0.14);
  --portal-shadow-soft: 0 18px 48px rgba(27, 66, 99, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.82);
  --portal-shadow-active: 0 24px 62px rgba(26, 86, 130, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.96);
  --portal-radius-sm: 12px;
  --portal-radius-md: 18px;
  --portal-radius-lg: 26px;
  --portal-radius-sidebar: var(--portal-radius-hero);
  --portal-backdrop-blur: 18px;
  --portal-focus-ring: 0 0 0 4px rgba(24, 128, 199, 0.22);
  --portal-background: #eaf4fb;
  --portal-background-accent: #d9edf9;
  --portal-sidebar-background: var(--portal-sidebar-bg);
  --portal-sidebar: var(--portal-sidebar-background);
  --portal-surface-subtle: var(--portal-surface-muted);
  --portal-surface-elevated: var(--portal-surface-active);
  --portal-surface-dark: #071b38;
  --portal-text-inverse: #f7fbff;
  --portal-accent-hover: #176fae;
  --portal-success: #176a43;
  --portal-warning: #7a5200;
  --portal-error: #9f2434;
  --portal-shadow-sm: 0 10px 28px rgba(25, 66, 99, .08);
  --portal-shadow-md: 0 18px 48px rgba(27, 66, 99, .12);
  --portal-shadow-lg: 0 28px 72px rgba(11, 43, 72, .18);
  --portal-radius-panel: 24px;
  --action-primary-bg: var(--portal-accent);
  --action-primary-border: var(--portal-accent);
  --action-primary-text: var(--portal-text-inverse);
  --action-primary-shadow: var(--portal-shadow-sm);
  --action-primary-hover-bg: var(--portal-accent-hover);
  --action-primary-hover-border: var(--portal-accent-hover);
  --action-primary-hover-shadow: var(--portal-shadow-md);
  --action-primary-focus: var(--portal-focus-ring);
}

/* Project Record V1: the shared detail panel stays neutral; only its hero owns imagery. */
body.dashboardMode #reonicOrderDetailPanel.is-project-record {
  padding: 0;
  overflow: visible;
  border: 0;
  background: var(--ap-ui-page);
  box-shadow: none;
}

#reonicOrderDetailPanel.is-project-record::before {
  content: none;
}

.is-project-record .projectRecordHero {
  position: relative;
  height: clamp(340px, 31vw, 410px);
  max-height: 410px;
  padding: 24px;
  overflow: hidden;
  border-radius: 22px;
  background:
    linear-gradient(90deg, rgba(2, 8, 28, .97), rgba(3, 12, 38, .78) 48%, rgba(4, 13, 38, .24)),
    url("/assets/premium-customer-hero.jpg") center / cover no-repeat;
  color: #fff;
  box-shadow: var(--ap-ui-shadow);
}

.is-project-record .projectRecordHero .formHead {
  align-items: flex-start;
}

.is-project-record .projectRecordHero .formHead h3 {
  margin: 0;
  color: rgba(255, 255, 255, .72);
  font-size: .82rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.is-project-record .projectRecordHero .linkButton {
  color: #fff;
}

.projectRecordHeroContent {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  max-width: 1040px;
  margin-top: 4px;
}

.projectRecordHeroIdentity {
  min-width: 0;
}

.projectRecordEyebrow {
  margin: 0 0 4px;
  color: rgba(255, 255, 255, .72);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.projectRecordHeroContent h2,
.projectRecordHeroContent h3 {
  margin: 0;
  color: #fff;
}

.projectRecordHeroContent h2 {
  font-size: clamp(2.3rem, 4vw, 3.6rem);
  line-height: .96;
}

.projectRecordHeroContent h3 {
  margin-top: 4px;
  font-size: clamp(1.2rem, 2vw, 1.7rem);
  font-weight: 600;
}

.projectRecordHeroFacts {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 8px;
}

.projectRecordHeroFacts span {
  padding: 5px 9px;
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: 999px;
  background: rgba(3, 12, 38, .45);
  color: rgba(255, 255, 255, .9);
  font-size: .82rem;
  backdrop-filter: blur(8px);
}

.projectRecordFocus {
  min-width: 0;
  margin-top: 2px;
}

.projectRecordFocusPrimary {
  max-width: none;
  padding: 0 0 0 12px;
  border-left: 2px solid rgba(72, 159, 223, .82);
}

.projectRecordFocusPrimary + .projectRecordFocusPrimary {
  margin-top: 6px;
}

.projectRecordFocusLabel {
  margin: 0 0 3px;
  color: rgba(255, 255, 255, .62);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.projectRecordFocusPrimary strong,
.projectRecordFocusPrimary span,
.projectRecordFocusMeta span {
  display: block;
  overflow-wrap: anywhere;
}

.projectRecordFocusPrimary strong {
  color: #fff;
  font-size: clamp(.9rem, 1vw, 1.05rem);
  font-weight: 600;
  line-height: 1.35;
}

.projectRecordFocusPrimary span {
  margin-top: 2px;
  color: rgba(255, 255, 255, .76);
  font-size: clamp(.78rem, .85vw, .88rem);
  line-height: 1.4;
}

.projectRecordFocusMeta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 8px;
  padding-top: 7px;
  border-top: 1px solid rgba(255, 255, 255, .18);
}

.projectRecordFocusMeta > div {
  min-width: 0;
  padding-right: 18px;
}

.projectRecordFocusMeta > div + div {
  padding-left: 18px;
  border-left: 1px solid rgba(255, 255, 255, .18);
}

.projectRecordFocusMeta span {
  color: rgba(255, 255, 255, .88);
  font-size: clamp(.76rem, .8vw, .84rem);
  line-height: 1.4;
}

.projectRecordStateFacts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.projectRecordStateFacts > div > span {
  margin-bottom: 4px;
  color: rgba(255, 255, 255, .72);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.projectRecordStateTag {
  width: max-content;
  max-width: 100%;
  padding: 5px 9px;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 800;
  line-height: 1.25;
}

.projectRecordStateTag.is-status { background: #d9edf9; color: #0a1b36; }
.projectRecordStateTag.is-phase { background: #e8f4df; color: #173a24; }

.projectRecordStatusAction {
  margin-top: 8px;
}

.projectRecordStatusToggle,
.projectRecordStatusSubmit,
.projectRecordStatusCancel {
  min-height: 34px;
  padding: 7px 12px;
  border-radius: 10px;
  font: inherit;
  font-size: .78rem;
  font-weight: 700;
  cursor: pointer;
}

.projectRecordStatusToggle,
.projectRecordStatusCancel {
  border: 1px solid rgba(255, 255, 255, .24);
  background: rgba(3, 12, 38, .42);
  color: #fff;
}

.projectRecordStatusSubmit {
  border: 1px solid rgba(101, 189, 255, .58);
  background: var(--ap-ui-button);
  color: #fff;
}

.projectRecordStatusToggle:disabled,
.projectRecordStatusSubmit:disabled,
.projectRecordStatusCancel:disabled {
  cursor: wait;
  opacity: .62;
}

.projectRecordStatusForm {
  display: grid;
  gap: 8px;
}

.projectRecordStatusForm label {
  color: rgba(255, 255, 255, .72);
  font-size: .72rem;
  font-weight: 600;
}

.projectRecordStatusForm select {
  width: 100%;
  min-height: 38px;
  padding: 7px 32px 7px 10px;
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: 10px;
  background: rgba(3, 12, 38, .78);
  color: #fff;
  font: inherit;
  font-size: .8rem;
}

.projectRecordStatusActions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.projectRecordStatusMessage {
  margin: 8px 0 0;
  color: rgba(255, 255, 255, .78);
  font-size: .76rem;
  line-height: 1.4;
}

.projectRecordStatusMessage.is-error {
  color: #ffd2d2;
}

.projectRecordStatusMessage.is-warning {
  color: #ffe4a8;
}

.projectRecordLayout {
  display: grid;
  grid-template-columns: minmax(190px, 230px) minmax(0, 1fr);
  gap: clamp(20px, 3vw, 38px);
  align-items: start;
  margin-top: 24px;
}

.projectRecordMobileToolbar,
.projectRecordNavigationDrawerHead,
.projectRecordNavigationBackdrop {
  display: none;
}

.projectRecordNavigation {
  position: sticky;
  top: 18px;
  display: grid;
  gap: 5px;
  padding: 10px;
  border: 1px solid var(--ap-ui-border);
  border-radius: 16px;
  background: var(--ap-ui-surface);
  box-shadow: var(--ap-ui-shadow);
}

.projectRecordNavItem {
  width: 100%;
  padding: 10px 12px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--ap-ui-text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.projectRecordNavItem:hover,
.projectRecordNavItem.is-active {
  background: rgba(72, 159, 223, .14);
  color: var(--ap-ui-primary);
}

.projectRecordNavItem:disabled {
  color: var(--ap-ui-muted);
  cursor: not-allowed;
  opacity: .58;
}

.projectRecordContent {
  min-width: 0;
}

.projectRecordSection {
  padding: clamp(20px, 3vw, 34px);
  border: 1px solid var(--ap-ui-border);
  border-radius: 18px;
  background: var(--ap-ui-surface);
  box-shadow: var(--ap-ui-shadow);
}

.projectRecordSection > h3 {
  margin-top: 0;
}

.projectRecordDefinition {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
}

.projectRecordDefinition div,
.projectRecordMediaItem,
.projectRecordDocumentList a {
  padding: 14px;
  border: 1px solid var(--ap-ui-border);
  border-radius: 12px;
  background: var(--ap-ui-page);
}

.projectRecordDefinition dt {
  color: var(--ap-ui-muted);
  font-size: .78rem;
}

.projectRecordDefinition dd {
  margin: 5px 0 0;
  font-weight: 650;
}

.projectRecordMediaGrid,
.projectRecordDocumentList {
  display: grid;
  gap: 12px;
}

.projectRecordMediaGrid {
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
}

.projectRecordMediaItem,
.projectRecordDocumentList a {
  display: flex;
  gap: 10px;
  align-items: center;
  color: inherit;
  text-decoration: none;
}

.projectRecordMediaOpen {
  width: 100%;
  font: inherit;
  text-align: left;
  cursor: zoom-in;
}

.projectRecordMediaOpen img {
  width: 96px;
  height: 68px;
  flex: 0 0 auto;
  border-radius: 8px;
  object-fit: cover;
}

.projectRecordMediaViewer[hidden] {
  display: none;
}

.projectRecordMediaViewer {
  width: 100%;
  height: min(70vh, 720px);
  margin-top: 18px;
  overflow: hidden;
  padding: 0;
  border: 1px solid rgba(72, 159, 223, .34);
  border-radius: 16px;
  background: #081522;
  color: #fff;
  box-shadow: 0 20px 54px rgba(10, 42, 66, .2);
}

.projectRecordMediaViewerShell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  height: 100%;
}

.projectRecordMediaViewer header,
.projectRecordMediaViewer footer {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  background: rgba(6, 19, 32, .96);
}

.projectRecordMediaViewer header {
  justify-content: space-between;
  border-bottom: 1px solid rgba(255, 255, 255, .15);
}

.projectRecordMediaViewer header strong {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

.projectRecordMediaViewer header p {
  margin: 3px 0 0;
  color: #cfeaff !important;
  -webkit-text-fill-color: #cfeaff !important;
  font-size: .82rem;
}

.projectRecordMediaViewer footer {
  justify-content: center;
  border-top: 1px solid rgba(255, 255, 255, .15);
}

.projectRecordMediaViewer button {
  min-width: 42px;
  min-height: 42px;
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: 10px;
  background: rgba(255, 255, 255, .1);
  color: #fff;
  font: inherit;
  cursor: pointer;
}

.projectRecordMediaViewer [data-project-record-media-close] {
  font-size: 1.5rem;
}

.projectRecordMediaViewport {
  display: grid;
  overflow: auto;
  place-items: center;
  min-height: 0;
  padding: 22px;
  touch-action: none;
}

.projectRecordMediaViewport img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  transform-origin: center;
  transition: transform .16s ease;
}

.projectRecordMediaViewer output {
  min-width: 60px;
  text-align: center;
}

.projectRecordDocumentList a {
  justify-content: space-between;
}

.projectRecordTimeline {
  display: grid;
  gap: 24px;
}

.projectRecordTimelineGroup {
  display: grid;
  grid-template-columns: minmax(150px, 190px) minmax(0, 1fr);
  gap: 24px;
}

.projectRecordTimelineDate {
  margin: 0;
  color: #304c68;
  font-size: .82rem;
  font-weight: 700;
  line-height: 1.4;
}

.projectRecordTimeline ol {
  position: relative;
  display: grid;
  gap: 14px;
  margin: 0;
  padding: 0 0 0 28px;
  list-style: none;
}

.projectRecordTimeline ol::before {
  content: "";
  position: absolute;
  top: 10px;
  bottom: -34px;
  left: 7px;
  width: 2px;
  background: #b9d8ee;
}

.projectRecordTimelineGroup:last-child ol::before {
  bottom: 10px;
}

.projectRecordTimeline li {
  position: relative;
  min-width: 0;
}

.projectRecordTimelineNode {
  position: absolute;
  z-index: 1;
  top: 16px;
  left: -27px;
  width: 14px;
  height: 14px;
  border: 3px solid #fff;
  border-radius: 50%;
  background: #2e95d6;
  box-shadow: 0 0 0 2px #8cc5ea;
}

.projectRecordTimeline article {
  padding: 14px 16px;
  border: 1px solid #cbdfea;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 22px rgba(27, 66, 99, .07);
}

.projectRecordTimeline article > strong,
.projectRecordTimeline article > .projectRecordHistoryMessage {
  color: #0a1b36;
  font-weight: 700;
}

.projectRecordTimelineMeta {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 6px 14px;
  margin-top: 5px;
  color: #526b82;
  font-size: .8rem;
}

.projectRecordTimeline article > p {
  margin: 10px 0 0;
  color: #304c68;
  line-height: 1.5;
}

.projectRecordTimelineAttachments {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 11px;
}

.projectRecordTimelineAttachments a {
  padding: 6px 9px;
  border: 1px solid #b9d8ee;
  border-radius: 8px;
  background: #eef7fd;
  color: #176fae;
  font-size: .8rem;
  font-weight: 650;
  text-decoration: none;
}

@media (max-width:760px) {
  .projectRecordTimelineGroup {
    grid-template-columns: 1fr;
    gap: 10px;
  }
}

.projectRecordTaskList {
  display: grid;
}

.projectRecordTaskItem {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ap-gap-default);
  padding: var(--ap-space-4) 0;
  border-bottom: 1px solid var(--ap-ui-border);
}

.projectRecordTaskItem:first-child {
  padding-top: var(--ap-space-1);
}

.projectRecordTaskItem:last-child {
  padding-bottom: var(--ap-space-1);
  border-bottom: 0;
}

.projectRecordTaskMain,
.projectRecordTaskMeta {
  display: flex;
  gap: var(--ap-space-2);
}

.projectRecordTaskMain {
  min-width: 0;
  flex-direction: column;
}

.projectRecordTaskMain > span:last-child,
.projectRecordTaskNumber,
.projectRecordTaskHint {
  color: var(--ap-ui-muted);
  font-size: .86rem;
  line-height: 1.45;
}

.projectRecordTaskNumber {
  font-weight: 700;
}

.projectRecordTaskMain strong {
  color: var(--ap-ui-text);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.35;
}

.projectRecordTaskMeta {
  flex: 0 0 auto;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.projectRecordTaskMeta .linkButton {
  min-height: auto;
  margin: 0;
  padding: var(--ap-space-2);
}

.projectRecordTaskNotice {
  margin: 0;
  color: var(--ap-ui-muted);
}

.projectRecordTaskHint {
  margin: 14px 0 0;
}

.projectRecordEmpty {
  color: var(--ap-ui-muted);
}

@media (max-width: 900px) {
  .is-project-record .projectRecordHero {
    height: auto;
    max-height: none;
    background:
      linear-gradient(180deg, rgba(2, 8, 28, .9), rgba(3, 12, 38, .72) 48%, rgba(2, 8, 28, .94)),
      url("/assets/premium-customer-hero.jpg") 62% center / cover no-repeat;
  }

  .projectRecordHeroContent {
    grid-template-columns: 1fr;
    align-items: start;
    gap: var(--ap-space-5);
  }

  .projectRecordFocusMeta {
    grid-template-columns: 1fr;
  }

  .projectRecordFocusMeta > div {
    padding: 12px 0;
  }

  .projectRecordFocusMeta > div + div {
    padding-left: 0;
    border-top: 1px solid rgba(255, 255, 255, .14);
    border-left: 0;
  }

  .projectRecordLayout {
    grid-template-columns: 1fr;
    margin-top: var(--ap-space-4);
  }

  .projectRecordMobileToolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--ap-gap-default);
    margin-top: var(--ap-space-4);
  }

  .projectRecordMobileToolbar .secondaryButton {
    flex: 0 0 auto;
    width: auto;
    min-height: 40px;
    margin: 0;
    padding-inline: var(--ap-space-4);
  }

  .projectRecordMobileToolbar span {
    color: var(--ap-ui-muted);
    font-size: .86rem;
    font-weight: 700;
  }

  .projectRecordNavigationPanel {
    position: fixed;
    z-index: 1002;
    top: 0;
    bottom: 0;
    left: 0;
    width: min(86vw, 320px);
    padding: var(--ap-surface-padding);
    overflow-y: auto;
    border-right: 1px solid var(--ap-ui-border);
    background: var(--ap-ui-surface-strong);
    box-shadow: var(--ap-ui-shadow);
    transform: translateX(-105%);
    transition: transform .2s ease;
  }

  .projectRecordNavigationPanel.is-open {
    transform: translateX(0);
  }

  .projectRecordNavigationDrawerHead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--ap-gap-default);
    margin-bottom: var(--ap-space-4);
    padding-bottom: var(--ap-space-3);
    border-bottom: 1px solid var(--ap-ui-border);
  }

  .projectRecordNavigationDrawerHead strong {
    color: var(--ap-ui-text);
  }

  .projectRecordNavigationDrawerHead .linkButton {
    min-height: auto;
    margin: 0;
  }

  .projectRecordNavigation {
    position: static;
    grid-template-columns: 1fr;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .projectRecordNavigationBackdrop {
    position: fixed;
    z-index: 1001;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: rgba(2, 8, 23, .72);
    backdrop-filter: blur(3px);
  }

  .projectRecordNavigationBackdrop.hidden {
    display: none;
  }

  body.project-record-navigation-open {
    overflow: hidden;
  }

  .projectRecordDefinition {
    grid-template-columns: 1fr;
  }

  .projectRecordTaskItem {
    align-items: flex-start;
    flex-direction: column;
  }

  .projectRecordTaskMeta {
    justify-content: flex-start;
  }
}

@media (max-width: 560px) {
  .is-project-record .projectRecordHero {
    min-height: 0;
    padding: 20px;
  }

  .projectRecordHeroContent {
    gap: var(--ap-space-4);
    margin-top: 16px;
  }

  .projectRecordHeroContent h2 {
    font-size: 2.65rem;
  }

  .projectRecordHeroFacts {
    gap: 7px;
    margin-top: 14px;
  }

  .projectRecordFocusPrimary {
    padding-left: 12px;
  }

  .projectRecordFocusMeta {
    margin-top: 14px;
    padding-top: 8px;
  }

}

.projectOrderReviewMount {
  min-width: 0;
  margin-top: var(--ap-space-4);
  color: var(--ap-ui-text);
}

.projectOrderReviewGrid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--ap-ui-gap);
  min-width: 0;
}

.projectOrderReviewReadModel,
.projectOrderReviewDecision,
.projectOrderReviewState,
.projectOrderReviewPreview,
.projectOrderReviewCurrent,
.projectOrderReviewSectionState {
  min-width: 0;
  padding: var(--ap-ui-card-padding);
  border: 1px solid var(--ap-ui-border);
  border-radius: var(--ap-radius-lg);
  background: var(--ap-ui-card);
  color: var(--ap-ui-text);
  overflow-wrap: anywhere;
}

.projectOrderReviewReadModel,
.projectOrderReviewForm,
.projectOrderReviewForm fieldset,
.projectOrderReviewCurrent dl {
  display: grid;
  gap: var(--ap-space-3);
  min-width: 0;
}

.projectOrderReviewReadModel > section,
.projectOrderReviewCurrent,
.projectOrderReviewSectionState + .projectOrderReviewSectionState,
.projectOrderReviewPreview {
  margin-top: var(--ap-space-4);
}

.projectOrderReviewReadModel ul,
.projectOrderReviewCurrent ul {
  margin: var(--ap-space-2) 0 0;
  padding-inline-start: var(--ap-space-5);
}

.projectOrderReviewReadModel li,
.projectOrderReviewSectionState li,
.projectOrderReviewCurrent li {
  margin-block: var(--ap-space-2);
  overflow-wrap: anywhere;
}

.projectOrderReviewSectionState li,
.projectOrderReviewSectionState li > span {
  display: grid;
  gap: var(--ap-space-1);
}

.projectOrderReviewProgress {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--ap-space-2);
}

.projectOrderReviewProgress > div {
  padding: var(--ap-space-3);
  border: 1px solid var(--ap-ui-border);
  border-radius: var(--ap-radius-md);
  background: var(--ap-ui-card-soft);
}

.projectOrderReviewReonicSummary {
  padding: var(--ap-space-4);
  border: 1px solid var(--ap-ui-border-strong);
  border-radius: var(--ap-radius-md);
  background: var(--ap-ui-card-soft);
}

.projectOrderReviewVirtualBadge {
  width: fit-content;
  margin: 0 0 var(--ap-space-2);
  padding: var(--ap-space-1) var(--ap-space-3);
  border-radius: 999px;
  background: rgba(72, 159, 223, .18);
  color: var(--ap-ui-text);
  font-weight: 700;
}

.projectOrderReviewReonicFacts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ap-space-2);
  margin-top: var(--ap-space-3);
}

.projectOrderReviewReonicFacts > div {
  min-width: 0;
  padding: var(--ap-space-3);
  border: 1px solid var(--ap-ui-border);
  border-radius: var(--ap-radius-md);
}

.projectOrderReviewReonicFacts :is(dt, dd) {
  margin: 0;
  overflow-wrap: anywhere;
}

.projectOrderReviewReonicFacts dt {
  color: var(--ap-ui-muted);
  font-size: .78rem;
}

.projectOrderReviewReonicFacts dd {
  margin-top: var(--ap-space-1);
  color: var(--ap-ui-text);
  font-weight: 600;
}

.projectOrderReviewForm fieldset {
  margin: 0;
  padding: var(--ap-space-4);
  border: 1px solid var(--ap-ui-border);
  border-radius: var(--ap-radius-md);
}

.projectOrderReviewScopeRows,
.projectOrderReviewConditionRows,
.projectOrderReviewConditionRow,
.projectOrderReviewW01Row {
  display: grid;
  gap: var(--ap-space-3);
  min-width: 0;
}

.projectOrderReviewConditionRow {
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
  padding: var(--ap-space-3);
  border: 1px solid var(--ap-ui-border);
  border-radius: var(--ap-radius-md);
}

.projectOrderReviewW01Row {
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  align-items: end;
}

.projectOrderReviewForm label {
  display: grid;
  gap: var(--ap-space-2);
  color: var(--ap-ui-muted-strong);
}

.projectOrderReviewForm label:has(input[type="checkbox"]),
.projectOrderReviewForm label:has(input[type="radio"]),
.projectOrderReviewConfirmation {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  min-height: 44px;
}

.projectOrderReviewForm input:not([type="checkbox"]):not([type="radio"]),
.projectOrderReviewForm textarea,
.projectOrderReviewForm select {
  width: 100%;
  min-height: 44px;
  padding: var(--ap-space-2) var(--ap-space-3);
  border: 1px solid var(--ap-ui-border);
  border-radius: var(--ap-radius-md);
  background: var(--ap-ui-control);
  color: var(--ap-ui-text);
}

.projectOrderReviewForm textarea {
  min-height: 96px;
  resize: vertical;
}

.projectOrderReviewForm button,
.projectOrderReviewState button,
.projectOrderReviewRetryActions button {
  min-height: 44px;
  padding: var(--ap-space-2) var(--ap-space-4);
  border: 1px solid var(--ap-ui-border-strong);
  border-radius: var(--ap-radius-md);
  background: var(--ap-ui-button);
  color: var(--ap-ui-text);
  cursor: pointer;
}

.projectOrderReviewForm button:disabled,
.projectOrderReviewRetryActions button:disabled {
  opacity: .55;
  cursor: not-allowed;
}

.projectOrderReviewForm :focus-visible,
.projectOrderReviewState :focus-visible,
.projectOrderReviewRetryActions :focus-visible {
  outline: 3px solid var(--ap-ui-border-strong);
  outline-offset: 3px;
}

.projectOrderReviewAlert,
.projectOrderReviewStatus {
  padding: var(--ap-space-3);
  border: 1px solid var(--ap-ui-border-strong);
  border-radius: var(--ap-radius-md);
  background: var(--ap-ui-card-soft);
  color: var(--ap-ui-text);
}

.projectOrderReviewRetryActions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ap-space-3);
  margin-top: var(--ap-space-3);
}

@media (max-width: 900px) {
  .projectOrderReviewGrid {
    grid-template-columns: minmax(0, 1fr);
  }

  .projectOrderReviewProgress {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .projectOrderReviewProgress,
  .projectOrderReviewReonicFacts {
    grid-template-columns: minmax(0, 1fr);
  }

  .projectOrderReviewConditionRow,
  .projectOrderReviewW01Row {
    grid-template-columns: minmax(0, 1fr);
  }

  .projectOrderReviewForm fieldset,
  .projectOrderReviewReadModel,
  .projectOrderReviewDecision,
  .projectOrderReviewState,
  .projectOrderReviewPreview,
  .projectOrderReviewCurrent,
  .projectOrderReviewSectionState {
    padding: var(--ap-space-3);
  }

  .projectOrderReviewForm button,
  .projectOrderReviewState button,
  .projectOrderReviewRetryActions button {
    width: 100%;
  }
}

/* Task Work Queue */
.task-work-queue {
  display: grid;
  gap: var(--ap-section-gap);
  min-width: 0;
  padding: var(--ap-surface-padding);
}

.task-work-queue-head,
.task-editor-head,
.task-editor-actions {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--ap-gap-default);
}

.task-work-queue-head h1,
.task-work-queue-head p,
.task-editor-head h2 {
  margin: 0;
}

.task-work-queue-toolbar {
  padding-block: var(--ap-space-4);
  border-block: 1px solid var(--portal-border);
}

.task-view-tabs {
  display: flex;
  gap: var(--ap-gap-tight);
  overflow-x: auto;
  padding-bottom: var(--ap-space-2);
}

.task-view-tabs button {
  flex: 0 0 auto;
  min-height: var(--ap-space-8);
  padding: var(--ap-space-2) var(--ap-space-3);
  border: 0;
  border-radius: var(--portal-radius-control);
  background: transparent;
  color: var(--portal-muted);
  box-shadow: none;
  font-size: .82rem;
  font-weight: 800;
}

.task-view-tabs button:hover,
.task-view-tabs button.is-active {
  background: rgba(72, 159, 223, .11);
  color: var(--portal-text);
}

.task-view-tabs button.is-active {
  box-shadow: inset var(--ap-space-1) 0 0 var(--portal-accent);
}

.task-filter-grid {
  display: grid;
  grid-template-columns: minmax(14rem, 2fr) repeat(5, minmax(8rem, 1fr));
  gap: var(--ap-gap-tight);
  align-items: end;
}

.task-filter-grid label {
  display: grid;
  min-width: 0;
  gap: var(--ap-space-1);
  margin: 0;
  color: var(--portal-muted);
  font-size: .76rem;
  font-weight: 750;
}

.task-filter-grid input,
.task-filter-grid select,
.task-command-row input,
.task-command-row select,
.task-dependency-form input,
.task-dependency-form select {
  width: 100%;
  min-width: 0;
}

.task-filter-check {
  display: flex !important;
  align-items: center;
  align-self: center;
  gap: var(--ap-space-2) !important;
}

.task-filter-check input {
  width: auto;
}

.task-work-queue-content {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(23rem, 30rem);
  gap: var(--ap-section-gap);
  min-width: 0;
  align-items: start;
}

.task-work-queue-content:not(:has(.task-detail-panel)) {
  grid-template-columns: minmax(0, 1fr);
}

.task-list-region,
.task-panel-region {
  min-width: 0;
}

.task-panel-region:empty {
  display: none;
}

.task-panel-region:empty + * {
  display: none;
}

.task-premium-list .ap-list-v2-row {
  min-height: var(--ap-space-12);
}

.task-premium-list .ap-list-v2-cell[data-list-column="owner"] .ap-list-v2-value {
  display: grid;
  gap: var(--ap-space-1);
}

.task-premium-list small {
  color: var(--portal-muted);
  font-size: .72rem;
}

.task-is-overdue {
  color: #ff9d9d;
  font-weight: 850;
}

.task-load-more {
  margin: var(--ap-gap-default) auto 0;
}

.task-detail-panel {
  position: sticky;
  top: var(--ap-page-gap);
  display: grid;
  max-height: calc(100vh - (var(--ap-page-gap) * 2));
  overflow-y: auto;
  gap: var(--ap-section-gap);
  padding: var(--ap-card-padding);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-surface);
  background: var(--portal-surface);
  box-shadow: var(--portal-shadow);
}

.task-panel-close {
  position: absolute;
  top: var(--ap-space-3);
  right: var(--ap-space-3);
}

.task-detail-head {
  display: grid;
  gap: var(--ap-gap-tight);
  padding-right: var(--ap-space-9);
}

.task-detail-head h2,
.task-detail-facts p,
.task-blocking-note p {
  margin: 0;
}

.task-number {
  color: var(--portal-muted);
  font-size: .78rem;
  font-weight: 850;
}

.task-detail-badges,
.task-status-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ap-gap-tight);
}

.task-detail-facts dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ap-gap-default);
  margin: 0;
}

.task-detail-facts dl div {
  min-width: 0;
}

.task-detail-facts dt {
  color: var(--portal-muted);
  font-size: .74rem;
  font-weight: 750;
}

.task-detail-facts dd {
  margin: var(--ap-space-1) 0 0;
  color: var(--portal-text);
  overflow-wrap: anywhere;
}

.task-blocking-note {
  display: grid;
  gap: var(--ap-space-1);
  padding: var(--ap-space-3);
  border-left: var(--ap-space-1) solid #ffd978;
  background: rgba(255, 198, 78, .08);
}

.task-detail-readable-list,
.task-history {
  display: grid;
  gap: var(--ap-gap-tight);
  margin: 0;
  padding-left: var(--ap-space-5);
}

.task-checklist {
  gap: var(--ap-gap-tight);
}

.task-checklist label {
  display: flex;
  align-items: flex-start;
  gap: var(--ap-gap-tight);
  margin: 0;
}

.task-checklist input {
  width: auto;
  margin-top: var(--ap-space-1);
}

.task-history {
  padding-left: 0;
}

.task-history article {
  display: grid;
  gap: var(--ap-space-1);
  padding-bottom: var(--ap-gap-tight);
  border-bottom: 1px solid var(--portal-border);
}

.task-history article span,
.task-history article small {
  color: var(--portal-muted);
  font-size: .76rem;
}

.task-command-row,
.task-dependency-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--ap-gap-tight);
}

.task-dependency-form {
  grid-template-columns: minmax(0, .7fr) minmax(0, 1fr) auto;
}

.task-inline-message {
  margin: 0;
  padding: var(--ap-space-3);
  border-left: var(--ap-space-1) solid #ff9d9d;
  background: rgba(255, 112, 112, .08);
  color: #ffc0c0;
}

.task-editor-dialog {
  width: min(54rem, calc(100vw - (var(--ap-page-gap) * 2)));
  max-height: calc(100vh - (var(--ap-page-gap) * 2));
  padding: 0;
  border: 0;
  background: transparent;
}

.task-editor-dialog::backdrop {
  background: rgba(0, 5, 16, .78);
}

.task-editor-form {
  display: grid;
  max-height: inherit;
  overflow-y: auto;
  gap: var(--ap-section-gap);
  padding: var(--ap-surface-padding);
}

.task-editor-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ap-gap-default);
}

.task-editor-grid label {
  min-width: 0;
  margin: 0;
}

.task-editor-wide {
  grid-column: 1 / -1;
}

.task-editor-actions {
  align-items: center;
  justify-content: flex-end;
}

@media (max-width: 1280px) {
  .task-filter-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .task-search-field {
    grid-column: span 2;
  }

  .task-work-queue-content {
    grid-template-columns: minmax(0, 1fr) minmax(20rem, 25rem);
  }
}

@media (max-width: 900px) {
  .task-filter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .task-work-queue-content {
    display: block;
  }

  .task-detail-panel {
    position: fixed;
    inset: 0;
    z-index: 1000;
    max-height: 100vh;
    border: 0;
    border-radius: 0;
  }
}

@media (max-width: 640px) {
  .task-work-queue-head,
  .task-editor-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .task-filter-grid,
  .task-editor-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .task-search-field,
  .task-editor-wide {
    grid-column: 1;
  }

  .task-command-row,
  .task-dependency-form {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Final partner signature modal contrast override. */
#partnerSubmitModal.partnerSubmitModal {
  background:
    radial-gradient(circle at 50% 18%, rgba(72, 159, 223, .18), transparent 34%),
    rgba(2, 9, 20, .72);
  backdrop-filter: blur(18px) saturate(1.2);
  -webkit-backdrop-filter: blur(18px) saturate(1.2);
}

#partnerSubmitModal .partnerSubmitModalCard {
  width: min(820px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  overflow: auto;
  text-align: left;
  color: #fff;
  border: 1px solid rgba(72, 159, 223, .34);
  border-radius: 24px;
  background:
    linear-gradient(145deg, rgba(8, 24, 51, .96), rgba(20, 27, 77, .86)),
    rgba(2, 9, 20, .92);
  box-shadow:
    0 32px 100px rgba(0, 0, 0, .48),
    inset 0 1px 0 rgba(255, 255, 255, .14);
}

#partnerSubmitModal .partnerSubmitModalCard h3 {
  padding-right: 44px;
  color: #fff;
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.08;
}

#partnerSubmitModal .partnerSubmitModalCard p {
  max-width: 680px;
  color: rgba(255, 255, 255, .76);
  font-size: 16px;
}

#partnerSubmitModal .partnerSubmitModalClose {
  color: #fff;
  border-color: rgba(255, 255, 255, .18);
  background: rgba(255, 255, 255, .1);
}

#partnerSubmitModal .partnerSubmitModalClose:hover {
  background: rgba(72, 159, 223, .28);
}

#partnerSubmitModal .partnerSubmitPreviewPaper {
  color: #fff;
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: 20px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, .045)),
    rgba(2, 9, 20, .26);
  padding: 18px;
}

#partnerSubmitModal .partnerSubmitPreviewHeader {
  border-color: rgba(72, 159, 223, .24);
}

#partnerSubmitModal .partnerSubmitPreviewHeader strong,
#partnerSubmitModal .partnerSubmitPreviewRows strong,
#partnerSubmitModal .partnerSubmitPreviewCosts strong {
  color: #fff;
}

#partnerSubmitModal .partnerSubmitPreviewHeader span,
#partnerSubmitModal .partnerSubmitPreviewRows span,
#partnerSubmitModal .partnerSubmitPreviewCosts span,
#partnerSubmitModal .partnerSubmitPreviewCosts small {
  color: rgba(255, 255, 255, .68);
}

#partnerSubmitModal .partnerSubmitPreviewRows div {
  border-bottom: 1px solid rgba(72, 159, 223, .18);
  background: rgba(255, 255, 255, .045);
  border-radius: 14px;
  padding: 10px 12px;
}

#partnerSubmitModal .partnerSubmitPreviewCosts {
  border-color: rgba(72, 159, 223, .34);
  background: rgba(72, 159, 223, .12);
}

#partnerSubmitModal .partnerSubmitModalActions {
  justify-content: flex-start;
}

#partnerSubmitModal .partnerSubmitModalActions button,
#partnerSubmitModal .partnerSubmitModalActions button:hover {
  color: #fff;
}

/* Final compact admin page hero: keep all admin menu headers as slim as the map header. */
body.roleAdmin .dashboardHeadModern:not(.hidden) {
  min-height: clamp(190px, 18vw, 250px) !important;
  align-content: center !important;
  padding: clamp(24px, 2.8vw, 38px) clamp(30px, 4vw, 64px) !important;
  border-radius: 22px;
  overflow: hidden !important;
  background:
    linear-gradient(90deg, rgba(2, 8, 28, .98) 0%, rgba(4, 13, 38, .9) 30%, rgba(4, 13, 38, .48) 58%, rgba(4, 13, 38, .28) 100%),
    linear-gradient(180deg, rgba(5, 12, 34, .04) 0%, rgba(5, 12, 34, .16) 50%, rgba(5, 12, 34, .76) 100%),
    url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center center / cover no-repeat,
    #020817;
}

body.roleAdmin .dashboardHeadModern:not(.hidden)::after {
  bottom: clamp(16px, 1.8vw, 24px) !important;
}

body.roleAdmin .dashboardHeadModern:not(.hidden) .dashboardIdentity {
  max-width: min(760px, 62vw) !important;
  padding-top: 0 !important;
}

body.roleAdmin .dashboardHeadModern:not(.hidden) #welcomeTitle {
  font-size: clamp(34px, 4vw, 58px) !important;
  line-height: 1.02 !important;
}

body.roleAdmin .dashboardHeadModern:not(.hidden) .dashboardActions {
  align-self: center !important;
}

@media (max-width: 980px) {
  body.roleAdmin .dashboardHeadModern:not(.hidden) {
    min-height: 220px !important;
    padding: 132px 18px 24px !important;
    align-content: end !important;
    background:
      linear-gradient(180deg, rgba(2, 8, 28, .18) 0%, rgba(2, 8, 28, .82) 60%, rgba(2, 8, 28, .98) 100%),
      url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center top / auto 230px no-repeat,
      #020817;
  }

  body.roleAdmin .dashboardHeadModern:not(.hidden) .dashboardIdentity {
    max-width: 100% !important;
  }

body.roleAdmin .dashboardHeadModern:not(.hidden) #welcomeTitle {
    font-size: clamp(30px, 9vw, 46px) !important;
  }
}

body.sidebarCollapsed .sidebarRail,
body.sidebarCollapsed .appSidebar,
body.sidebarCollapsed .sidebarTop,
body.sidebarCollapsed .sidebarControls,
body.sidebarCollapsed .sidebarNav,
body.sidebarCollapsed .sidebarFooter {
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.sidebarCollapsed .sidebarTop::before,
body.sidebarCollapsed .sidebarTop::after,
body.sidebarCollapsed .sidebarControls::before,
body.sidebarCollapsed .sidebarControls::after,
body.sidebarCollapsed .dashboardHeadModern::after {
  display: none !important;
  content: none !important;
}

/* Customer search dropdown mirrors the notification panel visual language. */
.sidebarCustomerSearchResults {
  gap: 12px !important;
  padding: 16px !important;
  border: 1px solid rgba(72, 159, 223, .32);
  border-radius: 10px;
  background:
    linear-gradient(145deg, rgba(8, 24, 51, .97), rgba(20, 27, 77, .9)),
    rgba(2, 9, 20, .92);
  box-shadow: 0 28px 86px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(255, 255, 255, .12);
  backdrop-filter: blur(22px) saturate(1.2);
  -webkit-backdrop-filter: blur(22px) saturate(1.2);
}

.sidebarCustomerSearchResults button {
  gap: 10px !important;
  padding: 18px 20px !important;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 18px;
  color: #ffffff;
  background: rgba(255, 255, 255, .08);
  box-shadow: 0 14px 34px rgba(3, 9, 28, .14);
}

.sidebarCustomerSearchResults button:hover {
  border-color: rgba(72, 159, 223, .38);
  background: linear-gradient(135deg, rgba(72, 159, 223, .18), rgba(255, 255, 255, .08));
}

.sidebarCustomerSearchResultTopline {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.sidebarCustomerSearchResults strong {
  color: #ffffff;
  font-size: 17px !important;
  line-height: 1.22 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

.sidebarCustomerSearchResultTopline small {
  flex: 0 0 auto;
  color: rgba(255, 255, 255, .7);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.sidebarCustomerSearchResults span {
  color: rgba(255, 255, 255, .72);
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.32 !important;
  -webkit-line-clamp: 3 !important;
}

body.roleAdmin #emailAutomationPanel {
  overflow: hidden;
}

body.roleAdmin #emailAutomationPanel .emailAutomationList {
  gap: 14px;
}

body.roleAdmin #emailAutomationPanel .emailAutomationCard {
  padding: 0 !important;
  overflow: hidden;
  border-radius: 16px;
  border: 1px solid rgba(72, 159, 223, .28);
  background:
    radial-gradient(circle at 100% 0%, rgba(72, 159, 223, .16), transparent 34%),
    linear-gradient(145deg, rgba(13, 28, 64, .94), rgba(5, 14, 36, .9));
  box-shadow: 0 20px 58px rgba(2, 7, 22, .3), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.roleAdmin #emailAutomationPanel .emailAutomationCard:hover {
  border-color: rgba(72, 159, 223, .48);
  background:
    radial-gradient(circle at 100% 0%, rgba(72, 159, 223, .22), transparent 36%),
    linear-gradient(145deg, rgba(16, 35, 78, .98), rgba(6, 18, 46, .94));
  box-shadow: 0 26px 70px rgba(72, 159, 223, .16), inset 0 1px 0 rgba(255, 255, 255, .14);
}

body.roleAdmin #emailAutomationPanel .emailAutomationCardHeader {
  padding: 18px 20px;
  border: 0;
  background: transparent;
}

body.roleAdmin #emailAutomationPanel .emailAutomationCardText {
  gap: 7px;
}

body.roleAdmin #emailAutomationPanel .emailAutomationCardText strong {
  color: rgba(255, 255, 255, .96);
  font-size: 20px;
  line-height: 1.18;
}

body.roleAdmin #emailAutomationPanel .emailAutomationCardText p {
  max-width: 980px;
  color: rgba(224, 237, 255, .74);
  font-size: 15px;
  font-weight: 650;
}

body.roleAdmin #emailAutomationPanel .emailAutomationStatus {
  width: max-content;
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 10px;
  border: 1px solid rgba(72, 159, 223, .26);
  border-radius: 999px;
  color: rgba(188, 220, 255, .88);
  background: rgba(72, 159, 223, .1);
  font-size: 12px;
  font-weight: 850;
  text-transform: uppercase;
}

body.roleAdmin #emailAutomationPanel .emailAutomationEditHint {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(135deg, rgba(72, 159, 223, .88), rgba(58, 122, 183, .62));
  box-shadow: 0 14px 34px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .2);
  font-size: 15px;
}

body.roleAdmin #emailAutomationPanel .emailAutomationEditor {
  margin: 0 20px 20px;
  padding: 18px;
  border: 1px solid rgba(72, 159, 223, .22);
  border-radius: 14px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .065), rgba(255, 255, 255, .028)),
    rgba(2, 10, 28, .42);
}

body.roleAdmin #emailAutomationPanel .emailAutomationEditor label {
  gap: 10px;
  color: rgba(255, 255, 255, .92);
  font-size: 17px;
}

body.roleAdmin #emailAutomationPanel .emailAutomationEditor label > span {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: baseline;
}

body.roleAdmin #emailAutomationPanel .emailAutomationEditor label small {
  color: rgba(188, 220, 255, .66);
  font-size: 13px;
  font-weight: 750;
}

body.roleAdmin #emailAutomationPanel .emailAutomationEditor textarea {
  min-height: 128px;
  padding: 14px 16px;
  border-radius: 14px;
  color: rgba(255, 255, 255, .94);
  background: rgba(1, 9, 28, .78);
}

body.roleAdmin #emailAutomationPanel .emailAutomationEditor .mutedText {
  margin: 0;
  color: rgba(224, 237, 255, .68);
  font-size: 14px;
}

body.roleAdmin #emailAutomationPanel .emailAutomationActions {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}

body.roleAdmin #emailAutomationPanel .emailAutomationActions button {
  width: 100%;
  min-width: 0;
  min-height: 52px;
  margin: 0;
  border-radius: 14px;
  align-self: stretch;
}

body.roleAdmin #emailAutomationPanel .emailAutomationPreviewButton {
  border: 1px solid rgba(72, 159, 223, .38);
  color: #ffffff;
  background: rgba(72, 159, 223, .18);
}

body.roleAdmin #emailAutomationPanel .emailAutomationDeleteButton {
  border: 1px solid rgba(255, 114, 114, .38);
  color: #ffffff;
  background: linear-gradient(135deg, rgba(129, 35, 35, .78), rgba(82, 18, 30, .72));
}

body.roleAdmin #emailAutomationPanel .emailAutomationPreview {
  border: 1px solid rgba(72, 159, 223, .24);
  border-radius: 16px;
  padding: 14px;
  background: rgba(2, 10, 28, .5);
}

body.roleAdmin #emailAutomationPanel .emailAutomationPreviewPaper {
  display: grid;
  gap: 14px;
  max-width: 760px;
  padding: 22px;
  border-radius: 14px;
  color: #17213d;
  background: #f7fbff;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .22);
}

body.roleAdmin #emailAutomationPanel .emailAutomationPreviewBrand {
  width: fit-content;
  padding: 6px 10px;
  border-radius: 999px;
  color: #ffffff;
  background: #141B4D;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .02em;
}

body.roleAdmin #emailAutomationPanel .emailAutomationPreviewPaper h4,
body.roleAdmin #emailAutomationPanel .emailAutomationPreviewPaper p {
  margin: 0;
}

body.roleAdmin #emailAutomationPanel .emailAutomationPreviewPaper h4 {
  color: #141B4D;
  font-size: 22px;
  line-height: 1.18;
}

body.roleAdmin #emailAutomationPanel .emailAutomationPreviewPaper p {
  color: #30425f;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.55;
}

body.roleAdmin #emailAutomationPanel .emailAutomationPreviewMuted {
  color: #7d8aa2;
  font-style: italic;
}

body.roleAdmin #emailAutomationPanel .emailAutomationPreviewSystemBlock {
  display: grid;
  gap: 6px;
  padding: 14px;
  border: 1px solid rgba(72, 159, 223, .24);
  border-radius: 12px;
  background: rgba(72, 159, 223, .1);
}

body.roleAdmin #emailAutomationPanel .emailAutomationPreviewSystemBlock strong {
  color: #141B4D;
}

body.roleAdmin #emailAutomationPanel .emailAutomationPreviewSignature {
  display: grid;
  gap: 2px;
  padding-top: 10px;
  border-top: 1px solid rgba(20, 27, 77, .14);
  color: #30425f;
}

body.roleAdmin #emailAutomationPanel .emailAutomationPreviewSignature strong {
  color: #141B4D;
}

body.roleAdmin #emailAutomationPanel .emailAutomationPreviewSignature span {
  color: #53637c;
  font-size: 14px;
  font-weight: 700;
}

@media (max-width: 760px) {
  body.roleAdmin #emailAutomationPanel .emailAutomationActions {
    grid-template-columns: 1fr;
  }
}

/* Partner inquiry UX V2: compact entry, one surface layer, seven-step flow. */
.srOnly {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0;
}

body.dashboardMode.partnerInquiryMode .dashboardHeadModern {
  min-height: clamp(180px, 18vw, 220px);
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas: "identity";
  align-content: end;
  gap: 0;
  padding: clamp(24px, 3.5vw, 42px);
  background-position: center 44%;
}

body.dashboardMode.partnerInquiryMode .dashboardHeadModern .dashboardIdentity {
  grid-area: identity;
  max-width: 760px;
  gap: 8px;
}

body.dashboardMode.partnerInquiryMode .dashboardHeadModern #welcomeTitle {
  margin: 0;
  font-size: clamp(30px, 4.2vw, 52px);
  line-height: 1.02;
}

body.dashboardMode.partnerInquiryMode .dashboardHeadModern .employeePhotoButton,
body.dashboardMode.partnerInquiryMode .dashboardHeadModern .advisorCard,
body.dashboardMode.partnerInquiryMode .dashboardHeadModern .dashboardActions {
  display: none !important;
}

.portalSelect {
  position: relative;
  display: inline-flex;
  width: 100%;
  min-width: 0;
}

.portalSelectNative {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  opacity: 0;
  pointer-events: none !important;
}

.portalSelectTrigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-width: 0;
  min-height: 48px;
  gap: 12px;
  padding: 11px 14px;
  border: 1px solid rgba(123, 160, 199, .32);
  border-radius: 12px;
  background: rgba(3, 13, 32, .78);
  color: #f5f9ff;
  font: inherit;
  text-align: left;
  box-shadow: none;
  cursor: pointer;
}

.portalSelectTrigger:hover,
.portalSelectTrigger.isOpen {
  border-color: rgba(113, 185, 238, .68);
  background: rgba(11, 32, 62, .94);
}

.portalSelectTrigger:focus-visible {
  outline: 3px solid rgba(113, 185, 238, .3);
  outline-offset: 2px;
}

.portalSelectTrigger[aria-invalid="true"] {
  border-color: #f69a9a;
}

.portalSelectTrigger:disabled {
  cursor: not-allowed;
  opacity: .55;
}

.portalSelectValue {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.portalSelectIcon {
  color: #8bc9f5;
  font-size: 1.15rem;
  transition: transform 160ms ease;
}

.portalSelectTrigger.isOpen .portalSelectIcon {
  transform: rotate(180deg);
}

.portalSelectMenu {
  position: fixed;
  z-index: 2500;
  overflow: auto;
  padding: 6px;
  border: 1px solid rgba(113, 185, 238, .36);
  border-radius: 13px;
  background: #07162d;
  color: #f5f9ff;
  box-shadow: 0 22px 60px rgba(0, 0, 0, .52);
  overscroll-behavior: contain;
}

.portalSelectOption {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  align-items: center;
  min-height: 42px;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 9px;
  cursor: pointer;
}

.portalSelectOption:is(.isActive, :hover) {
  background: rgba(72, 159, 223, .16);
}

.portalSelectOption.isSelected {
  color: #cdeaff;
  font-weight: 800;
}

.portalSelectOption.isDisabled {
  cursor: not-allowed;
  opacity: .48;
}

.portalSelectCheck {
  visibility: hidden;
  color: #72c9ff;
  text-align: center;
}

.portalSelectOption.isSelected .portalSelectCheck {
  visibility: visible;
}

body.dashboardMode #partnerInquiryView .partnerInquirySurface {
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-surface);
  background:
    radial-gradient(circle at 10% 0%, rgba(72, 159, 223, .11), transparent 34%),
    linear-gradient(145deg, rgba(7, 20, 49, .96), rgba(2, 9, 25, .95));
  box-shadow: var(--portal-shadow);
}

body.dashboardMode #partnerInquiryView .partnerInquiryWizard {
  min-height: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepper {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
  padding: 0 0 18px;
  border-bottom: 1px solid rgba(72, 159, 223, .14);
  list-style: none;
  counter-reset: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepper li {
  min-width: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepButton {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  width: 100%;
  min-height: 46px;
  gap: 8px;
  padding: 7px 5px;
  font: inherit;
  font-size: .76rem;
  font-weight: 750;
  text-align: left;
  cursor: pointer;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepButton::before {
  content: none !important;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepButton > span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 1px solid rgba(114, 159, 199, .28);
  border-radius: 50%;
  background: rgba(114, 159, 199, .08);
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepButton:is(.active, .isComplete) > span {
  border-color: rgba(113, 185, 238, .62);
  background: rgba(72, 159, 223, .2);
  color: #dff3ff;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepButton[aria-disabled="true"] {
  cursor: default;
  opacity: .55;
}

body.dashboardMode #partnerInquiryView .partnerInquiryScopeChoices {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--portal-space-md);
  margin: 0;
  padding: 0;
  border: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryChoiceCard {
  position: relative;
  display: grid;
  min-height: 150px;
  align-content: center;
  gap: 8px;
  padding: 22px;
  border: 1px solid rgba(113, 159, 199, .24);
  border-radius: var(--portal-radius-card);
  background: rgba(2, 9, 25, .46);
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

body.dashboardMode #partnerInquiryView .partnerInquiryChoiceCard:hover,
body.dashboardMode #partnerInquiryView .partnerInquiryChoiceCard:has(input:checked) {
  border-color: rgba(113, 185, 238, .66);
  background: rgba(72, 159, 223, .13);
  transform: translateY(-1px);
}

body.dashboardMode #partnerInquiryView .partnerInquiryChoiceCard:focus-within {
  outline: 3px solid rgba(113, 185, 238, .28);
  outline-offset: 2px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryChoiceCard > input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryChoiceCard small,
body.dashboardMode #partnerInquiryView .partnerInquiryToggleCard small {
  color: var(--portal-muted);
  font-weight: 500;
  line-height: 1.45;
}

body.dashboardMode #partnerInquiryView .partnerInquiryChoiceCheck {
  position: absolute;
  top: 14px;
  right: 14px;
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background: rgba(72, 159, 223, .22);
  color: #ccecff;
  opacity: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryChoiceCard:has(input:checked) .partnerInquiryChoiceCheck {
  opacity: 1;
}

body.dashboardMode #partnerInquiryView .partnerInquiryTechnicalGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: var(--portal-space-lg);
}

body.dashboardMode #partnerInquiryView .partnerInquiryComponentBlock {
  display: grid;
  align-content: start;
  gap: var(--portal-space-md);
  padding: clamp(18px, 2.5vw, 26px);
  border: 1px solid rgba(72, 159, 223, .16);
  border-radius: var(--portal-radius-card);
  background: rgba(2, 9, 25, .38);
}

body.dashboardMode #partnerInquiryView .partnerInquiryComponentBlock > h4 {
  margin: 0;
  color: #dcedf9;
  font-size: 1.08rem;
}

body.dashboardMode #partnerInquiryView .partnerInquiryModuleFields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryToggleCard {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(113, 159, 199, .2);
  border-radius: 12px;
  background: rgba(8, 25, 51, .46);
  cursor: pointer;
}

body.dashboardMode #partnerInquiryView .partnerInquiryToggleCard:has(input:checked) {
  border-color: rgba(113, 185, 238, .56);
  background: rgba(72, 159, 223, .12);
}

body.dashboardMode #partnerInquiryView .partnerInquiryToggleCard input {
  width: 20px;
  height: 20px;
  margin: 2px 0 0;
  accent-color: #489fdf;
}

body.dashboardMode #partnerInquiryView .partnerInquiryToggleCard > span,
body.dashboardMode #partnerInquiryView .partnerInquiryWallboxRoute {
  display: grid;
  gap: 5px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryUploadDropzone {
  display: grid;
  min-height: 150px;
  place-content: center;
  gap: 7px;
  padding: 24px;
  border: 2px dashed rgba(113, 185, 238, .42);
  border-radius: var(--portal-radius-card);
  background: rgba(72, 159, 223, .07);
  text-align: center;
  cursor: pointer;
}

body.dashboardMode #partnerInquiryView .partnerInquiryUploadDropzone:hover,
body.dashboardMode #partnerInquiryView .partnerInquiryUploadDropzone:focus-within {
  border-color: rgba(113, 185, 238, .8);
  background: rgba(72, 159, 223, .13);
}

body.dashboardMode #partnerInquiryView .partnerInquiryUploadDropzone input {
  width: 100%;
  max-width: 360px;
  color: var(--portal-muted);
}

body.dashboardMode #partnerInquiryView .partnerInquiryUploadList,
body.dashboardMode #partnerInquiryView .partnerInquiryAttachmentGallery,
body.dashboardMode #partnerInquiryView .partnerInquiryRecordSectionStack,
body.dashboardMode #partnerInquiryView .partnerInquiryRecordDecision {
  display: grid;
  gap: 12px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryUploadItem,
body.dashboardMode #partnerInquiryView .partnerInquiryDocumentCard {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 12px;
  border: 1px solid rgba(72, 159, 223, .15);
  border-radius: 12px;
  background: rgba(2, 9, 25, .38);
}

body.dashboardMode #partnerInquiryView .partnerInquiryUploadPreview,
body.dashboardMode #partnerInquiryView .partnerInquiryAttachmentThumb {
  overflow: hidden;
  padding: 0;
  border: 1px solid rgba(113, 185, 238, .25);
  border-radius: 10px;
  background: rgba(2, 9, 25, .62);
  color: var(--portal-text);
  cursor: zoom-in;
}

body.dashboardMode #partnerInquiryView .partnerInquiryUploadPreview {
  width: 72px;
  height: 58px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryUploadPreview img,
body.dashboardMode #partnerInquiryView .partnerInquiryAttachmentThumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

body.dashboardMode #partnerInquiryView .partnerInquiryUploadInfo,
body.dashboardMode #partnerInquiryView .partnerInquiryDocumentCard > div {
  display: grid;
  min-width: 0;
  gap: 4px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryUploadInfo > strong,
body.dashboardMode #partnerInquiryView .partnerInquiryDocumentCard strong {
  overflow-wrap: anywhere;
}

body.dashboardMode #partnerInquiryView .partnerInquiryUploadInfo > span,
body.dashboardMode #partnerInquiryView .partnerInquiryDocumentCard span {
  color: var(--portal-muted);
  font-size: .83rem;
}

body.dashboardMode #partnerInquiryView .partnerInquiryUploadInfo progress {
  width: 100%;
  accent-color: #489fdf;
}

body.dashboardMode #partnerInquiryView .partnerInquiryUploadActions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryDocumentIcon {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 10px;
  background: rgba(72, 159, 223, .12);
  color: #bfe6ff;
  font-size: .73rem;
  font-weight: 900;
}

body.dashboardMode #partnerInquiryView .partnerInquiryReview {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.dashboardMode #partnerInquiryView .partnerInquiryReviewSection {
  display: grid;
  align-content: start;
  gap: 0;
  padding: 18px;
  border: 1px solid rgba(72, 159, 223, .15);
  border-radius: var(--portal-radius-card);
  background: rgba(2, 9, 25, .38);
}

body.dashboardMode #partnerInquiryView .partnerInquiryReviewHead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 10px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryReviewHead h4 {
  margin: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryReviewSection .partnerInquiryReviewRow {
  grid-template-columns: minmax(105px, .65fr) minmax(0, 1fr);
  gap: 10px;
  padding: 10px 0;
  border: 0;
  border-top: 1px solid rgba(72, 159, 223, .1);
  border-radius: 0;
  background: transparent;
}

body.dashboardMode #partnerInquiryView .partnerInquiryReviewRow strong {
  text-align: right;
}

body.dashboardMode #partnerInquiryView .partnerInquiryListCardHead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryListCard h3,
body.dashboardMode #partnerInquiryView .partnerInquiryListCard p {
  margin: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryEmptyState {
  display: grid;
  place-items: start;
  gap: 8px;
  padding: clamp(22px, 3vw, 36px);
}

body.dashboardMode #partnerInquiryView .partnerInquiryNotifications {
  display: grid;
  gap: 14px;
  padding: clamp(18px, 2.5vw, 26px);
}

body.dashboardMode #partnerInquiryView .partnerInquiryNotificationsHead {
  display: grid;
  gap: 4px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryNotificationsHead > span {
  color: #71b9ee;
  font-size: .74rem;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

body.dashboardMode #partnerInquiryView .partnerInquiryNotificationsHead h3,
body.dashboardMode #partnerInquiryView .partnerInquiryNotification p {
  margin: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryNotificationList {
  display: grid;
  gap: 8px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryNotification {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 12px 14px;
  border-left: 3px solid transparent;
  border-radius: 9px;
  background: rgba(2, 9, 25, .38);
}

body.dashboardMode #partnerInquiryView .partnerInquiryNotification.isUnread {
  border-left-color: #71b9ee;
  background: rgba(72, 159, 223, .1);
}

body.dashboardMode #partnerInquiryView .partnerInquiryNotification > div {
  display: grid;
  gap: 3px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryNotification p {
  color: var(--portal-muted);
  line-height: 1.45;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordSubsection {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 0 0 var(--portal-space-lg);
  border: 0;
  border-bottom: 1px solid rgba(72, 159, 223, .13);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordSubsection:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryDetailGrid > .partnerInquiryRecordSubsection {
  padding: 0 0 var(--portal-space-md);
}

body.dashboardMode #partnerInquiryView .partnerInquiryAttachmentGallery {
  grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
}

body.dashboardMode #partnerInquiryView .partnerInquiryAttachmentThumb {
  display: grid;
  grid-template-rows: 118px auto;
  min-width: 0;
  text-align: left;
}

body.dashboardMode #partnerInquiryView .partnerInquiryAttachmentThumb span {
  overflow: hidden;
  padding: 9px;
  color: var(--portal-text);
  font-size: .8rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.partnerInquiryLightbox {
  position: fixed;
  inset: 0;
  z-index: 5000;
  display: grid;
  place-items: center;
  padding: clamp(12px, 3vw, 32px);
  background: rgba(0, 4, 13, .92);
  backdrop-filter: blur(10px);
  touch-action: none;
}

.partnerInquiryLightboxFrame {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  width: min(1180px, 100%);
  height: min(820px, calc(100vh - 40px));
  gap: 12px;
}

.partnerInquiryLightboxFrame figure {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  min-width: 0;
  height: 100%;
  margin: 0;
}

.partnerInquiryLightboxCanvas {
  display: grid;
  overflow: auto;
  place-items: center;
  min-height: 0;
  border-radius: 16px;
  background: rgba(2, 9, 25, .86);
}

.partnerInquiryLightboxCanvas img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  transform-origin: center;
  transition: transform 100ms ease;
}

.partnerInquiryLightboxFrame figcaption {
  padding: 10px;
  color: #dceaf5;
  text-align: center;
}

.partnerInquiryLightboxClose,
.partnerInquiryLightboxNav,
.partnerInquiryLightboxReset {
  min-width: 44px;
  min-height: 44px;
  border: 1px solid rgba(113, 185, 238, .34);
  border-radius: 999px;
  background: rgba(7, 22, 45, .9);
  color: #fff;
  cursor: pointer;
}

.partnerInquiryLightboxClose {
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  font-size: 1.6rem;
}

.partnerInquiryLightboxReset {
  position: absolute;
  right: 58px;
  bottom: 0;
  padding: 0 15px;
}

.partnerInquiryLightboxNav {
  font-size: 2rem;
}

@media (max-width: 1100px) {
  body.dashboardMode #partnerInquiryView .partnerInquiryStepper {
    grid-auto-flow: column;
    grid-auto-columns: minmax(132px, 1fr);
    grid-template-columns: none;
    overflow-x: auto;
    scroll-snap-type: x proximity;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryStepper li {
    scroll-snap-align: center;
  }
}

@media (max-width: 760px) {
  body.dashboardMode.partnerInquiryMode .dashboardHeadModern {
    min-height: clamp(140px, 38vw, 180px);
    padding: 22px 18px;
  }

  body.dashboardMode.partnerInquiryMode .dashboardHeadModern #welcomeTitle {
    font-size: clamp(27px, 9vw, 38px);
  }

  body.dashboardMode #partnerInquiryView.partnerInquiryWorkspace:not(.hidden) {
    gap: var(--portal-space-lg);
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryWizard,
  body.dashboardMode #partnerInquiryView .partnerInquiryRecordPanel,
  body.dashboardMode #partnerInquiryView .partnerInquiryRecordHero {
    padding: 18px;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryStepper {
    grid-auto-columns: minmax(120px, 42vw);
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryScopeChoices,
  body.dashboardMode #partnerInquiryView .partnerInquiryTechnicalGrid,
  body.dashboardMode #partnerInquiryView .partnerInquiryModuleFields,
  body.dashboardMode #partnerInquiryView .partnerInquiryReview,
  body.dashboardMode #partnerInquiryView .partnerInquiryReviewSection .partnerInquiryReviewRow {
    grid-template-columns: 1fr;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryChoiceCard {
    min-height: 118px;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryUploadItem,
  body.dashboardMode #partnerInquiryView .partnerInquiryDocumentCard {
    grid-template-columns: 58px minmax(0, 1fr);
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryNotification {
    grid-template-columns: 1fr;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryUploadPreview {
    width: 58px;
    height: 52px;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryUploadActions,
  body.dashboardMode #partnerInquiryView .partnerInquiryDocumentCard > a {
    grid-column: 1 / -1;
    justify-content: stretch;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryReviewRow strong {
    text-align: left;
  }

  .partnerInquiryLightboxFrame {
    grid-template-columns: minmax(0, 1fr);
    height: calc(100vh - 24px);
  }

  .partnerInquiryLightboxNav {
    position: absolute;
    z-index: 2;
    top: 50%;
  }

  .partnerInquiryLightboxNav.isPrev {
    left: 5px;
  }

  .partnerInquiryLightboxNav.isNext {
    right: 5px;
  }

  .partnerInquiryLightboxReset {
    right: 52px;
    bottom: 4px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portalSelectIcon,
  .partnerInquiryLightboxCanvas img,
  body.dashboardMode #partnerInquiryView .partnerInquiryChoiceCard {
    transition: none;
  }
}

/* Portal Layout System V2: Premium List */
.ap-list-v2-intro {
  display: grid;
  gap: var(--ap-space-2);
}

.ap-list-v2-intro .partnerProjectsTitleRow {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: var(--ap-gap-default);
}

.ap-list-v2-intro .partnerProjectsTitleDivider {
  display: none;
}

.ap-list-v2-intro .partnerProjectsTitleLink {
  min-height: calc(var(--ap-space-6) + var(--ap-space-2));
  padding-inline: var(--ap-space-4);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-control);
  background: rgba(8, 22, 50, .58);
  color: var(--portal-muted);
  font-size: .82rem;
}

.ap-list-v2-intro .partnerProjectsTitleLink:is(:hover, :focus-visible) {
  border-color: var(--portal-border-strong);
  background: rgba(8, 22, 50, .86);
  color: var(--portal-text);
}

.ap-list-v2-intro > p {
  margin: 0;
  color: var(--portal-muted);
  font-size: .9rem;
}

body.dashboardMode #partnerProjectsCards.partnerProjectsCards:has(.ap-list-v2) {
  display: block !important;
  padding: var(--ap-space-0) !important;
  border: 0;
  border-radius: var(--ap-space-0);
  background: transparent;
  box-shadow: none;
  overflow: visible !important;
}

.ap-list-v2.portalList {
  display: block;
  width: 100%;
  max-width: none;
  padding: var(--ap-space-0);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: rgba(2, 9, 25, .52);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 18px 46px rgba(0, 0, 0, .18);
  overflow: hidden;
}

.ap-list-v2-header,
.ap-list-v2-row {
  display: grid;
  grid-template-columns: var(--ap-list-v2-columns, repeat(4, minmax(0, 1fr)));
  align-items: center;
  gap: var(--ap-gap-default);
}

.ap-list-v2-header {
  padding: var(--ap-space-2) var(--ap-space-4);
  border-bottom: 1px solid rgba(140, 174, 211, .16);
  background: rgba(2, 9, 25, .5);
}

.ap-list-v2-header-cell {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: var(--ap-space-2);
  color: var(--portal-muted);
  font-size: .72rem;
  font-weight: 850;
  line-height: 1;
  text-transform: uppercase;
}

.ap-list-v2-sort {
  display: inline-flex;
  align-items: center;
  gap: var(--ap-space-1);
}

body.dashboardMode .ap-list-v2 .ap-list-v2-sort-button {
  display: grid !important;
  width: calc(var(--ap-space-4) + var(--ap-space-1)) !important;
  height: calc(var(--ap-space-4) + var(--ap-space-1)) !important;
  min-width: calc(var(--ap-space-4) + var(--ap-space-1)) !important;
  min-height: calc(var(--ap-space-4) + var(--ap-space-1)) !important;
  place-items: center !important;
  padding: var(--ap-space-0) !important;
  border: 0;
  border-radius: var(--ap-space-1);
  background: transparent;
  color: rgba(184, 205, 229, .56);
  box-shadow: none;
  font-size: .72rem !important;
  line-height: 1 !important;
}

body.dashboardMode .ap-list-v2 .ap-list-v2-sort-button:is(:hover, .active) {
  border: 0;
  background: rgba(72, 159, 223, .14);
  color: var(--portal-text);
}

.ap-list-v2-body {
  display: grid;
}

body.dashboardMode .ap-list-v2 .ap-list-v2-row {
  display: grid !important;
  grid-template-columns: var(--ap-list-v2-columns, repeat(4, minmax(0, 1fr))) !important;
  width: 100% !important;
  min-height: calc(var(--ap-space-8) + var(--ap-space-2)) !important;
  padding: var(--ap-space-3) var(--ap-space-4) !important;
  align-items: center !important;
  gap: var(--ap-gap-default) !important;
  border: 0;
  border-bottom: 1px solid rgba(140, 174, 211, .13);
  border-radius: var(--ap-space-0);
  background: transparent;
  color: var(--portal-text);
  box-shadow: none;
  text-align: left !important;
  transform: none !important;
  transition: background .16s ease, color .16s ease !important;
}

body.dashboardMode .ap-list-v2 .ap-list-v2-row.is-interactive {
  cursor: pointer;
}

body.dashboardMode .ap-list-v2 .ap-list-v2-row.is-static {
  cursor: default;
}

body.dashboardMode .ap-list-v2 .ap-list-v2-row:last-child {
  border-bottom: 0;
}

body.dashboardMode .ap-list-v2 .ap-list-v2-row.is-interactive:is(:hover, :active) {
  border-color: rgba(140, 174, 211, .13);
  background: rgba(255, 255, 255, .035);
  color: var(--portal-text);
  box-shadow: none;
  outline: none;
}

body.dashboardMode .ap-list-v2 .ap-list-v2-row.is-interactive:focus-visible {
  background: rgba(255, 255, 255, .035);
  box-shadow: none;
  outline: 2px solid var(--portal-accent);
  outline-offset: calc(var(--ap-space-1) * -1);
}

body.dashboardMode .ap-list-v2 .ap-list-v2-row:is(
  .is-active,
  .is-selected,
  [aria-current="true"],
  [aria-current="page"],
  [aria-selected="true"]
) {
  background: rgba(8, 22, 50, .52);
  color: var(--portal-text);
  box-shadow: inset var(--ap-space-1) 0 0 var(--portal-accent);
  outline: none;
}

.ap-list-v2-cell {
  min-width: 0;
}

.ap-list-v2-cell-slot-badge .ap-list-v2-value {
  display: flex;
  align-items: center;
  gap: var(--ap-gap-tight);
}

.ap-list-v2-cell-slot-action,
.ap-list-v2-header-cell[data-list-column="actions"] {
  justify-content: flex-end;
  text-align: right;
}

.ap-list-v2-cell-slot-action .ap-list-v2-value {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--ap-gap-tight);
}

.ap-list-v2-value {
  display: block;
  min-width: 0;
  color: var(--portal-muted);
  font-size: .88rem;
  font-weight: 650;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.ap-list-v2-cell-primary .ap-list-v2-value,
.ap-list-v2-cell-primary .ap-list-v2-value strong {
  color: var(--portal-text);
  font-size: 1rem;
  font-weight: 900;
}

.ap-list-v2-cell-secondary .ap-list-v2-value,
.ap-list-v2-cell-secondary .ap-list-v2-value strong {
  color: rgba(239, 246, 255, .92);
  font-size: .94rem;
  font-weight: 800;
}

.ap-list-v2-mobile-label {
  display: none;
  margin-bottom: var(--ap-space-1);
  color: var(--portal-muted);
  font-size: .7rem;
  font-weight: 850;
  text-transform: uppercase;
}

.ap-list-v2-empty {
  display: grid;
  min-height: calc(var(--ap-space-8) + var(--ap-space-8));
  place-items: center;
  padding: var(--ap-section-gap) var(--ap-surface-padding);
  text-align: center;
}

.ap-list-v2-empty .mutedText {
  margin: 0;
}

.ap-reonic-list-v2 .ap-list-v2-header-cell:is([data-list-column="value"], [data-list-column="created_at"]),
.ap-reonic-list-v2 .ap-list-v2-cell:is([data-list-column="value"], [data-list-column="created_at"]) {
  justify-content: flex-end;
  text-align: right;
}

.ap-reonic-list-v2 .ap-list-v2-cell-primary .ap-list-v2-value {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--ap-gap-default);
}

.ap-list-v2-customer {
  display: grid;
  min-width: 0;
  gap: var(--ap-space-1);
}

.ap-list-v2-customer strong {
  overflow: hidden;
  color: var(--portal-text);
  font-size: 1rem;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ap-list-v2-customer small {
  overflow: hidden;
  color: var(--portal-muted);
  font-size: .78rem;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.dashboardMode .ap-reonic-list-v2 .ap-list-v2-row .status.reonicStatus,
body.dashboardMode .ap-reonic-list-v2 .ap-list-v2-row .montageProtocolNotice {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  min-height: calc(var(--ap-space-5) + var(--ap-space-1));
  align-items: center;
  padding-inline: var(--ap-space-3);
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: var(--portal-radius-control);
  background: rgba(72, 159, 223, .1);
  color: rgba(222, 237, 252, .78);
  box-shadow: none;
  font-size: .76rem;
  font-weight: 800;
  line-height: 1.15;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.dashboardMode .ap-reonic-list-v2 .ap-list-v2-row .montageProtocolNotice.isUnread {
  border-color: rgba(72, 159, 223, .42);
  background: rgba(72, 159, 223, .16);
  color: var(--portal-text);
}

body.dashboardMode .ap-reonic-list-v2 .ap-list-v2-row.hasMontageNotice {
  outline: 0;
  background: transparent;
}

.ap-reonic-list-v2 .ap-list-v2-number {
  color: var(--portal-text);
  font-size: .94rem;
  font-weight: 900;
  white-space: nowrap;
}

.ap-reonic-list-v2 time {
  color: rgba(222, 237, 252, .76);
  font-size: .86rem;
  font-weight: 750;
  white-space: nowrap;
}

.ap-list-v2-stack {
  display: grid;
  min-width: 0;
  gap: var(--ap-space-1);
}

.ap-list-v2-stack > :is(strong, span, small) {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ap-list-v2-stack small {
  color: var(--portal-muted);
  font-size: .76rem;
  font-weight: 650;
}

.ap-partner-orders-list-v2 .ap-list-v2-header-cell[data-list-column="total_cost"],
.ap-partner-orders-list-v2 .ap-list-v2-cell[data-list-column="total_cost"] {
  justify-content: flex-end;
  text-align: right;
}

.ap-list-v2-cost {
  color: var(--portal-text);
  font-size: .92rem;
  font-weight: 900;
  white-space: nowrap;
}

.ap-list-v2-preview-title {
  color: var(--portal-text);
  font-size: 1rem;
  font-weight: 900;
}

.ap-list-v2-preview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ap-gap-default);
}

.ap-list-v2-preview-item {
  display: grid;
  min-width: 0;
  gap: var(--ap-space-1);
}

.ap-list-v2-preview-label {
  color: var(--portal-muted);
  font-size: .7rem;
  font-weight: 800;
  text-transform: uppercase;
}

.ap-list-v2-preview-value {
  color: var(--portal-text);
  font-size: .82rem;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.ap-montage-list-v2 .ap-list-v2-cell-slot-badge .ap-list-v2-value {
  align-items: flex-start;
}

.ap-montage-list-v2 .ap-list-v2-cell[data-list-column="montage"] .ap-list-v2-value {
  display: grid;
  gap: var(--ap-space-2);
}

.ap-list-v2-meta-pair {
  display: grid;
  min-width: 0;
  grid-template-columns: var(--ap-space-6) minmax(0, 1fr);
  gap: var(--ap-space-2);
  align-items: baseline;
}

.ap-list-v2-meta-pair small {
  color: var(--portal-muted);
  font-size: .7rem;
  font-weight: 800;
  text-transform: uppercase;
}

.ap-list-v2-meta-pair strong {
  overflow: hidden;
  color: var(--portal-text);
  font-size: .8rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.dashboardMode .tableWrap.reonicTableWrap:has(.ap-reonic-list-v2) {
  overflow: visible !important;
}

@media (max-width: 760px) {
  .ap-list-v2-intro .partnerProjectsTitleRow {
    align-items: flex-start;
  }

  .ap-list-v2-header {
    display: none;
  }

  body.dashboardMode .ap-list-v2 .ap-list-v2-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    min-height: 0 !important;
    padding: var(--ap-space-4) !important;
    gap: var(--ap-space-4) var(--ap-gap-default) !important;
  }

  .ap-list-v2-mobile-label {
    display: block;
  }

  .ap-list-v2-cell-slot-action,
  .ap-list-v2-cell-slot-action .ap-list-v2-value {
    justify-content: flex-start;
    text-align: left;
  }

  .ap-reonic-list-v2 .ap-list-v2-cell-primary .ap-list-v2-value {
    grid-template-columns: minmax(0, 1fr);
  }

  .ap-reonic-list-v2 .ap-list-v2-header-cell:is([data-list-column="value"], [data-list-column="created_at"]),
  .ap-reonic-list-v2 .ap-list-v2-cell:is([data-list-column="value"], [data-list-column="created_at"]) {
    justify-content: flex-start;
    text-align: left;
  }

  .ap-list-v2-meta-pair strong {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
  }
}

@media (max-width: 520px) {
  .ap-list-v2-intro .partnerProjectsTitleRow {
    display: grid;
  }

  .ap-list-v2-intro .partnerProjectsTitleLink {
    width: fit-content;
  }

  body.dashboardMode .ap-list-v2 .ap-list-v2-row {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Final compact admin page hero: match the slimmer montage map header height. */
body.roleAdmin .dashboardHeadModern:not(.hidden) {
  min-height: clamp(190px, 18vw, 250px) !important;
  align-content: center !important;
  padding: clamp(24px, 2.8vw, 38px) clamp(30px, 4vw, 64px) !important;
  border-radius: 22px;
  overflow: hidden !important;
  background:
    linear-gradient(90deg, rgba(2, 8, 28, .98) 0%, rgba(4, 13, 38, .9) 30%, rgba(4, 13, 38, .48) 58%, rgba(4, 13, 38, .28) 100%),
    linear-gradient(180deg, rgba(5, 12, 34, .04) 0%, rgba(5, 12, 34, .16) 50%, rgba(5, 12, 34, .76) 100%),
    url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center center / cover no-repeat,
    #020817;
}

body.roleAdmin .dashboardHeadModern:not(.hidden)::after {
  bottom: clamp(16px, 1.8vw, 24px) !important;
}

body.roleAdmin .dashboardHeadModern:not(.hidden) .dashboardIdentity {
  max-width: min(760px, 62vw) !important;
  padding-top: 0 !important;
}

body.roleAdmin .dashboardHeadModern:not(.hidden) #welcomeTitle {
  font-size: clamp(34px, 4vw, 58px) !important;
  line-height: 1.02 !important;
}

body.roleAdmin .dashboardHeadModern:not(.hidden) .dashboardActions {
  align-self: center !important;
}

@media (max-width: 980px) {
  body.roleAdmin .dashboardHeadModern:not(.hidden) {
    min-height: 220px !important;
    padding: 132px 18px 24px !important;
    align-content: end !important;
    background:
      linear-gradient(180deg, rgba(2, 8, 28, .18) 0%, rgba(2, 8, 28, .82) 60%, rgba(2, 8, 28, .98) 100%),
      url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center top / auto 230px no-repeat,
      #020817;
  }

  body.roleAdmin .dashboardHeadModern:not(.hidden) .dashboardIdentity {
    max-width: 100% !important;
  }

  body.roleAdmin .dashboardHeadModern:not(.hidden) #welcomeTitle {
    font-size: clamp(30px, 9vw, 46px) !important;
  }
}

/* Admin partner order detail contrast override. */
body.roleAdmin #partnerOrderDetailBox.reviewBox,
body.roleAdmin #partnerOrderDetailForm.recommendationForm,
body.roleAdmin #partnerOrderDetailBox .partnerOrderChatTop,
body.roleAdmin #partnerOrderDetailBox .chatMessages,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimate,
body.roleAdmin #partnerOrderDetailBox .chatAttachmentField {
  color: #ffffff;
  border: 1px solid rgba(72, 159, 223, .28);
  background:
    linear-gradient(145deg, rgba(12, 24, 58, .92), rgba(5, 14, 35, .82)),
    rgba(255, 255, 255, .05);
  box-shadow: 0 28px 86px rgba(3, 9, 28, .3), inset 0 1px 0 rgba(255, 255, 255, .13);
  backdrop-filter: blur(22px) saturate(1.18);
  -webkit-backdrop-filter: blur(22px) saturate(1.18);
}

body.roleAdmin #partnerOrderDetailBox.reviewBox {
  padding: clamp(22px, 2.8vw, 38px) !important;
  align-items: stretch;
}

body.roleAdmin #partnerOrderDetailForm.recommendationForm {
  padding: clamp(18px, 2.2vw, 28px) !important;
  border-radius: 22px;
}

body.roleAdmin #partnerOrderDetailBox .formHead,
body.roleAdmin #partnerOrderDetailBox .partnerOrderAttachmentsSection,
body.roleAdmin #partnerOrderDetailBox .partnerOrderNotesSection {
  border-color: rgba(72, 159, 223, .18);
}

body.roleAdmin #partnerOrderDetailBox h3,
body.roleAdmin #partnerOrderDetailBox h4,
body.roleAdmin #partnerOrderDetailBox label,
body.roleAdmin #partnerOrderDetailBox small,
body.roleAdmin #partnerOrderDetailBox .mutedText,
body.roleAdmin #partnerOrderDetailBox .partnerOrderDetailMeta,
body.roleAdmin #partnerOrderDetailBox .partnerOrderMetaSeparator,
body.roleAdmin #partnerOrderDetailBox .chatMessageHeader,
body.roleAdmin #partnerOrderDetailBox .chatMessageAuthor,
body.roleAdmin #partnerOrderDetailBox .chatMessageBody,
body.roleAdmin #partnerOrderDetailBox .partnerOrderImageCard span,
body.roleAdmin #partnerOrderDetailBox .partnerOrderFileLink,
body.roleAdmin #partnerOrderDetailBox .partnerOrderFileLink span,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimate span,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimate small,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimateRow strong,
body.roleAdmin #partnerOrderDetailBox .formMessage {
  color: rgba(255, 255, 255, .9);
}

body.roleAdmin #partnerOrderDetailBox .step {
  color: rgba(255, 255, 255, .72);
}

body.roleAdmin #partnerOrderDetailForm input,
body.roleAdmin #partnerOrderDetailForm select,
body.roleAdmin #partnerOrderDetailForm textarea,
body.roleAdmin #partnerOrderMessageForm textarea,
body.roleAdmin #partnerOrderDetailBox input[type="file"] {
  border-color: rgba(72, 159, 223, .34);
  background: rgba(2, 12, 32, .72);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 12px 28px rgba(3, 9, 28, .16);
}

body.roleAdmin #partnerOrderDetailForm input::placeholder,
body.roleAdmin #partnerOrderDetailForm textarea::placeholder,
body.roleAdmin #partnerOrderMessageForm textarea::placeholder {
  color: rgba(255, 255, 255, .52);
}

body.roleAdmin #partnerOrderDetailForm input:disabled,
body.roleAdmin #partnerOrderDetailForm select:disabled,
body.roleAdmin #partnerOrderDetailForm textarea:disabled {
  opacity: 1;
  color: rgba(255, 255, 255, .86);
  -webkit-text-fill-color: rgba(255, 255, 255, .86);
}

body.roleAdmin #partnerOrderDetailForm input:focus,
body.roleAdmin #partnerOrderDetailForm select:focus,
body.roleAdmin #partnerOrderDetailForm textarea:focus,
body.roleAdmin #partnerOrderMessageForm textarea:focus {
  border-color: rgba(72, 159, 223, .84);
  background: rgba(6, 18, 46, .88);
  box-shadow: 0 0 0 4px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .14);
}

body.roleAdmin #partnerOrderDetailBox input[type="file"]::file-selector-button {
  border-color: rgba(72, 159, 223, .42);
  background: linear-gradient(135deg, rgba(72, 159, 223, .98), rgba(72, 159, 223, .78));
  color: #ffffff;
}

body.roleAdmin #partnerOrderDetailForm select option {
  color: #ffffff;
  background: #081833;
}

body.roleAdmin #partnerOrderDetailBox .partnerOrderImageCard,
body.roleAdmin #partnerOrderDetailBox .partnerOrderFileLink,
body.roleAdmin #partnerOrderDetailBox .chatMessage,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimateRow {
  border-color: rgba(72, 159, 223, .22);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .13), rgba(255, 255, 255, .06)),
    rgba(20, 27, 77, .46);
  box-shadow: 0 22px 56px rgba(3, 9, 28, .2), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.roleAdmin #partnerOrderDetailBox .chatMessageRight {
  border-color: rgba(72, 159, 223, .34);
  background: linear-gradient(135deg, rgba(72, 159, 223, .28), rgba(72, 159, 223, .12));
}

body.roleAdmin #partnerOrderDetailBox .partnerOrderImageCard img {
  background: rgba(2, 12, 32, .72);
}

body.roleAdmin #partnerOrderDetailBox .reviewStatus.reviewPending {
  color: #ffd2a8;
  background: rgba(181, 71, 8, .24);
  border: 1px solid rgba(255, 185, 116, .32);
}

body.roleAdmin #partnerOrderDetailBox .reviewStatus.reviewInfo {
  color: #bfe0ff;
  background: rgba(72, 159, 223, .22);
  border: 1px solid rgba(72, 159, 223, .38);
}

body.roleAdmin #partnerOrderDetailBox .reviewStatus.reviewDone {
  color: #b9f2d3;
  background: rgba(31, 122, 82, .24);
  border: 1px solid rgba(95, 213, 150, .28);
}

body.roleAdmin #partnerOrderDetailBox .reviewStatus.reviewUnknown {
  color: rgba(255, 255, 255, .82);
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .16);
}

/* Admin residual contrast cleanup. */
body.roleAdmin #upcomingAppointments,
body.roleAdmin #emailAutomationPanel.recommendationForm,
body.roleAdmin #partnerAdminOverviewPanel,
body.roleAdmin .partnerAdminOverviewCard,
body.roleAdmin .partnerProjectCard,
body.roleAdmin .partnerAdminOrderButton,
body.roleAdmin .emailAutomationCard,
body.roleAdmin .partnerAdminSortBar {
  color: #ffffff;
  border-color: rgba(72, 159, 223, .26);
  background:
    linear-gradient(145deg, rgba(12, 24, 58, .9), rgba(6, 16, 42, .78)),
    rgba(255, 255, 255, .05);
  box-shadow: 0 24px 72px rgba(3, 9, 28, .24), inset 0 1px 0 rgba(255, 255, 255, .13);
}

body.roleAdmin .partnerProjectCard:hover,
body.roleAdmin .partnerAdminOrderButton:hover,
body.roleAdmin .partnerAdminOverviewCard:hover,
body.roleAdmin .emailAutomationCard:hover {
  color: #ffffff;
  border-color: rgba(72, 159, 223, .52);
  background:
    linear-gradient(145deg, rgba(18, 34, 76, .96), rgba(8, 22, 54, .88)),
    rgba(72, 159, 223, .08);
  box-shadow: 0 30px 86px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .16);
}

body.roleAdmin #upcomingAppointments h3,
body.roleAdmin #upcomingAppointments h4,
body.roleAdmin #emailAutomationPanel h3,
body.roleAdmin #emailAutomationPanel label,
body.roleAdmin .emailAutomationCardText strong,
body.roleAdmin #partnerAdminOverviewPanel h3,
body.roleAdmin .partnerAdminOverviewPrimary h3,
body.roleAdmin .partnerProjectField strong,
body.roleAdmin .partnerProjectField > span:not(.partnerProjectLabel):not(.partnerProjectSortableLabel):not(.reviewStatus),
body.roleAdmin .partnerAdminOrderButton strong,
body.roleAdmin .partnerAdminOverviewText,
body.roleAdmin .partnerAdminSortBar,
body.roleAdmin .partnerProjectSortButton.active,
body.roleAdmin .partnerProjectSortButton:hover {
  color: rgba(255, 255, 255, .94);
}

body.roleAdmin #upcomingAppointments .mutedText,
body.roleAdmin #emailAutomationPanel .mutedText,
body.roleAdmin .emailAutomationCardText p,
body.roleAdmin .emailAutomationEditor label,
body.roleAdmin .partnerAdminOverviewCard .step,
body.roleAdmin .partnerAdminOverviewProjects .mutedText,
body.roleAdmin .partnerProjectLabel,
body.roleAdmin .partnerProjectLabelInline,
body.roleAdmin .partnerProjectSortButton,
body.roleAdmin .partnerAdminOrderButton span,
body.roleAdmin .emailAutomationEditHint {
  color: rgba(255, 255, 255, .72);
}

body.roleAdmin #emailAutomationPanel textarea,
body.roleAdmin .emailAutomationEditor textarea {
  color: #ffffff;
  border-color: rgba(72, 159, 223, .34);
  background: rgba(2, 12, 32, .72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 12px 28px rgba(3, 9, 28, .16);
}

body.roleAdmin #emailAutomationPanel textarea::placeholder,
body.roleAdmin .emailAutomationEditor textarea::placeholder {
  color: rgba(255, 255, 255, .52);
}

body.roleAdmin .emailAutomationEditor,
body.roleAdmin .partnerAdminOrders,
body.roleAdmin .partnerAdminOverviewProjects,
body.roleAdmin .partnerAdminOverviewActions {
  border-color: rgba(72, 159, 223, .18);
}

body.roleAdmin .partnerAdminStatCard {
  color: #ffffff;
  border-color: rgba(72, 159, 223, .2);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .055)),
    rgba(20, 27, 77, .44);
}

body.roleAdmin .partnerAdminDetailLogo {
  border-color: rgba(72, 159, 223, .28);
  background: rgba(255, 255, 255, .08);
}

body.roleAdmin .partnerProjectHoverPreview,
body.roleAdmin .partnerOrderMapPopup .partnerProjectHoverPreview {
  color: #ffffff;
  border: 1px solid rgba(72, 159, 223, .34);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(8, 24, 51, .98), rgba(20, 27, 77, .94)),
    rgba(2, 9, 20, .96);
  box-shadow: 0 28px 80px rgba(2, 9, 28, .4), inset 0 1px 0 rgba(255, 255, 255, .14);
  z-index: 10080 !important;
}

body.roleAdmin .partnerProjectHoverPreview strong,
body.roleAdmin .partnerProjectHoverPreview .partnerProjectHoverItem b {
  color: rgba(255, 255, 255, .94);
}

body.roleAdmin .partnerProjectHoverPreview .partnerProjectHoverItem span {
  color: rgba(255, 255, 255, .68);
}

/* Admin accounts contrast cleanup. */
body.roleAdmin #adminAccountsPanel.adminAccountsPanel,
body.roleAdmin #adminAccountForm.adminAccountForm,
body.roleAdmin .adminAccountCard {
  color: #ffffff;
  border: 1px solid rgba(72, 159, 223, .28);
  background:
    linear-gradient(145deg, rgba(12, 24, 58, .92), rgba(5, 14, 35, .82)),
    rgba(255, 255, 255, .05);
  box-shadow: 0 28px 86px rgba(3, 9, 28, .3), inset 0 1px 0 rgba(255, 255, 255, .13);
  backdrop-filter: blur(22px) saturate(1.18);
  -webkit-backdrop-filter: blur(22px) saturate(1.18);
}

body.roleAdmin #adminAccountsPanel .formHead,
body.roleAdmin #adminAccountsPanel .adminAccountFilterBar,
body.roleAdmin #adminAccountsPanel .adminAccountTabs,
body.roleAdmin #adminAccountsPanel .adminAccountMain,
body.roleAdmin #adminAccountsPanel .adminAccountMeta,
body.roleAdmin #adminAccountsPanel .adminPermissionPills {
  border-color: rgba(72, 159, 223, .18);
}

body.roleAdmin #adminAccountsPanel h3,
body.roleAdmin #adminAccountsPanel h4,
body.roleAdmin #adminAccountsPanel label,
body.roleAdmin #adminAccountsPanel .adminAccountFilterBar label,
body.roleAdmin #adminAccountsPanel .adminAccountMain strong,
body.roleAdmin #adminAccountsPanel .adminAccountEditPermissions,
body.roleAdmin #adminAccountsPanel #adminAccountsMessage {
  color: rgba(255, 255, 255, .94);
}

body.roleAdmin #adminAccountsPanel .step,
body.roleAdmin #adminAccountsPanel .mutedText,
body.roleAdmin #adminAccountsPanel .adminAccountMain span,
body.roleAdmin #adminAccountsPanel .adminAccountMain small,
body.roleAdmin #adminAccountsPanel .adminAccountMeta span,
body.roleAdmin #adminAccountsPanel .adminPermissionPills em,
body.roleAdmin #adminAccountsPanel .adminPermissionPills span {
  color: rgba(255, 255, 255, .72);
}

body.roleAdmin #adminAccountsPanel .adminAccountMeta span,
body.roleAdmin #adminAccountsPanel .adminPermissionPills span,
body.roleAdmin #adminAccountsPanel .adminAccountFilterBar,
body.roleAdmin #adminAccountsPanel .adminAccountTabs,
body.roleAdmin #adminAccountsPanel .adminPermissionCheck,
body.roleAdmin #adminAccountsPanel .adminPermissionToggle {
  border-color: rgba(72, 159, 223, .22);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .055)),
    rgba(20, 27, 77, .44);
}

body.roleAdmin #adminAccountsPanel input,
body.roleAdmin #adminAccountsPanel select,
body.roleAdmin #adminAccountsPanel textarea {
  color: #ffffff;
  border-color: rgba(72, 159, 223, .34);
  background: rgba(2, 12, 32, .72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 12px 28px rgba(3, 9, 28, .16);
}

body.roleAdmin #adminAccountsPanel input::placeholder,
body.roleAdmin #adminAccountsPanel textarea::placeholder {
  color: rgba(255, 255, 255, .52);
}

body.roleAdmin #adminAccountsPanel input:focus,
body.roleAdmin #adminAccountsPanel select:focus,
body.roleAdmin #adminAccountsPanel textarea:focus {
  border-color: rgba(72, 159, 223, .84);
  background: rgba(6, 18, 46, .88);
  box-shadow: 0 0 0 4px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .14);
}

body.roleAdmin #adminAccountsPanel select option {
  color: #ffffff;
  background: #081833;
}

body.roleAdmin #adminAccountsPanel .adminAccountCard:hover {
  border-color: rgba(72, 159, 223, .52);
  background:
    linear-gradient(145deg, rgba(18, 34, 76, .96), rgba(8, 22, 54, .88)),
    rgba(72, 159, 223, .08);
  box-shadow: 0 30px 86px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .16);
}

body.roleAdmin #adminAccountsPanel .adminAccountFilterBar {
  display: flex;
  align-items: end;
  justify-content: flex-start;
  gap: 12px;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 18px;
  padding: 12px;
  border-radius: 16px;
}

body.roleAdmin #adminAccountsPanel .adminAccountFilterBar label {
  display: grid;
  gap: 6px;
  min-width: 190px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .03em;
  text-transform: uppercase;
}

body.roleAdmin #adminAccountsPanel .adminAccountFilterBar select {
  min-width: 230px;
}

body.roleAdmin #adminAccountsPanel .adminAccountTab {
  color: rgba(255, 255, 255, .78);
}

body.roleAdmin #adminAccountsPanel .adminAccountTab.is-active,
body.roleAdmin #adminAccountsPanel .adminAccountTab:hover {
  color: #101839;
}

/* Admin montage calendar */
.montageCalendarPanel {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: hidden;
}

.montageCalendarShell {
  display: grid;
  gap: 18px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  color: #fff;
}

.montageCalendarHero,
.montageCalendarToolbar,
.montageCalendarEventForm,
.montageCalendarGrid {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  border: 1px solid rgba(72, 159, 223, .24);
  border-radius: 24px;
  background:
    linear-gradient(145deg, rgba(8, 24, 51, .88), rgba(20, 27, 77, .68)),
    rgba(255, 255, 255, .06);
  box-shadow: 0 24px 72px rgba(3, 9, 28, .28), inset 0 1px 0 rgba(255, 255, 255, .12);
}

.montageCalendarHero {
  min-height: 190px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: end;
  padding: clamp(22px, 4vw, 42px);
  background:
    linear-gradient(100deg, rgba(2, 9, 20, .88), rgba(20, 27, 77, .55)),
    url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center / cover;
  overflow: hidden;
}

.montageCalendarHero > *,
.montageCalendarToolbar > *,
.montageCalendarEventForm > *,
.montageCalendarGrid > * {
  min-width: 0;
}

.montageCalendarHero h3 {
  margin: 4px 0 8px;
  color: #fff;
  font-size: clamp(34px, 6vw, 68px);
  line-height: .96;
  letter-spacing: 0;
}

.montageCalendarActions,
.montageCalendarToolbar,
.montageCalendarViewSwitch {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.montageCalendarToolbar {
  justify-content: space-between;
  padding: 14px;
}

.montageCalendarToolbar > strong {
  font-size: clamp(20px, 3vw, 30px);
}

.montageCalendarViewSwitch {
  padding: 5px;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 999px;
  background: rgba(255, 255, 255, .08);
}

.montageCalendarViewSwitch button {
  min-height: 38px;
  padding: 0 16px;
  border: 0;
  border-radius: 999px;
  color: rgba(255, 255, 255, .72);
  background: transparent;
  font-weight: 800;
}

.montageCalendarViewSwitch button.active {
  color: #fff;
  background: rgba(72, 159, 223, .62);
  box-shadow: 0 10px 24px rgba(72, 159, 223, .2);
}

.montageCalendarEventForm {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, .9fr) minmax(0, .9fr) minmax(0, .7fr);
  gap: 12px;
  align-items: end;
  padding: 16px;
}

.montageCalendarEventForm label {
  display: grid;
  gap: 7px;
  color: rgba(255, 255, 255, .76);
  font-weight: 800;
}

.montageCalendarEventForm .fullWidth {
  grid-column: span 2;
}

.montageCalendarEventForm button {
  min-height: 48px;
}

#montageCalendarMessage {
  grid-column: 1 / -1;
  margin: 0;
}

.montageCalendarGrid {
  min-height: 420px;
  padding: 14px;
}

.montageCalendarMonth {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 8px;
}

.montageCalendarWeekday {
  color: rgba(255, 255, 255, .64);
  font-size: 12px;
  font-weight: 900;
  text-align: center;
  text-transform: uppercase;
}

.montageCalendarDay,
.montageCalendarWeekColumn,
.montageCalendarAgenda {
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 18px;
  background: rgba(255, 255, 255, .065);
}

.montageCalendarDay {
  min-height: 132px;
  padding: 10px;
}

.montageCalendarDay.isMuted {
  opacity: .45;
}

.montageCalendarDay.isToday {
  border-color: rgba(72, 159, 223, .72);
  box-shadow: inset 0 0 0 1px rgba(72, 159, 223, .32), 0 12px 28px rgba(72, 159, 223, .14);
}

.montageCalendarDay header,
.montageCalendarWeekColumn header {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
  margin-bottom: 9px;
}

.montageCalendarDay header strong,
.montageCalendarWeekColumn header strong {
  color: #fff;
}

.montageCalendarDay header span {
  min-width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(72, 159, 223, .18);
  color: rgba(255, 255, 255, .82);
  font-size: 12px;
  font-weight: 900;
}

.montageCalendarDayEvents,
.montageCalendarWeekColumn > div,
.montageCalendarAgenda {
  display: grid;
  gap: 8px;
}

.montageCalendarWeek {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: hidden;
  padding-bottom: 4px;
}

.montageCalendarWeekColumn {
  min-height: 420px;
  padding: 12px;
}

.montageCalendarAgenda {
  padding: 14px;
}

.montageCalendarAgenda h4 {
  margin: 0 0 4px;
  color: #fff;
}

.montageCalendarEventPill,
.montageCalendarEventCard {
  border: 1px solid rgba(255, 255, 255, .12);
  border-left: 4px solid rgba(72, 159, 223, .78);
  border-radius: 12px;
  background: rgba(72, 159, 223, .13);
}

.montageCalendarEventPill {
  display: flex;
  gap: 7px;
  align-items: center;
  min-height: 30px;
  padding: 5px 7px;
  overflow: hidden;
}

.montageCalendarEventPill b,
.montageCalendarEventCard b {
  color: #fff;
}

.montageCalendarEventPill span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: rgba(255, 255, 255, .82);
  font-size: 12px;
  font-weight: 800;
}

.montageCalendarEventCard {
  display: grid;
  gap: 7px;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
  padding: 9px 10px;
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.montageCalendarEventCard:hover,
.montageCalendarEventCard:focus-within {
  border-color: rgba(169, 213, 242, .88);
  border-left-color: rgba(169, 213, 242, .96);
  background:
    linear-gradient(90deg, rgba(238, 247, 255, .96) 0%, rgba(149, 200, 234, .86) 42%, rgba(72, 159, 223, .78) 100%);
  box-shadow: 0 14px 28px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .5);
  transform: translateY(-1px);
}

.montageCalendarEventCard:hover span,
.montageCalendarEventCard:hover small,
.montageCalendarEventCard:hover strong,
.montageCalendarEventCard:hover b,
.montageCalendarEventCard:focus-within span,
.montageCalendarEventCard:focus-within small,
.montageCalendarEventCard:focus-within strong,
.montageCalendarEventCard:focus-within b {
  color: #ffffff;
}

.montageCalendarEventCard > div {
  min-width: 0;
  max-width: 100%;
  display: grid;
  gap: 4px;
  overflow: hidden;
}

.montageCalendarEventCard span,
.montageCalendarEventCard small {
  color: rgba(255, 255, 255, .68);
  font-size: 11px;
  font-weight: 500;
  line-height: 1.25;
}

.montageCalendarEventCard strong,
.montageCalendarCustomerLink {
  color: #fff;
  font-size: clamp(13px, .82vw, 16px);
  font-weight: 800;
  line-height: 1.18;
  overflow-wrap: anywhere;
}

.montageCalendarCustomerLink {
  width: fit-content;
  max-width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.montageCalendarCustomerLink:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.montageCalendarEventMeta {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  color: rgba(255, 255, 255, .72);
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
}

.montageCalendarEventMeta span,
.montageCalendarEventMeta b,
.montageCalendarEventMeta small {
  min-width: 0;
  color: inherit;
  font-size: inherit;
  line-height: inherit;
  white-space: nowrap;
}

.montageCalendarEventMeta b {
  margin-left: auto;
}

.montageCalendarEventCard button {
  min-height: 30px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 12px;
}

.montageCalendarEventCard .montageCalendarCustomerLink {
  min-height: 0;
  padding: 0;
  border-radius: 0;
  font-size: clamp(13px, .82vw, 16px);
}

.montageCalendarEventCard > button[data-delete-calendar-event] {
  width: fit-content;
}

.montageCalendarEditModal {
  position: relative;
  width: min(620px, calc(100vw - 32px));
  max-height: calc(100vh - 40px);
  overflow: auto;
  display: grid;
  gap: 14px;
  padding: 24px;
  border: 1px solid rgba(72, 159, 223, .26);
  border-radius: 18px;
  background:
    radial-gradient(circle at 18% 0%, rgba(72, 159, 223, .2), transparent 38%),
    linear-gradient(145deg, rgba(20, 27, 77, .94), rgba(8, 24, 51, .9));
  color: #ffffff;
  box-shadow: 0 36px 90px rgba(3, 9, 28, .42), inset 0 1px 0 rgba(255, 255, 255, .12);
}

.montageCalendarEditModal h3 {
  margin: 0;
  color: #ffffff;
}

.montageCalendarEditModal label {
  display: grid;
  gap: 7px;
  color: rgba(255, 255, 255, .76);
  font-weight: 800;
}

.montageCalendarEventPill.ac,
.montageCalendarEventCard.ac {
  border-left-color: rgba(255, 255, 255, .82);
}

.montageCalendarEventPill.manual,
.montageCalendarEventCard.manual {
  border-left-color: #9dd2ff;
  background: rgba(255, 255, 255, .1);
}

.montageCalendarEventPill.cancelled,
.montageCalendarEventCard.cancelled {
  border-color: rgba(255, 134, 134, .42);
  border-left-color: rgba(255, 134, 134, .72);
  background: linear-gradient(145deg, rgba(46, 12, 22, .72), rgba(4, 15, 38, .92));
}

@media (max-width: 920px) {
  .montageCalendarHero,
  .montageCalendarToolbar,
  .montageCalendarEventCard {
    align-items: stretch;
    flex-direction: column;
  }

  .montageCalendarEventForm {
    grid-template-columns: 1fr;
  }

  .montageCalendarEventForm .fullWidth {
    grid-column: auto;
  }

  .montageCalendarMonth {
    grid-template-columns: 1fr;
  }

  .montageCalendarWeek {
    grid-template-columns: 1fr;
    gap: 12px;
    overflow: visible;
  }

  .montageCalendarWeekColumn {
    min-height: 0;
    padding: 14px;
  }

  .montageCalendarWeekColumn header {
    justify-content: flex-start;
    gap: 12px;
    margin-bottom: 12px;
  }

  .montageCalendarWeekColumn header span,
  .montageCalendarWeekColumn header strong {
    font-size: 18px;
    line-height: 1.2;
    white-space: nowrap;
  }

  .montageCalendarWeekColumn > div {
    gap: 10px;
  }

  .montageCalendarWeekColumn .mutedText {
    margin: 0;
    font-size: 15px;
  }

  .montageCalendarEventCard {
    min-height: 0;
    padding: 12px 14px;
  }

  .montageCalendarEventMeta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 10px;
    font-size: 11px;
  }

  .montageCalendarEventMeta b {
    margin-left: 0;
  }

  .montageCalendarEventCard strong,
  .montageCalendarEventCard .montageCalendarCustomerLink {
    font-size: 16px;
  }

  .montageCalendarEventCard small {
    font-size: 13px;
  }

  .montageCalendarWeekday {
    display: none;
  }
}

/* Partner order signature modal */
#partnerSubmitModal.partnerSubmitModal {
  background:
    radial-gradient(circle at 50% 18%, rgba(72, 159, 223, .18), transparent 34%),
    rgba(2, 9, 20, .72);
  backdrop-filter: blur(18px) saturate(1.2);
  -webkit-backdrop-filter: blur(18px) saturate(1.2);
}

#partnerSubmitModal .partnerSubmitModalCard {
  width: min(820px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  overflow: auto;
  text-align: left;
  border: 1px solid rgba(72, 159, 223, .34);
  border-radius: 24px;
  background:
    linear-gradient(145deg, rgba(8, 24, 51, .96), rgba(20, 27, 77, .86)),
    rgba(2, 9, 20, .92);
  color: #fff;
  box-shadow:
    0 32px 100px rgba(0, 0, 0, .48),
    inset 0 1px 0 rgba(255, 255, 255, .14);
}

#partnerSubmitModal .partnerSubmitModalCard h3 {
  padding-right: 44px;
  color: #fff;
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.08;
}

#partnerSubmitModal .partnerSubmitModalCard p {
  max-width: 680px;
  color: rgba(255, 255, 255, .76);
  font-size: 16px;
}

#partnerSubmitModal .partnerSubmitModalClose {
  color: #fff;
  border-color: rgba(255, 255, 255, .18);
  background: rgba(255, 255, 255, .1);
}

#partnerSubmitModal .partnerSubmitModalClose:hover {
  background: rgba(72, 159, 223, .28);
}

#partnerSubmitModal .partnerSubmitPreviewPaper {
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: 20px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, .045)),
    rgba(2, 9, 20, .26);
  padding: 18px;
}

#partnerSubmitModal .partnerSubmitPreviewHeader {
  border-color: rgba(72, 159, 223, .24);
}

#partnerSubmitModal .partnerSubmitPreviewHeader strong {
  color: #fff;
}

#partnerSubmitModal .partnerSubmitPreviewHeader span,
#partnerSubmitModal .partnerSubmitPreviewRows span,
#partnerSubmitModal .partnerSubmitPreviewCosts span,
#partnerSubmitModal .partnerSubmitPreviewCosts small {
  color: rgba(255, 255, 255, .68);
}

#partnerSubmitModal .partnerSubmitPreviewRows div {
  border-bottom: 1px solid rgba(72, 159, 223, .18);
  background: rgba(255, 255, 255, .045);
  border-radius: 14px;
  padding: 10px 12px;
}

#partnerSubmitModal .partnerSubmitPreviewRows strong {
  color: #fff;
  font-weight: 800;
}

#partnerSubmitModal .partnerSubmitPreviewCosts {
  border-color: rgba(72, 159, 223, .34);
  background: rgba(72, 159, 223, .12);
}

#partnerSubmitModal .partnerSubmitPreviewCosts strong {
  color: #fff;
}

#partnerSubmitModal .partnerSubmitModalActions {
  justify-content: flex-start;
}

#partnerSubmitModal .partnerSubmitModalActions button {
  color: #fff;
}

/* Partner portal contrast polish */
body.portalPartner #partnerOrderView.panel,
body.portalPartner #partnerOrderForm.recommendationForm,
body.portalPartner #partnerProjectsPanel.reviewBox,
body.partnerDashboardHome #partnerProjectsPanel.reviewBox,
body.partnerDashboardHome .advisorCard,
body.partnerDashboardHome .partnerHomeActionCard {
  color: #ffffff;
  border: 1px solid rgba(72, 159, 223, .26);
  background:
    linear-gradient(145deg, rgba(12, 24, 58, .9), rgba(6, 16, 42, .78)),
    rgba(255, 255, 255, .05);
  box-shadow: 0 28px 86px rgba(3, 9, 28, .32), inset 0 1px 0 rgba(255, 255, 255, .13);
  backdrop-filter: blur(22px) saturate(1.18);
  -webkit-backdrop-filter: blur(22px) saturate(1.18);
}

body.portalPartner #partnerOrderView.panel {
  padding: clamp(24px, 3vw, 42px);
}

body.portalPartner #partnerOrderView h2,
body.portalPartner #partnerOrderForm label,
body.portalPartner #partnerOrderForm small,
body.portalPartner #partnerOrderForm .mutedText,
body.portalPartner #partnerProjectsPanel h3,
body.portalPartner #partnerProjectsPanel p,
body.partnerDashboardHome .advisorCard span,
body.partnerDashboardHome .advisorCard strong,
body.partnerDashboardHome .advisorCard small,
body.partnerDashboardHome .partnerHomeActionCard strong,
body.partnerDashboardHome .partnerHomeActionCard small {
  color: rgba(255, 255, 255, .9);
}

body.portalPartner #partnerOrderView > .mutedText {
  color: rgba(255, 255, 255, .74);
}

body.portalPartner #partnerOrderForm input,
body.portalPartner #partnerOrderForm select,
body.portalPartner #partnerOrderForm textarea {
  border-color: rgba(72, 159, 223, .34);
  background: rgba(2, 12, 32, .72);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 12px 28px rgba(3, 9, 28, .16);
}

body.portalPartner #partnerOrderForm input:focus,
body.portalPartner #partnerOrderForm select:focus,
body.portalPartner #partnerOrderForm textarea:focus {
  border-color: rgba(72, 159, 223, .84);
  background: rgba(6, 18, 46, .88);
  box-shadow: 0 0 0 4px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .14);
}

body.portalPartner #partnerOrderForm input[type="file"] {
  min-height: 58px;
  padding: 9px 12px;
  color: rgba(255, 255, 255, .8);
}

body.portalPartner #partnerOrderForm input[type="file"]::file-selector-button {
  min-height: 40px;
  border-color: rgba(72, 159, 223, .42);
  background: linear-gradient(135deg, rgba(72, 159, 223, .98), rgba(72, 159, 223, .78));
  color: #ffffff;
}

body.portalPartner #partnerOrderForm select option {
  color: #141B4D;
  background: #ffffff;
}

body.portalPartner #partnerOrderForm .formActions select {
  min-width: min(420px, 100%);
}

body.partnerDashboardHome .dashboardHeadModern {
  background:
    linear-gradient(90deg, rgba(2, 9, 20, .88), rgba(20, 27, 77, .52) 56%, rgba(2, 9, 20, .52)),
    url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center / cover;
}

body.partnerDashboardHome .advisorCard {
  gap: 18px;
}

body.partnerDashboardHome .advisorCard img {
  border: 1px solid rgba(255, 255, 255, .2);
  box-shadow: 0 16px 34px rgba(0, 0, 0, .28);
}

body.partnerDashboardHome .employeePhotoButton {
  border: 1px solid rgba(72, 159, 223, .28);
  background: rgba(4, 14, 38, .62);
  box-shadow: 0 24px 60px rgba(3, 9, 28, .28), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.partnerDashboardHome #partnerProjectsPanel.reviewBox {
  padding: clamp(22px, 2.6vw, 34px);
}

body.partnerDashboardHome .partnerHomeActionGrid {
  gap: 18px;
}

body.partnerDashboardHome .partnerHomeActionCard {
  min-height: 150px;
  padding: 22px;
  border-radius: 18px;
}

body.partnerDashboardHome .partnerHomeActionCard:hover {
  border-color: rgba(72, 159, 223, .72);
  background:
    linear-gradient(145deg, rgba(72, 159, 223, .28), rgba(6, 16, 42, .84)),
    rgba(255, 255, 255, .07);
  box-shadow: 0 30px 80px rgba(72, 159, 223, .2), inset 0 1px 0 rgba(255, 255, 255, .16);
}

body.partnerDashboardHome .partnerHomeActionCard span {
  color: #489FDF;
}

@media (max-width: 980px) {
  body.partnerDashboardHome .dashboardHeadModern {
    grid-template-columns: 1fr;
    grid-template-areas:
      "identity"
      "photo"
      "advisor";
  }

  body.partnerDashboardHome .employeePhotoButton,
  body.partnerDashboardHome .advisorCard {
    width: 100%;
    height: auto;
  }

  body.partnerDashboardHome .partnerHomeActionGrid {
    grid-template-columns: 1fr;
  }

}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  font-family: var(--ap-font);
  color: var(--ink);
  background:
    radial-gradient(circle at 74% 12%, rgba(72, 159, 223, 0.18), transparent 34%),
    linear-gradient(120deg, rgba(2, 9, 20, 0.96), rgba(20, 27, 77, 0.82) 54%, rgba(2, 9, 20, 0.96)),
    url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

/* P11.1: Until the session result is known, expose no application chrome at
   all. A complete login or a complete dashboard is shown only after the
   explicit auth state has changed from UNKNOWN. */
body[data-auth-state="unknown"] {
  background: #edf6fc;
  color-scheme: light;
}

body[data-auth-state="unknown"] .shell {
  visibility: hidden;
}

body.dashboardMode {
  background: var(--ap-ui-page);
}

body.dashboardMode::before,
body.dashboardMode::after {
  content: none;
  display: none;
}

button,
input,
select,
textarea {
  font: inherit;
}

button:not([class]) {
  min-height: 48px;
  min-width: 112px;
  padding: 0 18px;
  border: 0;
  border-radius: 999px;
  color: #ffffff;
  background: var(--accent);
  cursor: pointer;
  font-weight: 700;
}

button:not([class]):hover {
  background: var(--night);
}

.shell {
  width: min(1040px, calc(100% - 32px));
  min-height: 100vh;
  margin: 0 auto;
  padding: 56px 0 32px;
  display: grid;
  align-content: center;
  gap: 24px;
}

body.dashboardMode .shell {
  width: min(1440px, calc(100% - 24px));
  padding: 12px 0;
  align-content: start;
}

.toast {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 20;
  width: min(420px, calc(100% - 36px));
  padding: 14px 16px;
  border-radius: 8px;
  color: #ffffff;
  background: var(--night);
  box-shadow: 0 14px 42px rgba(20, 27, 77, 0.28);
  font-weight: 700;
}

.globalLoadingIndicator {
  position: fixed;
  top: 18px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 30;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border-radius: 8px;
  background: rgba(20, 27, 77, 0.94);
  color: #ffffff;
  box-shadow: 0 16px 40px rgba(20, 27, 77, 0.24);
  font-weight: 700;
}

.loadingCursorPretzel {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 60;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  font-size: 24px;
  line-height: 1;
  pointer-events: none;
  transform: translate(-9999px, -9999px);
  animation: partnerSubmitSpinner 0.8s linear infinite;
}

body.cursorLoading {
  cursor: none;
}

body.cursorLoading * {
  cursor: none !important;
}

.globalLoadingSpinner {
  width: 20px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  animation: partnerSubmitSpinner 0.8s linear infinite;
}

.globalLoadingSpinner::before {
  content: "";
}

body.portalRedirecting .brand,
body.portalRedirecting .panel,
body.portalRedirecting #dashboardView,
body.portalRedirecting .appLayout {
  visibility: hidden;
}

.partnerSubmitModal {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(20, 27, 77, 0.36);
  backdrop-filter: blur(4px);
}

#appLoadingModal {
  z-index: 10050;
}

.partnerSubmitModalCard {
  position: relative;
  width: min(760px, 100%);
  padding: 28px 24px 22px;
  border: 1px solid rgba(215, 227, 238, 0.96);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 22px 56px rgba(20, 27, 77, 0.24);
  text-align: center;
}

.partnerSubmitModalClose {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 38px;
  height: 38px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(215, 227, 238, 0.96);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  font-size: 24px;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
}

.partnerSubmitModalClose:hover {
  background: var(--accent);
  color: #ffffff;
}

.partnerSubmitModalSpinner {
  width: 52px;
  height: 52px;
  margin: 0 auto 14px;
  display: grid;
  place-items: center;
  font-size: 34px;
  line-height: 1;
  animation: partnerSubmitSpinner 0.8s linear infinite;
}

.partnerSubmitModalCard h3 {
  margin: 0 0 10px;
  font-size: 28px;
  line-height: 1.15;
  color: var(--ink);
}

.partnerSubmitModalCard p {
  margin: 0;
  font-size: 18px;
  line-height: 1.45;
  color: var(--muted);
}

.partnerSubmitModalActions {
  margin-top: 22px;
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}

.partnerSubmitModalActions button {
  min-width: 188px;
}

.partnerSubmitPreview {
  margin-top: 18px;
  text-align: left;
}

.partnerSubmitPreviewPaper {
  border: 1px solid rgba(215, 227, 238, 0.98);
  border-radius: 8px;
  background: #f7fbff;
  padding: 18px;
}

.partnerSubmitPreviewHeader {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
  border-bottom: 1px solid rgba(207, 222, 236, 0.9);
  padding-bottom: 12px;
  margin-bottom: 12px;
}

.partnerSubmitPreviewHeader strong {
  color: var(--ink);
  font-size: 20px;
}

.partnerSubmitPreviewHeader span,
.partnerSubmitPreviewCosts small {
  color: var(--muted);
}

.partnerSubmitPreviewRows {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 16px;
}

.partnerSubmitPreviewRows div {
  border-bottom: 1px solid rgba(207, 222, 236, 0.72);
  padding-bottom: 8px;
}

.partnerSubmitPreviewRows span,
.partnerSubmitPreviewCosts span {
  display: block;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
}

.partnerSubmitPreviewRows strong {
  display: block;
  color: var(--ink);
  font-size: 16px;
  margin-top: 3px;
}

.partnerSubmitPreviewCosts {
  margin-top: 16px;
  border: 1px solid #bee7cf;
  border-radius: 8px;
  background: #eefaf1;
  padding: 14px;
}

.partnerSubmitPreviewCosts strong {
  display: block;
  color: #13773d;
  font-size: 30px;
  margin: 4px 0;
}

@media (max-width: 720px) {
  .partnerSubmitPreviewRows {
    grid-template-columns: 1fr;
  }

  .partnerSubmitPreviewHeader {
    display: block;
  }
}

.brand {
  position: relative;
  justify-self: center;
  width: min(920px, 100%);
  max-width: 720px;
  color: #ffffff;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.36);
}

body.dashboardMode .brand {
  display: none;
}

.hamburgerMenuButton,
.hamburgerMenuPanel {
  display: none !important;
}

.hamburgerMenuButton {
  position: absolute;
  top: 0;
  right: -320px;
  z-index: 12;
  width: 48px;
  height: 48px;
  display: grid;
  place-content: center;
  gap: 5px;
  border: 1px solid rgba(255, 255, 255, 0.38);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.16);
  box-shadow: 0 14px 34px rgba(20, 27, 77, 0.22);
  backdrop-filter: blur(12px);
}

.hamburgerMenuButton span {
  display: block;
  width: 22px;
  height: 2px;
  border-radius: 999px;
  background: #ffffff;
}

.hamburgerMenuButton:hover {
  background: rgba(255, 255, 255, 0.24);
}

.hamburgerMenuPanel {
  position: absolute;
  top: 56px;
  right: -320px;
  z-index: 13;
  width: min(260px, calc(100vw - 32px));
  padding: 8px;
  display: grid;
  gap: 4px;
  border: 1px solid rgba(215, 227, 238, 0.86);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 22px 48px rgba(20, 27, 77, 0.28);
  text-shadow: none;
}

.hamburgerMenuPanel button {
  width: 100%;
  min-height: 42px;
  padding: 10px 12px;
  border: 0;
  border-radius: 8px;
  color: var(--night);
  background: #ffffff;
  text-align: left;
  font-weight: 800;
}

.hamburgerMenuPanel button:hover {
  background: #eef7fd;
}

.hamburgerMenuGroup {
  display: grid;
  gap: 4px;
  padding: 4px 0 4px 10px;
  border-left: 2px solid var(--line);
}

.hamburgerMenuGroup button {
  color: var(--muted);
  font-size: 14px;
}

.brandLogo {
  width: min(330px, 82vw);
  height: auto;
  margin: 0 auto 26px;
  display: block;
}

.brand h1 {
  margin: 0;
  font-size: clamp(36px, 6vw, 72px);
  line-height: 1.02;
}

.brand p {
  margin: 14px 0 0;
  font-size: 19px;
}

.eyebrow,
.step {
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.panel {
  width: min(760px, 100%);
  max-width: 100%;
  padding: 28px;
  background: rgba(255, 255, 255, 0.98);
  border: 1px solid rgba(215, 227, 238, 0.95);
  border-radius: 8px;
  box-shadow: 0 22px 70px rgba(20, 27, 77, 0.28);
}

#dashboardView {
  width: 100%;
  min-height: calc(100vh - 24px);
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.appLayout {
  position: relative;
  display: grid;
  grid-template-columns: 288px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.sidebarRail {
  position: sticky;
  top: 12px;
  align-self: start;
  display: grid;
  height: fit-content;
  max-height: calc(100vh - 24px);
}

.appSidebar {
  position: relative;
  width: 100%;
  display: grid;
  gap: 6px;
  align-content: start;
  align-self: start;
  height: fit-content;
  max-height: calc(100vh - 24px);
  overflow-y: auto;
  overflow-x: visible;
  padding: 12px 16px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(9, 21, 73, 0.96), rgba(20, 27, 77, 0.94));
  box-shadow: 0 22px 50px rgba(4, 10, 35, 0.28);
  transition: width 180ms ease, transform 180ms ease, opacity 180ms ease;
}

.appContent {
  min-width: 0;
  max-width: 100%;
  overflow-x: hidden;
  display: grid;
  gap: 18px;
}

body.accountStandaloneView .appContent > :not(.dashboardHead):not(#accountView) {
  display: none !important;
}

body.accountStandaloneView #accountView {
  width: 100%;
  max-width: 100%;
  margin: 0;
}

body.partnerOrderStandaloneView .appContent > :not(.dashboardHead):not(#partnerOrderView) {
  display: none !important;
}

body.partnerOrderStandaloneView #partnerOrderView {
  width: 100%;
  max-width: 100%;
  margin: 0;
}

.authOverlayPanel {
  position: fixed;
  top: 20px;
  right: 20px;
  left: 340px;
  bottom: 20px;
  z-index: 24;
  overflow: auto;
  width: auto;
  margin: 0;
}

.modalCloseButton {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--ink);
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}

.modalCloseButton:hover {
  background: rgba(20, 27, 77, 0.08);
}

.sidebarTop {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 6px 10px;
  align-items: start;
}

.sidebarProfileCard {
  grid-column: 1 / -1;
  grid-row: 2;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  padding: 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.sidebarProfileCard,
.sidebarBrandMark {
  display: none !important;
}

.sidebarUserPhotoButton {
  width: 54px;
  height: 54px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  overflow: hidden;
  background: #d9e9f6;
  cursor: pointer;
}

.sidebarUserPhotoButton img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sidebarProfileText {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.sidebarProfileText strong {
  font-size: 16px;
  line-height: 1.2;
  color: #ffffff;
}

.sidebarProfileText span {
  color: rgba(255, 255, 255, 0.7);
  font-size: 13px;
}

.sidebarNotificationWrap {
  grid-column: 2;
  grid-row: 1;
  position: relative;
  justify-self: end;
}

.sidebarNotificationButton {
  position: relative;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  cursor: pointer;
}

.sidebarNotificationCount {
  position: absolute;
  top: -6px;
  right: -6px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #c61f14;
  color: #ffffff;
  font-size: 11px;
  font-weight: 800;
  display: grid;
  place-items: center;
}

.sidebarNotificationPanel {
  position: fixed;
  top: 72px;
  left: 340px;
  z-index: 10060;
  width: min(360px, 70vw);
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 18px 34px rgba(20, 27, 77, 0.18);
}

.notificationItem {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}

.notificationItemTopline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.notificationItemState {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 74px;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.notificationItem span {
  color: var(--muted);
  font-size: 13px;
}

.notificationItem small {
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}

.notificationItemUnread {
  border-color: rgba(66, 159, 224, 0.55);
  border-left: 4px solid #429fe0;
  background: #eef7fd;
  box-shadow: inset 0 0 0 1px rgba(66, 159, 224, 0.08);
}

.notificationItemUnread .notificationItemState {
  background: rgba(66, 159, 224, 0.14);
  color: #1c5f8f;
}

.notificationItemRead {
  background: #f2f5f8;
  border-color: rgba(20, 27, 77, 0.08);
  opacity: 0.78;
}

.notificationItemRead .notificationItemState {
  background: rgba(20, 27, 77, 0.08);
  color: rgba(20, 27, 77, 0.72);
}

.sidebarNotificationPanel {
  max-height: 360px;
  overflow-y: auto;
}

.notificationPanelHead {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 4px 2px 10px;
  background: inherit;
}

.notificationPanelHead strong {
  color: #ffffff;
  font-size: 14px;
}

.notificationPanelHead button {
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid rgba(72, 159, 223, .32);
  border-radius: 8px;
  color: #ffffff;
  background: rgba(72, 159, 223, .28);
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.notificationPanelHead button:hover:not(:disabled) {
  background: rgba(72, 159, 223, .44);
}

.notificationPanelHead button:disabled {
  opacity: .52;
  cursor: default;
}

body > .sidebarNotificationPanel {
  color: #fff;
  border: 1px solid rgba(72, 159, 223, .32);
  background:
    linear-gradient(145deg, rgba(8, 24, 51, .97), rgba(20, 27, 77, .9)),
    rgba(2, 9, 20, .92);
  box-shadow: 0 28px 86px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(255, 255, 255, .12);
  backdrop-filter: blur(22px) saturate(1.2);
  -webkit-backdrop-filter: blur(22px) saturate(1.2);
}

body > .sidebarNotificationPanel .notificationItem {
  color: #fff;
  border-color: rgba(255, 255, 255, .12);
  background: rgba(255, 255, 255, .08);
}

body > .sidebarNotificationPanel .notificationItem span,
body > .sidebarNotificationPanel .notificationItem small {
  color: rgba(255, 255, 255, .72);
}

.sidebarControls {
  grid-column: 3;
  grid-row: 1;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
}

.sidebarControlButton {
  min-height: 40px;
  padding: 0 12px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  font-weight: 700;
  cursor: pointer;
}

.sidebarPinButton {
  display: none !important;
}

.sidebarArrowButton {
  min-width: 40px;
  padding: 0 12px;
  display: grid;
  place-items: center;
  font-size: 18px;
  line-height: 1;
}

.sidebarControlButton span {
  display: block;
  width: 16px;
  height: 2px;
  margin: 3px 0;
  border-radius: 999px;
  background: currentColor;
}

.sidebarControlButton.isActive {
  border-color: rgba(66, 159, 224, 0.6);
  background: rgba(66, 159, 224, 0.16);
  color: #8fd3ff;
}

.sidebarInlineLogoutButton {
  width: auto;
  min-width: 0;
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 16px;
  background: transparent;
  color: rgba(255, 255, 255, 0.84);
  text-align: left;
  font-weight: 400;
  cursor: pointer;
  text-decoration: none;
}

.sidebarNav {
  display: grid;
  gap: 6px;
  align-content: start;
  padding-top: 14px;
  margin-top: 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.sidebarCustomerSearch {
  position: relative;
  display: grid;
  gap: 7px;
  margin-top: 12px;
}

.sidebarCustomerSearch label {
  color: rgba(255, 255, 255, .62);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.sidebarCustomerSearch input {
  width: 100%;
  min-height: 40px;
  padding: 0 12px;
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: 10px;
  color: #ffffff;
  background: rgba(2, 12, 32, .58);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
  font-weight: 400;
}

.sidebarCustomerSearch input::placeholder {
  color: rgba(255, 255, 255, .46);
}

.sidebarCustomerSearch input:focus {
  outline: none;
  border-color: rgba(72, 159, 223, .78);
  background: rgba(6, 18, 46, .86);
  box-shadow: 0 0 0 3px rgba(72, 159, 223, .16), inset 0 1px 0 rgba(255, 255, 255, .14);
}

.sidebarCustomerSearchResults {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 10070;
  display: grid;
  gap: 7px;
  max-height: min(340px, calc(100vh - 320px));
  overflow: auto;
  padding: 8px;
  border: 1px solid rgba(72, 159, 223, .3);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(8, 24, 51, .98), rgba(20, 27, 77, .94)),
    rgba(2, 9, 20, .96);
  box-shadow: 0 24px 70px rgba(2, 9, 28, .42), inset 0 1px 0 rgba(255, 255, 255, .12);
}

.sidebarCustomerSearchResults::-webkit-scrollbar {
  width: 8px;
}

.sidebarCustomerSearchResults::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(72, 159, 223, .58);
}

.sidebarCustomerSearchResults p {
  margin: 0;
  padding: 8px;
  color: rgba(255, 255, 255, .68);
  font-weight: 800;
}

.sidebarCustomerSearchResults button {
  display: grid;
  gap: 5px;
  width: 100%;
  min-width: 0;
  padding: 10px 12px 10px 14px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-left: 4px solid rgba(72, 159, 223, .78);
  border-radius: 8px;
  color: #ffffff;
  background: rgba(255, 255, 255, .08);
  box-shadow: 0 14px 34px rgba(3, 9, 28, .14);
  text-align: left;
  cursor: pointer;
}

.sidebarCustomerSearchResults button:hover {
  border-color: rgba(72, 159, 223, .42);
  border-left-color: rgba(72, 159, 223, .95);
  background: linear-gradient(135deg, rgba(72, 159, 223, .24), rgba(72, 159, 223, .1));
}

.sidebarCustomerSearchResults strong {
  color: #ffffff;
  min-width: 0;
  font-size: 14px;
  line-height: 1.15;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebarCustomerSearchResults span {
  color: rgba(255, 255, 255, .72);
  min-width: 0;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.25;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.sidebarSection {
  display: grid;
  gap: 4px;
}

.sidebarSectionTitle {
  font-size: 16px;
  font-weight: 400;
  text-transform: none;
  color: #ffffff;
}

.sidebarSectionTitleButton {
  width: 100%;
  min-height: 38px;
  padding: 0 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  text-align: left;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.sidebarSectionTitleButton:hover {
  background: rgba(255, 255, 255, 0.08);
}

.sidebarSectionChevron {
  flex: 0 0 auto;
  width: 9px;
  height: 9px;
  border-right: 2px solid rgba(255, 255, 255, 0.72);
  border-bottom: 2px solid rgba(255, 255, 255, 0.72);
  transform: rotate(-45deg);
  transition: transform 0.18s ease;
}

.sidebarSection.isExpanded .sidebarSectionChevron {
  transform: rotate(45deg);
}

.sidebarSectionItems {
  display: grid;
  gap: 2px;
  padding-left: 10px;
}

.sidebarSectionItems[hidden] {
  display: none !important;
}

.sidebarNavButton {
  width: 100%;
  min-height: 42px;
  padding: 0 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: rgba(255, 255, 255, 0.84);
  text-align: left;
  display: flex;
  align-items: center;
  gap: 0;
  font-weight: 400;
  cursor: pointer;
}

.sidebarNavButton:hover {
  background: rgba(255, 255, 255, 0.08);
}

.sidebarNavDot {
  display: none;
}

.sidebarNavBadge {
  flex: 0 0 auto;
  min-width: 22px;
  height: 22px;
  padding: 0 7px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  margin-left: auto;
  color: #ffffff;
  background: #c61f14;
  border: 1px solid rgba(255, 255, 255, 0.34);
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 8px 18px rgba(198, 31, 20, 0.22);
}

.sidebarFooter {
  margin-top: auto;
  display: grid;
  gap: 8px;
  padding-top: 12px;
  border-top: 1px solid rgba(72, 159, 223, 0.22);
}

.sidebarFooterRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}

.sidebarFooterButton {
  width: 100%;
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  text-align: left;
  font-weight: 400;
  cursor: pointer;
}

.sidebarLogoutButton {
  color: var(--danger);
}

.sidebarBrandMark {
  padding-top: 6px;
  display: grid;
  place-items: center;
}

.sidebarBrandMark img {
  width: 82px;
  height: 82px;
  padding: 6px;
  border-radius: 999px;
  background: #ffffff;
  box-shadow: 0 8px 22px rgba(4, 10, 35, 0.16);
  object-fit: contain;
  opacity: 0.92;
}

.sidebarBackdrop {
  display: none;
}

.mobileSidebarButton {
  display: none;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid #d8e5f0;
  border-radius: 8px;
  background: #ffffff;
  cursor: pointer;
}

.mobileSidebarButton span {
  display: block;
  width: 18px;
  height: 2px;
  margin: 4px auto;
  border-radius: 999px;
  background: var(--ink);
}

.dashboardHeadModern {
  padding: 24px 26px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(246, 250, 253, 0.95));
  box-shadow: 0 18px 42px rgba(4, 10, 35, 0.16);
}

.dashboardHeadModern .dashboardActions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

body.sidebarCollapsed .appLayout {
  grid-template-columns: 72px minmax(0, 1fr);
}

body.sidebarCollapsed .sidebarRail {
  position: sticky;
  top: 12px;
  left: auto;
  z-index: 4;
  width: 72px;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
  pointer-events: none;
}

body.sidebarCollapsed .appSidebar {
  position: relative;
  width: 72px;
  max-height: none;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

body.sidebarCollapsed .sidebarTop,
body.sidebarCollapsed .sidebarNav,
body.sidebarCollapsed .sidebarFooter {
  display: block;
}

body.sidebarCollapsed .sidebarNav {
  padding-top: 0;
  margin-top: 0;
  border-top: 0;
}

body.sidebarCollapsed .sidebarSectionTitle,
body.sidebarCollapsed .sidebarNavLabel,
body.sidebarCollapsed .sidebarProfileText,
body.sidebarCollapsed .sidebarFooterButton {
  display: none;
}

body.sidebarCollapsed .sidebarProfileCard,
body.sidebarCollapsed .sidebarInlineLogoutButton,
body.sidebarCollapsed .sidebarInlineAdminPortalButton,
body.sidebarCollapsed .sidebarBrandMark,
body.sidebarCollapsed .sidebarCustomerSearch,
body.sidebarCollapsed .sidebarNotificationWrap {
  display: none;
}

body.sidebarCollapsed .sidebarControls {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0;
  width: auto;
  margin: 0;
  pointer-events: auto;
}

body.sidebarCollapsed .sidebarNavButton {
  justify-content: center;
  padding: 0;
}

body.sidebarCollapsed .sidebarFooter {
  justify-items: center;
  margin-top: auto;
}

body.sidebarCollapsed .sidebarFooterButton {
  display: none;
}

body.sidebarCollapsed .sidebarArrowButton {
  display: grid;
  position: sticky;
  top: 12px;
  left: auto;
  margin-left: 24px;
  z-index: 5;
  width: 42px;
  min-width: 42px;
  height: 42px;
  padding: 0;
  border-radius: 8px;
  border-color: rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
  font-size: 18px;
  box-shadow: none;
  pointer-events: auto;
}

body.partnerProjectsOnly #customerListBackButton {
  display: none !important;
}

#partnerProjectsPanel {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  align-items: start;
}

#partnerProjectsIntro .step {
  display: none;
}

body.partnerDashboardHome .dashboardHeadModern {
  display: grid;
  grid-template-columns: minmax(520px, 1fr) 220px;
  grid-template-areas:
    "identity identity"
    "advisor photo";
  align-items: stretch;
  gap: 18px;
}

body.partnerDashboardHome .dashboardIdentity {
  grid-area: identity;
  gap: 16px;
  min-width: 0;
  align-content: start;
  align-items: start;
}

body.partnerDashboardHome .advisorCard {
  grid-area: advisor;
  align-self: stretch;
  min-height: 220px;
  margin-top: 0;
  height: 220px;
  width: 100%;
  min-width: 0;
  padding: 18px 22px;
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  align-items: center;
}

body.partnerDashboardHome .dashboardActions {
  display: none;
}

body.partnerDashboardHome #partnerOrderDetailBox,
body.partnerDashboardHome #partnerActionBox,
body.partnerDashboardHome .tableWrap,
body.partnerDashboardHome #emptyState,
body.partnerDashboardHome #customerListBackButton {
  display: none !important;
}

body.partnerDashboardHome #partnerProjectsPanel {
  display: grid !important;
}

body.partnerDashboardHome .employeePhotoButton {
  grid-area: photo;
  width: 220px;
  height: 220px;
  max-width: 100%;
  aspect-ratio: auto;
  justify-self: end;
  align-self: stretch;
}

body.partnerDashboardHome .advisorCard img {
  width: 112px;
  height: 112px;
  border-radius: 8px;
  flex: 0 0 112px;
}

body.partnerDashboardHome .advisorCard strong {
  font-size: 24px;
  line-height: 1.05;
}

body.partnerDashboardHome .advisorCard span {
  font-size: 16px;
}

body.partnerDashboardHome .advisorCard small {
  font-size: 16px;
  line-height: 1.35;
}

body.partnerDashboardHome .advisorCard > div {
  min-width: 0;
}

@media (max-width: 980px) {
  body.profileStandaloneView #profileView .profileEditor {
    grid-template-columns: 1fr;
  }

  body.dashboardMode .shell {
    width: min(100%, calc(100% - 18px));
    padding: 10px 0 18px;
  }

  .appLayout {
    grid-template-columns: minmax(0, 1fr);
  }

  .sidebarRail {
    position: fixed;
    top: 10px;
    left: 10px;
    bottom: 10px;
    z-index: 30;
    width: min(310px, calc(100vw - 20px));
    min-height: auto;
    max-height: none;
    transform: translateX(calc(-100% - 20px));
  }

  .appSidebar {
    max-height: calc(100vh - 20px);
  }

  body.sidebarOpen .sidebarRail {
    transform: translateX(0);
  }

  .sidebarBackdrop {
    position: fixed;
    inset: 0;
    z-index: 29;
    display: block;
    background: rgba(20, 27, 77, 0.34);
  }

  .sidebarControls {
    display: none;
  }

  .sidebarPinButton {
    display: none;
  }

  .appContent {
    width: 100%;
  }

  .dashboardHeadModern {
    padding: 18px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
  }

  .authOverlayPanel {
    left: 10px;
    right: 10px;
    top: 72px;
    bottom: 10px;
  }

  .mobileSidebarButton {
    display: block;
    justify-self: end;
    align-self: start;
    margin-left: 12px;
  }

  .dashboardIdentity {
    min-width: 0;
  }
}

.choiceGrid {
  display: grid;
  grid-template-columns: repeat(var(--choice-count, 3), minmax(0, 1fr));
  gap: 16px;
}

#choiceView[data-choice-count="2"] {
  width: min(720px, calc(100vw - 32px));
}

#choiceView[data-choice-count="1"] {
  width: min(360px, calc(100vw - 32px));
}

body.portalHub .shell {
  width: min(1120px, calc(100% - 32px));
}

body.portalHub #choiceView {
  width: min(860px, calc(100vw - 32px));
  padding: 24px;
}

body.portalHub #choiceView::before {
  content: "";
  display: block;
  min-height: 190px;
  margin: 0 0 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background:
    linear-gradient(90deg, rgba(20, 31, 77, 0.88), rgba(46, 149, 214, 0.2)),
    url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center / cover;
}

body.portalHub .choiceGrid {
  --choice-count: 2;
}

.portalHubButton {
  min-height: 112px;
  display: grid;
  align-content: center;
  gap: 6px;
  text-align: left;
  padding: 20px 22px;
}

.portalHubButton span {
  font-size: 22px;
  font-weight: 800;
}

.portalHubButton small {
  font-size: 14px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.86);
  line-height: 1.35;
}

.choiceButton,
.loginForm button,
.secondaryButton {
  min-height: 48px;
  min-width: 112px;
  padding: 0 18px;
  border: 0;
  border-radius: 8px;
  color: #ffffff;
  background: var(--accent);
  cursor: pointer;
  font-weight: 700;
}

.choiceButton:hover,
.loginForm button:hover,
.secondaryButton:hover {
  background: var(--accent-strong);
}

.dangerButton {
  min-height: 48px;
  margin-top: 12px;
  border: 0;
  border-radius: 8px;
  color: #ffffff;
  background: var(--danger);
  cursor: pointer;
  font-weight: 700;
}

.dangerButton:hover {
  background: #8f1d15;
}

.loginLinks {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.loginForm,
.recommendationForm,
.noticeBox {
  display: grid;
  gap: 16px;
}

.loginForm label,
.recommendationForm label,
.noticeBox label {
  display: grid;
  gap: 7px;
  color: var(--muted);
  font-weight: 700;
}

.loginForm input,
.noticeBox input,
.recommendationForm input,
.recommendationForm select,
.recommendationForm textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 13px;
  background: var(--field);
  color: var(--ink);
}

.loginForm input,
.noticeBox input,
.recommendationForm input,
.recommendationForm select {
  min-height: 46px;
}

.recommendationForm textarea {
  min-height: 108px;
  padding-top: 12px;
  resize: vertical;
}

.loginForm input:focus,
.noticeBox input:focus,
.recommendationForm input:focus,
.recommendationForm select:focus,
.recommendationForm textarea:focus {
  outline: 3px solid rgba(15, 124, 99, 0.2);
  border-color: var(--accent);
}

.addressLookupField {
  position: relative;
}

.addressLookupInlineSpinner {
  position: absolute;
  top: 36px;
  right: 12px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 8px 18px rgba(20, 27, 77, 0.12);
  font-size: 16px;
  line-height: 1;
  animation: pretzelSpin 1s linear infinite;
  pointer-events: none;
}

.addressSuggestionDropdown {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 8;
  display: grid;
  gap: 4px;
  max-height: 220px;
  overflow: auto;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 18px 34px rgba(20, 27, 77, 0.18);
}

.addressSuggestionOption {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid transparent;
  border-radius: 8px;
  appearance: none !important;
  -webkit-appearance: none !important;
  background: #ffffff;
  color: #111111;
  text-align: left;
  cursor: pointer;
  display: grid;
  gap: 2px;
  box-shadow: none;
  text-shadow: none;
  -webkit-tap-highlight-color: transparent !important;
  -webkit-text-fill-color: #111111;
}

.addressSuggestionOption:hover,
.addressSuggestionOption:focus,
.addressSuggestionOption:active {
  background: #f5f9fc;
  color: #111111;
  -webkit-text-fill-color: #111111;
  outline: none;
  border-color: var(--line);
}

.addressSuggestionOption strong {
  font-size: 14px;
  color: #111111;
  -webkit-text-fill-color: #111111;
}

.addressSuggestionOption span {
  color: #111111;
  -webkit-text-fill-color: #111111;
  font-size: 13px;
  font-weight: 500;
}

.addressSuggestionOption strong,
.addressSuggestionOption span {
  pointer-events: none;
}

.linkButton {
  border: 0;
  min-height: 38px;
  padding: 8px 10px;
  margin-bottom: 18px;
  background: transparent;
  color: var(--mid);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

.inlineLink {
  min-height: auto;
  width: fit-content;
  padding: 0;
  margin-bottom: 0;
  border-radius: 0;
  background: transparent;
  color: var(--mid);
  box-shadow: none;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.loginForm .inlineLink,
.loginForm .inlineLink:hover {
  min-height: auto;
  min-width: 0;
  padding: 0;
  color: var(--mid);
  background: transparent;
  font-weight: 800;
}

.error {
  min-height: 22px;
  color: var(--danger);
  font-weight: 700;
}

.dashboardHead {
  display: flex;
  align-items: start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 22px;
}

.adminImpersonationBanner {
  margin: -8px 0 24px;
  padding: 12px 16px;
  border: 1px solid rgba(20, 31, 107, 0.18);
  border-radius: 8px;
  background: #fff8df;
  color: var(--night);
  font-weight: 700;
}

.dashboardIdentity {
  display: grid;
  gap: 14px;
  min-width: min(330px, 100%);
}

.advisorCard {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: min(280px, 100%);
  max-width: 100%;
  min-height: 160px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
}

.advisorCard img {
  width: 84px;
  height: 84px;
  object-fit: cover;
  border-radius: 8px;
}

.advisorCard span {
  display: block;
  color: var(--muted);
  font-size: 18px;
}

.advisorCard strong {
  display: block;
  font-size: 28px;
  line-height: 1.1;
}

.advisorCard small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.employeePhotoButton {
  width: min(420px, 100%);
  height: auto;
  aspect-ratio: 1;
  padding: 0;
  border: 2px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
  cursor: pointer;
  overflow: hidden;
}

.employeePhotoButton:hover {
  border-color: var(--accent);
}

.employeePhotoButton img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.dashboardActions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: end;
}

.dashboardHead h2,
#loginTitle {
  margin: 0 0 22px;
  font-size: 30px;
}

.secondaryButton {
  padding: 0 18px;
  background: var(--night);
}

.ghostButton {
  background: var(--accent);
}

.ghostButton:hover {
  background: var(--night);
}

.creditSummary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}

.creditSummary div {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
}

.creditSummary span {
  display: block;
  color: var(--muted);
  font-weight: 700;
  margin-bottom: 8px;
}

.creditSummary strong {
  display: block;
  color: var(--night);
  font-size: 30px;
}

.adminSummary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 14px;
  align-items: stretch;
  margin-bottom: 22px;
}

.adminMetric {
  display: grid;
  gap: 6px;
  width: 100%;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
  color: var(--ink);
  cursor: pointer;
  text-align: left;
}

.adminMetric span,
.adminMetric small {
  color: var(--muted);
  font-weight: 700;
}

.adminMetric strong {
  color: var(--night);
  font-size: 34px;
}

.adminMetric:hover {
  border-color: var(--accent);
}

.accountingMetric {
  cursor: default;
}

.accountingMetric:hover {
  border-color: var(--line);
}

.accountingList {
  display: grid;
  gap: 14px;
  margin-top: 20px;
}

.accountingInvoiceCard {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(180px, 0.7fr) minmax(220px, auto);
  gap: 18px;
  align-items: center;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
}

.accountingInvoiceMain,
.accountingInvoiceAmount {
  display: grid;
  gap: 4px;
}

.accountingInvoiceMain span,
.accountingInvoiceMain small,
.accountingInvoiceAmount small {
  color: var(--muted);
  font-weight: 800;
}

.accountingInvoiceMain strong,
.accountingInvoiceAmount strong {
  color: var(--night);
  font-size: 1.35rem;
}

.accountingInvoiceMain p {
  margin: 0;
  color: var(--ink);
  font-weight: 800;
}

.accountingInvoiceActions {
  display: grid;
  gap: 8px;
}

.dangerSoftButton {
  background: #fff1f1;
  border-color: #f2c5c5;
  color: #9f1f17;
}

.upcomingAppointments {
  display: grid;
  gap: 12px;
  margin-bottom: 22px;
}

.appointmentList {
  display: grid;
  gap: 10px;
}

.montageProtocolNotice {
  width: fit-content;
  padding: 5px 9px;
  border-radius: 8px;
  color: rgba(255, 255, 255, 0.9);
  background: rgba(72, 159, 223, 0.18);
  border: 1px solid rgba(72, 159, 223, 0.34);
}

.montageProtocolNotice.isUnread {
  color: #ffffff;
  background: linear-gradient(135deg, rgba(72, 159, 223, 0.9), rgba(20, 27, 77, 0.88));
  box-shadow: 0 10px 24px rgba(72, 159, 223, 0.18);
}

.orderStatusDone,
.orderStatusOpen {
  width: fit-content;
  padding: 6px 9px;
  border-radius: 8px;
  font-style: normal;
  font-weight: 800;
}

.statisticsPanel {
  display: grid;
  gap: 18px;
  margin-bottom: 22px;
}

.statisticsContent {
  display: grid;
  gap: 18px;
}

.statisticsHero,
.statisticsGrid,
.statisticsColumns,
.statisticsMiniGrid {
  display: grid;
  gap: 14px;
}

.statisticsHero {
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.statisticsHero > div,
.statCard,
.statisticsBlock,
.miniStat,
.insightList article {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
}

.statisticsHero > div {
  display: grid;
  gap: 8px;
  padding: 22px;
}

.statisticsHero span,
.statCard span,
.miniStat span {
  color: var(--muted);
  font-weight: 800;
}

.statisticsHero strong {
  color: var(--night);
  font-size: 42px;
  line-height: 1;
}

.statisticsHero p {
  margin: 0;
  color: var(--muted);
  font-weight: 700;
}

.statisticsGrid {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
}

.statCard {
  display: grid;
  gap: 6px;
  padding: 18px;
}

.statCard strong {
  color: var(--night);
  font-size: 30px;
}

.statCard small {
  color: var(--muted);
  font-weight: 700;
}

.statisticsColumns {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.statisticsBlock {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.statisticsBlock h4 {
  margin: 0;
  color: var(--night);
  font-size: 20px;
}

.statisticsMiniGrid {
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
}

.miniStat {
  display: grid;
  gap: 4px;
  padding: 14px;
  background: var(--surface);
}

.miniStat strong {
  color: var(--night);
  font-size: 26px;
}

.insightList {
  display: grid;
  gap: 10px;
}

.insightList article {
  padding: 14px;
  background: var(--surface);
}

.insightList strong {
  color: var(--night);
}

.insightList p {
  margin: 5px 0 0;
  color: var(--muted);
  font-weight: 700;
}

.statisticsTableWrap {
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.statisticsTable {
  width: 100%;
  min-width: 680px;
  border-collapse: collapse;
}

.statisticsTable th,
.statisticsTable td {
  padding: 13px 14px;
  border-bottom: 1px solid var(--line);
  text-align: left;
}

.statisticsTable th {
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
}

.statisticsTable td {
  color: var(--ink);
  font-weight: 700;
}

.orderStatusDone {
  color: var(--paid);
  background: #eaf8ee;
}

.orderStatusOpen {
  color: #9b1c1c;
  background: #feecec;
}

.bigInviteButton {
  width: 100%;
  min-height: 64px;
  margin: 0;
  padding: 0 22px;
  border: 0;
  border-radius: 8px;
  color: #ffffff;
  background: var(--accent);
  cursor: pointer;
  font-size: 18px;
  font-weight: 700;
}

.bigInviteButton.hidden {
  display: none;
}

.bigInviteButton:hover {
  background: var(--accent-strong);
}

.payoutButton {
  margin-bottom: 22px;
  background: var(--paid);
}

.payoutButton:hover {
  background: #176642;
}

.customerListBackButton {
  display: inline-flex;
  width: fit-content;
  margin: 0 0 18px;
}

.customerActionBox {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(240px, 0.75fr);
  gap: 18px;
  align-items: center;
  margin-bottom: 22px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: linear-gradient(135deg, #ffffff, #f2f8fd);
}

.customerActionBox span {
  display: block;
  margin-bottom: 8px;
  color: var(--mid);
  font-weight: 700;
  text-transform: uppercase;
  font-size: 13px;
}

.customerActionBox strong {
  display: block;
  margin-bottom: 8px;
  color: var(--night);
  font-size: 26px;
}

.customerActionBox p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.customerActionButtons {
  display: grid;
  gap: 10px;
}

.recommendationForm {
  margin-bottom: 22px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
}

.noticeBox,
.reviewBox {
  margin-bottom: 22px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
}

.noticeBox h3,
.reviewBox h3 {
  margin: 0 0 8px;
  font-size: 22px;
}

.noticeBox p,
.reviewBox p {
  margin: 0;
}

.alignEnd {
  align-self: end;
}

#partnerNameSuggestionControls,
#partnerAddressSuggestionControls {
  grid-column: 1 / -1;
  margin-top: -6px;
}

#partnerNameSuggestionControls select,
#partnerAddressSuggestionControls select {
  min-height: 48px;
}

.visuallyHidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.noticeBox button[type="submit"],
.reviewButton {
  min-height: 48px;
  border: 0;
  border-radius: 8px;
  color: #ffffff;
  background: var(--accent);
  cursor: pointer;
  font-weight: 700;
}

.noticeBox button[type="submit"] {
  width: fit-content;
  padding: 0 18px;
}

.reviewBox {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

#partnerOrderDetailBox {
  display: grid;
  align-items: stretch;
  justify-content: stretch;
  gap: 18px;
}

.reviewActions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: end;
}

.reviewModalOverlay {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(7, 13, 40, 0.72);
}

.reviewModalOverlay.hidden {
  display: none;
}

.reviewModalOverlay.calendarEditOverlayAnchored {
  display: block;
  padding: 0;
}

.reviewModalOverlay.calendarEditOverlayAnchored .montageCalendarEditModal {
  position: fixed;
  top: var(--montage-calendar-edit-top, 24px);
  left: 50%;
  transform: translateX(-50%);
  margin: 0;
}

.reviewModal,
.reonicChangeModal {
  position: relative;
  width: min(980px, calc(100vw - 32px));
  max-height: calc(100vh - 40px);
  overflow: auto;
  display: grid;
  gap: 16px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
}

.reviewModal iframe {
  width: 100%;
  min-height: min(620px, 58vh);
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.reviewModalActions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.reviewModalActions > * {
  min-height: 46px;
  display: inline-grid;
  place-items: center;
  text-align: center;
  text-decoration: none;
}

.orderChangeBox {
  display: grid;
  gap: 12px;
}

.orderChangeOpen {
  padding: 12px;
  border: 1px solid #f5c979;
  border-radius: 8px;
  background: #fff7e8;
  color: #8a4c00;
  font-weight: 800;
}

.orderChangeList {
  display: grid;
  gap: 8px;
}

.orderChangeListCompact {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.orderChangeList article {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.orderChangeListCompact article p {
  margin: 4px 0 0;
}

.orderChangeActions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.dangerLinkButton {
  border-color: #f0c4be;
  background: #fff4f2;
  color: #b52217;
}

.signedChangeLink {
  background: #e9f8ef;
  color: #177a3f;
  border: 1px solid #bce8c9;
  border-radius: 8px;
  padding-inline: 12px;
}

.reonicChangeWizard {
  display: grid;
  gap: 12px;
}

.reonicChangeChecklist {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.reonicChangeChecklist legend {
  padding: 0 8px;
  color: var(--night);
  font-weight: 900;
}

.reonicChangeCheck {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f5f9fd;
  font-weight: 800;
}

.reonicChangeSections {
  display: grid;
  gap: 10px;
}

.reonicChangeSection {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.reonicChangeSection > div:first-child {
  display: grid;
  gap: 4px;
}

.reonicChangeSection strong,
.reonicChangeSection input {
  min-width: 0;
  overflow-wrap: anywhere;
}

.reonicChangeSection span {
  color: var(--muted);
  font-weight: 800;
}

.reonicChangeSection [hidden] {
  display: none !important;
}

.reonicChangeChoiceRow {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.reonicChangeDescriptionLabel {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-weight: 900;
}

.reonicChangeDescriptionLabel textarea {
  width: 100%;
  min-height: 132px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--night);
  font: inherit;
  resize: vertical;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.partnerHomeActionGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.partnerHomeActionCard {
  display: grid;
  gap: 8px;
  min-height: 132px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--night);
  text-align: left;
  cursor: pointer;
}

.partnerHomeActionCard:hover {
  border-color: var(--accent);
  box-shadow: 0 12px 30px rgba(14, 89, 138, 0.14);
}

.partnerHomeActionCard span {
  color: var(--accent);
  font-weight: 900;
  text-transform: uppercase;
  font-size: 0.8rem;
}

.partnerHomeActionCard strong {
  font-size: 1.15rem;
}

.partnerAdminDetailBox {
  align-items: start;
}

body.adminPartnerCompact .appContent {
  gap: 0;
}

body.adminPartnerCompact.partnerProjectsOnly #partnerProjectsPanel.reviewBox {
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body.adminPartnerCompact.partnerProjectsOnly #partnerProjectsPanel.reviewBox::before {
  display: none !important;
}

body.adminPartnerOverviewOnly #partnerOrderDetailBox,
body.adminPartnerOverviewOnly #partnerAdminDetailBox,
body.adminPartnerOverviewOnly #partnerActionBox,
body.adminPartnerOverviewOnly #partnerProjectsPanel,
body.adminPartnerOverviewOnly .tableWrap,
body.adminPartnerOverviewOnly #emptyState {
  display: none !important;
}

body.partnerOrderDetailOnly #partnerAdminOverviewPanel,
body.partnerOrderDetailOnly #partnerAdminDetailBox,
body.partnerOrderDetailOnly #partnerActionBox,
body.partnerOrderDetailOnly #partnerProjectsPanel,
body.partnerOrderDetailOnly #partnerProjectsCards,
body.partnerOrderDetailOnly #partnerProjectsIntro,
body.partnerOrderDetailOnly .dashboardHead,
body.partnerOrderDetailOnly .tableWrap,
body.partnerOrderDetailOnly #emptyState {
  display: none !important;
}

body.partnerAdminEditOnly:not(.roleAdmin) .dashboardHead,
body.partnerAdminEditOnly #adminSummary,
body.partnerAdminEditOnly #employeeSummary,
body.partnerAdminEditOnly #upcomingAppointments,
body.partnerAdminEditOnly #adminStatisticsPanel,
body.partnerAdminEditOnly #creditSummary,
body.partnerAdminEditOnly #customerActionBox,
body.partnerAdminEditOnly #partnerActionBox,
body.partnerAdminEditOnly #partnerProjectsPanel,
body.partnerAdminEditOnly #partnerOrderDetailBox,
body.partnerAdminEditOnly #partnerAdminDetailBox,
body.partnerAdminEditOnly #partnerAdminOverviewPanel,
body.partnerAdminEditOnly .tableWrap,
body.partnerAdminEditOnly #emptyState,
body.partnerAdminEditOnly #reviewBox,
body.partnerAdminEditOnly #customerDetailBox,
body.partnerAdminEditOnly #reonicOrdersPanel,
body.partnerAdminEditOnly #reonicOrderDetailPanel,
body.partnerAdminEditOnly #newCustomerButton,
body.partnerAdminEditOnly #requestPayoutButton {
  display: none !important;
}

body.adminPartnerProfileOnly:not(.roleAdmin) .dashboardHead,
body.adminPartnerProfileOnly #adminSummary,
body.adminPartnerProfileOnly #employeeSummary,
body.adminPartnerProfileOnly #upcomingAppointments,
body.adminPartnerProfileOnly #adminStatisticsPanel,
body.adminPartnerProfileOnly #emailAutomationPanel,
body.adminPartnerProfileOnly #creditSummary,
body.adminPartnerProfileOnly #customerActionBox,
body.adminPartnerProfileOnly #partnerActionBox,
body.adminPartnerProfileOnly #partnerProjectsPanel,
body.adminPartnerProfileOnly #partnerOrderDetailBox,
body.adminPartnerProfileOnly #partnerAdminOverviewPanel,
body.adminPartnerProfileOnly .tableWrap,
body.adminPartnerProfileOnly #emptyState,
body.adminPartnerProfileOnly #reviewBox,
body.adminPartnerProfileOnly #customerDetailBox,
body.adminPartnerProfileOnly #reonicOrdersPanel,
body.adminPartnerProfileOnly #reonicOrderDetailPanel,
body.adminPartnerProfileOnly #newCustomerButton,
body.adminPartnerProfileOnly #requestPayoutButton {
  display: none !important;
}

body.adminPartnerProfileOnly #partnerAdminDetailBox {
  display: grid !important;
}

body.partnerProjectsOnly:not(.roleAdmin) .dashboardHead,
body.partnerProjectsOnly #partnerActionBox,
body.partnerProjectsOnly #partnerOrderDetailBox {
  display: none !important;
}

body.roleCustomer #partnerActionBox,
body.roleCustomer #partnerProjectsPanel,
body.roleCustomer #partnerOrderDetailBox,
body.roleCustomer #partnerAdminDetailBox,
body.roleCustomer #partnerAdminOverviewPanel,
body.roleCustomer #partnerAdminEditForm,
body.roleCustomer .sidebarNotificationWrap,
body.roleEmployee:not(.roleAdmin) #partnerActionBox,
body.roleEmployee:not(.roleAdmin) #partnerProjectsPanel,
body.roleEmployee:not(.roleAdmin) #partnerOrderDetailBox,
body.roleEmployee:not(.roleAdmin) #partnerAdminDetailBox,
body.roleEmployee:not(.roleAdmin) #partnerAdminOverviewPanel,
body.roleEmployee:not(.roleAdmin) #partnerAdminEditForm,
body.roleEmployee:not(.roleAdmin) .sidebarNotificationWrap {
  display: none !important;
}

.partnerProjectsCards {
  display: grid;
  gap: 14px;
}

.partnerProjectsHeader {
  padding: 0 24px;
}

.partnerProjectCard {
  position: relative;
  width: 100%;
  padding: 20px 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}

.partnerProjectCard:hover {
  background: #f8fbfe;
}

.partnerProjectStatusTag {
  display: inline-flex;
  width: fit-content;
  margin-top: 6px;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(31, 111, 235, 0.14);
  color: #1f6feb;
  font-size: 0.78rem;
  font-weight: 800;
}

.partnerProjectHoverPreview {
  position: absolute;
  top: 12px;
  right: 12px;
  left: auto;
  z-index: 24;
  width: min(360px, calc(100vw - 120px));
  display: none !important;
  gap: 10px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 18px 40px rgba(12, 20, 58, 0.18);
  pointer-events: none;
  overflow-wrap: anywhere;
  word-break: normal;
}

.partnerPriceRuleGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ap-gap-default);
}

.partnerPriceRuleSection .partnerPriceRuleGrid,
.partnerPriceRuleSection .partnerPriceRuleGrid label {
  display: grid;
}

.partnerPriceRuleSection {
  display: grid;
  gap: var(--ap-section-gap);
  padding: var(--ap-card-padding);
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
}

.partnerPriceRuleSectionHead {
  display: grid;
  gap: 4px;
}

.partnerPriceRuleSectionHead h4 {
  margin: 0;
  font-size: 18px;
  color: var(--night);
}

.partnerPriceRuleSectionHead p {
  margin: 0;
  color: var(--muted);
}

.partnerProjectHoverPreview strong {
  color: var(--night);
  font-size: 16px;
}

.partnerProjectHoverGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 14px;
}

.partnerProjectHoverItem {
  display: grid;
  gap: 2px;
}

.partnerProjectHoverItem span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.partnerProjectHoverItem b {
  color: var(--ink);
  font-size: 14px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.partnerProjectMain {
  display: grid;
  grid-template-columns: .85fr 1.05fr 2.35fr 1.35fr 1.05fr 1.55fr .95fr .85fr;
  gap: 18px;
  align-items: start;
}

.partnerProjectField {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.partnerProjectField > strong,
.partnerProjectField > span:not(.partnerProjectLabel):not(.partnerProjectSortableLabel):not(.reviewStatus) {
  display: block;
  width: 100%;
  min-width: 0;
  text-align: left;
  line-height: 1.15;
  overflow-wrap: break-word;
  word-break: normal;
}

.partnerProjectField > .reviewStatus {
  justify-self: start;
}

.partnerProjectLabel {
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
  color: var(--muted);
}

.partnerProjectLabelInline {
  display: none;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  color: var(--muted);
}

.partnerProjectSortableLabel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.partnerProjectSortControls {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.partnerProjectSortButton {
  border: 0;
  background: transparent;
  color: var(--muted);
  padding: 0;
  min-width: auto;
  min-height: auto;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
}

.partnerProjectSortButton:hover,
.partnerProjectSortButton.active {
  color: var(--night);
}

.partnerAdminOverviewPanel {
  display: grid;
  gap: 16px;
}

.partnerAdminOverviewHead h3 {
  margin: 0;
  font-size: 28px;
  color: var(--night);
}

.partnerAdminOverviewList {
  display: grid;
  gap: 18px;
}

.partnerAdminSortBar {
  display: flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
  color: var(--muted);
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
}

.partnerAdminDetailMain {
  flex: 1 1 520px;
  min-width: 0;
}

.partnerAdminDetailHeader {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.partnerAdminDetailLogo {
  width: 92px;
  height: 92px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: #ffffff;
}

.partnerAdminDetailBox .reviewActions {
  align-self: stretch;
}

.partnerAdminDetailPriceSummary {
  margin-top: 14px;
}

.partnerAdminDetailOverview {
  display: grid;
  gap: var(--ap-space-xs);
  margin-top: var(--ap-space-md);
}

.partnerAdminDetailOverview p {
  margin: 0;
  color: var(--portal-muted);
  font-weight: 750;
}

.partnerAdminStatsList {
  display: grid;
  gap: 0;
  margin-top: var(--ap-section-gap);
  border-block: 1px solid rgba(140, 174, 211, .16);
}

.partnerAdminStatRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: var(--ap-gap-default);
  padding-block: var(--ap-space-sm);
  border-bottom: 1px solid rgba(140, 174, 211, .12);
}

.partnerAdminStatRow:last-child {
  border-bottom: 0;
}

.partnerAdminStatRow span,
.partnerAdminStatRow small {
  color: var(--portal-muted);
  font-weight: 800;
}

.partnerAdminStatRow strong {
  color: var(--portal-text);
  font-size: 1.05rem;
  font-weight: 950;
}

.partnerAdminDetailTabs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-top: var(--ap-section-gap) !important;
  padding: 10px !important;
  border: 1px solid rgba(72, 159, 223, .24);
  border-radius: 18px;
  background: rgba(2, 12, 32, .42);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

.partnerAdminDetailTab {
  width: auto !important;
  min-height: 48px !important;
  padding: 0 18px !important;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 14px;
  color: rgba(255, 255, 255, .68);
  background: rgba(9, 22, 50, .82);
  box-shadow: none;
  font-size: 15px !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
  transform: none !important;
}

.partnerAdminDetailTab:is(:hover, :focus-visible) {
  color: #ffffff;
  border-color: rgba(72, 159, 223, .38);
  background: rgba(5, 15, 36, .96);
  box-shadow: none;
  transform: none !important;
}

.partnerAdminDetailTab.active {
  color: #ffffff;
  border-color: rgba(124, 190, 246, .68);
  background: linear-gradient(135deg, rgba(72, 159, 223, .98), rgba(53, 117, 184, .86));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 12px 26px rgba(72, 159, 223, .2);
}

.partnerAdminDetailTabPanels {
  min-width: 0;
}

#partnerAdminEditForm.partnerAdminTabbedForm {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

#partnerAdminEditForm.partnerAdminTabbedForm::before,
#partnerAdminEditForm.partnerAdminTabbedForm .formHead {
  display: none;
}

.partnerAdminFormPanels {
  display: grid;
  gap: var(--ap-section-gap);
}

.partnerAdminFormPanel {
  display: grid;
  gap: var(--ap-gap-default);
}

.partnerAdminFormPanel[hidden] {
  display: none !important;
}

.partnerAdminFormPanel > h4 {
  margin: 0;
  color: var(--portal-text);
  font-size: 1.05rem;
  font-weight: 950;
}

#partnerAdminEditForm.partnerAdminTabbedForm > button[type="submit"],
#partnerAdminEditForm.partnerAdminTabbedForm > .formMessage {
  margin-top: var(--ap-section-gap);
}

#partnerAdminEditForm.partnerAdminPasswordTab > button[type="submit"] {
  display: none;
}

.partnerAdminDetailBox .reviewActions button {
  margin-top: 0;
  min-width: 220px;
}

body.adminPartnerCompact .partnerAdminDetailBox {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--ap-section-gap);
  width: 100%;
}

.partnerAdminOverviewCard {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(220px, 0.9fr) minmax(220px, 0.7fr);
  gap: 22px;
  padding: 18px 20px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
  align-items: stretch;
}

.partnerAdminOverviewPrimary {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  cursor: pointer;
}

.partnerAdminOverviewPrimary > div {
  min-width: 0;
}

.partnerAdminOverviewPrimary:hover {
  opacity: 0.92;
}

.partnerAdminOverviewPrimary h3 {
  margin: 0 0 6px;
  font-size: 20px;
  color: var(--night);
}

.partnerAdminOverviewText {
  margin: 0;
  color: var(--ink);
  line-height: 1.35;
}

.partnerAdminOverviewProjects,
.partnerAdminOverviewActions {
  align-self: start;
}

.partnerAdminOverviewProjects .partnerAdminOrdersList {
  max-height: 172px;
}

.partnerProjectsTitleRow {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.partnerProjectsTitleText {
  font-size: inherit;
  font-weight: inherit;
  color: inherit;
}

.partnerProjectsTitleDivider {
  width: 1px;
  height: 22px;
  background: var(--line);
}

.partnerProjectsTitleLink {
  border: 0;
  background: transparent;
  padding: 0;
  color: inherit;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
  text-decoration: none;
  box-shadow: none;
  outline: 0;
  -webkit-tap-highlight-color: transparent;
}

.partnerProjectsTitleLink:hover,
.partnerProjectsTitleLink:focus,
.partnerProjectsTitleLink:focus-visible,
.partnerProjectsTitleLink:active {
  border: 0;
  background: transparent;
  color: #ffffff;
  text-decoration: none;
  box-shadow: none;
  outline: 0;
  transform: none !important;
}

.partnerProjectsMapPanel {
  display: grid;
  gap: 16px;
}

.partnerProjectsMapCard {
  display: grid;
  gap: 14px;
  padding: 18px 20px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.partnerProjectsMapHint {
  color: var(--muted);
  font-size: 15px;
}

.partnerProjectsMapHead {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.partnerProjectsMapFilters {
  display: flex;
  align-items: end;
  gap: 12px;
  flex-wrap: wrap;
}

.partnerProjectsMapFilters label {
  display: grid;
  gap: 6px;
  min-width: 180px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
}

.montageMapScopeFilter {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  min-height: 48px;
  padding: 4px;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 14px;
  background: rgba(255, 255, 255, .12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12);
}

.montageMapScopeFilter button {
  min-width: 0;
  min-height: 40px;
  padding: 0 12px;
  border: 0;
  border-radius: 10px;
  color: rgba(255, 255, 255, .82);
  background: transparent;
  font-weight: 900;
  cursor: pointer;
}

.montageMapScopeFilter button.active,
.montageMapScopeFilter button:hover {
  color: #141B4D;
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(2, 9, 28, .2);
}

.montageMapStepFilter {
  display: grid;
  gap: 6px;
  min-width: 220px;
  max-height: 150px;
  padding: 8px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f7fbff;
}

.partnerProjectsMapFilters .montageMapStepOption {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: var(--night);
  font-size: 14px;
  line-height: 1.2;
  text-transform: none;
}

.montageMapStepOption input {
  width: auto;
  min-height: 0;
}

.montageMapStepClear {
  min-height: 34px;
  padding: 0 12px;
  border: 0;
  border-radius: 8px;
  color: #ffffff;
  background: var(--night);
  font-weight: 800;
  cursor: pointer;
}

.montageMapStepClear:hover {
  background: var(--accent);
}

.partnerProjectsMapCanvas {
  width: 100%;
  min-height: 520px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--line);
}

#montageMapStatus {
  margin: 0;
  padding: 12px 14px;
  border: 1px solid rgba(72, 159, 223, .16);
  border-radius: 12px;
  background: #f4f9ff;
  color: #334155;
  font-weight: 700;
}

#montageMapPanel .partnerProjectsMapCard {
  position: relative;
  overflow: visible !important;
  gap: clamp(18px, 2.2vw, 28px);
  padding: clamp(18px, 2.4vw, 30px);
  border: 1px solid rgba(72, 159, 223, .2);
  border-radius: 22px;
  background:
    radial-gradient(circle at 78% 0%, rgba(72, 159, 223, .18), transparent 34%),
    linear-gradient(140deg, rgba(2, 9, 28, .96), rgba(20, 27, 77, .88));
  box-shadow: 0 30px 90px rgba(3, 8, 26, .34), inset 0 1px 0 rgba(255, 255, 255, .12);
}

#montageMapPanel .partnerProjectsMapHead {
  position: relative;
  z-index: 20;
  display: grid;
  grid-template-columns: 1fr;
  align-items: start;
  gap: clamp(22px, 2.6vw, 36px);
  padding: clamp(22px, 3vw, 42px);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 16px;
  background:
    linear-gradient(90deg, rgba(20, 27, 77, .96), rgba(20, 27, 77, .7)),
    url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center / cover no-repeat;
  color: #ffffff;
  overflow: visible !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12);
}

#montageMapPanel .partnerProjectsMapHead .step,
#montageMapPanel .partnerProjectsMapHead h3,
#montageMapPanel .partnerProjectsMapHead .partnerProjectsMapHint {
  color: #ffffff;
}

#montageMapPanel .partnerProjectsMapHead .step {
  opacity: .78;
}

#montageMapPanel .partnerProjectsMapHead h3 {
  margin: 0;
  font-size: clamp(42px, 5vw, 84px);
  line-height: 1;
}

#montageMapPanel .partnerProjectsMapHint {
  max-width: 620px;
  margin: 4px 0 0;
  color: rgba(255, 255, 255, .82);
  font-weight: 600;
}

#montageMapPanel .partnerProjectsMapFilters {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  min-width: 0;
  max-width: none;
}

#montageMapPanel .partnerProjectsMapFilters label {
  color: rgba(255, 255, 255, .72);
}

#montageMapPanel .partnerProjectsMapFilters select,
#montageMapPanel .montageMapFilterToggle {
  border-color: rgba(255, 255, 255, .22);
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 14px 34px rgba(2, 9, 28, .18);
}

#montageMapPanel .montageMapScopeFilter {
  align-self: center;
  width: min(360px, 100%);
}

#montageMapPanel .montageMapFilterMenu {
  position: relative;
  display: flex;
  align-items: center;
}

#montageMapPanel .montageMapFilterToggle {
  min-height: 48px;
  padding: 0 22px;
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: 14px;
  color: #141B4D;
  font-weight: 900;
  cursor: pointer;
}

#montageMapPanel .montageMapFilterToggle:hover,
#montageMapPanel .montageMapFilterToggle[aria-expanded="true"] {
  background: #ffffff;
  box-shadow: 0 16px 38px rgba(2, 9, 28, .24);
}

#montageMapPanel .montageMapFilterPanel {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 1000;
  display: grid;
  gap: 14px;
  width: min(420px, calc(100vw - 48px));
  padding: 18px;
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(12, 24, 58, .98), rgba(5, 14, 35, .94)),
    rgba(2, 9, 20, .96);
  box-shadow: 0 28px 80px rgba(2, 9, 28, .38), inset 0 1px 0 rgba(255, 255, 255, .14);
}

#montageMapPanel .montageMapFilterPanel.hidden {
  display: none;
}

#montageMapPanel .montageMapFilterPanel label {
  display: grid;
  gap: 6px;
  min-width: 0;
}

#montageMapPanel .montageMapFilterPanel select {
  width: 100%;
  min-width: 0;
}

#montageMapPanel .partnerProjectsMapCanvas {
  position: relative;
  z-index: 1;
  border-radius: 16px;
  border-color: rgba(255, 255, 255, .14);
  box-shadow: 0 20px 64px rgba(2, 9, 28, .28);
}

#montageMapPanel #montageMapStatus {
  border-color: rgba(255, 255, 255, .12);
  background: rgba(255, 255, 255, .08);
  color: rgba(255, 255, 255, .82);
}

.partnerOrderMapMarker {
  width: auto !important;
  height: auto !important;
  white-space: nowrap;
}

.partnerOrderMapMarker span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 12px 30px rgba(12, 20, 58, 0.14);
  background: #ffffff;
  color: var(--night);
  font-weight: 800;
  font-size: 13px;
}

.partnerOrderMapMarker--unscheduled span {
  background: #fff1ee;
  border-color: rgba(198, 31, 20, 0.28);
  color: #a51c12;
}

.partnerOrderMapMarker--scheduled span {
  background: #edf8f1;
  border-color: #cbead7;
  color: #1f7a4a;
}

.partnerOrderMapMarker--complaint span {
  background: #fff4df;
  border-color: #f0c774;
  color: #9b5800;
}

.partnerOrderMapCluster span {
  width: 38px;
  height: 38px;
  min-height: 38px;
  justify-content: center;
  padding: 0;
  border: 3px solid #ffffff;
  border-radius: 999px;
  background: var(--night);
  color: #ffffff;
  font-size: 16px;
  box-shadow: 0 16px 34px rgba(12, 20, 58, 0.22);
}

.mapClusterPopupList {
  display: grid;
  gap: 6px;
  margin-top: 10px;
}

.mapClusterPopupList span {
  display: block;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: 8px;
  background: rgba(255, 255, 255, .08);
  color: rgba(255, 255, 255, .94);
  font-weight: 800;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.mapClusterPopupHint {
  margin: 10px 0 0;
  color: rgba(255, 255, 255, .68);
  font-size: 12px;
  font-weight: 700;
}

.partnerOrderMapPopup .partnerProjectHoverPreview,
.partnerOrderMapPopup .leaflet-popup-content-wrapper {
  border-radius: 8px;
}

.partnerOrderMapPopup .leaflet-popup-content-wrapper {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.partnerOrderMapPopup .leaflet-popup-content {
  margin: 0;
}

.partnerOrderMapPopup .leaflet-popup-tip {
  background: rgba(8, 24, 51, .98);
  box-shadow: 0 10px 24px rgba(3, 9, 28, .26);
}

.partnerOrderMapPopup--below .leaflet-popup-tip-container {
  position: absolute;
  top: -19px;
  bottom: auto;
  margin-top: 0;
}

.partnerOrderMapPopup--below .leaflet-popup-tip {
  margin: 12px auto 0;
  box-shadow: -8px -8px 18px rgba(3, 9, 28, .18);
}

.partnerOrderMapPopup a.leaflet-popup-close-button {
  top: -10px;
  right: -10px;
  width: 30px;
  height: 30px;
  border: 1px solid rgba(72, 159, 223, .32);
  border-radius: 999px;
  background: rgba(8, 24, 51, .96);
  color: rgba(255, 255, 255, .86);
  font: 24px/27px Arial, sans-serif;
  box-shadow: 0 12px 28px rgba(3, 9, 28, .3);
}

.partnerOrderMapPopup a.leaflet-popup-close-button:hover {
  background: rgba(72, 159, 223, .95);
  color: #ffffff;
}

.partnerOrderMapPopup .partnerProjectHoverPreview {
  position: static;
  display: grid !important;
  width: auto;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.partnerOrderMapPopup .leaflet-popup-content {
  min-width: 280px;
  max-width: min(460px, 80vw);
  overflow-wrap: anywhere;
}

.partnerOrderMapPopup .mapClusterPopup {
  width: min(360px, calc(100vw - 72px));
  max-width: calc(100vw - 72px);
  padding: 14px 16px !important;
}

.partnerOrderMapPopup .mapClusterPopup strong {
  display: block;
  max-width: calc(100% - 28px);
  font-size: 18px;
  line-height: 1.14;
}

.partnerAdminOverviewActions {
  display: grid;
  gap: 12px;
  justify-content: stretch;
}

.adminPartnerOrdersMain {
  grid-template-columns: .85fr 1.15fr 1.15fr 2fr 1.3fr 1fr 1.55fr .95fr .85fr;
}

.payoutReleaseMain {
  grid-template-columns: 1.2fr 1.2fr 1fr .8fr auto;
  align-items: center;
}

.payoutReleaseCard {
  cursor: default;
}

.payoutReleaseCard:hover {
  background: #ffffff;
}

.partnerPriceListSummaryBox,
.partnerOrderCostEstimate {
  display: grid;
  gap: 6px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
  color: var(--ink);
}

.partnerPriceListSummaryBox p {
  margin: 0;
}

.partnerPriceListSummaryBox a {
  color: var(--link);
  font-weight: 800;
}

.partnerAdminStatsGrid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0;
}

.partnerAdminStatCard {
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
}

.partnerAdminStatCard span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.partnerAdminStatCard strong {
  color: var(--night);
  font-size: 24px;
  line-height: 1;
}

.partnerAdminStatCard small {
  color: var(--ink);
  font-weight: 700;
}

.partnerOrderCostEstimate {
  margin-top: 22px;
  margin-bottom: 14px;
  background: #edf8f1;
  border-color: #cbead7;
}

.partnerOrderCostEstimate strong {
  color: var(--paid);
}

.partnerOrderCostEstimateTotal {
  font-size: 30px;
  font-weight: 900;
  color: var(--paid);
  line-height: 1.1;
}

.partnerOrderCostEstimateRows {
  display: grid;
  gap: 8px;
}

.partnerOrderCostEstimateRow {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
}

.partnerOrderCostEstimateRow strong {
  color: var(--ink);
}

.partnerOrderCostEstimate span,
.partnerOrderCostEstimate small {
  color: var(--ink);
}

.partnerOrderChatTop {
  margin: 18px 0 22px;
  padding: 18px;
  border: 1px solid #cfe0ee;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 12px 30px rgba(12, 29, 66, 0.08);
}

.partnerOrderChatTop .chatMessages {
  padding: 10px;
  border: 1px solid #d8e7f2;
  border-radius: 8px;
  background: #f8fbfe;
}

.partnerOrderChatTop .chatComposer textarea {
  min-height: 86px;
  border-color: #cfe0ee;
  background: #ffffff;
}

body.adminPartnerCompact .partnerAdminOrders {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
  align-self: start;
}

body.adminPartnerCompact .partnerAdminDetailBox .reviewActions {
  display: grid;
  justify-content: stretch;
  align-content: start;
}

.reviewButton {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  padding: 0 18px;
  text-decoration: none;
}

.submittedBadge {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 14px;
  border-radius: 8px;
  background: #eaf8ee;
  color: var(--paid);
  font-weight: 700;
}

.detailMeta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.profileEditor {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

#profileView {
  width: min(960px, 100%);
}

#profileView .profileEditor {
  grid-template-columns: 180px minmax(0, 1fr);
}

#profileView .profileEditor.customerProfileEditor {
  grid-template-columns: 1fr;
}

#profileView .profileEditor .formGrid {
  width: 100%;
}

.profileEditor img {
  width: 100%;
  max-width: 180px;
  aspect-ratio: 1;
  height: auto;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: #f8fbfe;
}

body.profileStandaloneView:not(.dashboardMode) #dashboardView {
  display: none !important;
}

body.profileStandaloneView #profileView {
  width: min(980px, calc(100vw - 36px));
  margin: 0 auto;
  border: 1px solid rgba(72, 159, 223, .28);
  background:
    linear-gradient(145deg, rgba(12, 24, 58, .94), rgba(6, 16, 42, .82)),
    rgba(20, 27, 77, .72);
  color: #ffffff;
  box-shadow: 0 30px 86px rgba(3, 9, 28, .34), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.profileStandaloneView #profileView h2,
body.profileStandaloneView #profileView label,
body.profileStandaloneView #profileView .formMessage {
  color: rgba(255, 255, 255, .92);
}

body.profileStandaloneView #profileForm {
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 0;
}

body.profileStandaloneView #profileView .profileEditor {
  grid-template-columns: 160px minmax(0, 1fr);
}

body.profileStandaloneView #profileView input {
  border-color: rgba(72, 159, 223, .34);
  background: rgba(2, 12, 32, .72);
  color: #ffffff;
}

body.profileStandaloneView #profilePreview {
  border-color: rgba(72, 159, 223, .28);
  background: rgba(4, 14, 38, .62);
}

body.dashboardMode.profileStandaloneView .appContent > :not(.dashboardHead):not(#profileView) {
  display: none !important;
}

body.dashboardMode.profileStandaloneView #profileView {
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: clamp(22px, 3vw, 34px);
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: 28px;
  background:
    linear-gradient(145deg, rgba(12, 24, 58, .94), rgba(6, 16, 42, .84)),
    rgba(20, 27, 77, .72);
  color: #ffffff;
  box-shadow: 0 30px 86px rgba(3, 9, 28, .34), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.dashboardMode.profileStandaloneView #profileForm {
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode.profileStandaloneView #profileView .profileEditor {
  padding: clamp(18px, 2.4vw, 26px);
  border: 1px solid rgba(72, 159, 223, .24);
  border-radius: 22px;
  background:
    linear-gradient(145deg, rgba(4, 14, 38, .72), rgba(12, 28, 64, .62)),
    rgba(255, 255, 255, .05);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode.profileStandaloneView #profileView h2,
body.dashboardMode.profileStandaloneView #profileView label,
body.dashboardMode.profileStandaloneView #profileView .formMessage {
  color: rgba(255, 255, 255, .92);
}

body.dashboardMode.profileStandaloneView #profileView input {
  border-color: rgba(72, 159, 223, .34);
  background: rgba(2, 12, 32, .72);
  color: #ffffff;
}

body.dashboardMode.profileStandaloneView #profileView input::file-selector-button {
  border: 0;
  border-radius: 999px;
  background: #489fdf;
  color: #ffffff;
  font-weight: 800;
}

body.dashboardMode.profileStandaloneView #profileView .modalCloseButton {
  top: 20px;
  right: 20px;
  color: #ffffff;
  background: rgba(20, 27, 77, .72);
  border-color: rgba(255, 255, 255, .18);
}

button:disabled {
  cursor: not-allowed;
  opacity: 0.56;
}

.reviewStatus,
.friendStatus {
  display: inline-flex;
  min-width: 104px;
  justify-content: center;
  padding: 6px 10px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
}

.reviewDone {
  color: #1f7a52;
  background: #eaf8ee;
}

.reviewPending {
  color: #b54708;
  background: #fff0e1;
}

.reviewInfo {
  color: #155eef;
  background: #e8f1ff;
}

.reviewOpen {
  color: #b42318;
  background: #fdebea;
}

.reviewUnknown {
  color: var(--muted);
  background: #edf2f7;
}

.friendDone {
  color: #1f7a52;
  background: #eaf8ee;
}

.friendOpen {
  color: #b42318;
  background: #fdebea;
}

.formHead {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
}

.formHead h3 {
  margin: 0;
  font-size: 22px;
}

.formGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.fullWidth {
  grid-column: 1 / -1;
}

.formActions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  gap: 12px;
}

.partnerOrderDetailActions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-items: stretch;
}

.partnerOrderDetailActions > button {
  width: 100%;
  min-width: 0;
  min-height: 56px;
  margin: 0;
}

.partnerOrderDetailActions > .dangerButton {
  width: 100%;
  min-width: 0;
  min-height: 56px;
  margin: 0;
  background: var(--danger);
}

.partnerOrderDetailActions > .dangerButton:hover {
  background: #8f1d15;
}

.recommendationForm .partnerOrderDetailActions .dangerButton {
  background: var(--danger);
}

.recommendationForm .partnerOrderDetailActions .dangerButton:hover {
  background: #8f1d15;
}

.suggestionAccepted {
  align-self: center;
  color: #16784b;
  font-weight: 800;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

.emailAutomationList {
  display: grid;
  gap: 12px;
}

.emailAutomationCard {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
}

.emailAutomationCardHeader {
  width: 100%;
  border: 0;
  background: transparent;
  padding: 0;
  color: inherit;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  text-align: left;
  cursor: pointer;
}

.emailAutomationEditHint {
  color: var(--sky);
  font-weight: 800;
  white-space: nowrap;
}

.emailAutomationCardText {
  display: grid;
  gap: 6px;
}

.emailAutomationCardText strong {
  color: var(--night);
  font-size: 18px;
  line-height: 1.3;
}

.emailAutomationCardText p {
  margin: 0;
  color: var(--muted);
  font-weight: 700;
  line-height: 1.5;
}

.emailAutomationEditor {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 12px;
}

.emailAutomationEditor label {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-weight: 800;
}

.emailAutomationEditor textarea {
  min-height: 110px;
  resize: vertical;
}

.emailAutomationActions {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
}

.recommendationForm button[type="submit"],
.recommendationForm button[type="button"] {
  min-height: 48px;
  min-width: 112px;
  padding: 0 18px;
  border: 0;
  border-radius: 8px;
  color: #ffffff;
  background: var(--accent);
  cursor: pointer;
  font-weight: 700;
  white-space: normal;
}

.recommendationForm button[type="submit"]:hover,
.recommendationForm button[type="button"]:hover {
  background: var(--accent-strong);
}

.recommendationForm button.isLoading {
  opacity: 0.72;
  cursor: progress;
}

.recommendationForm .partnerOrderDetailActions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.recommendationForm .partnerOrderDetailActions > button {
  width: 100%;
  min-width: 0;
  min-height: 56px;
  margin: 0;
}

.recommendationForm .partnerOrderDetailActions .dangerButton {
  background: var(--danger);
}

.recommendationForm .partnerOrderDetailActions .dangerButton:hover {
  background: #8f1d15;
}

.recommendationForm button.isLoading::after {
  content: "";
  width: 18px;
  height: 18px;
  margin-left: 10px;
  display: inline-block;
  vertical-align: -3px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: partnerSubmitSpinner 0.8s linear infinite;
}

@keyframes partnerSubmitSpinner {
  to {
    transform: rotate(360deg);
  }
}

.formMessage {
  min-height: 22px;
  margin: 0;
  color: var(--mid);
  font-weight: 700;
}

.successMessage {
  color: #1f7a52;
}

.formMessage a {
  color: var(--night);
  word-break: break-word;
}

.chatBox {
  display: grid;
  gap: 14px;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.detailBackButton {
  display: inline-flex;
  width: fit-content;
  margin: 0 0 12px;
}

.partnerOrderDetailHead {
  margin-bottom: 18px;
}

.partnerOrderDetailMeta {
  margin: 0 0 10px;
  font-size: 15px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.partnerOrderDetailMeta > span {
  display: inline-flex;
  align-items: center;
}

.partnerOrderMetaSeparator {
  color: var(--muted);
  font-weight: 600;
}

.partnerOrderAttachmentsSection,
.partnerOrderNotesSection {
  display: grid;
  gap: 14px;
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.partnerOrderImageGallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
}

.partnerOrderAttachmentHeading {
  margin: 16px 0 8px;
  color: var(--ink);
  font-size: 18px;
  font-weight: 900;
  line-height: 1.2;
}

.partnerOrderImageCard {
  position: relative;
  display: grid;
  gap: 8px;
  width: 100%;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
  color: var(--ink);
  text-decoration: none;
  text-align: left;
  cursor: default;
}

.partnerOrderImagePreviewButton {
  display: grid;
  gap: 8px;
  width: 100%;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  box-shadow: none;
  text-align: left;
  cursor: pointer;
}

.partnerOrderImageCard img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  border-radius: 6px;
  background: #e8eff6;
}

.partnerOrderImageCard span {
  font-size: 13px;
  font-weight: 700;
  word-break: break-word;
}

.partnerOrderAttachmentSourceBadge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: var(--ap-space-1) var(--ap-space-2);
  border: 1px solid rgba(72, 159, 223, .34);
  border-radius: 999px;
  background: rgba(72, 159, 223, .14);
  color: rgba(255, 255, 255, .88);
  font-size: 12px;
  font-weight: 900;
  line-height: 1.1;
}

.partnerOrderFileList {
  display: grid;
  gap: 10px;
}

.assetUploadTile {
  display: grid;
  gap: 6px;
  padding: 18px;
  border: 1px dashed var(--portal-accent);
  border-radius: 12px;
  background: rgba(72, 159, 223, .08);
  cursor: pointer;
}

.assetUploadTile input {
  display: none;
}

.assetUploadTile > strong {
  color: var(--ink);
  font-size: 16px;
}

.assetUploadTile > span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.assetUploadProgress {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 5px 12px;
  margin-top: 8px;
  padding: 12px;
  border-radius: 8px;
  background: rgba(72, 159, 223, .12);
}

.assetUploadProgress progress {
  grid-column: 1 / -1;
  width: 100%;
  accent-color: var(--portal-accent);
}

.assetUploadProgress.is-success {
  background: rgba(31, 157, 104, .14);
  color: #18754f;
}

.assetUploadProgress.is-error {
  background: rgba(197, 56, 56, .13);
  color: #a22c2c;
}

.assetRenameDialog {
  width: min(440px, calc(100vw - 32px));
  padding: 0;
  border: 0;
  border-radius: 14px;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .28);
}

.assetRenameDialog::backdrop {
  background: rgba(3, 14, 31, .58);
}

.assetRenameDialog form {
  display: grid;
  gap: 14px;
  padding: 22px;
}

.assetRenameDialog label {
  display: grid;
  gap: 6px;
  font-weight: 800;
}

.assetRenameActions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.partnerOrderMediaVideoPreview,
.customerVideoPreview {
  display: grid;
  place-items: center;
  gap: 10px;
  width: 100%;
  min-height: 150px;
  padding: 14px;
  border: 0;
  border-radius: 8px;
  background: linear-gradient(145deg, #e9f4fa, #d9e9f3);
  color: var(--ink);
  box-shadow: none;
  cursor: pointer;
}

.customerVideoPlaceholder {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: var(--portal-accent);
  color: #fff;
  font-size: 20px;
}

.partnerOrderAppointmentsList {
  display: grid;
  gap: 12px;
}

.partnerOrderAppointmentCard {
  display: grid;
  gap: 6px;
  width: 100%;
  min-height: 0;
  padding: 16px 18px;
  border: 1px solid var(--ap-ui-border);
  border-radius: 16px;
  background: var(--ap-ui-card);
  color: var(--ap-ui-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 14px 34px rgba(0, 0, 0, .18);
  text-align: left;
  cursor: default;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}

button.partnerOrderAppointmentCard {
  cursor: pointer;
}

.partnerOrderAppointmentCard:hover {
  border-color: var(--ap-ui-border-strong);
  background: var(--ap-ui-card);
  transform: translateY(-1px);
}

.partnerOrderAppointmentCard.is-cancelled {
  border-color: rgba(255, 134, 134, .42);
  background: linear-gradient(145deg, rgba(46, 12, 22, .72), rgba(4, 15, 38, .92));
}

.partnerOrderAppointmentCard span,
.partnerOrderAppointmentCard small {
  color: var(--ap-ui-muted);
  font-size: 13px;
  font-weight: 800;
}

.partnerOrderAppointmentCard strong {
  color: var(--ap-ui-text);
  font-size: 18px;
  font-weight: 900;
}

.partnerOrderFileCard {
  position: relative;
}

.partnerOrderFileLink {
  display: grid;
  gap: 4px;
  padding: 12px 54px 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
  color: var(--ink);
  text-decoration: none;
}

.partnerOrderFileLink span {
  color: var(--muted);
  font-size: 13px;
}

.partnerOrderFileLink .partnerOrderAttachmentSourceBadge {
  color: rgba(255, 255, 255, .88);
}

.partnerOrderVideoCard {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--ap-gap-default);
  min-width: 0;
  padding: var(--ap-space-4) 52px var(--ap-space-4) 0;
}

.partnerOrderVideoIcon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: var(--portal-radius-control);
  background: rgba(72, 159, 223, .1);
  color: var(--portal-accent);
  font-size: 15px;
}

.partnerOrderVideoInfo {
  display: grid;
  min-width: 0;
  gap: var(--ap-space-1);
}

.partnerOrderVideoInfo .ap-badge {
  width: fit-content;
}

.partnerOrderVideoInfo strong,
.partnerOrderVideoInfo span {
  overflow-wrap: anywhere;
}

.partnerOrderVideoInfo > span:last-child {
  color: var(--portal-muted);
  font-size: .84rem;
}

.partnerOrderVideoActions {
  display: flex;
  align-items: center;
  gap: var(--ap-space-2);
}

.partnerVideoPreviewOverlay {
  position: fixed;
  inset: 0;
  z-index: 110;
  display: grid;
  place-items: center;
  padding: var(--ap-space-6);
  background: rgba(1, 7, 20, .88);
}

.partnerVideoPreviewPanel {
  display: grid;
  width: min(960px, 100%);
  max-height: calc(100vh - (2 * var(--ap-space-6)));
  gap: var(--ap-gap-default);
  padding: var(--ap-surface-padding);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: var(--portal-surface);
  box-shadow: var(--portal-shadow);
  overflow: auto;
}

.partnerVideoPreviewHeader {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--ap-gap-default);
}

.partnerVideoPreviewHeader > div {
  display: grid;
  gap: var(--ap-space-2);
}

.partnerVideoPreviewHeader h3 {
  margin: 0;
  overflow-wrap: anywhere;
}

.partnerVideoPreviewPanel video {
  width: 100%;
  max-height: min(65vh, 680px);
  border-radius: var(--portal-radius-control);
  background: #000;
}

.partnerVideoPreviewPanel > a {
  width: fit-content;
}

@media (max-width: 760px) {
  .partnerOrderVideoCard {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .partnerOrderVideoActions {
    grid-column: 1 / -1;
    flex-wrap: wrap;
  }

  .partnerOrderVideoActions > * {
    flex: 1 1 150px;
  }

  .partnerVideoPreviewOverlay {
    padding: var(--ap-space-3);
  }

  .partnerVideoPreviewPanel {
    max-height: calc(100vh - (2 * var(--ap-space-3)));
    padding: var(--ap-space-4);
  }
}

.partnerOrderAttachmentDelete {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 3;
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  min-width: 30px;
  min-height: 30px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: 999px;
  background: rgba(3, 9, 28, .72);
  color: #ffffff;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
  box-shadow: 0 12px 26px rgba(3, 9, 28, .32);
  cursor: pointer;
}

.partnerOrderAttachmentDelete:hover {
  border-color: rgba(255, 255, 255, .42);
  background: rgba(128, 28, 42, .92);
  color: #ffffff;
  transform: scale(1.04);
}

.imagePreviewOverlay {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(7, 13, 40, 0.78);
}

.imagePreviewFrame {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  max-width: calc(100vw - 48px);
  max-height: calc(100vh - 48px);
}

.imagePreviewOverlay img {
  max-width: min(1200px, calc(100vw - 80px));
  max-height: calc(100vh - 80px);
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.34);
  background: #ffffff;
}

.imagePreviewClose {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--night);
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}

.chatBoxHeader h4 {
  margin: 0 0 4px;
}

.chatMessages {
  display: grid;
  gap: 10px;
  max-height: 248px;
  min-height: 0;
  overflow-y: auto;
  padding-right: 6px;
  align-content: start;
  overscroll-behavior: contain;
}

.chatMessage {
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
  max-width: min(100%, 78%);
}

.chatMessageHeader {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 6px;
  font-size: 13px;
  color: var(--muted);
}

.chatMessageAuthor {
  font-weight: 700;
  color: var(--ink);
}

.chatMessageBody {
  white-space: pre-wrap;
  color: var(--ink);
}

.chatMessageLeft {
  justify-self: start;
}

.chatMessageRight {
  justify-self: end;
  background: #eef6ff;
  border-color: #bfd9f2;
}

.chatAttachmentField {
  display: grid;
  gap: 6px;
}

.chatComposer {
  display: grid;
  gap: 12px;
}

.partnerAdminOrders {
  display: grid;
  gap: 10px;
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.partnerAdminOrdersList {
  display: grid;
  gap: 8px;
  max-height: 210px;
  overflow-y: auto;
  padding-right: 4px;
  align-content: start;
  overscroll-behavior: contain;
}

.partnerAdminOrderButton {
  position: relative;
  width: 100%;
  text-align: left;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
  color: var(--ink);
  cursor: pointer;
}

.partnerAdminOrderButton:hover {
  background: #eef5fb;
}

.resultBox {
  display: grid;
  gap: 10px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f5f9fc;
}

.resultBox p {
  margin: 0;
}

.resultBox code {
  display: inline-block;
  width: fit-content;
  max-width: 100%;
  padding: 10px 12px;
  border-radius: 8px;
  background: var(--night);
  color: #ffffff;
  overflow-wrap: anywhere;
}

.tableWrap {
  width: 100%;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  -webkit-overflow-scrolling: touch;
}

.statusStack {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.reonicDetailPanel {
  gap: 18px;
}

.reonicDetailContent {
  display: grid;
  gap: 16px;
}

.reonicCustomerMeta {
  display: grid;
  gap: 9px;
  justify-items: start;
  max-width: 720px;
  text-align: left;
}

.reonicCustomerMeta p {
  display: grid;
  gap: 2px;
  margin: 0;
}

.reonicCustomerMeta span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.reonicCustomerMeta strong,
.reonicCustomerMeta a {
  color: var(--night);
  font-weight: 800;
  line-height: 1.35;
  overflow-wrap: anywhere;
  text-decoration: none;
}

/* Premium customer detail hero */
#reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: min(920px, calc(100vh - 42px));
  padding: clamp(28px, 3.6vw, 58px);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 34px;
  color: #ffffff;
  background:
    radial-gradient(circle at 76% 16%, rgba(72, 159, 223, .26), transparent 32%),
    linear-gradient(112deg, rgba(5, 10, 32, .96) 0%, rgba(20, 27, 77, .88) 37%, rgba(20, 27, 77, .48) 66%, rgba(5, 10, 32, .82) 100%),
    url("/assets/premium-customer-hero.jpg") center center / cover no-repeat;
  box-shadow: 0 38px 110px rgba(3, 8, 26, .48), inset 0 1px 0 rgba(255, 255, 255, .16);
}

#reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record)::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .03), rgba(255, 255, 255, 0) 42%),
    radial-gradient(circle at 8% 12%, rgba(255, 255, 255, .18), transparent 30%),
    linear-gradient(90deg, rgba(6, 12, 36, .72), rgba(6, 12, 36, .16) 56%, rgba(6, 12, 36, .74));
  pointer-events: none;
}

#reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record) > * {
  position: relative;
  z-index: 1;
}

#reonicOrderDetailPanel .formHead {
  align-items: flex-start;
  gap: 18px;
  margin-bottom: clamp(24px, 4vw, 56px);
}

#reonicOrderDetailPanel #reonicDetailTitle {
  max-width: min(820px, 100%);
  margin: 0;
  color: #ffffff;
  font-size: clamp(34px, 4.4vw, 78px);
  line-height: .95;
  letter-spacing: 0;
  text-shadow: 0 18px 46px rgba(0, 0, 0, .48);
}

#reonicOrderDetailPanel #closeReonicDetailButton {
  min-height: 52px;
  padding: 0 24px;
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: 999px;
  background: rgba(72, 159, 223, .92);
  color: #ffffff;
  box-shadow: 0 18px 42px rgba(72, 159, 223, .28);
}

#reonicOrderDetailPanel #closeReonicDetailButton:hover {
  background: #ffffff;
  color: var(--ap-night);
}

#reonicOrderDetailPanel #reonicDetailMeta {
  max-width: min(680px, 100%);
  margin: 0 0 clamp(30px, 5vw, 74px);
  color: rgba(255, 255, 255, .86);
}

#reonicOrderDetailPanel .reonicCustomerMeta {
  gap: 16px;
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 24px;
  background: rgba(8, 15, 43, .34);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
  backdrop-filter: blur(16px);
}

#reonicOrderDetailPanel .reonicCustomerMeta span {
  color: rgba(255, 255, 255, .7);
}

#reonicOrderDetailPanel .reonicCustomerMeta strong,
#reonicOrderDetailPanel .reonicCustomerMeta a {
  color: #ffffff;
  font-size: clamp(18px, 1.8vw, 28px);
  text-shadow: 0 12px 34px rgba(0, 0, 0, .45);
}

#reonicOrderDetailPanel .reonicDetailContent {
  gap: 18px;
}

#reonicOrderDetailPanel .reonicDetailTabs {
  display: grid;
  gap: 14px;
}

#reonicOrderDetailPanel .reonicDetailTabList {
  display: flex;
  gap: 8px;
  max-width: 100%;
  padding: 8px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 18px;
  background: rgba(8, 15, 43, .38);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

#reonicOrderDetailPanel .reonicDetailTabButton {
  flex: 0 0 auto;
  min-height: 46px;
  min-width: 0;
  padding: 0 18px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: rgba(255, 255, 255, .76);
  background: transparent;
  font-weight: 800;
  cursor: pointer;
}

#reonicOrderDetailPanel .reonicDetailTabButton:hover,
#reonicOrderDetailPanel .reonicDetailTabButton:focus-visible {
  color: #ffffff;
  border-color: rgba(255, 255, 255, .22);
  background: rgba(255, 255, 255, .1);
}

#reonicOrderDetailPanel .reonicDetailTabButton.is-active {
  color: var(--ap-night);
  background: #ffffff;
  box-shadow: 0 16px 38px rgba(3, 9, 28, .22);
}

#reonicOrderDetailPanel .reonicDetailTabPanels {
  min-width: 0;
}

#reonicOrderDetailPanel .reonicDetailTabPanel {
  display: grid;
  gap: 16px;
}

#reonicOrderDetailPanel .reonicDetailTabPanel[hidden] {
  display: none;
}

#reonicOrderDetailPanel .reonicEmptyTabState {
  min-height: 92px;
  display: grid;
  align-items: center;
}

#reonicOrderDetailPanel .customerImagesCard,
#reonicOrderDetailPanel .protocolDocumentsCard {
  display: grid;
  gap: 18px;
}

#reonicOrderDetailPanel .customerImageSection {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 18px;
  background: rgba(4, 10, 30, .22);
}

#reonicOrderDetailPanel .customerImageSectionHead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

#reonicOrderDetailPanel .customerImageSectionHead span {
  display: block;
  margin-top: 2px;
  color: rgba(255, 255, 255, .66);
  font-size: 13px;
  font-weight: 800;
}

#reonicOrderDetailPanel .customerImageDownloadButton {
  min-height: 40px;
  padding: 0 16px;
  border-radius: 12px;
}

#reonicOrderDetailPanel .customerImageGrid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 12px;
}

#reonicOrderDetailPanel .customerImageThumb {
  position: relative;
  min-height: 0;
  min-width: 0;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 14px;
  overflow: hidden;
  background: rgba(255, 255, 255, .08);
  color: #ffffff;
  text-align: left;
}

#reonicOrderDetailPanel .customerImageThumb img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background: rgba(4, 10, 30, .28);
}

#reonicOrderDetailPanel .customerImageThumb span {
  display: block;
  padding: 10px 12px;
  color: rgba(255, 255, 255, .86);
  font-size: 13px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#reonicOrderDetailPanel .customerImageTile,
#reonicOrderDetailPanel .preparationImageCard {
  position: relative;
}

#reonicOrderDetailPanel .customerImageTile .customerImageThumb {
  width: 100%;
}

#reonicOrderDetailPanel .imageDeleteButton {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  min-width: 32px;
  min-height: 32px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .26);
  border-radius: 50%;
  color: #ffffff;
  background: rgba(5, 10, 32, .72);
  box-shadow: 0 10px 24px rgba(3, 9, 28, .34);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}

#reonicOrderDetailPanel .imageDeleteButton:hover,
#reonicOrderDetailPanel .imageDeleteButton:focus-visible {
  background: rgba(180, 30, 30, .92);
}

#reonicOrderDetailPanel .protocolDocumentList {
  display: grid;
  gap: 12px;
}

#reonicOrderDetailPanel .protocolDocumentItem {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 16px;
  background: rgba(255, 255, 255, .08);
}

#reonicOrderDetailPanel .protocolDocumentItem span {
  display: block;
  margin-top: 4px;
  color: rgba(255, 255, 255, .7);
  font-size: 13px;
  font-weight: 800;
}

#reonicOrderDetailPanel .protocolDocumentActions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

#reonicOrderDetailPanel .protocolDocumentActions button:disabled {
  opacity: .45;
  cursor: not-allowed;
}

#reonicOrderDetailPanel .reonicOptionCard,
#reonicOrderDetailPanel .preparationUploadCard,
#reonicOrderDetailPanel .deliveryDateBox,
#reonicOrderDetailPanel .billingCard,
#reonicOrderDetailPanel .customerActionBox,
#reonicOrderDetailPanel .noticeBox,
#reonicOrderDetailPanel .chatBox,
#reonicOrderDetailPanel .partnerOrderCostEstimate,
#reonicOrderDetailPanel .substructureBox,
#reonicOrderDetailPanel .reonicDocumentLink,
#reonicOrderDetailPanel .calendarCheckItem {
  border-color: rgba(255, 255, 255, .17);
  border-radius: 24px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .06));
  color: #ffffff;
  box-shadow: 0 24px 70px rgba(3, 9, 28, .28), inset 0 1px 0 rgba(255, 255, 255, .12);
  backdrop-filter: blur(20px);
}

#reonicOrderDetailPanel .preparationDropZone,
#reonicOrderDetailPanel .componentGroup li,
#reonicOrderDetailPanel .substructureSummaryCard,
#reonicOrderDetailPanel .preparationImageCard {
  border-color: rgba(255, 255, 255, .15);
  background: rgba(255, 255, 255, .1);
  color: #ffffff;
}

#reonicOrderDetailPanel h3,
#reonicOrderDetailPanel h4,
#reonicOrderDetailPanel label,
#reonicOrderDetailPanel strong,
#reonicOrderDetailPanel .preparationDropZone strong,
#reonicOrderDetailPanel .componentGroup li span,
#reonicOrderDetailPanel .reonicOptionHead span,
#reonicOrderDetailPanel .deliveryDateBox label,
#reonicOrderDetailPanel .calendarCheckItem span,
#reonicOrderDetailPanel .mutedText,
#reonicOrderDetailPanel p {
  color: rgba(255, 255, 255, .88);
}

#reonicOrderDetailPanel .reonicOptionHead strong,
#reonicOrderDetailPanel .partnerOrderCostEstimateTotal,
#reonicOrderDetailPanel .costTotal {
  color: #ffffff;
}

#reonicOrderDetailPanel input,
#reonicOrderDetailPanel select,
#reonicOrderDetailPanel textarea {
  border-color: rgba(255, 255, 255, .2);
  background: rgba(255, 255, 255, .1);
  color: #ffffff;
}

#reonicOrderDetailPanel input::placeholder,
#reonicOrderDetailPanel textarea::placeholder {
  color: rgba(255, 255, 255, .55);
}

/* Reonic customer detail - final premium layout */
#reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record) {
  display: grid;
  align-content: start;
  gap: 0;
  min-height: min(1120px, calc(100vh - 28px));
  padding: clamp(30px, 3.2vw, 52px);
  border-radius: 30px;
  background:
    linear-gradient(90deg, rgba(2, 9, 28, .96) 0%, rgba(4, 13, 38, .88) 27%, rgba(4, 13, 38, .42) 53%, rgba(4, 13, 38, .08) 82%),
    linear-gradient(180deg, rgba(5, 12, 34, .14) 0%, rgba(5, 12, 34, .28) 45%, rgba(5, 12, 34, .9) 100%),
    url("/assets/premium-customer-hero.jpg") 68% top / cover no-repeat;
}

#reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record)::before {
  z-index: 0;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, 0) 10%),
    radial-gradient(circle at 20% 8%, rgba(72, 159, 223, .18), transparent 34%);
}

#reonicOrderDetailPanel .formHead {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: start;
  gap: clamp(26px, 4vw, 52px);
  max-width: 620px;
  margin: 0;
}

#reonicOrderDetailPanel #closeReonicDetailButton {
  order: -1;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: rgba(190, 221, 255, .94);
  font-size: 18px;
  font-weight: 800;
}

#reonicOrderDetailPanel #closeReonicDetailButton::before {
  content: none;
  margin-right: 0;
}

#reonicOrderDetailPanel #closeReonicDetailButton:hover {
  background: transparent;
  color: #ffffff;
  transform: translateX(-2px);
}

#reonicOrderDetailPanel #reonicDetailTitle {
  max-width: 640px;
  font-size: clamp(42px, 4.3vw, 72px);
  line-height: 1.03;
}

#reonicOrderDetailPanel #reonicDetailMeta {
  max-width: 620px;
  margin: clamp(22px, 2.6vw, 34px) 0 clamp(28px, 3vw, 42px);
}

#reonicOrderDetailPanel .reonicCustomerMeta {
  display: grid;
  gap: 19px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}

#reonicOrderDetailPanel .reonicMetaItem {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  margin: 0;
}

#reonicOrderDetailPanel .reonicMetaIcon {
  width: 28px;
  height: 28px;
  display: inline-grid;
  place-items: center;
  border: 2px solid rgba(232, 244, 255, .86);
  border-radius: 9px;
  color: #ffffff;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .28);
}

#reonicOrderDetailPanel .reonicMetaIcon:not(.reonicMetaIcon-status) {
  padding: 4px;
  border-radius: 9px;
}

#reonicOrderDetailPanel .reonicMetaIcon-status {
  width: 10px;
  height: 10px;
  border: 0;
  border-radius: 999px;
  background: #489FDF;
  box-shadow: 0 0 0 7px rgba(72, 159, 223, .18);
  margin-left: 9px;
}

#reonicOrderDetailPanel .reonicMetaIcon-status::before {
  content: "";
}

#reonicOrderDetailPanel .reonicCustomerMeta strong,
#reonicOrderDetailPanel .reonicCustomerMeta a {
  color: #ffffff;
  font-size: clamp(18px, 1.45vw, 26px);
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.22;
  text-shadow: 0 10px 26px rgba(0, 0, 0, .5);
}

#reonicOrderDetailPanel .reonicMetaStatus {
  display: inline-grid;
  grid-template-columns: 18px auto;
  justify-self: start;
  gap: 10px;
  min-height: 48px;
  padding: 0 22px;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 12px;
  background: rgba(255, 255, 255, .11);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 18px 42px rgba(0, 0, 0, .22);
  backdrop-filter: blur(16px);
}

#reonicOrderDetailPanel .reonicMetaStatus strong {
  font-size: clamp(18px, 1.35vw, 24px);
}

#reonicOrderDetailPanel .reonicDetailContent {
  margin-top: clamp(8px, 2vw, 24px);
  gap: clamp(20px, 2vw, 28px);
}

#reonicOrderDetailPanel .calendarCheckCard,
#reonicOrderDetailPanel .preparationUploadCard {
  max-width: none;
  border-radius: 18px;
  background: rgba(1, 12, 34, .72);
  border: 1px solid rgba(101, 169, 226, .24);
  box-shadow: 0 26px 80px rgba(0, 0, 0, .32), inset 0 1px 0 rgba(255, 255, 255, .08);
  backdrop-filter: blur(18px) saturate(1.1);
}

#reonicOrderDetailPanel .calendarCheckGrid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

#reonicOrderDetailPanel .calendarCheckItem {
  position: relative;
  min-height: 150px;
  padding: 28px 112px 28px 32px;
  border-radius: 16px;
  background: rgba(0, 18, 46, .78);
  border-color: rgba(72, 159, 223, .2);
}

#reonicOrderDetailPanel .preparationUploadCard {
  padding: clamp(24px, 2.2vw, 36px);
}

#reonicOrderDetailPanel .preparationDropZone {
  min-height: 116px;
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  align-items: center;
  column-gap: 24px;
  padding: 22px 28px;
  border-radius: 14px;
  border: 1px dashed rgba(72, 159, 223, .58);
  background: rgba(0, 22, 58, .62);
}

.tableSortButton {
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.tableSortButton:hover {
  color: var(--accent);
}

.reonicImageGallery {
  gap: 14px;
}

.reonicDocumentCard {
  gap: 14px;
}

.reonicDocumentList {
  display: grid;
  gap: 10px;
}

.reonicDocumentLink {
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.74);
  color: var(--ink);
  text-decoration: none;
}

.reonicDocumentLink:hover {
  border-color: var(--accent);
}

.reonicDocumentBadge {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.reonicDocumentLink strong {
  overflow-wrap: anywhere;
}

.reonicImageGrid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 12px;
}

.reonicImageThumb {
  display: grid;
  gap: 7px;
  min-height: 0;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  overflow: hidden;
  cursor: pointer;
  text-align: left;
}

.reonicImageThumb img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  background: #eef4f8;
}

.reonicImageThumb span {
  padding: 0 9px 9px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.preparationUploadCard {
  gap: 14px;
}

.preparationDropZone {
  display: grid;
  gap: 5px;
  padding: 18px;
  border: 1px dashed #8db7cc;
  border-radius: 8px;
  background: #f5fbfe;
  cursor: pointer;
}

.preparationPdfDropZone {
  background: #fff8ef;
  border-style: solid;
  border-color: #efc28b;
}

.preparationDropZone input {
  display: none;
}

.preparationDropZone strong {
  color: var(--night);
}

.preparationDropZone span,
.preparationImageSummary span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.preparationImageSummary {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.preparationImageSummary span {
  padding: 7px 10px;
  border-radius: 8px;
  background: #eef7fb;
}

.preparationNotesGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.preparationNotesGrid label {
  display: grid;
  gap: 6px;
  color: var(--night);
  font-weight: 800;
}

.preparationNotesGrid textarea {
  width: 100%;
  min-height: 108px;
  resize: vertical;
}

.preparationImageGrid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 14px;
}

.preparationImageCard {
  display: grid;
  gap: 9px;
  align-items: start;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.preparationImagePreview {
  min-height: 0;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 14px;
  background:
    linear-gradient(145deg, rgba(3, 10, 30, .72), rgba(12, 24, 58, .48));
  cursor: pointer;
  overflow: hidden;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

.preparationImagePreview img {
  width: 100%;
  aspect-ratio: 4 / 3;
  display: block;
  object-fit: contain;
  background: transparent;
}

.preparationImageCard strong {
  display: block;
  margin-bottom: 7px;
  font-size: 13px;
  overflow-wrap: anywhere;
}

.preparationImageCard select {
  width: 100%;
  min-height: 36px;
  margin-bottom: 8px;
}

.imagePreviewOverlay {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(20, 27, 77, 0.78);
}

.imagePreviewFrame {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  max-width: calc(100vw - 48px);
  max-height: calc(100vh - 48px);
}

.imagePreviewOverlay figure {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  max-width: min(1040px, calc(100vw - 88px));
  max-height: calc(100vh - 88px);
  margin: 0;
}

.imagePreviewOverlay img {
  max-width: 100%;
  max-height: calc(100vh - 132px);
  display: block;
  margin: 0 auto;
  object-fit: contain;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 28px 80px rgba(0, 0, 0, .36);
}

.imagePreviewOverlay figcaption {
  color: #ffffff;
  font-weight: 800;
  text-align: center;
}

.imagePreviewClose {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  width: 44px;
  height: 44px;
  min-height: 0;
  padding: 0;
  border-radius: 999px;
  border: 0;
  background: #ffffff;
  color: var(--night);
  font-size: 30px;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 12px 32px rgba(3, 9, 28, .34);
}

.imagePreviewNav {
  position: absolute;
  top: 50%;
  z-index: 2;
  width: 48px;
  height: 48px;
  min-height: 0;
  padding: 0;
  transform: translateY(-50%);
  border: 1px solid rgba(255, 255, 255, .26);
  border-radius: 999px;
  background: rgba(20, 27, 77, .72);
  color: #ffffff;
  font-size: 40px;
  line-height: 42px;
  cursor: pointer;
  box-shadow: 0 18px 42px rgba(3, 9, 28, .32);
  backdrop-filter: blur(12px);
}

.imagePreviewNav:hover,
.imagePreviewClose:hover {
  transform: translateY(-50%) scale(1.03);
}

.imagePreviewClose:hover {
  transform: scale(1.03);
}

.imagePreviewNavPrev {
  left: 10px;
}

.imagePreviewNavNext {
  right: 10px;
}

.imagePreviewNav[hidden] {
  display: none;
}

.reonicChangeModal > .imagePreviewClose,
.reviewModal > .imagePreviewClose {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 42px;
  min-height: 42px;
  padding: 0;
}

.reonicOptionCard {
  display: grid;
  gap: 16px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.reonicOptionHead {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.reonicOptionHead span {
  display: block;
  color: var(--muted);
  font-size: 13px;
}

.reonicOptionHead strong {
  display: block;
  margin-top: 3px;
  font-size: 20px;
}

.componentGroup {
  display: grid;
  gap: 8px;
}

.componentGroup h4 {
  margin: 0;
  font-size: 15px;
}

.componentGroup ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.componentGroup li {
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
}

.componentGroup li span {
  color: var(--muted);
  font-size: 13px;
}

.roofTileWarning {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 2px solid #b42318;
  border-radius: 8px;
  background: #feecec;
}

.roofTileWarning strong {
  color: #9b1c1c;
  font-size: 18px;
}

.roofTileWarning p {
  margin: 5px 0 0;
  color: var(--night);
  font-weight: 700;
}

.roofTileWarning ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.roofTileWarning li {
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border-radius: 8px;
  background: #ffffff;
}

.roofTileWarning li span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}

.roofTileForm {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.roofTileForm label {
  display: grid;
  gap: 6px;
  font-weight: 800;
}

.roofTileForm input {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.calendarCheckGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.calendarCheckItem {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
}

.calendarCheckItem span {
  color: var(--muted);
  font-size: 13px;
}

.calendarCheckItem p {
  margin: 0;
  font-weight: 700;
}

.calendarFound {
  color: var(--paid);
}

.calendarMissing {
  color: #806000;
}

.deliveryDateBox {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
}

.deliveryDateBox label {
  font-weight: 800;
}

.deliveryDateBox input {
  width: 100%;
}

.substructureBox {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.substructureToggle {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 800;
}

.substructureToggle input {
  width: 18px;
  height: 18px;
  margin: 0;
}

.substructurePreviewGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.substructureSummaryCard {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
}

.substructureSummaryCard strong,
.substructureSummaryCard p {
  margin: 0;
}

.deliveryDateBox .secondaryButton {
  width: 100%;
}

.orderStatusRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.orderStatusRow p {
  margin: 0;
}

.orderStatusRow .secondaryButton {
  width: auto;
}

.printOrderButton {
  width: 100%;
}

.orderActionGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.billingCard {
  gap: 14px;
}

.billingToggleRow {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.billingToggleButton {
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
  color: var(--night);
  font-weight: 800;
}

.billingToggleButton.is-selected,
.billingToggleButton.is-selected:hover,
.billingToggleButton.is-selected:focus-visible {
  border-color: var(--night);
  background: var(--night);
  color: #ffffff;
  box-shadow: 0 0 0 3px rgba(65, 160, 222, 0.22);
}

.billingSummaryBox {
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
}

.protocolBillingNotice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 14px;
  border: 1px solid rgba(72, 159, 223, 0.36);
  border-radius: 8px;
  background: rgba(72, 159, 223, 0.12);
}

.protocolBillingNotice > div {
  display: grid;
  gap: 3px;
}

.protocolBillingNotice strong {
  color: #ffffff;
}

.protocolBillingNotice span {
  color: rgba(255, 255, 255, 0.74);
  font-weight: 700;
}

.protocolBillingNotice button {
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid rgba(72, 159, 223, 0.54);
  border-radius: 8px;
  color: #ffffff;
  background: linear-gradient(135deg, rgba(72, 159, 223, 0.92), rgba(47, 120, 190, 0.86));
  font-weight: 900;
}

.protocolBillingNotice button:disabled {
  opacity: 0.48;
  cursor: not-allowed;
}

.billingSummaryBox strong {
  color: var(--night);
}

.billingPaymentPanel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff5f5;
}

.billingPaymentPanel.is-paid {
  background: #effaf3;
  border-color: #cbeed6;
}

.billingPaymentPanel.is-open {
  background: #fff1f1;
  border-color: #f2c5c5;
}

.billingPaymentPanel div {
  display: grid;
  gap: 3px;
}

.billingPaymentPanel span {
  color: var(--muted);
  font-weight: 800;
}

.billingPaymentPanel strong {
  color: var(--night);
  font-size: 1.4rem;
}

.billingPaymentPanel small {
  color: var(--muted);
  font-weight: 800;
}

.billingPaymentBadge,
.billingPaidButton {
  min-height: 40px;
  padding: 0 18px;
  border: 0;
  border-radius: 8px;
  font-weight: 900;
  white-space: nowrap;
}

.billingPaymentBadge {
  display: inline-flex;
  align-items: center;
  background: #dff5e7;
  color: #14783f;
}

.billingPaymentBadge.is-open {
  background: #ffefe1;
  color: #b84b00;
}

.billingPaymentTerms {
  display: grid;
  gap: 6px;
  margin: 12px 0;
  color: var(--muted);
  font-weight: 900;
}

.billingPaymentTerms input {
  min-height: 46px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
  color: var(--night);
  font: inherit;
  font-weight: 800;
  padding: 0 12px;
}

.billingPaidButton {
  background: #c6281d;
  color: #ffffff;
  cursor: pointer;
}

.billingPaidButton:disabled {
  opacity: 0.55;
  cursor: wait;
}

.printArea {
  display: none;
}

.printDocument {
  color: var(--night);
  font-family: Arial, sans-serif;
}

.printHeader {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 20px;
}

.printLogo {
  width: 110px;
  height: 110px;
  object-fit: contain;
}

.printDocument h1 {
  margin: 0 0 6px;
  font-size: 30px;
}

.printDocument h2 {
  margin: 26px 0 10px;
  font-size: 18px;
}

.printDocument p {
  margin: 4px 0;
}

.printDocument table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 14px;
}

.printDocument th,
.printDocument td {
  border: 1px solid #d9e3ea;
  padding: 9px;
  text-align: left;
  font-size: 13px;
}

.printDocument th {
  background: #eef4f7;
}

.printMeta {
  margin-top: 8px;
  color: var(--muted);
}

.preparationPrintPage {
  min-height: 270mm;
}

.preparationPrintTop {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 18px;
}

.preparationPrintComponents {
  display: grid;
  gap: 12px;
}

.preparationPrintComponents h3 {
  margin: 10px 0 0;
  font-size: 14px;
}

.preparationPrintNotes {
  padding: 9px 10px;
  border: 1px solid #d9e3ea;
  background: #f8fbfe;
  font-size: 12px;
  line-height: 1.45;
  break-inside: avoid;
  page-break-inside: avoid;
}

.preparationPrintImages {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.preparationPrintImages figure {
  margin: 0;
  break-inside: avoid;
  page-break-inside: avoid;
  break-before: page;
  page-break-before: always;
}

.preparationPrintImages img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border: 1px solid #d9e3ea;
  display: block;
}

.printPageBreak {
  break-before: page;
  page-break-before: always;
}

.smartMeterBox,
.smartMeterWarning,
.smartMeterOk {
  border-radius: 8px;
}

.smartMeterBox {
  padding: 12px;
  background: #f8fbfe;
  border: 1px solid var(--line);
}

.smartMeterBox p {
  margin: 5px 0 0;
  color: var(--muted);
}

.smartMeterWarning,
.smartMeterOk {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 10px;
  font-weight: 700;
}

.smartMeterWarning {
  color: #9b1c1c;
  background: #feecec;
}

.smartMeterOk {
  color: var(--paid);
  background: #eaf8ee;
}

.helpButton {
  width: 100%;
  background: var(--night);
}

.helpSteps {
  display: grid;
  gap: 14px;
}

.helpSteps article {
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfe;
}

.helpSteps strong {
  display: block;
  margin-bottom: 8px;
  font-size: 18px;
}

.helpSteps p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.emailHistoryList {
  grid-column: 1 / -1;
  display: grid;
  gap: 10px;
}

.emailHistoryItem {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #ffffff;
}

.emailHistoryItem span {
  color: var(--muted);
  font-size: 13px;
}

.emailHistoryItem small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.reonicEmailHistoryList {
  display: grid;
  gap: 10px;
}

table {
  width: 100%;
  min-width: 560px;
  border-collapse: collapse;
  background: var(--surface);
}

th,
td {
  padding: 14px;
  text-align: left;
  border-bottom: 1px solid var(--line);
  overflow-wrap: anywhere;
}

th {
  color: var(--muted);
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0;
}

tr:last-child td {
  border-bottom: 0;
}

.tableSubtext {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}

.clickableRow,
.clickableReonicRow {
  cursor: pointer;
}

.clickableRow:hover,
.clickableEmployeeRow:hover,
.clickableCustomerRow:hover,
.clickableReonicRow:hover {
  background: rgba(255, 255, 255, .035);
}

.clickableReonicRow .montageProtocolNotice {
  display: inline-flex;
  margin-top: 8px;
  font-size: 12px;
  font-weight: 850;
  line-height: 1.2;
}

.status {
  display: inline-flex;
  min-width: 112px;
  justify-content: center;
  padding: 6px 10px;
  border-radius: 8px;
  font-weight: 700;
  font-size: 13px;
}

.status.offen {
  color: var(--open);
  background: #eaf4ff;
}

.status.in_bearbeitung {
  color: var(--work);
  background: #fff4dd;
}

.status.ausgezahlt {
  color: var(--paid);
  background: #eaf8ee;
}

.status.zur_auszahlung_bereit {
  color: #1f7a52;
  background: #eaf8ee;
}

.status.payout_requested {
  color: #806000;
  background: #fff4dd;
}

.status.reonicStatus {
  color: var(--night);
  background: #eef4f7;
}

.approvePayoutButton,
.projectDoneButton,
.resendOverviewButton,
.openReonicDetailButton,
.editEmployeeButton {
  min-height: 42px;
  padding: 0 14px;
  border: 0;
  border-radius: 8px;
  color: #ffffff;
  background: var(--paid);
  cursor: pointer;
  font-weight: 700;
}

.approvePayoutButton:hover,
.projectDoneButton:hover,
.resendOverviewButton:hover,
.openReonicDetailButton:hover,
.editEmployeeButton:hover {
  background: #176642;
}

.resendOverviewButton,
.openReonicDetailButton,
.editEmployeeButton {
  background: var(--mid);
}

.resendOverviewButton:hover,
.openReonicDetailButton:hover,
.editEmployeeButton:hover {
  background: var(--night);
}

.empty {
  margin: 18px 0 0;
  color: var(--muted);
  font-weight: 700;
}

.mutedText {
  color: var(--muted);
}

.noteText {
  display: inline-block;
  margin-top: 4px;
  color: var(--muted);
}

.demoAccess {
  width: min(760px, 100%);
  padding: 14px 18px;
  color: #ffffff;
  background: rgba(20, 27, 77, 0.72);
  border-radius: 8px;
}

.demoAccess p {
  margin: 4px 0;
}

.hidden {
  display: none !important;
}

body.partnerAccountMode .employeeAccountField {
  display: none !important;
}

@media (max-width: 640px) {
  body {
    background-attachment: scroll;
  }

  .shell {
    width: min(1040px, calc(100% - 20px));
    padding-top: 28px;
    padding-bottom: 20px;
    align-content: start;
  }

  .panel {
    padding: 18px;
  }

  .brandLogo {
    width: min(260px, 76vw);
    margin-bottom: 18px;
  }

  .brand h1 {
    font-size: 34px;
  }

  .brand p {
    font-size: 17px;
  }

  .choiceGrid,
  .dashboardHead {
    grid-template-columns: 1fr;
    display: grid;
  }

  body.portalHub #choiceView::before {
    min-height: 150px;
  }

  .portalHubButton {
    min-height: 92px;
  }

  .advisorCard {
    width: 100%;
    align-items: flex-start;
    min-height: 0;
  }

  .employeePhotoButton {
    width: min(220px, 100%);
    height: auto;
  }

  .dashboardActions {
    justify-content: stretch;
  }

  body.partnerDashboardHome .dashboardHeadModern {
    grid-template-columns: 1fr;
  }

  .hamburgerMenuButton {
    top: 0;
    right: 0;
  }

  .hamburgerMenuPanel {
    top: 56px;
    right: 0;
  }

  .orderStatusRow {
    grid-template-columns: 1fr;
  }

  .roofTileForm {
    grid-template-columns: 1fr;
  }

  .calendarCheckGrid {
    grid-template-columns: 1fr;
  }

  .substructurePreviewGrid {
    grid-template-columns: 1fr;
  }

  .dashboardActions button {
    width: 100%;
  }

  .loginLinks {
    display: grid;
    justify-content: stretch;
  }

  .formGrid {
    grid-template-columns: 1fr;
  }

  .profileEditor {
    grid-template-columns: 1fr;
  }

  #profileView .profileEditor {
    grid-template-columns: 1fr;
  }

  .formActions {
    grid-template-columns: 1fr;
  }

  .creditSummary {
    grid-template-columns: 1fr;
  }

  .adminSummary {
    grid-template-columns: 1fr;
  }

  .reviewBox {
    display: grid;
  }

  .reviewActions {
    justify-content: stretch;
  }

  .reviewModalActions {
    grid-template-columns: 1fr;
  }

  .reviewModal,
  .reonicChangeModal {
    padding: 18px;
  }

  .partnerAdminDetailHeader {
    grid-template-columns: 1fr;
  }

  .partnerAdminDetailLogo {
    width: 84px;
    height: 84px;
  }

  .reviewActions > * {
    width: 100%;
    justify-content: center;
  }

  .secondaryButton {
    width: 100%;
  }

  .bigInviteButton {
    min-height: 56px;
    padding: 12px 16px;
    white-space: normal;
  }

  .customerActionBox {
    grid-template-columns: 1fr;
    padding: 18px;
  }

  .customerActionBox strong {
    font-size: 22px;
  }

  .preparationNotesGrid {
    grid-template-columns: 1fr;
  }

  .partnerProjectCard {
    padding: 16px;
  }

  .partnerProjectsHeader {
    display: none;
  }

  .partnerProjectMain,
  .adminPartnerOrdersMain {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .partnerProjectField {
    gap: 6px;
  }

  .partnerProjectLabelInline {
    display: block;
  }

  .partnerAdminOverviewCard,
  body.adminPartnerCompact .partnerAdminDetailBox {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .partnerAdminOverviewPrimary {
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 12px;
  }

  .partnerAdminDetailLogo {
    width: 72px;
    height: 72px;
  }

  .partnerAdminOverviewProjects .partnerAdminOrdersList,
  .partnerAdminOrdersList {
    max-height: 220px;
  }

  .partnerProjectHoverPreview {
    top: auto;
    left: 12px;
    right: 12px;
    bottom: 12px;
    width: auto;
  }

  .partnerPriceRuleGrid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .partnerHomeActionGrid,
  .reonicChangeChecklist {
    grid-template-columns: 1fr;
  }

  .tableWrap {
    border: 0;
    overflow: visible;
  }

  table,
  thead,
  tbody,
  tr,
  th,
  td {
    display: block;
  }

  table {
    min-width: 0;
    background: transparent;
  }

  thead {
    display: none;
  }

  tbody {
    display: grid;
    gap: 12px;
  }

  tr {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
    overflow: hidden;
  }

  td {
    display: grid;
    grid-template-columns: minmax(104px, 38%) minmax(0, 1fr);
    gap: 10px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
  }

  td::before {
    content: attr(data-label);
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
  }

  td:last-child {
    border-bottom: 0;
  }

  .status,
  .reviewStatus,
  .friendStatus {
    min-width: 0;
    width: fit-content;
  }
}

@media (max-width: 980px) {
  body.sidebarCollapsed .appLayout {
    grid-template-columns: 64px minmax(0, 1fr);
  }

  .partnerProjectsHeader {
    display: none;
  }

  .partnerProjectMain,
  .adminPartnerOrdersMain {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 18px;
  }

  .partnerProjectLabelInline {
    display: block;
  }

  .partnerAdminOverviewCard {
    grid-template-columns: 1fr;
  }

  .partnerAdminOverviewProjects,
  .partnerAdminOverviewActions {
    width: 100%;
  }

  .partnerAdminOverviewActions {
    grid-template-columns: 1fr;
  }

  .partnerPriceRuleGrid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  body.dashboardMode .shell {
    width: 100%;
    padding: 8px 8px 18px;
  }

  .appLayout,
  body.sidebarCollapsed .appLayout {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
  }

  .appContent {
    gap: 12px;
  }

  .dashboardHeadModern,
  .panel,
  .partnerProjectsMapCard,
  .partnerAdminOverviewCard,
  .partnerAdminDetailBox,
  .partnerOrderDetailBox,
  .reonicDetailBox,
  .customerActionBox {
    padding: 16px;
  }

  .partnerProjectsMapHead,
  .partnerProjectsMapFilters {
    align-items: stretch;
  }

  .partnerProjectsMapFilters,
  .partnerProjectsMapFilters label {
    width: 100%;
  }

  #montageMapPanel .partnerProjectsMapHead,
  #montageMapPanel .partnerProjectsMapFilters {
    grid-template-columns: 1fr;
    min-width: 0;
  }

  .partnerProjectsMapFilters select,
  .partnerProjectsMapFilters button,
  input,
  select,
  textarea {
    max-width: 100%;
    font-size: 16px;
  }

  .partnerProjectsMapCanvas {
    min-height: 360px;
  }

  .partnerOrderMapPopup .leaflet-popup-content {
    min-width: 220px;
    max-width: calc(100vw - 56px);
  }

  .partnerProjectHoverGrid {
    grid-template-columns: 1fr;
  }

  .partnerProjectMain,
  .adminPartnerOrdersMain,
  .accountingInvoiceCard {
    grid-template-columns: 1fr;
  }

  .partnerOrderDetailMeta,
  .partnerProjectsTitleRow {
    flex-wrap: wrap;
  }

  .partnerOrderCostEstimateRow,
  .partnerOrderDetailActions,
  .formActions {
    grid-template-columns: 1fr;
  }

}

@media (max-width: 420px) {
  .brand h1,
  .welcomeTitle,
  .partnerAdminOverviewHead h3,
  .partnerProjectsTitleText {
    font-size: 30px;
  }

  .partnerProjectCard,
  .partnerAdminOverviewCard {
    padding: 14px;
  }

  .mobileSidebarButton,
  body.sidebarCollapsed .sidebarArrowButton {
    width: 40px;
    min-width: 40px;
    height: 40px;
  }
}

/* Premium Autarkieprofis OS visual layer
   Pure presentation layer: keeps existing markup, state and workflows intact. */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(2, 9, 20, 0.72), rgba(20, 27, 77, 0.28) 44%, rgba(2, 9, 20, 0.74)),
    radial-gradient(circle at 18% 16%, rgba(72, 159, 223, 0.16), transparent 28%),
    radial-gradient(circle at 84% 74%, rgba(72, 159, 223, 0.12), transparent 30%);
}

body,
.shell,
.appContent {
  letter-spacing: 0;
}

.panel,
.authOverlayPanel,
.dashboardHeadModern,
.partnerSubmitModalCard,
.partnerAdminOverviewCard,
.partnerAdminDetailBox,
.partnerOrderDetailBox,
.partnerProjectsMapCard,
.partnerHomeHero,
.partnerHomeActionCard,
.partnerProjectCard,
.partnerProjectDetailCard,
.reonicDetailBox,
.customerActionBox,
.noticeBox,
.emailAutomationCard,
.tableWrap:not(.reonicKanbanWrap),
.modal,
.mapContainer,
.billingPanel,
.accountingCard,
.settingsCard {
  color: var(--ap-white);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: var(--ap-radius-lg);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.06)),
    linear-gradient(180deg, rgba(8, 24, 51, 0.82), rgba(9, 28, 61, 0.66));
  box-shadow: var(--ap-shadow);
  backdrop-filter: blur(24px) saturate(1.22);
  -webkit-backdrop-filter: blur(24px) saturate(1.22);
}

.panel {
  width: min(940px, 100%);
}

.appLayout {
  gap: 26px;
}

.appSidebar {
  top: 18px;
  padding: 22px;
  gap: 12px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: var(--ap-radius-lg);
  background:
    linear-gradient(180deg, rgba(20, 27, 77, 0.76), rgba(2, 9, 20, 0.72)),
    linear-gradient(140deg, rgba(72, 159, 223, 0.16), transparent 44%);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.44), inset 0 1px 0 rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(24px) saturate(1.22);
  -webkit-backdrop-filter: blur(24px) saturate(1.22);
}

.sidebarNav {
  gap: 8px;
}

.sidebarSectionTitle,
.eyebrow,
.step {
  color: rgba(255, 255, 255, 0.86);
  letter-spacing: 0;
}

.sidebarNavButton,
.sidebarFooterButton,
.linkButton {
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.82);
  transition: transform 180ms ease, background 180ms ease, color 180ms ease, box-shadow 180ms ease;
}

.sidebarNavButton:hover,
.sidebarFooterButton:hover,
.linkButton:hover {
  color: var(--ap-white);
  background: rgba(72, 159, 223, 0.16);
  box-shadow: var(--ap-glow);
  transform: translateY(-1px);
}

.sidebarTop,
.sidebarNav {
  border-color: rgba(72, 159, 223, 0.22);
}

.sidebarNotificationButton,
.sidebarCollapseButton,
.hamburgerMenuButton,
.mobileSidebarButton {
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 16px;
  color: var(--ap-white);
  background: rgba(255, 255, 255, 0.1);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.sidebarNotificationButton:hover,
.sidebarCollapseButton:hover,
.hamburgerMenuButton:hover,
.mobileSidebarButton:hover {
  background: rgba(72, 159, 223, 0.2);
  box-shadow: var(--ap-glow);
  transform: translateY(-1px);
}

.hamburgerMenuButton span,
.mobileSidebarButton span {
  background: var(--ap-white);
}

.notificationPanel,
.projectHoverCard,
.mapProjectTooltip {
  color: var(--ap-white);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 20px;
  background: rgba(8, 24, 51, 0.9);
  box-shadow: 0 22px 70px rgba(0, 0, 0, 0.42);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}

.dashboardHeadModern {
  position: relative;
  overflow: hidden;
  min-height: 300px;
  display: grid;
  align-content: end;
  padding: clamp(28px, 4vw, 56px);
  border-radius: var(--ap-radius-xl);
  background:
    linear-gradient(90deg, rgba(2, 9, 20, 0.86), rgba(20, 27, 77, 0.52) 58%, rgba(2, 9, 20, 0.5)),
    url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center/cover;
  box-shadow: 0 32px 110px rgba(0, 0, 0, 0.46);
}

.dashboardHeadModern::after {
  content: "";
  position: absolute;
  left: clamp(26px, 4vw, 56px);
  right: clamp(26px, 4vw, 56px);
  bottom: 28px;
  height: 1px;
  background: linear-gradient(90deg, rgba(72, 159, 223, 0.58), transparent);
  opacity: 0.85;
}

.dashboardHeadModern > * {
  position: relative;
  z-index: 1;
}

.dashboardHeadModern h1,
.dashboardHeadModern h2,
.brand h1 {
  color: var(--ap-white);
  font-weight: 800;
  line-height: 0.98;
  letter-spacing: 0;
  text-shadow: 0 18px 42px rgba(0, 0, 0, 0.38);
}

.brand {
  min-height: 54vh;
  display: grid;
  place-items: center;
  align-content: center;
  text-align: center;
  padding: clamp(48px, 7vw, 96px) 20px 28px;
}

.brandLogo {
  filter: drop-shadow(0 18px 42px rgba(0, 0, 0, 0.36));
}

#choiceView,
#loginView,
#resetPasswordView,
#forcePasswordView {
  margin: 0 auto;
}

.choiceGrid {
  gap: 18px;
}

button:not([class]),
.choiceButton,
.primaryButton,
.secondaryButton,
.dangerButton,
.approvePayoutButton,
.projectDoneButton,
.resendOverviewButton,
.openReonicDetailButton,
.editEmployeeButton,
.partnerSubmitModalActions button,
.partnerSubmitModalActions .secondaryButton {
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  color: var(--ap-white);
  background:
    linear-gradient(135deg, rgba(72, 159, 223, 0.96), rgba(72, 159, 223, 0.72));
  box-shadow: 0 14px 36px rgba(72, 159, 223, 0.24);
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease, border-color 180ms ease;
}

button:not([class]):hover,
.choiceButton:hover,
.primaryButton:hover,
.secondaryButton:hover,
.dangerButton:hover,
.approvePayoutButton:hover,
.projectDoneButton:hover,
.resendOverviewButton:hover,
.openReonicDetailButton:hover,
.editEmployeeButton:hover,
.partnerSubmitModalActions button:hover {
  background:
    linear-gradient(135deg, rgba(72, 159, 223, 1), rgba(255, 255, 255, 0.18));
  border-color: rgba(72, 159, 223, 0.64);
  box-shadow: var(--ap-glow), 0 18px 46px rgba(0, 0, 0, 0.28);
  transform: translateY(-2px);
}

button:disabled,
button[disabled] {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none !important;
}

input,
select,
textarea {
  color: var(--ap-white);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

input::placeholder,
textarea::placeholder {
  color: rgba(255, 255, 255, 0.48);
}

input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: rgba(72, 159, 223, 0.72);
  box-shadow: 0 0 0 4px rgba(72, 159, 223, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

label,
.muted,
.helperText,
.dashboardText,
.projectMeta,
.partnerProjectMeta,
.formHint,
.tableHint {
  color: rgba(255, 255, 255, 0.72);
}

table,
.dataTable,
.partnerOrdersGrid,
.projectList,
.cardGrid {
  color: var(--ap-white);
}

th,
.projectColumnHeader,
.partnerOrdersHeader {
  color: rgba(255, 255, 255, 0.72);
  letter-spacing: 0;
}

tr,
.clickableRow,
.clickableEmployeeRow,
.clickableCustomerRow,
.clickableReonicRow,
.partnerOrderRow,
.partnerProjectRow,
.projectCard,
.statCard,
.kpiCard,
.fileCard,
.imageCard,
.assetCard {
  border-color: rgba(72, 159, 223, 0.18);
  background: rgba(255, 255, 255, 0.06);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.clickableRow:hover,
.clickableEmployeeRow:hover,
.clickableCustomerRow:hover,
.clickableReonicRow:hover,
.partnerOrderRow:hover,
.partnerProjectRow:hover {
  background: rgba(255, 255, 255, .035);
  border-color: rgba(72, 159, 223, .18);
  box-shadow: none;
  transform: none;
}

.projectCard:hover,
.statCard:hover,
.kpiCard:hover,
.fileCard:hover,
.imageCard:hover,
.assetCard:hover {
  background: rgba(72, 159, 223, 0.12);
  border-color: rgba(72, 159, 223, 0.44);
  box-shadow: var(--ap-glow);
  transform: translateY(-2px);
}

.status,
.status.offen,
.status.in_bearbeitung,
.status.ausgezahlt,
.status.zur_auszahlung_bereit,
.status.payout_requested,
.status.reonicStatus,
.projectStatusBadge,
.partnerStatusBadge,
.tag,
.badge {
  min-width: 112px;
  border: 1px solid rgba(72, 159, 223, 0.28);
  border-radius: 999px;
  color: var(--ap-white);
  background: rgba(72, 159, 223, 0.18);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.toast {
  border-radius: 18px;
  background: rgba(8, 24, 51, 0.92);
  color: var(--ap-white);
  border: 1px solid rgba(72, 159, 223, 0.28);
  box-shadow: var(--ap-shadow);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.globalLoadingIndicator,
.partnerSubmitModalCard {
  border-radius: 26px;
}

@keyframes apFadeUp {
  from {
    opacity: 0;
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.panel,
.dashboardHeadModern,
.partnerAdminOverviewCard,
.partnerOrderDetailBox,
.reonicDetailBox,
.tableWrap {
  animation: apFadeUp 360ms ease both;
}

@media (max-width: 780px) {
  .panel,
  .authOverlayPanel,
  .dashboardHeadModern {
    border-radius: 22px;
  }

  .dashboardHeadModern {
    min-height: 230px;
    padding: 26px 20px;
  }

  .brand {
    min-height: 48vh;
    padding-top: 78px;
  }
}

/* Premium Autarkieprofis OS visual layer - pass 2
   Pure visual polish: deeper cinematic glass, sharper brand rhythm, no workflow changes. */
:root {
  --ap-premium-glass: linear-gradient(145deg, rgba(10, 20, 54, 0.82), rgba(20, 27, 77, 0.58));
  --ap-premium-glass-soft: linear-gradient(145deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.055));
  --ap-premium-line: rgba(255, 255, 255, 0.18);
  --ap-premium-blue-line: rgba(72, 159, 223, 0.38);
  --ap-premium-glow: 0 0 42px rgba(72, 159, 223, 0.22);
  --ap-premium-shadow: 0 28px 90px rgba(0, 0, 0, 0.34);
  --ap-premium-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}

.appShell,
.mainContent,
.shell {
  isolation: isolate;
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  background:
    radial-gradient(circle at 74% 10%, rgba(72, 159, 223, 0.16), transparent 28%),
    radial-gradient(circle at 28% 84%, rgba(255, 255, 255, 0.08), transparent 24%),
    linear-gradient(120deg, rgba(20, 27, 77, 0.18), transparent 42%, rgba(72, 159, 223, 0.08));
  mix-blend-mode: screen;
}

.panel,
.authOverlayPanel,
.modal,
.dashboardHeadModern,
.partnerAdminOverviewCard,
.partnerOrderDetailBox,
.reonicDetailBox,
.tableWrap:not(.reonicKanbanWrap),
.partnerCostPreview,
.partnerSummaryCard,
.partnerProjectCard,
.accountingCard,
.emailAutomationCard {
  border-color: var(--ap-premium-line);
  box-shadow:
    var(--ap-premium-shadow),
    inset 0 1px 0 rgba(255, 255, 255, 0.16),
    inset 0 -1px 0 rgba(72, 159, 223, 0.1);
  backdrop-filter: blur(30px) saturate(132%);
  -webkit-backdrop-filter: blur(30px) saturate(132%);
}

.panel:hover,
.partnerAdminOverviewCard:hover,
.partnerOrderDetailBox:hover,
.partnerProjectCard:hover,
.reonicDetailBox:hover {
  border-color: var(--ap-premium-blue-line);
  box-shadow:
    0 34px 104px rgba(0, 0, 0, 0.38),
    var(--ap-premium-glow),
    inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.dashboardHeadModern {
  overflow: hidden;
}

.dashboardHeadModern::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 78% 16%, rgba(255, 255, 255, 0.22), transparent 22%),
    linear-gradient(100deg, rgba(20, 27, 77, 0.94) 0%, rgba(20, 27, 77, 0.6) 42%, rgba(72, 159, 223, 0.14) 100%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.08), transparent 60%);
}

.dashboardHeadModern > * {
  position: relative;
  z-index: 1;
}

.dashboardHeadModern h1,
.dashboardHeadModern h2,
.brand h1 {
  letter-spacing: 0;
  text-shadow: 0 16px 46px rgba(0, 0, 0, 0.28);
}

.dashboardHeadModern .meta,
.dashboardHeadModern p,
.muted,
.smallMuted {
  color: rgba(255, 255, 255, 0.74);
}

.appSidebar {
  box-shadow:
    0 30px 90px rgba(0, 0, 0, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.18),
    inset -1px 0 0 rgba(72, 159, 223, 0.12);
}

.sidebarDivider {
  background: linear-gradient(90deg, transparent, rgba(72, 159, 223, 0.42), transparent);
}

.sidebarNavButton,
.sidebarSectionTitleButton,
.sidebarToggleButton,
.sidebarBellButton,
.miniMenuButton {
  transition:
    transform 180ms var(--ap-premium-ease),
    border-color 180ms var(--ap-premium-ease),
    background 180ms var(--ap-premium-ease),
    box-shadow 180ms var(--ap-premium-ease);
}

.sidebarNavButton:hover,
.sidebarSectionTitleButton:hover,
.sidebarToggleButton:hover,
.sidebarBellButton:hover,
.miniMenuButton:hover {
  transform: translateY(-1px);
  border-color: var(--ap-light);
  box-shadow: 0 12px 32px rgba(72, 159, 223, 0.2);
}

.sidebarNotificationPanel,
.notificationPanel {
  color: var(--ap-white);
  background:
    linear-gradient(145deg, rgba(9, 17, 46, 0.96), rgba(20, 27, 77, 0.92)),
    var(--ap-premium-glass);
  border: 1px solid rgba(255, 255, 255, 0.16);
  box-shadow: 0 26px 80px rgba(0, 0, 0, 0.42), 0 0 32px rgba(72, 159, 223, 0.18);
  backdrop-filter: blur(28px) saturate(132%);
  -webkit-backdrop-filter: blur(28px) saturate(132%);
}

.notificationItem,
.notificationEntry {
  color: var(--ap-white);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.08);
}

.notificationItem.unread,
.notificationEntry.unread {
  border-color: rgba(72, 159, 223, 0.7);
  background: rgba(72, 159, 223, 0.18);
  box-shadow: 0 14px 34px rgba(72, 159, 223, 0.18);
}

.choiceButton,
.primaryButton,
.secondaryButton,
.ghostButton,
.dangerButton,
.blueButton,
.formActions button,
.partnerSubmitModalActions button,
.partnerOrderDetailActions button,
button:not([class]) {
  min-height: 52px;
  border-radius: 999px;
  transition:
    transform 180ms var(--ap-premium-ease),
    background 180ms var(--ap-premium-ease),
    color 180ms var(--ap-premium-ease),
    box-shadow 180ms var(--ap-premium-ease);
}

.choiceButton:hover,
.primaryButton:hover,
.secondaryButton:hover,
.ghostButton:hover,
.blueButton:hover,
.formActions button:hover,
.partnerSubmitModalActions button:hover,
.partnerOrderDetailActions button:hover,
button:not([class]):hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 38px rgba(72, 159, 223, 0.28);
}

.secondaryButton,
.ghostButton,
.partnerSubmitModalActions .secondaryButton,
button:not([class]) {
  color: var(--ap-white);
  border: 1px solid rgba(72, 159, 223, 0.32);
  background: rgba(72, 159, 223, 0.22);
}

.secondaryButton:hover,
.ghostButton:hover,
.partnerSubmitModalActions .secondaryButton:hover,
button:not([class]):hover {
  background: var(--ap-night);
  border-color: var(--ap-light);
}

input[type="file"]::file-selector-button {
  margin-right: 12px;
  padding: 9px 16px;
  color: var(--ap-white);
  border: 0;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--ap-light), #66b9f6);
  font-family: inherit;
  font-weight: 800;
  box-shadow: 0 12px 28px rgba(72, 159, 223, 0.26);
}

input[type="file"]::file-selector-button:hover {
  background: var(--ap-night);
}

input,
select,
textarea {
  transition:
    border-color 160ms var(--ap-premium-ease),
    box-shadow 160ms var(--ap-premium-ease),
    background 160ms var(--ap-premium-ease);
}

input:focus,
select:focus,
textarea:focus {
  border-color: rgba(72, 159, 223, 0.82);
  box-shadow: 0 0 0 4px rgba(72, 159, 223, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

select option {
  color: var(--ap-night);
  background: var(--ap-white);
}

.tableWrap thead,
.partnerProjectsTable thead,
.reonicTable thead {
  color: rgba(255, 255, 255, 0.72);
}

.tableWrap tbody tr,
.partnerProjectsTable tbody tr,
.reonicTable tbody tr {
  transition:
    transform 180ms var(--ap-premium-ease),
    border-color 180ms var(--ap-premium-ease),
    background 180ms var(--ap-premium-ease),
    box-shadow 180ms var(--ap-premium-ease);
}

.tableWrap tbody tr:hover,
.partnerProjectsTable tbody tr:hover,
.reonicTable tbody tr:hover {
  transform: translateY(-1px);
  border-color: rgba(72, 159, 223, 0.45);
  background: rgba(72, 159, 223, 0.13);
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.18);
}

.modalCloseButton,
.partnerSubmitModalClose {
  color: var(--ap-white);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;
  background: rgba(20, 27, 77, 0.72);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
}

.modalCloseButton:hover,
.partnerSubmitModalClose:hover {
  color: var(--ap-white);
  background: var(--ap-light);
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.04);
}

::-webkit-scrollbar-thumb {
  border: 2px solid rgba(20, 27, 77, 0.72);
  border-radius: 999px;
  background: rgba(72, 159, 223, 0.72);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/* Sidebar and login brand seal refinements */
.brandLogo {
  width: clamp(112px, 13vw, 176px);
  height: auto;
  aspect-ratio: 1;
  object-fit: contain;
  margin-bottom: clamp(22px, 3vw, 34px);
}

.sidebarTop {
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 8px 10px;
}

.sidebarBrandTop {
  grid-column: 1;
  grid-row: 1;
  width: 168px;
  height: 42px;
  display: grid;
  place-items: center start;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.sidebarBrandTop img {
  width: auto;
  height: 42px;
  object-fit: contain;
  object-position: left center;
  display: block;
}

.sidebarNotificationWrap {
  grid-column: auto;
  grid-row: auto;
  justify-self: end;
}

.sidebarControls {
  grid-column: 4;
  grid-row: 1;
}

.sidebarInlineAdminPortalButton {
  width: fit-content;
  min-height: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.84);
  text-align: left;
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
}

body.portalBaustelle.roleAdmin .sidebarInlineLogoutButton {
  order: 1;
}

body.sidebarCollapsed .sidebarBrandTop {
  display: none;
}

/* Premium Autarkieprofis OS visual layer - pass 3 */
:root {
  --ap-premium-ring: 0 0 0 1px rgba(255, 255, 255, 0.14), 0 28px 90px rgba(3, 9, 28, 0.32);
  --ap-premium-glow: 0 18px 48px rgba(72, 159, 223, 0.2);
}

.appContent {
  gap: clamp(18px, 2.4vw, 30px);
}

.panel:not(#dashboardView),
.authOverlayPanel,
.dashboardHeadModern,
.tableWrap:not(.reonicKanbanWrap),
.partnerProjectListPanel,
.projectCard,
.partnerAdminOverviewCard,
.partnerProjectCard,
.statCard,
.noticeBox,
.loginForm,
.recommendationForm {
  position: relative;
  overflow: hidden;
}

.panel:not(#dashboardView)::before,
.authOverlayPanel::before,
.dashboardHeadModern::before,
.tableWrap:not(.reonicKanbanWrap)::before,
.partnerProjectListPanel::before,
.projectCard::before,
.partnerAdminOverviewCard::before,
.partnerProjectCard::before,
.statCard::before,
.noticeBox::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(72, 159, 223, 0.68), rgba(255, 255, 255, 0.44), transparent);
  opacity: 0.78;
}

.appSidebar {
  border-radius: 28px;
  box-shadow: var(--ap-premium-ring), inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.sidebarNotificationButton,
.sidebarToggleButton,
.sidebarHamburgerButton {
  transition:
    transform 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    box-shadow 180ms ease;
}

.sidebarNotificationButton:hover,
.sidebarToggleButton:hover,
.sidebarHamburgerButton:hover {
  transform: translateY(-1px);
  border-color: rgba(72, 159, 223, 0.46);
  background: rgba(72, 159, 223, 0.16);
  box-shadow: var(--ap-premium-glow), inset 0 1px 0 rgba(255, 255, 255, 0.16);
}

.sidebarNavButton,
.sidebarSectionTitleButton,
.sidebarInlineLogoutButton,
.sidebarInlineAdminPortalButton {
  border-radius: 16px;
  transition:
    transform 180ms ease,
    color 180ms ease,
    background 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.sidebarNavButton:hover,
.sidebarSectionTitleButton:hover,
.sidebarInlineLogoutButton:hover,
.sidebarInlineAdminPortalButton:hover {
  transform: translateX(3px);
  background: linear-gradient(135deg, rgba(72, 159, 223, 0.22), rgba(255, 255, 255, 0.08));
  border-color: rgba(72, 159, 223, 0.32);
}

.sidebarNavButton.active,
.sidebarNavButton.isActive,
.sidebarNavButton[aria-current="page"],
.sidebarSectionTitleButton.active,
.sidebarSectionTitleButton.isActive,
.sidebarSectionTitleButton[aria-current="page"] {
  color: var(--ap-white);
  background: linear-gradient(135deg, rgba(72, 159, 223, 0.34), rgba(255, 255, 255, 0.1));
  border-color: rgba(72, 159, 223, 0.44);
  box-shadow: var(--ap-premium-glow), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.sidebarNavButton:focus-visible,
.sidebarSectionTitleButton:focus-visible {
  outline: 2px solid rgba(72, 159, 223, 0.82);
  outline-offset: 3px;
}

.dashboardHeadModern {
  border-radius: 30px;
  min-height: clamp(260px, 35vw, 460px);
  box-shadow: var(--ap-premium-ring), 0 34px 110px rgba(4, 10, 35, 0.36);
}

.dashboardHeadModern::after {
  opacity: 0.92;
}

.dashboardTitle,
.dashboardHeadModern h1,
.panel h1,
.panel h2 {
  letter-spacing: 0;
}

.choiceGrid {
  align-items: stretch;
}

.choiceButton,
.primaryButton,
.secondaryButton,
.dangerButton,
.ghostButton,
.compactActionButton,
.adminActionButton {
  min-height: 48px;
}

.choiceButton,
.primaryButton,
.secondaryButton,
.adminActionButton {
  box-shadow: 0 16px 36px rgba(72, 159, 223, 0.18);
}

.tableWrap {
  padding: clamp(18px, 2.2vw, 28px);
}

.tableWrap table,
.projectListTable {
  border-collapse: separate;
  border-spacing: 0 12px;
}

.tableWrap.reonicTableWrap {
  padding: clamp(14px, 1.6vw, 22px);
  overflow-x: visible;
}

.tableWrap.reonicTableWrap .reonicTable {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0 10px;
  background: transparent;
}

.reonicTable th,
.reonicTable td {
  padding: 18px 20px;
  vertical-align: middle;
}

.reonicTable th:nth-child(1),
.reonicTable td:nth-child(1) {
  width: 50%;
}

.reonicTable th:nth-child(2),
.reonicTable td:nth-child(2) {
  width: 25%;
}

.reonicTable th:nth-child(3),
.reonicTable td:nth-child(3) {
  width: 12%;
}

.reonicTable th:nth-child(4),
.reonicTable td:nth-child(4) {
  width: 13%;
}

.reonicTable th:nth-child(3),
.reonicTable th:nth-child(4),
.reonicTable td:nth-child(3),
.reonicTable td:nth-child(4) {
  white-space: nowrap;
}

.reonicTable td:nth-child(3),
.reonicTable td:nth-child(4) {
  font-weight: 800;
}

.reonicTable .tableSubtext {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.reonicTable .status.reonicStatus {
  max-width: 100%;
  min-width: 0;
  white-space: nowrap;
}

.reonicTable .tableSortButton {
  white-space: nowrap;
}

@media (max-width: 1180px) {
  .tableWrap.reonicTableWrap {
    overflow-x: auto;
  }

  .tableWrap.reonicTableWrap .reonicTable {
    min-width: 860px;
  }
}

.tableWrap tbody tr,
.projectListTable .projectListRow {
  transition:
    transform 180ms ease,
    background 180ms ease,
    box-shadow 180ms ease,
    border-color 180ms ease;
}

.tableWrap tbody tr:hover,
.projectListTable .projectListRow:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 44px rgba(72, 159, 223, 0.14);
}

.notificationPanel,
.projectHoverPreview,
.mapHoverCard {
  border-radius: 22px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  box-shadow: 0 24px 72px rgba(3, 9, 28, 0.34);
  backdrop-filter: blur(24px) saturate(1.18);
  -webkit-backdrop-filter: blur(24px) saturate(1.18);
}

@media (max-width: 780px) {
  .appContent {
    gap: 16px;
  }

  .panel:not(#dashboardView),
  .authOverlayPanel,
  .dashboardHeadModern,
  .tableWrap,
  .partnerProjectListPanel {
    border-radius: 22px;
  }

  .dashboardHeadModern {
    min-height: 260px;
  }

  .choiceGrid {
    grid-template-columns: 1fr;
  }
}

/* Premium Autarkieprofis OS visual layer - pass 4 */
@keyframes ap-panel-reveal {
  from {
    opacity: 0;
    transform: translateY(14px) scale(.992);
    filter: blur(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
  }
}

@keyframes ap-soft-glow {
  0%, 100% { box-shadow: 0 20px 60px rgba(3, 9, 28, .22), 0 0 0 1px rgba(255, 255, 255, .08); }
  50% { box-shadow: 0 26px 78px rgba(72, 159, 223, .2), 0 0 0 1px rgba(72, 159, 223, .22); }
}

.dashboardHeadModern,
.portalHeroCard,
.tableWrap,
.referralCard,
.partnerProfileCard,
.partnerOrderCard,
.projectDetailCard,
.profileEditor,
.partnerSubmitPreview,
.partnerOrderCostEstimate,
.partnerOrderChatTop,
.modalCard,
.emailAutomationCard,
.adminAccountCard,
.billingPanel,
.mapPanel {
  animation: ap-panel-reveal .42s ease both;
}

.adminAccountsPanel {
  display: block;
}

.adminAccountTabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 0 0 18px;
  padding: 8px;
  border: 1px solid rgba(72, 159, 223, .22);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .09), rgba(255, 255, 255, .04)),
    rgba(20, 27, 77, .42);
}

.adminAccountTab {
  min-height: 48px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  color: rgba(255, 255, 255, .76);
  font: inherit;
  font-weight: 900;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease;
}

.adminAccountTab:hover {
  transform: translateY(-1px);
  border-color: rgba(255, 255, 255, .28);
  background: rgba(255, 255, 255, .12);
}

.adminAccountTab.is-active {
  color: #101839;
  border-color: rgba(255, 255, 255, .78);
  background: linear-gradient(180deg, #ffffff, rgba(255, 255, 255, .9));
  box-shadow: 0 14px 30px rgba(3, 9, 28, .22);
}

.adminAccountsLayout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 22px;
  align-items: start;
}

.adminAccountsList {
  display: grid;
  gap: 14px;
}

.adminAccountEmptyState {
  display: grid;
  gap: 6px;
  padding: 18px;
  border: 1px solid rgba(72, 159, 223, .24);
  border-radius: 14px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .04)),
    rgba(6, 18, 46, .66);
  color: rgba(255, 255, 255, .9);
}

.adminAccountEmptyState strong {
  font-size: 18px;
}

.adminAccountEmptyState span {
  color: rgba(255, 255, 255, .68);
  font-weight: 700;
}

.adminAccountCard,
.adminAccountForm {
  border: 1px solid rgba(72, 159, 223, .26);
  border-radius: 24px;
  background:
    linear-gradient(145deg, rgba(5, 18, 45, .92), rgba(20, 27, 77, .74)),
    rgba(20, 27, 77, .72);
  box-shadow: 0 18px 46px rgba(3, 9, 28, .28), inset 0 1px 0 rgba(255, 255, 255, .08);
}

.adminAccountCard {
  padding: 18px;
}

.adminAccountMain {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
}

.adminAccountMain div,
.adminAccountMeta,
.adminPermissionPills {
  min-width: 0;
}

.adminAccountMain span,
.adminPermissionPills em {
  display: block;
  color: rgba(72, 159, 223, .95);
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.adminAccountMain strong {
  display: block;
  margin-top: 4px;
  color: #fff;
  font-size: 20px;
  font-weight: 900;
}

.adminAccountMain small,
.adminAccountMeta span {
  color: rgba(255, 255, 255, .72);
  font-weight: 700;
}

.adminAccountMeta,
.adminPermissionPills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.adminAccountMeta span,
.adminPermissionPills span {
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 999px;
  background: rgba(255, 255, 255, .08);
  padding: 7px 11px;
  font-size: 13px;
}

.adminPermissionPills span {
  border-color: rgba(72, 159, 223, .28);
  background: rgba(72, 159, 223, .12);
  color: rgba(255, 255, 255, .9);
  font-weight: 800;
}

.adminAccountForm {
  padding: 20px;
  max-width: 980px;
}

.adminAccountForm .formHead.compact {
  margin-bottom: 16px;
}

.adminPermissionToggle,
.adminPermissionCheck {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(72, 159, 223, .22);
  border-radius: 16px;
  background: rgba(255, 255, 255, .06);
  color: rgba(255, 255, 255, .9);
  font-weight: 800;
}

.adminPermissionToggle {
  width: fit-content;
  margin: 14px 0 18px;
  padding: 10px 13px;
}

.adminPermissionGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 10px 0 18px;
}

.adminPermissionCheck {
  padding: 12px;
  min-height: 48px;
}

.adminPermissionCheck input,
.adminPermissionToggle input {
  accent-color: #489FDF;
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}

.ghostButton {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .14);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12);
}

@media (max-width: 1100px) {
  .adminAccountsLayout {
    grid-template-columns: 1fr;
  }

  .adminAccountForm {
    position: static;
  }
}

@media (max-width: 680px) {
  .adminAccountTabs {
    grid-template-columns: 1fr;
  }

  .adminAccountMain,
  .adminAccountsPanel .formHead {
    align-items: stretch;
    flex-direction: column;
  }

  .adminPermissionGrid {
    grid-template-columns: 1fr;
  }
}

.loginForm input,
.noticeBox input,
.noticeBox select,
.noticeBox textarea,
.recommendationForm input,
.recommendationForm select,
.recommendationForm textarea,
.profileEditor input,
.profileEditor select,
.profileEditor textarea,
.formGrid input,
.formGrid select,
.formGrid textarea,
.partnerOrderChatTop textarea,
.chatComposer textarea,
.emailAutomationEditor input,
.emailAutomationEditor textarea,
.billingPaymentTerms input,
.deliveryDateBox input,
.roofTileForm input,
.preparationNotesGrid textarea,
.projectSearchInput {
  border-radius: 18px;
  border: 1px solid rgba(72, 159, 223, .26);
  background: linear-gradient(145deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .07));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 12px 30px rgba(3, 9, 28, .1);
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease, transform .2s ease;
}

.loginForm input:focus,
.noticeBox input:focus,
.noticeBox select:focus,
.noticeBox textarea:focus,
.recommendationForm input:focus,
.recommendationForm select:focus,
.recommendationForm textarea:focus,
.profileEditor input:focus,
.profileEditor select:focus,
.profileEditor textarea:focus,
.formGrid input:focus,
.formGrid select:focus,
.formGrid textarea:focus,
.partnerOrderChatTop textarea:focus,
.chatComposer textarea:focus,
.emailAutomationEditor input:focus,
.emailAutomationEditor textarea:focus,
.billingPaymentTerms input:focus,
.deliveryDateBox input:focus,
.roofTileForm input:focus,
.preparationNotesGrid textarea:focus,
.projectSearchInput:focus {
  border-color: rgba(72, 159, 223, .72);
  background: linear-gradient(145deg, rgba(255, 255, 255, .2), rgba(255, 255, 255, .1));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 0 0 4px rgba(72, 159, 223, .16), 0 18px 44px rgba(3, 9, 28, .18);
  outline: none;
}

.loginForm button,
.choiceButton,
.primaryButton,
.secondaryButton,
.adminActionButton,
.compactActionButton,
.reviewButton,
.recommendationForm button[type="submit"],
.noticeBox button,
.profileEditor button,
.partnerSubmitModalActions button,
.partnerOrderActionRow button,
.chatComposer button,
.emailAutomationEditor button,
.billingActionButton,
.mapFilterButton,
.uploadButton,
.acceptSuggestionButton {
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .16);
  background: linear-gradient(135deg, rgba(72, 159, 223, .98), rgba(72, 159, 223, .74));
  box-shadow: 0 16px 38px rgba(72, 159, 223, .22), inset 0 1px 0 rgba(255, 255, 255, .26);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}

.loginForm button:hover,
.choiceButton:hover,
.primaryButton:hover,
.secondaryButton:hover,
.adminActionButton:hover,
.compactActionButton:hover,
.reviewButton:hover,
.recommendationForm button[type="submit"]:hover,
.noticeBox button:hover,
.profileEditor button:hover,
.partnerSubmitModalActions button:hover,
.partnerOrderActionRow button:hover,
.chatComposer button:hover,
.emailAutomationEditor button:hover,
.billingActionButton:hover,
.mapFilterButton:hover,
.uploadButton:hover,
.acceptSuggestionButton:hover {
  transform: translateY(-1px);
  color: var(--ap-navy);
  border-color: rgba(255, 255, 255, .28);
  background: linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(72, 159, 223, .86));
  box-shadow: 0 22px 54px rgba(72, 159, 223, .32), inset 0 1px 0 rgba(255, 255, 255, .36);
}

.secondaryButton,
.partnerSubmitModalActions .secondaryButton,
.profileEditor .secondaryButton {
  background: linear-gradient(135deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .08));
  color: var(--ap-white);
}

input[type="file"]::file-selector-button {
  border-radius: 999px;
  border: 1px solid rgba(72, 159, 223, .32);
  background: linear-gradient(135deg, rgba(255, 255, 255, .96), rgba(72, 159, 223, .8));
  color: var(--ap-navy);
  font-weight: 800;
  padding: 8px 16px;
  margin-right: 12px;
  box-shadow: 0 10px 26px rgba(72, 159, 223, .18);
}

input[type="file"]::file-selector-button:hover {
  background: linear-gradient(135deg, rgba(72, 159, 223, .98), rgba(20, 27, 77, .86));
  color: var(--ap-white);
}

.partnerOrderChatTop,
.chatBox,
.chatMessages {
  border-radius: 26px;
  border: 1px solid rgba(72, 159, 223, .24);
  background:
    linear-gradient(145deg, rgba(20, 27, 77, .72), rgba(20, 27, 77, .4)),
    rgba(255, 255, 255, .06);
  box-shadow: 0 26px 70px rgba(3, 9, 28, .2), inset 0 1px 0 rgba(255, 255, 255, .1);
  backdrop-filter: blur(18px);
}

.chatMessages,
.partnerOrderChatTop .chatMessages {
  padding: 12px;
  scrollbar-color: rgba(72, 159, 223, .6) rgba(255, 255, 255, .06);
}

.chatMessages::-webkit-scrollbar,
.notificationList::-webkit-scrollbar,
.partnerProjectsMiniList::-webkit-scrollbar {
  width: 8px;
}

.chatMessages::-webkit-scrollbar-thumb,
.notificationList::-webkit-scrollbar-thumb,
.partnerProjectsMiniList::-webkit-scrollbar-thumb {
  background: rgba(72, 159, 223, .58);
  border-radius: 999px;
}

.chatMessage,
.messageBubble,
.notificationItem {
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, .1);
  background: rgba(255, 255, 255, .09);
  box-shadow: 0 14px 34px rgba(3, 9, 28, .14);
}

.chatMessageRight,
.messageBubble.outgoing {
  background: linear-gradient(135deg, rgba(72, 159, 223, .26), rgba(72, 159, 223, .12));
  border-color: rgba(72, 159, 223, .3);
}

.partnerOrderCostEstimate {
  color: var(--ap-white);
  border-color: rgba(72, 159, 223, .34);
  background:
    radial-gradient(circle at 15% 0%, rgba(72, 159, 223, .3), transparent 34%),
    linear-gradient(145deg, rgba(20, 27, 77, .86), rgba(20, 27, 77, .58));
  box-shadow: 0 28px 76px rgba(3, 9, 28, .28), inset 0 1px 0 rgba(255, 255, 255, .14);
}

.partnerOrderCostEstimate h3,
.partnerOrderCostEstimateTotal,
.partnerOrderCostEstimate .costTotal,
.costEstimateTotal {
  color: var(--ap-light);
}

.partnerOrderCostEstimateRow,
.costEstimateRow {
  border-radius: 16px;
  background: rgba(255, 255, 255, .1);
  border: 1px solid rgba(255, 255, 255, .08);
}

.partnerOrderImageCard,
.partnerOrderFileLink,
.preparationImageCard,
.preparationDropZone,
.partnerPriceListSummaryBox,
.partnerAdminStatCard,
.automationEmailCard,
.emailAutomationCard,
.billingMetricCard,
.projectHoverPreview,
.mapHoverCard,
.mapProjectPopup {
  border-radius: 22px;
  border: 1px solid rgba(72, 159, 223, .22);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .06)),
    rgba(20, 27, 77, .46);
  box-shadow: 0 22px 56px rgba(3, 9, 28, .2), inset 0 1px 0 rgba(255, 255, 255, .12);
  backdrop-filter: blur(16px);
}

.partnerOrderImageCard:hover,
.partnerOrderFileLink:hover,
.preparationImageCard:hover,
.partnerPriceListSummaryBox:hover,
.partnerAdminStatCard:hover,
.automationEmailCard:hover,
.emailAutomationCard:hover,
.billingMetricCard:hover {
  transform: translateY(-2px);
  border-color: rgba(72, 159, 223, .46);
  box-shadow: 0 28px 70px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .18);
}

.mapHoverCard,
.mapProjectPopup {
  color: var(--ap-white);
  max-width: min(360px, calc(100vw - 32px));
  white-space: normal;
  overflow-wrap: anywhere;
  z-index: 60;
}

.notificationPopover,
.profilePopover,
.partnerSubmitModal,
.modalOverlay .modalCard {
  border-radius: 28px;
  border: 1px solid rgba(72, 159, 223, .26);
  background:
    radial-gradient(circle at 18% 0%, rgba(72, 159, 223, .2), transparent 38%),
    linear-gradient(145deg, rgba(20, 27, 77, .92), rgba(20, 27, 77, .74));
  color: var(--ap-white);
  box-shadow: 0 36px 90px rgba(3, 9, 28, .42), inset 0 1px 0 rgba(255, 255, 255, .12);
  backdrop-filter: blur(24px);
}

.modalCloseButton,
.closeButton,
.dialogCloseButton {
  border-radius: 999px;
}

.statusBadge,
.statusPill,
.projectStatusBadge {
  border-radius: 999px;
  border: 1px solid rgba(72, 159, 223, .25);
  background: rgba(72, 159, 223, .14);
  color: var(--ap-white);
}

.loginCard,
.authCard {
  border-radius: 30px;
}

.loginPanel,
.authPanel {
  overflow: visible;
}

@media (max-width: 780px) {
  .dashboardHeadModern,
  .portalHeroCard,
  .tableWrap,
  .partnerOrderCard,
  .projectDetailCard,
  .profileEditor,
  .partnerOrderChatTop,
  .partnerOrderCostEstimate {
    border-radius: 22px;
  }

  .loginForm button,
  .choiceButton,
  .primaryButton,
  .secondaryButton,
  .adminActionButton,
  .compactActionButton,
  .partnerSubmitModalActions button,
  .partnerOrderActionRow button {
    min-height: 48px;
  }
}

@media print {
  @page {
    size: A4;
    margin: 12mm;
  }

  body > *:not(.printArea) {
    display: none !important;
  }

  .printArea {
    display: block;
  }

  body {
    background: #ffffff;
  }

  .printDocument {
    font-size: 12px;
  }

  .printHeader {
    margin-bottom: 12px;
  }

  .printLogo {
    width: 82px;
    height: 82px;
  }

  .printDocument h1 {
    font-size: 24px;
  }

  .printDocument h2 {
    margin: 14px 0 6px;
    font-size: 15px;
  }

  .printDocument th,
  .printDocument td {
    padding: 5px 6px;
    font-size: 11px;
  }

  .preparationPrintPage {
    min-height: auto;
    break-after: page;
    page-break-after: always;
  }

  .preparationPrintPage:last-child {
    break-after: auto;
    page-break-after: auto;
  }

  .preparationPrintTop,
  .preparationPrintComponents,
  .preparationPrintNotes,
  .preparationPrintImages figure {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .preparationPrintImages {
    grid-template-columns: 1fr;
    gap: 12px;
    align-items: start;
  }

  .preparationPrintImages img {
    max-height: 170mm;
  }
}

/* Reonic detail live polish: keep hero and controls readable */
#reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record) {
  padding-top: clamp(34px, 3vw, 54px) !important;
  background:
    linear-gradient(90deg, rgba(2, 8, 28, .98) 0%, rgba(3, 12, 38, .9) 26%, rgba(4, 13, 38, .48) 50%, rgba(4, 13, 38, .12) 72%, rgba(4, 13, 38, .38) 100%),
    linear-gradient(180deg, rgba(5, 12, 34, .02) 0%, rgba(5, 12, 34, .12) 43%, rgba(5, 12, 34, .9) 100%),
    url("/assets/premium-customer-hero.jpg") center top / 100% clamp(360px, 32vw, 520px) no-repeat,
    #020817;
}

#reonicOrderDetailPanel .formHead {
  max-width: min(620px, 45vw) !important;
  margin-left: clamp(22px, 2vw, 38px) !important;
  margin-bottom: 0 !important;
}

#reonicOrderDetailPanel #closeReonicDetailButton {
  background: transparent;
  border: 0;
  box-shadow: none;
  color: rgba(190, 221, 255, .95);
  padding: 0 !important;
  min-height: auto;
}

#reonicOrderDetailPanel #reonicDetailMeta {
  max-width: min(620px, 45vw) !important;
  margin: clamp(22px, 2.4vw, 34px) 0 clamp(28px, 3vw, 42px) clamp(22px, 2vw, 38px) !important;
}

#reonicOrderDetailPanel .reonicCustomerMeta {
  border: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  padding: 0 !important;
}

#reonicOrderDetailPanel .reonicCustomerMeta p {
  position: relative;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: 16px !important;
  min-height: 34px;
  margin: 0 !important;
}

#reonicOrderDetailPanel .reonicCustomerMeta p > span:not(.reonicMetaIcon):not(.visuallyHidden) {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

#reonicOrderDetailPanel .reonicCustomerMeta p:not(.reonicMetaItem)::before {
  width: 28px;
  height: 28px;
  display: inline-grid;
  place-items: center;
  grid-column: 1;
  border: 2px solid rgba(232, 244, 255, .88);
  color: #ffffff;
  font-size: 16px;
  font-weight: 900;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .28);
}

#reonicOrderDetailPanel .reonicCustomerMeta p:not(.reonicMetaItem):nth-child(1)::before {
  content: "";
  border-radius: 999px 999px 999px 4px;
  transform: rotate(-45deg);
  box-shadow: inset 0 0 0 8px transparent, 0 10px 30px rgba(0, 0, 0, .28);
}

#reonicOrderDetailPanel .reonicCustomerMeta p:not(.reonicMetaItem):nth-child(1)::after {
  content: "";
  position: absolute;
  left: 10px;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #ffffff;
}

#reonicOrderDetailPanel .reonicCustomerMeta p:not(.reonicMetaItem):nth-child(2)::before,
#reonicOrderDetailPanel .reonicCustomerMeta p:not(.reonicMetaItem):nth-child(3)::before {
  content: none;
  display: none;
}

#reonicOrderDetailPanel .reonicCustomerMeta p:nth-child(4),
#reonicOrderDetailPanel .reonicCustomerMeta .reonicMetaStatus {
  display: inline-grid !important;
  grid-template-columns: 18px auto;
  justify-self: start;
  gap: 10px !important;
  min-height: 48px;
  padding: 0 22px;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 12px;
  background: rgba(255, 255, 255, .11);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 18px 42px rgba(0, 0, 0, .22);
  backdrop-filter: blur(16px);
}

#reonicOrderDetailPanel .reonicCustomerMeta p:not(.reonicMetaItem):nth-child(4)::before {
  content: "";
  width: 10px;
  height: 10px;
  align-self: center;
  margin-left: 4px;
  border: 0;
  border-radius: 999px;
  background: #489FDF;
  box-shadow: 0 0 0 7px rgba(72, 159, 223, .18);
}

#reonicOrderDetailPanel .reonicCustomerMeta strong,
#reonicOrderDetailPanel .reonicCustomerMeta a {
  grid-column: 2;
  font-size: clamp(18px, 1.35vw, 25px) !important;
  color: #ffffff;
}

#reonicOrderDetailPanel .reonicDetailContent {
  margin-top: 0 !important;
}

#reonicOrderDetailPanel.is-loading-detail {
  min-height: min(980px, calc(100vh - 72px));
}

#reonicOrderDetailPanel .reonicCustomerMetaLoading p,
#reonicOrderDetailPanel .reonicLoadingBlock {
  overflow: hidden;
}

#reonicOrderDetailPanel .reonicCustomerMetaLoading p::after,
#reonicOrderDetailPanel .reonicLoadingBlock::after {
  content: "";
  display: block;
  width: 100%;
  min-height: 24px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .28), rgba(255, 255, 255, .14));
  background-size: 220% 100%;
  animation: reonicLoadingShimmer 1.2s ease-in-out infinite;
}

#reonicOrderDetailPanel .reonicCustomerMetaLoading p:nth-child(1)::after {
  width: min(430px, 82%);
}

#reonicOrderDetailPanel .reonicCustomerMetaLoading p:nth-child(2)::after {
  width: min(360px, 72%);
}

#reonicOrderDetailPanel .reonicCustomerMetaLoading p:nth-child(3)::after {
  width: min(240px, 58%);
}

#reonicOrderDetailPanel .reonicCustomerMetaLoading p:nth-child(4)::after {
  width: min(220px, 54%);
}

#reonicOrderDetailPanel .reonicLoadingCard {
  pointer-events: none;
}

#reonicOrderDetailPanel .reonicLoadingBlock {
  min-height: 170px;
}

#reonicOrderDetailPanel .reonicLoadingBlock::after {
  min-height: 92px;
  border-radius: 8px;
}

@keyframes reonicLoadingShimmer {
  from {
    background-position: 120% 0;
  }

  to {
    background-position: -120% 0;
  }
}

#reonicOrderDetailPanel .calendarCheckItem {
  position: relative !important;
  padding: 28px 112px 28px 32px !important;
  background: rgba(0, 18, 46, .86);
  border-color: rgba(72, 159, 223, .26);
}

#reonicOrderDetailPanel .preparationImageSummary span,
#reonicOrderDetailPanel .billingToggleButton,
#reonicOrderDetailPanel .billingPaymentBadge,
#reonicOrderDetailPanel .billingPaidButton,
#reonicOrderDetailPanel .orderStatusRow p,
#reonicOrderDetailPanel .orderStatusDone,
#reonicOrderDetailPanel .orderStatusOpen {
  border: 1px solid rgba(72, 159, 223, .34);
  background: rgba(0, 22, 58, .7);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 12px 28px rgba(0, 0, 0, .18);
}

#reonicOrderDetailPanel .billingToggleButton.is-selected,
#reonicOrderDetailPanel .billingToggleButton:hover,
#reonicOrderDetailPanel .billingPaidButton:hover {
  background: rgba(72, 159, 223, .92);
  color: #ffffff;
}

#reonicOrderDetailPanel .secondaryButton,
#reonicOrderDetailPanel .bigInviteButton,
#reonicOrderDetailPanel .printOrderButton,
#reonicOrderDetailPanel .roofTileDoneButton,
#reonicOrderDetailPanel .roofTilePrintButton {
  border: 1px solid rgba(255, 255, 255, .18);
  background: linear-gradient(135deg, rgba(72, 159, 223, .98), rgba(37, 119, 190, .86));
  color: #ffffff;
  box-shadow: 0 16px 38px rgba(72, 159, 223, .22), inset 0 1px 0 rgba(255, 255, 255, .22);
}

@media (max-width: 980px) {
  #reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record) {
    background:
      linear-gradient(180deg, rgba(2, 8, 28, .78) 0%, rgba(2, 8, 28, .92) 48%, rgba(2, 8, 28, .98) 100%),
      url("/assets/premium-customer-hero.jpg") center top / auto 360px no-repeat,
      #020817;
    padding-top: 260px !important;
  }

  #reonicOrderDetailPanel .formHead,
  #reonicOrderDetailPanel #reonicDetailMeta {
    max-width: 100% !important;
    margin-left: 0 !important;
  }
}

body.roleAdmin #reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record) {
  min-height: min(760px, calc(100vh - 32px)) !important;
  padding: clamp(28px, 2.4vw, 42px) !important;
  background:
    linear-gradient(90deg, rgba(2, 8, 28, .98) 0%, rgba(3, 12, 38, .9) 26%, rgba(4, 13, 38, .48) 50%, rgba(4, 13, 38, .12) 72%, rgba(4, 13, 38, .38) 100%),
    linear-gradient(180deg, rgba(5, 12, 34, .02) 0%, rgba(5, 12, 34, .12) 43%, rgba(5, 12, 34, .9) 100%),
    url("/assets/premium-customer-hero.jpg") center top / 100% clamp(300px, 26vw, 420px) no-repeat,
    #020817;
}

body.roleAdmin #reonicOrderDetailPanel .formHead {
  max-width: min(520px, 46vw) !important;
  margin: clamp(28px, 4vw, 58px) 0 clamp(14px, 1.6vw, 22px) clamp(16px, 1.6vw, 28px) !important;
  gap: clamp(24px, 3.2vw, 44px) !important;
}

body.roleAdmin #reonicOrderDetailPanel #reonicDetailTitle {
  max-width: min(560px, 48vw) !important;
  font-size: clamp(30px, 3.4vw, 58px) !important;
  line-height: 1.04 !important;
  font-weight: 800 !important;
}

body.roleAdmin #reonicOrderDetailPanel #reonicDetailMeta {
  max-width: min(520px, 46vw) !important;
  margin: 0 0 clamp(22px, 2.2vw, 34px) clamp(16px, 1.6vw, 28px) !important;
}

body.roleAdmin #reonicOrderDetailPanel .reonicCustomerMeta {
  gap: clamp(9px, .85vw, 14px) !important;
}

body.roleAdmin #reonicOrderDetailPanel .reonicMetaItem,
body.roleAdmin #reonicOrderDetailPanel .reonicCustomerMeta p {
  grid-template-columns: 28px minmax(0, 1fr) !important;
  gap: 13px !important;
  min-height: 28px !important;
}

body.roleAdmin #reonicOrderDetailPanel .reonicMetaIcon,
body.roleAdmin #reonicOrderDetailPanel .reonicCustomerMeta p:not(.reonicMetaItem)::before {
  width: 23px !important;
  height: 23px !important;
  font-size: 12px !important;
  border-width: 2px;
}

body.roleAdmin #reonicOrderDetailPanel .reonicMetaIcon::before {
  font-size: 12px !important;
}

body.roleAdmin #reonicOrderDetailPanel .reonicMetaIcon-pin::before,
body.roleAdmin #reonicOrderDetailPanel .reonicCustomerMeta p:not(.reonicMetaItem):nth-child(1)::after {
  width: 6px !important;
  height: 6px !important;
}

body.roleAdmin #reonicOrderDetailPanel .reonicMetaIcon-status,
body.roleAdmin #reonicOrderDetailPanel .reonicCustomerMeta p:not(.reonicMetaItem):nth-child(4)::before {
  width: 8px !important;
  height: 8px !important;
  margin-left: 3px !important;
  box-shadow: 0 0 0 6px rgba(72, 159, 223, .16);
}

body.roleAdmin #reonicOrderDetailPanel .reonicCustomerMeta strong,
body.roleAdmin #reonicOrderDetailPanel .reonicCustomerMeta a,
body.roleAdmin #reonicOrderDetailPanel .reonicMetaStatus strong {
  font-size: clamp(15px, 1.05vw, 19px) !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
}

body.roleAdmin #reonicOrderDetailPanel .reonicMetaStatus,
body.roleAdmin #reonicOrderDetailPanel .reonicCustomerMeta p:nth-child(4) {
  grid-template-columns: 14px minmax(0, auto) !important;
  gap: 8px 12px !important;
  min-height: 40px !important;
  padding: 6px 14px !important;
  border-radius: 12px;
}

/* Admin montage overview polish */
body.roleAdmin .employeePhotoButton {
  display: none !important;
}

body.roleAdmin .dashboardHeadModern {
  min-height: clamp(430px, 47vw, 720px);
  align-content: start;
  padding: clamp(42px, 5vw, 82px) clamp(44px, 5.6vw, 96px);
  border-radius: 30px;
  background:
    linear-gradient(90deg, rgba(2, 8, 28, .98) 0%, rgba(4, 13, 38, .92) 28%, rgba(4, 13, 38, .48) 54%, rgba(4, 13, 38, .2) 76%, rgba(4, 13, 38, .5) 100%),
    linear-gradient(180deg, rgba(5, 12, 34, .04) 0%, rgba(5, 12, 34, .1) 46%, rgba(5, 12, 34, .88) 100%),
    url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center center / cover no-repeat,
    #020817;
}

body.roleAdmin .dashboardHeadModern::before {
  background:
    linear-gradient(90deg, rgba(2, 8, 28, .2), transparent 44%),
    radial-gradient(circle at 74% 18%, rgba(72, 159, 223, .24), transparent 28%);
}

body.roleAdmin .dashboardHeadModern::after {
  bottom: 38px;
}

body.roleAdmin .dashboardHeadModern .dashboardIdentity {
  max-width: min(720px, 48vw);
  padding-top: clamp(10px, 1vw, 18px);
}

body.roleAdmin .dashboardHeadModern .step {
  color: rgba(255, 255, 255, .74);
}

body.roleAdmin .dashboardHeadModern #welcomeTitle {
  color: #ffffff;
  font-size: clamp(42px, 5vw, 82px);
  line-height: .98;
  max-width: 760px;
}

body.roleAdmin .dashboardHeadModern .dashboardActions {
  align-self: end;
  justify-content: flex-start;
}

body.roleAdmin #reonicOrdersPanel.recommendationForm {
  border: 1px solid rgba(255, 255, 255, .16);
  background:
    radial-gradient(circle at 82% 0%, rgba(72, 159, 223, .18), transparent 34%),
    linear-gradient(145deg, rgba(8, 18, 50, .9), rgba(20, 27, 77, .68));
  color: #ffffff;
  box-shadow: 0 28px 90px rgba(3, 9, 28, .34), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.roleAdmin #reonicOrdersPanel .formHead h3,
body.roleAdmin #reonicOrdersPanel label,
body.roleAdmin #reonicOrdersPanel .formMessage {
  color: #ffffff;
}

body.roleAdmin #reonicOrdersPanel .formMessage,
body.roleAdmin #reonicOrdersPanel label {
  color: rgba(255, 255, 255, .78);
}

body.roleAdmin #reonicOrdersPanel input,
body.roleAdmin #reonicOrdersPanel select {
  border-color: rgba(255, 255, 255, .18);
  background: rgba(0, 18, 46, .72);
  color: #ffffff;
}

body.roleAdmin #reonicOrdersPanel input::placeholder {
  color: rgba(255, 255, 255, .5);
}

@media (max-width: 980px) {
  body.roleAdmin .dashboardHeadModern {
    min-height: 360px;
    padding: 260px 24px 30px;
    background:
      linear-gradient(180deg, rgba(2, 8, 28, .28) 0%, rgba(2, 8, 28, .86) 58%, rgba(2, 8, 28, .98) 100%),
      url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center top / auto 360px no-repeat,
      #020817;
  }

  body.roleAdmin .dashboardHeadModern .dashboardIdentity {
    max-width: 100%;
  }

  body.roleAdmin .dashboardHeadModern #welcomeTitle {
    font-size: clamp(34px, 11vw, 54px);
  }
}

/* Partner portal final contrast pass */
body.portalPartner #partnerOrderView.panel,
body.portalPartner #partnerOrderForm.recommendationForm,
body.portalPartner #partnerProjectsPanel.reviewBox,
body.partnerDashboardHome #partnerProjectsPanel.reviewBox,
body.partnerDashboardHome .advisorCard,
body.partnerDashboardHome .partnerHomeActionCard {
  color: #ffffff;
  border: 1px solid rgba(72, 159, 223, .26);
  background:
    linear-gradient(145deg, rgba(12, 24, 58, .9), rgba(6, 16, 42, .78)),
    rgba(255, 255, 255, .05);
  box-shadow: 0 28px 86px rgba(3, 9, 28, .32), inset 0 1px 0 rgba(255, 255, 255, .13);
  backdrop-filter: blur(22px) saturate(1.18);
  -webkit-backdrop-filter: blur(22px) saturate(1.18);
}

body.portalPartner #partnerOrderView.panel {
  padding: clamp(24px, 3vw, 42px) !important;
}

body.portalPartner #partnerOrderView h2,
body.portalPartner #partnerOrderForm label,
body.portalPartner #partnerOrderForm small,
body.portalPartner #partnerOrderForm .mutedText,
body.portalPartner #partnerProjectsPanel h3,
body.portalPartner #partnerProjectsPanel p,
body.partnerDashboardHome .advisorCard span,
body.partnerDashboardHome .advisorCard strong,
body.partnerDashboardHome .advisorCard small,
body.partnerDashboardHome .partnerHomeActionCard strong,
body.partnerDashboardHome .partnerHomeActionCard small {
  color: rgba(255, 255, 255, .9);
}

body.portalPartner #partnerOrderView > .mutedText {
  color: rgba(255, 255, 255, .74);
}

body.portalPartner #partnerOrderForm input,
body.portalPartner #partnerOrderForm select,
body.portalPartner #partnerOrderForm textarea {
  border-color: rgba(72, 159, 223, .34);
  background: rgba(2, 12, 32, .72);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 12px 28px rgba(3, 9, 28, .16);
}

body.portalPartner #partnerOrderForm input:focus,
body.portalPartner #partnerOrderForm select:focus,
body.portalPartner #partnerOrderForm textarea:focus {
  border-color: rgba(72, 159, 223, .84);
  background: rgba(6, 18, 46, .88);
  box-shadow: 0 0 0 4px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .14);
}

body.portalPartner #partnerOrderForm input[type="file"] {
  min-height: 58px;
  padding: 9px 12px;
  color: rgba(255, 255, 255, .8);
}

body.portalPartner #partnerOrderForm input[type="file"]::file-selector-button {
  min-height: 40px;
  border-color: rgba(72, 159, 223, .42);
  background: linear-gradient(135deg, rgba(72, 159, 223, .98), rgba(72, 159, 223, .78));
  color: #ffffff;
}

body.portalPartner #partnerOrderForm select option {
  color: #141B4D;
  background: #ffffff;
}

body.portalPartner #partnerOrderForm .formActions select {
  min-width: min(420px, 100%);
}

body.partnerDashboardHome .dashboardHeadModern {
  background:
    linear-gradient(90deg, rgba(2, 9, 20, .88), rgba(20, 27, 77, .52) 56%, rgba(2, 9, 20, .52)),
    url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center / cover;
}

body.partnerDashboardHome .advisorCard {
  gap: 18px;
}

body.partnerDashboardHome .advisorCard img {
  border: 1px solid rgba(255, 255, 255, .2);
  box-shadow: 0 16px 34px rgba(0, 0, 0, .28);
}

body.partnerDashboardHome .employeePhotoButton {
  border: 1px solid rgba(72, 159, 223, .28);
  background: rgba(4, 14, 38, .62);
  box-shadow: 0 24px 60px rgba(3, 9, 28, .28), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.partnerDashboardHome #partnerProjectsPanel.reviewBox {
  padding: clamp(22px, 2.6vw, 34px) !important;
}

body.partnerDashboardHome .partnerHomeActionGrid {
  gap: 18px;
}

body.partnerDashboardHome .partnerHomeActionCard {
  min-height: 150px;
  padding: 22px;
  border-radius: 18px;
  border-color: rgba(72, 159, 223, .24);
  background:
    linear-gradient(145deg, rgba(3, 13, 34, .96), rgba(5, 15, 38, .88)),
    rgba(2, 9, 20, .94);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 18px 44px rgba(3, 9, 28, .2);
}

body.partnerDashboardHome .partnerHomeActionCard:hover {
  border-color: rgba(72, 159, 223, .72);
  background:
    linear-gradient(145deg, rgba(72, 159, 223, .28), rgba(6, 16, 42, .84)),
    rgba(255, 255, 255, .07);
  box-shadow: 0 30px 80px rgba(72, 159, 223, .2), inset 0 1px 0 rgba(255, 255, 255, .16);
}

body.portalPartner .partnerProjectCard:hover,
body.portalPartner .partnerProjectCard:focus-visible {
  color: #ffffff;
  border-color: rgba(72, 159, 223, .62);
  background:
    linear-gradient(145deg, rgba(72, 159, 223, .18), rgba(6, 16, 42, .9)),
    rgba(12, 24, 58, .9);
  box-shadow: 0 28px 76px rgba(3, 9, 28, .36), inset 0 1px 0 rgba(255, 255, 255, .14);
}

body.portalPartner .partnerProjectCard:hover *,
body.portalPartner .partnerProjectCard:focus-visible * {
  color: inherit;
}

body.portalPartner .partnerProjectCard:hover .reviewStatus.reviewPending,
body.portalPartner .partnerProjectCard:focus-visible .reviewStatus.reviewPending,
body.portalPartner #partnerOrderDetailBox .reviewStatus.reviewPending {
  color: #ffd2a8;
  background: rgba(181, 71, 8, .24);
  border: 1px solid rgba(255, 185, 116, .32);
}

body.portalPartner .partnerProjectCard:hover .reviewStatus.reviewInfo,
body.portalPartner .partnerProjectCard:focus-visible .reviewStatus.reviewInfo,
body.portalPartner #partnerOrderDetailBox .reviewStatus.reviewInfo {
  color: #bfe0ff;
  background: rgba(72, 159, 223, .22);
  border: 1px solid rgba(72, 159, 223, .38);
}

body.portalPartner .partnerProjectCard:hover .reviewStatus.reviewDone,
body.portalPartner .partnerProjectCard:focus-visible .reviewStatus.reviewDone,
body.portalPartner #partnerOrderDetailBox .reviewStatus.reviewDone {
  color: #b9f2d3;
  background: rgba(31, 122, 82, .24);
  border: 1px solid rgba(95, 213, 150, .28);
}

body.portalPartner .partnerProjectCard:hover .reviewStatus.reviewUnknown,
body.portalPartner .partnerProjectCard:focus-visible .reviewStatus.reviewUnknown,
body.portalPartner #partnerOrderDetailBox .reviewStatus.reviewUnknown {
  color: rgba(255, 255, 255, .82);
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .16);
}

body.portalPartner #partnerOrderDetailBox.reviewBox,
body.portalPartner #partnerOrderDetailForm.recommendationForm,
body.portalPartner #partnerOrderDetailBox .partnerOrderChatTop,
body.portalPartner #partnerOrderDetailBox .chatMessages,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimate {
  color: #ffffff;
  border: 1px solid rgba(72, 159, 223, .26);
  background:
    linear-gradient(145deg, rgba(12, 24, 58, .9), rgba(6, 16, 42, .78)),
    rgba(255, 255, 255, .05);
  box-shadow: 0 28px 86px rgba(3, 9, 28, .32), inset 0 1px 0 rgba(255, 255, 255, .13);
  backdrop-filter: blur(22px) saturate(1.18);
  -webkit-backdrop-filter: blur(22px) saturate(1.18);
}

body.portalPartner #partnerOrderDetailBox.reviewBox {
  padding: clamp(22px, 2.8vw, 38px) !important;
  align-items: stretch;
}

body.portalPartner #partnerOrderDetailForm.recommendationForm {
  padding: clamp(18px, 2.2vw, 28px) !important;
  border-radius: 22px;
}

body.portalPartner #partnerOrderDetailBox h3,
body.portalPartner #partnerOrderDetailBox h4,
body.portalPartner #partnerOrderDetailBox label,
body.portalPartner #partnerOrderDetailBox small,
body.portalPartner #partnerOrderDetailBox .mutedText,
body.portalPartner #partnerOrderDetailBox .partnerOrderDetailMeta,
body.portalPartner #partnerOrderDetailBox .partnerOrderMetaSeparator,
body.portalPartner #partnerOrderDetailBox .chatMessageHeader,
body.portalPartner #partnerOrderDetailBox .chatMessageAuthor,
body.portalPartner #partnerOrderDetailBox .chatMessageBody,
body.portalPartner #partnerOrderDetailBox .partnerOrderImageCard span,
body.portalPartner #partnerOrderDetailBox .partnerOrderFileLink,
body.portalPartner #partnerOrderDetailBox .partnerOrderFileLink span,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimate span,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimate small,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimateRow strong {
  color: rgba(255, 255, 255, .9);
}

body.portalPartner #partnerOrderDetailBox .step {
  color: rgba(255, 255, 255, .72);
}

body.portalPartner #partnerOrderDetailForm input,
body.portalPartner #partnerOrderDetailForm select,
body.portalPartner #partnerOrderDetailForm textarea,
body.portalPartner #partnerOrderMessageForm textarea,
body.portalPartner #partnerOrderDetailBox input[type="file"] {
  border-color: rgba(72, 159, 223, .34);
  background: rgba(2, 12, 32, .72);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 12px 28px rgba(3, 9, 28, .16);
}

body.portalPartner #partnerOrderDetailForm input:disabled,
body.portalPartner #partnerOrderDetailForm select:disabled,
body.portalPartner #partnerOrderDetailForm textarea:disabled {
  opacity: 1;
  color: rgba(255, 255, 255, .86);
  -webkit-text-fill-color: rgba(255, 255, 255, .86);
}

body.portalPartner #partnerOrderDetailForm input:focus,
body.portalPartner #partnerOrderDetailForm select:focus,
body.portalPartner #partnerOrderDetailForm textarea:focus,
body.portalPartner #partnerOrderMessageForm textarea:focus {
  border-color: rgba(72, 159, 223, .84);
  background: rgba(6, 18, 46, .88);
  box-shadow: 0 0 0 4px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .14);
}

body.portalPartner #partnerOrderDetailBox input[type="file"]::file-selector-button {
  border-color: rgba(72, 159, 223, .42);
  background: linear-gradient(135deg, rgba(72, 159, 223, .98), rgba(72, 159, 223, .78));
  color: #ffffff;
}

body.portalPartner #partnerOrderDetailForm select option {
  color: #141B4D;
  background: #ffffff;
}

body.portalPartner #partnerOrderDetailBox .partnerOrderImageCard,
body.portalPartner #partnerOrderDetailBox .partnerOrderFileLink,
body.portalPartner #partnerOrderDetailBox .chatMessage,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimateRow {
  border-color: rgba(72, 159, 223, .22);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .13), rgba(255, 255, 255, .06)),
    rgba(20, 27, 77, .46);
  box-shadow: 0 22px 56px rgba(3, 9, 28, .2), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.portalPartner #partnerOrderDetailBox .chatMessageRight {
  border-color: rgba(72, 159, 223, .34);
  background: linear-gradient(135deg, rgba(72, 159, 223, .28), rgba(72, 159, 223, .12));
}

body.portalPartner #partnerOrderDetailBox .partnerOrderImageCard img {
  background: rgba(2, 12, 32, .72);
}

body.portalPartner.partnerOrderDetailOnly #partnerOrderDetailBox.reviewBox {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: min(760px, calc(100vh - 32px));
  padding: clamp(28px, 2.4vw, 42px) !important;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 30px;
  background:
    linear-gradient(90deg, rgba(2, 8, 28, .98) 0%, rgba(3, 12, 38, .9) 26%, rgba(4, 13, 38, .48) 50%, rgba(4, 13, 38, .12) 72%, rgba(4, 13, 38, .38) 100%),
    linear-gradient(180deg, rgba(5, 12, 34, .02) 0%, rgba(5, 12, 34, .12) 43%, rgba(5, 12, 34, .9) 100%),
    url("/assets/premium-customer-hero.jpg") center top / 100% clamp(300px, 26vw, 420px) no-repeat,
    #020817;
  box-shadow: 0 38px 110px rgba(3, 8, 26, .48), inset 0 1px 0 rgba(255, 255, 255, .16);
}

body.portalPartner.partnerOrderDetailOnly #partnerOrderDetailBox.reviewBox::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, 0) 12%),
    radial-gradient(circle at 20% 8%, rgba(72, 159, 223, .18), transparent 34%);
  pointer-events: none;
}

body.portalPartner.partnerOrderDetailOnly #partnerOrderDetailBox > * {
  position: relative;
  z-index: 1;
}

body.portalPartner.partnerOrderDetailOnly .partnerOrderDetailHead {
  max-width: min(520px, 46vw);
  margin: clamp(28px, 4vw, 58px) 0 clamp(14px, 1.6vw, 22px) clamp(16px, 1.6vw, 28px);
}

body.portalPartner.partnerOrderDetailOnly #partnerOrderDetailTitle {
  max-width: min(560px, 48vw);
  margin: 0;
  color: #ffffff;
  font-size: clamp(30px, 3.4vw, 58px);
  line-height: 1.04;
  letter-spacing: 0;
  text-shadow: 0 14px 34px rgba(0, 0, 0, .44);
}

body.portalPartner.partnerOrderDetailOnly .partnerOrderDetailMeta {
  display: block;
  max-width: min(520px, 46vw);
  margin: 0 0 clamp(22px, 2.2vw, 34px) clamp(16px, 1.6vw, 28px);
  font-size: inherit;
}

body.portalPartner.partnerOrderDetailOnly .partnerOrderHeroMeta {
  display: grid;
  gap: clamp(9px, .85vw, 14px);
}

body.portalPartner.partnerOrderDetailOnly .partnerOrderHeroMetaItem {
  position: relative;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  align-items: center;
  gap: 13px;
  min-height: 28px;
  margin: 0;
}

body.portalPartner.partnerOrderDetailOnly .partnerOrderHeroIcon {
  width: 23px;
  height: 23px;
  display: inline-grid;
  place-items: center;
  grid-column: 1;
  border: 2px solid rgba(232, 244, 255, .82);
  color: #ffffff;
  font-size: 12px;
  font-weight: 900;
  box-shadow: 0 8px 22px rgba(0, 0, 0, .24);
}

body.portalPartner.partnerOrderDetailOnly .partnerOrderHeroIcon {
  padding: 4px;
  border-radius: 9px;
}

body.portalPartner.partnerOrderDetailOnly .partnerOrderHeroMetaItem strong,
body.portalPartner.partnerOrderDetailOnly .partnerOrderHeroMetaItem a {
  grid-column: 2;
  color: #ffffff;
  font-size: clamp(15px, 1.05vw, 19px);
  font-weight: 500;
  text-decoration: none;
  overflow-wrap: anywhere;
  text-shadow: 0 10px 24px rgba(0, 0, 0, .36);
}

body.portalPartner.partnerOrderDetailOnly .partnerOrderHeroMetaItem small {
  grid-column: 2;
  color: rgba(255, 255, 255, .78);
  font-size: clamp(13px, .95vw, 16px);
  font-weight: 500;
  overflow-wrap: anywhere;
}

body.portalPartner.partnerOrderDetailOnly .partnerOrderHeroStatus {
  display: inline-grid;
  grid-template-columns: 14px minmax(0, auto);
  justify-self: start;
  gap: 8px 12px;
  min-height: 40px;
  padding: 6px 14px;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 12px;
  background: rgba(255, 255, 255, .11);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 18px 42px rgba(0, 0, 0, .22);
  backdrop-filter: blur(16px);
}

body.portalPartner.partnerOrderDetailOnly .partnerOrderHeroStatusDot {
  width: 8px;
  height: 8px;
  align-self: center;
  margin-left: 3px;
  border-radius: 999px;
  background: #489FDF;
  box-shadow: 0 0 0 6px rgba(72, 159, 223, .16);
}

body.portalPartner.partnerOrderDetailOnly .partnerOrderHeroStatus strong,
body.portalPartner.partnerOrderDetailOnly .partnerOrderHeroStatus small {
  grid-column: 2;
}

body.portalPartner.partnerOrderDetailOnly .partnerOrderHeroStatus small {
  display: block;
  max-width: min(560px, 72vw);
  color: rgba(255, 255, 255, .72);
  font-size: clamp(12px, .85vw, 14px);
}

body.partnerDashboardHome .partnerHomeActionCard span {
  color: #489FDF;
}

body.roleAdmin.partnerAccountMode #accountView.panel {
  max-width: min(1160px, 100%);
  padding: clamp(24px, 3vw, 42px) !important;
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: 28px;
  background:
    linear-gradient(145deg, rgba(12, 24, 58, .9), rgba(6, 16, 42, .78)),
    rgba(255, 255, 255, .05);
  box-shadow: 0 28px 86px rgba(3, 9, 28, .32), inset 0 1px 0 rgba(255, 255, 255, .13);
  backdrop-filter: blur(22px) saturate(1.18);
  -webkit-backdrop-filter: blur(22px) saturate(1.18);
}

body.roleAdmin.partnerAccountMode #accountView #accountBackButton {
  min-height: auto !important;
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: rgba(190, 221, 255, .95);
}

body.roleAdmin.partnerAccountMode #accountView #accountTitle {
  margin-top: clamp(24px, 3.6vw, 46px);
  color: #ffffff;
  font-size: clamp(28px, 3.4vw, 52px);
  line-height: 1.04;
  letter-spacing: 0;
}

body.roleAdmin.partnerAccountMode #accountView #accountIntro {
  max-width: 720px;
  color: rgba(255, 255, 255, .72);
  font-size: clamp(15px, 1.1vw, 18px);
}

body.roleAdmin.partnerAccountMode #accountForm,
body.roleAdmin.partnerAccountMode #accountPartnerFields {
  gap: clamp(14px, 1.5vw, 20px);
}

body.roleAdmin.partnerAccountMode #accountView label,
body.roleAdmin.partnerAccountMode #accountView .partnerPriceRuleSectionHead h4 {
  color: rgba(255, 255, 255, .82);
}

body.roleAdmin.partnerAccountMode #accountView .partnerPriceRuleSectionHead p,
body.roleAdmin.partnerAccountMode #accountView small {
  color: rgba(255, 255, 255, .58);
}

body.roleAdmin.partnerAccountMode #accountView input,
body.roleAdmin.partnerAccountMode #accountView select,
body.roleAdmin.partnerAccountMode #accountView textarea {
  border-color: rgba(72, 159, 223, .34);
  background: rgba(2, 12, 32, .72);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 12px 28px rgba(3, 9, 28, .16);
}

body.roleAdmin.partnerAccountMode #accountView input:focus,
body.roleAdmin.partnerAccountMode #accountView select:focus,
body.roleAdmin.partnerAccountMode #accountView textarea:focus {
  border-color: rgba(72, 159, 223, .84);
  background: rgba(6, 18, 46, .88);
  box-shadow: 0 0 0 4px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .14);
}

body.roleAdmin.partnerAccountMode #accountView select option {
  color: #141B4D;
  background: #ffffff;
}

body.roleAdmin.partnerAccountMode #accountView input[type="file"] {
  padding: 8px 10px !important;
}

body.roleAdmin.partnerAccountMode #accountView input[type="file"]::file-selector-button {
  border-color: rgba(72, 159, 223, .42);
  background: linear-gradient(135deg, rgba(72, 159, 223, .98), rgba(72, 159, 223, .78));
  color: #ffffff;
}

body.roleAdmin.partnerAccountMode .partnerPriceRuleSection {
  padding: clamp(18px, 2.2vw, 28px);
  border: 1px solid rgba(72, 159, 223, .26);
  border-radius: 24px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .055)),
    rgba(20, 27, 77, .42);
  box-shadow: 0 22px 56px rgba(3, 9, 28, .2), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.roleAdmin.partnerAccountMode .partnerPriceRuleGrid {
  gap: clamp(14px, 1.5vw, 20px);
}

body.roleAdmin.partnerAccountMode #accountSubmitButton {
  justify-self: start;
  min-width: min(260px, 100%);
}

body.portalReferral:not(.dashboardMode) .shell {
  width: 100%;
  max-width: none;
  justify-items: center;
  padding-left: 0;
  padding-right: 0;
}

body.portalReferral:not(.dashboardMode) .brand {
  width: min(1040px, calc(100vw - 32px));
  max-width: min(1040px, calc(100vw - 32px));
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  box-sizing: border-box;
}

body.portalReferral:not(.dashboardMode) .brandLogo,
body.portalReferral:not(.dashboardMode) .brand h1,
body.portalReferral:not(.dashboardMode) .brand p {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

body.portalReferral:not(.dashboardMode) .brand h1 {
  width: 100%;
  max-width: 780px;
}

body.portalReferral:not(.dashboardMode) .brand p {
  width: 100%;
  max-width: 680px;
}

body.portalReferral:not(.dashboardMode) #choiceView,
body.portalReferral:not(.dashboardMode) #loginView {
  justify-self: center;
  margin-left: auto;
  margin-right: auto;
}

body.portalReferral #loginView.panel,
body.portalReferral.roleCustomer #dashboardView,
body.portalReferral .recommendationForm,
body.portalReferral .reviewBox,
body.portalReferral .noticeBox,
body.portalReferral .customerActionBox,
body.portalReferral .tableWrap,
body.portalReferral .creditSummary > div,
body.portalReferral .advisorCard {
  color: #ffffff;
  border: 1px solid rgba(72, 159, 223, .28);
  background:
    linear-gradient(145deg, rgba(12, 24, 58, .9), rgba(6, 16, 42, .78)),
    rgba(255, 255, 255, .05);
  box-shadow: 0 28px 86px rgba(3, 9, 28, .32), inset 0 1px 0 rgba(255, 255, 255, .13);
  backdrop-filter: blur(22px) saturate(1.18);
  -webkit-backdrop-filter: blur(22px) saturate(1.18);
}

body.portalReferral #dashboardView {
  background: transparent;
  border: 0;
  box-shadow: none;
}

body.portalReferral #loginView.panel {
  max-width: 540px;
  border-radius: 28px;
}

body.portalReferral #loginView h2,
body.portalReferral #dashboardView h2,
body.portalReferral #dashboardView h3,
body.portalReferral #dashboardView h4,
body.portalReferral .customerActionBox strong,
body.portalReferral .creditSummary strong,
body.portalReferral .reviewBox strong,
body.portalReferral .tableWrap strong {
  color: #ffffff;
}

body.portalReferral #loginView label,
body.portalReferral .recommendationForm label,
body.portalReferral .noticeBox label,
body.portalReferral .customerActionBox span,
body.portalReferral .reviewBox .step,
body.portalReferral .tableWrap th {
  color: rgba(255, 255, 255, .72);
}

body.portalReferral .mutedText,
body.portalReferral .customerActionBox p,
body.portalReferral .reviewBox p,
body.portalReferral .noticeBox p,
body.portalReferral .creditSummary span,
body.portalReferral .tableSubtext,
body.portalReferral .tableWrap .mutedText {
  color: rgba(255, 255, 255, .64);
}

body.portalReferral input,
body.portalReferral select,
body.portalReferral textarea {
  border-color: rgba(72, 159, 223, .34);
  background: rgba(2, 12, 32, .72);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 12px 28px rgba(3, 9, 28, .16);
}

body.portalReferral input:focus,
body.portalReferral select:focus,
body.portalReferral textarea:focus {
  border-color: rgba(72, 159, 223, .84);
  background: rgba(6, 18, 46, .88);
  box-shadow: 0 0 0 4px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .14);
}

body.portalReferral input::placeholder,
body.portalReferral textarea::placeholder {
  color: rgba(255, 255, 255, .48);
}

body.portalReferral select option {
  color: #141B4D;
  background: #ffffff;
}

body.portalReferral .tableWrap table {
  border-spacing: 0 12px !important;
}

body.portalReferral .tableWrap th {
  border-bottom: 0;
}

body.portalReferral .tableWrap td {
  border-top: 1px solid rgba(72, 159, 223, .18);
  border-bottom: 1px solid rgba(72, 159, 223, .18);
  background: rgba(12, 28, 64, .74);
  color: rgba(255, 255, 255, .92);
}

body.portalReferral .tableWrap tbody tr td:first-child {
  border-left: 1px solid rgba(72, 159, 223, .18);
  border-radius: 20px 0 0 20px;
}

body.portalReferral .tableWrap tbody tr td:last-child {
  border-right: 1px solid rgba(72, 159, 223, .18);
  border-radius: 0 20px 20px 0;
}

body.portalReferral .friendStatus,
body.portalReferral .reviewStatus,
body.portalReferral .status {
  border: 1px solid rgba(72, 159, 223, .38);
  background: rgba(72, 159, 223, .18);
  color: #ffffff;
}

@media (max-width: 980px) {
  body.partnerDashboardHome .dashboardHeadModern {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "identity"
      "photo"
      "advisor" !important;
  }

  body.partnerDashboardHome .employeePhotoButton,
  body.partnerDashboardHome .advisorCard {
    width: 100% !important;
    height: auto !important;
  }

  body.partnerDashboardHome .partnerHomeActionGrid {
    grid-template-columns: 1fr;
  }

  body.portalPartner.partnerOrderDetailOnly #partnerOrderDetailBox.reviewBox {
    min-height: auto;
    background:
      linear-gradient(180deg, rgba(2, 9, 28, .9) 0%, rgba(5, 14, 42, .8) 38%, rgba(5, 14, 42, .96) 100%),
      url("/assets/premium-customer-hero.jpg") center top / auto 360px no-repeat,
      #020817;
  }

  body.portalPartner.partnerOrderDetailOnly .partnerOrderDetailHead,
  body.portalPartner.partnerOrderDetailOnly .partnerOrderDetailMeta {
    max-width: 100%;
    margin-left: 0;
  }

  body.portalPartner.partnerOrderDetailOnly #partnerOrderDetailTitle {
    max-width: 100%;
    font-size: clamp(34px, 10vw, 56px);
  }

  body.portalPartner.partnerOrderDetailOnly .partnerOrderHeroMetaItem {
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 16px;
  }

  body.portalPartner.partnerOrderDetailOnly .partnerOrderHeroIcon {
    width: 30px;
    height: 30px;
    border-width: 2px;
  }
}

/* Compact admin overview hero */
body.roleAdmin .dashboardHeadModern {
  min-height: clamp(220px, 24vw, 360px) !important;
  align-content: center !important;
  padding: clamp(26px, 3vw, 42px) clamp(34px, 4.2vw, 72px) !important;
  background:
    linear-gradient(90deg, rgba(2, 8, 28, .98) 0%, rgba(4, 13, 38, .9) 28%, rgba(4, 13, 38, .46) 56%, rgba(4, 13, 38, .2) 78%, rgba(4, 13, 38, .48) 100%),
    linear-gradient(180deg, rgba(5, 12, 34, .02) 0%, rgba(5, 12, 34, .1) 48%, rgba(5, 12, 34, .76) 100%),
    url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center center / cover no-repeat,
    #020817;
}

body.roleAdmin .dashboardHeadModern::after {
  bottom: clamp(18px, 2.2vw, 28px) !important;
}

body.roleAdmin .dashboardHeadModern .dashboardIdentity {
  max-width: min(760px, 58vw) !important;
  padding-top: 0 !important;
}

body.roleAdmin .dashboardHeadModern #welcomeTitle {
  font-size: clamp(34px, 4.2vw, 64px) !important;
  line-height: 1 !important;
}

@media (max-width: 980px) {
  body.roleAdmin .dashboardHeadModern {
    min-height: 260px !important;
    padding: 160px 22px 28px !important;
    align-content: end !important;
    background:
      linear-gradient(180deg, rgba(2, 8, 28, .2) 0%, rgba(2, 8, 28, .84) 62%, rgba(2, 8, 28, .98) 100%),
      url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center top / auto 260px no-repeat,
      #020817;
  }

body.roleAdmin .dashboardHeadModern #welcomeTitle {
    font-size: clamp(30px, 9vw, 48px) !important;
  }
}

/* Reonic detail dark field pass */
#reonicOrderDetailPanel .billingSummaryBox,
#reonicOrderDetailPanel .billingPaymentPanel,
#reonicOrderDetailPanel .billingPaymentTerms input,
#reonicOrderDetailPanel .smartMeterBox,
#reonicOrderDetailPanel .smartMeterOk,
#reonicOrderDetailPanel .smartMeterWarning,
#reonicOrderDetailPanel .roofTileWarning,
#reonicOrderDetailPanel .orderChangeOpen {
  border: 1px solid rgba(72, 159, 223, .32);
  background: rgba(0, 18, 46, .72);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 14px 34px rgba(0, 0, 0, .18);
}

#reonicOrderDetailPanel .billingSummaryBox strong,
#reonicOrderDetailPanel .billingSummaryBox span,
#reonicOrderDetailPanel .billingPaymentPanel span,
#reonicOrderDetailPanel .billingPaymentPanel strong,
#reonicOrderDetailPanel .billingPaymentPanel small,
#reonicOrderDetailPanel .smartMeterBox strong,
#reonicOrderDetailPanel .smartMeterBox p,
#reonicOrderDetailPanel .roofTileWarning,
#reonicOrderDetailPanel .orderChangeOpen {
  color: rgba(255, 255, 255, .9);
}

#reonicOrderDetailPanel .smartMeterOk {
  border-color: rgba(72, 159, 223, .42);
  background: rgba(72, 159, 223, .18);
}

#reonicOrderDetailPanel .smartMeterWarning {
  border-color: rgba(255, 197, 96, .36);
  background: rgba(255, 197, 96, .16);
}

#reonicOrderDetailPanel .billingPaymentTerms input:focus {
  border-color: rgba(72, 159, 223, .84);
  box-shadow: 0 0 0 4px rgba(72, 159, 223, .16), inset 0 1px 0 rgba(255, 255, 255, .12);
}

/* Reonic customer file: unify every tab with the dark blue montage look */
#reonicOrderDetailPanel .reonicDetailTabs {
  gap: clamp(16px, 1.6vw, 22px) !important;
}

#reonicOrderDetailPanel .reonicDetailTabList {
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: 18px;
  background: rgba(1, 12, 34, .74);
  box-shadow: 0 18px 44px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .08);
}

#reonicOrderDetailPanel .reonicDetailTabButton {
  border-radius: 12px;
  color: rgba(225, 240, 255, .82);
  background: rgba(255, 255, 255, .04);
}

#reonicOrderDetailPanel .reonicDetailTabButton:hover,
#reonicOrderDetailPanel .reonicDetailTabButton:focus-visible {
  border-color: rgba(72, 159, 223, .44);
  background: rgba(72, 159, 223, .18);
  color: #ffffff;
}

#reonicOrderDetailPanel .reonicDetailTabButton.is-active {
  border-color: rgba(101, 189, 255, .62);
  background: linear-gradient(135deg, rgba(72, 159, 223, .98), rgba(22, 85, 154, .9));
  color: #ffffff;
  box-shadow: 0 16px 38px rgba(72, 159, 223, .22), inset 0 1px 0 rgba(255, 255, 255, .18);
}

#reonicOrderDetailPanel .reonicDetailTabPanel {
  gap: clamp(14px, 1.4vw, 18px) !important;
}

#reonicOrderDetailPanel .reonicOptionCard,
#reonicOrderDetailPanel .calendarCheckCard,
#reonicOrderDetailPanel .reonicDocumentCard,
#reonicOrderDetailPanel .protocolDocumentsCard,
#reonicOrderDetailPanel .orderChangeBox,
#reonicOrderDetailPanel .customerImagesCard,
#reonicOrderDetailPanel .reonicEmailHistoryCard,
#reonicOrderDetailPanel .billingCard,
#reonicOrderDetailPanel .deliveryDateBox,
#reonicOrderDetailPanel .preparationUploadCard {
  border: 1px solid rgba(101, 169, 226, .24);
  border-radius: 18px;
  background: rgba(1, 12, 34, .72);
  color: #ffffff;
  box-shadow: 0 26px 80px rgba(0, 0, 0, .32), inset 0 1px 0 rgba(255, 255, 255, .08);
  backdrop-filter: blur(18px) saturate(1.1);
  -webkit-backdrop-filter: blur(18px) saturate(1.1);
}

#reonicOrderDetailPanel .reonicOptionHead {
  padding-bottom: 2px;
}

#reonicOrderDetailPanel .reonicOptionHead span,
#reonicOrderDetailPanel .reonicDocumentBadge,
#reonicOrderDetailPanel .customerImageSectionHead span,
#reonicOrderDetailPanel .protocolDocumentItem span,
#reonicOrderDetailPanel .emailHistoryItem span,
#reonicOrderDetailPanel .emailHistoryItem small {
  color: rgba(190, 221, 255, .76);
}

#reonicOrderDetailPanel .reonicOptionHead strong,
#reonicOrderDetailPanel .reonicDocumentLink strong,
#reonicOrderDetailPanel .customerImageSectionHead strong,
#reonicOrderDetailPanel .protocolDocumentItem strong,
#reonicOrderDetailPanel .emailHistoryItem strong {
  color: #ffffff;
}

#reonicOrderDetailPanel .calendarCheckItem,
#reonicOrderDetailPanel .reonicDocumentLink,
#reonicOrderDetailPanel .protocolDocumentItem,
#reonicOrderDetailPanel .customerImageSection,
#reonicOrderDetailPanel .preparationDropZone,
#reonicOrderDetailPanel .preparationImageSummary span,
#reonicOrderDetailPanel .preparationImageCard,
#reonicOrderDetailPanel .customerImageThumb,
#reonicOrderDetailPanel .reonicImageThumb,
#reonicOrderDetailPanel .emailHistoryItem,
#reonicOrderDetailPanel .componentGroup li,
#reonicOrderDetailPanel .substructureSummaryCard {
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: 16px;
  background: rgba(0, 18, 46, .78);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 14px 34px rgba(0, 0, 0, .18);
}

#reonicOrderDetailPanel .reonicDocumentLink,
#reonicOrderDetailPanel .customerImageThumb,
#reonicOrderDetailPanel .reonicImageThumb {
  text-decoration: none;
}

#reonicOrderDetailPanel .reonicDocumentLink:hover,
#reonicOrderDetailPanel .reonicDocumentLink:focus-visible,
#reonicOrderDetailPanel .customerImageThumb:hover,
#reonicOrderDetailPanel .customerImageThumb:focus-visible,
#reonicOrderDetailPanel .reonicImageThumb:hover,
#reonicOrderDetailPanel .reonicImageThumb:focus-visible {
  border-color: rgba(101, 189, 255, .58);
  background: rgba(0, 28, 70, .86);
  box-shadow: 0 18px 42px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .12);
}

#reonicOrderDetailPanel .customerImageThumb img,
#reonicOrderDetailPanel .reonicImageThumb img,
#reonicOrderDetailPanel .preparationImagePreview img {
  background: rgba(2, 8, 28, .68);
}

#reonicOrderDetailPanel .customerImageThumb span,
#reonicOrderDetailPanel .reonicImageThumb span {
  color: rgba(235, 246, 255, .9);
}

#reonicOrderDetailPanel .preparationNotesGrid textarea,
#reonicOrderDetailPanel .preparationImageCategory,
#reonicOrderDetailPanel .deliveryDateBox input,
#reonicOrderDetailPanel .substructureToggle,
#reonicOrderDetailPanel .billingPaymentTerms input {
  border: 1px solid rgba(72, 159, 223, .3);
  background: rgba(0, 18, 46, .78);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

#reonicOrderDetailPanel .preparationNotesGrid textarea:focus,
#reonicOrderDetailPanel .preparationImageCategory:focus,
#reonicOrderDetailPanel .deliveryDateBox input:focus,
#reonicOrderDetailPanel .billingPaymentTerms input:focus {
  border-color: rgba(101, 189, 255, .72);
  box-shadow: 0 0 0 4px rgba(72, 159, 223, .16), inset 0 1px 0 rgba(255, 255, 255, .12);
}

#reonicOrderDetailPanel .reonicEmptyTabState {
  border-style: dashed;
  background: rgba(0, 18, 46, .56);
}

/* Final dark surface pass for admin CRM tables and metrics */
body.roleAdmin .adminMetric,
body.roleAdmin .creditSummary div,
body.roleAdmin .accountingMetric,
body.roleAdmin .statCard,
body.roleAdmin .kpiCard,
body.roleEmployee .adminMetric,
body.roleEmployee .creditSummary div {
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(10, 23, 58, .9), rgba(4, 14, 38, .82)),
    rgba(255, 255, 255, .05);
  color: #ffffff;
  box-shadow: 0 24px 70px rgba(3, 9, 28, .24), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.roleAdmin .adminMetric span,
body.roleAdmin .adminMetric small,
body.roleAdmin .creditSummary span,
body.roleEmployee .adminMetric span,
body.roleEmployee .adminMetric small,
body.roleEmployee .creditSummary span {
  color: rgba(255, 255, 255, .74);
}

body.roleAdmin .adminMetric strong,
body.roleAdmin .creditSummary strong,
body.roleEmployee .adminMetric strong,
body.roleEmployee .creditSummary strong {
  color: #ffffff;
}

body.roleAdmin .adminMetric:hover,
body.roleEmployee .adminMetric:hover {
  border-color: rgba(72, 159, 223, .62);
  background:
    linear-gradient(145deg, rgba(72, 159, 223, .22), rgba(4, 14, 38, .88)),
    rgba(255, 255, 255, .07);
  box-shadow: 0 30px 84px rgba(72, 159, 223, .16), inset 0 1px 0 rgba(255, 255, 255, .16);
}

body.roleAdmin .tableWrap:not(.reonicKanbanWrap),
body.roleEmployee .tableWrap:not(.reonicKanbanWrap) {
  border: 1px solid rgba(72, 159, 223, .24);
  border-radius: 28px;
  background:
    radial-gradient(circle at 88% 0%, rgba(72, 159, 223, .16), transparent 34%),
    linear-gradient(145deg, rgba(8, 18, 50, .88), rgba(3, 12, 34, .84));
  box-shadow: 0 28px 86px rgba(3, 9, 28, .32), inset 0 1px 0 rgba(255, 255, 255, .1);
  overflow-x: auto;
}

body.roleAdmin .tableWrap table,
body.roleEmployee .tableWrap table {
  min-width: 760px;
  border-collapse: separate !important;
  border-spacing: 0 12px !important;
  background: transparent;
}

body.roleAdmin .tableWrap th,
body.roleEmployee .tableWrap th {
  padding: 16px 20px !important;
  border-bottom: 0;
  color: rgba(255, 255, 255, .68);
  font-weight: 900;
}

body.roleAdmin .tableWrap td,
body.roleEmployee .tableWrap td {
  padding: 18px 20px !important;
  border-top: 1px solid rgba(72, 159, 223, .18);
  border-bottom: 1px solid rgba(72, 159, 223, .18);
  background: rgba(12, 28, 64, .74);
  color: rgba(255, 255, 255, .92);
  vertical-align: middle;
}

body.roleAdmin .tableWrap tbody tr td:first-child,
body.roleEmployee .tableWrap tbody tr td:first-child {
  border-left: 1px solid rgba(72, 159, 223, .18);
  border-radius: 22px 0 0 22px;
}

body.roleAdmin .tableWrap tbody tr td:last-child,
body.roleEmployee .tableWrap tbody tr td:last-child {
  border-right: 1px solid rgba(72, 159, 223, .18);
  border-radius: 0 22px 22px 0;
}

body.roleAdmin .tableWrap tbody tr:hover td,
body.roleEmployee .tableWrap tbody tr:hover td {
  border-color: rgba(72, 159, 223, .52);
  background: rgba(72, 159, 223, .16);
  box-shadow: 0 18px 44px rgba(3, 9, 28, .22);
}

body.roleAdmin .tableWrap strong,
body.roleAdmin .tableWrap .tableSubtext,
body.roleAdmin .tableWrap .mutedText,
body.roleEmployee .tableWrap strong,
body.roleEmployee .tableWrap .tableSubtext,
body.roleEmployee .tableWrap .mutedText {
  color: rgba(255, 255, 255, .9);
}

body.roleAdmin .tableWrap .tableSubtext,
body.roleAdmin .tableWrap .mutedText,
body.roleEmployee .tableWrap .tableSubtext,
body.roleEmployee .tableWrap .mutedText {
  color: rgba(255, 255, 255, .62);
}

body.roleAdmin .status,
body.roleEmployee .status,
body.roleAdmin .reviewStatus,
body.roleEmployee .reviewStatus {
  border: 1px solid rgba(72, 159, 223, .38);
  background: rgba(72, 159, 223, .18);
  color: #ffffff;
}

body.roleAdmin .tableWrap.reonicTableWrap .reonicTable,
body.roleEmployee .tableWrap.reonicTableWrap .reonicTable {
  border-spacing: 0 12px !important;
}

body.roleAdmin #accountingPanel,
body.roleAdmin #accountingSettingsPanel {
  width: 100% !important;
  max-width: none !important;
  color: #ffffff;
  border: 1px solid rgba(72, 159, 223, .26);
  border-radius: 28px;
  background:
    radial-gradient(circle at 88% 0%, rgba(72, 159, 223, .16), transparent 34%),
    linear-gradient(145deg, rgba(8, 18, 50, .9), rgba(3, 12, 34, .86));
  box-shadow: 0 28px 86px rgba(3, 9, 28, .32), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.roleAdmin #accountingPanel .formHead,
body.roleAdmin #accountingSettingsPanel .formHead {
  align-items: end;
  gap: 18px;
  margin-bottom: 22px;
}

body.roleAdmin #accountingPanel h3,
body.roleAdmin #accountingSettingsPanel h3 {
  color: #ffffff;
}

body.roleAdmin #accountingPanel .step,
body.roleAdmin #accountingSettingsPanel .step {
  color: rgba(255, 255, 255, .68);
}

body.roleAdmin .accountingSummary {
  gap: 14px !important;
  margin-bottom: 22px;
}

body.roleAdmin .accountingMetric {
  min-height: 132px;
  cursor: default !important;
}

body.roleAdmin .accountingMetric:hover {
  border-color: rgba(72, 159, 223, .34);
  background:
    linear-gradient(145deg, rgba(10, 23, 58, .9), rgba(4, 14, 38, .82)),
    rgba(255, 255, 255, .05);
  box-shadow: 0 24px 70px rgba(3, 9, 28, .24), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.roleAdmin .accountingMetric span,
body.roleAdmin .accountingMetric small {
  color: rgba(255, 255, 255, .68);
}

body.roleAdmin .accountingMetric strong {
  color: #ffffff;
}

body.roleAdmin .accountingList {
  gap: 14px;
  margin-top: 0;
}

body.roleAdmin .accountingInvoiceCard {
  border: 1px solid rgba(72, 159, 223, .22);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(12, 28, 64, .82), rgba(4, 14, 38, .76)),
    rgba(255, 255, 255, .04);
  color: #ffffff;
  box-shadow: 0 18px 52px rgba(3, 9, 28, .2), inset 0 1px 0 rgba(255, 255, 255, .1);
}

body.roleAdmin .accountingInvoiceCard:hover {
  border-color: rgba(72, 159, 223, .48);
  background:
    linear-gradient(145deg, rgba(72, 159, 223, .16), rgba(4, 14, 38, .82)),
    rgba(255, 255, 255, .055);
}

body.roleAdmin .accountingInvoiceMain span,
body.roleAdmin .accountingInvoiceMain small,
body.roleAdmin .accountingInvoiceAmount small {
  color: rgba(255, 255, 255, .62);
}

body.roleAdmin .accountingInvoiceMain strong,
body.roleAdmin .accountingInvoiceAmount strong,
body.roleAdmin .accountingInvoiceMain p {
  color: #ffffff;
}

body.roleAdmin #accountingSettingsForm {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  color: #ffffff;
}

body.roleAdmin #accountingSettingsForm label {
  color: rgba(255, 255, 255, .76);
  font-weight: 800;
}

body.roleAdmin #accountingSettingsForm label:has(textarea),
body.roleAdmin #accountingSettingsForm button,
body.roleAdmin #accountingSettingsMessage {
  grid-column: 1 / -1;
}

body.roleAdmin #accountingSettingsForm input,
body.roleAdmin #accountingSettingsForm textarea {
  border-color: rgba(72, 159, 223, .34);
  background: rgba(2, 12, 32, .72);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 12px 28px rgba(3, 9, 28, .16);
}

body.roleAdmin #accountingSettingsForm input:focus,
body.roleAdmin #accountingSettingsForm textarea:focus {
  border-color: rgba(72, 159, 223, .84);
  background: rgba(6, 18, 46, .88);
  box-shadow: 0 0 0 4px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .14);
}

body.roleAdmin #accountingSettingsForm textarea::placeholder,
body.roleAdmin #accountingSettingsForm input::placeholder {
  color: rgba(255, 255, 255, .46);
}

body.roleAdmin #accountingSettingsMessage {
  margin: 0;
  color: rgba(255, 255, 255, .72);
}

body.roleAdmin #accountingPanel .secondaryButton,
body.roleAdmin #accountingSettingsPanel button[type="submit"] {
  border: 1px solid rgba(72, 159, 223, .38);
  background:
    linear-gradient(135deg, rgba(72, 159, 223, .96), rgba(72, 159, 223, .72));
  color: #ffffff;
  box-shadow: 0 16px 38px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .18);
}

body.roleAdmin #accountingPanel .secondaryButton:hover,
body.roleAdmin #accountingSettingsPanel button[type="submit"]:hover {
  border-color: rgba(255, 255, 255, .34);
  background:
    linear-gradient(135deg, rgba(96, 178, 240, .98), rgba(72, 159, 223, .86));
}

body.roleAdmin #accountingPanel .dangerSoftButton {
  border-color: rgba(255, 114, 114, .38);
  background:
    linear-gradient(135deg, rgba(129, 35, 35, .78), rgba(82, 18, 30, .72));
  color: #ffffff;
}

body.roleAdmin .advisorCard,
body.roleEmployee .advisorCard,
body.roleAdmin .employeePhotoButton,
body.roleEmployee .employeePhotoButton,
body.roleAdmin .componentGroup li,
body.roleEmployee .componentGroup li,
body.roleAdmin .calendarCheckItem,
body.roleEmployee .calendarCheckItem,
body.roleAdmin .deliveryDateBox,
body.roleEmployee .deliveryDateBox,
body.roleAdmin .substructureBox,
body.roleEmployee .substructureBox,
body.roleAdmin .substructureSummaryCard,
body.roleEmployee .substructureSummaryCard,
body.roleAdmin .billingSummaryBox,
body.roleEmployee .billingSummaryBox,
body.roleAdmin .billingPaymentPanel,
body.roleEmployee .billingPaymentPanel,
body.roleAdmin .roofTileWarning,
body.roleEmployee .roofTileWarning {
  border: 1px solid rgba(72, 159, 223, .26);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(12, 28, 64, .86), rgba(4, 14, 38, .82)),
    rgba(255, 255, 255, .05);
  color: #ffffff;
  box-shadow: 0 20px 54px rgba(3, 9, 28, .22), inset 0 1px 0 rgba(255, 255, 255, .1);
}

body.roleAdmin .advisorCard span,
body.roleAdmin .advisorCard small,
body.roleAdmin .componentGroup li span,
body.roleAdmin .calendarCheckItem span,
body.roleAdmin .billingSummaryBox p,
body.roleAdmin .roofTileWarning p,
body.roleAdmin .roofTileWarning li span,
body.roleEmployee .advisorCard span,
body.roleEmployee .advisorCard small,
body.roleEmployee .componentGroup li span,
body.roleEmployee .calendarCheckItem span,
body.roleEmployee .billingSummaryBox p,
body.roleEmployee .roofTileWarning p,
body.roleEmployee .roofTileWarning li span {
  color: rgba(255, 255, 255, .68);
}

body.roleAdmin .advisorCard strong,
body.roleAdmin .componentGroup li strong,
body.roleAdmin .billingSummaryBox strong,
body.roleAdmin .roofTileWarning strong,
body.roleEmployee .advisorCard strong,
body.roleEmployee .componentGroup li strong,
body.roleEmployee .billingSummaryBox strong,
body.roleEmployee .roofTileWarning strong {
  color: #ffffff;
}

body.roleAdmin .roofTileWarning li,
body.roleEmployee .roofTileWarning li {
  border: 1px solid rgba(72, 159, 223, .18);
  background: rgba(4, 14, 38, .58);
}

body.roleAdmin .billingToggleButton,
body.roleEmployee .billingToggleButton {
  border: 1px solid rgba(72, 159, 223, .38);
  background: rgba(6, 20, 50, .84);
  color: #ffffff;
}

body.roleAdmin .billingToggleButton:hover,
body.roleEmployee .billingToggleButton:hover {
  border-color: rgba(72, 159, 223, .72);
  background: rgba(72, 159, 223, .18);
}

body.roleAdmin .deliveryDateBox input,
body.roleAdmin .roofTileForm input,
body.roleEmployee .deliveryDateBox input,
body.roleEmployee .roofTileForm input {
  border-color: rgba(72, 159, 223, .34);
  background: rgba(2, 12, 32, .72);
  color: #ffffff;
}

body.roleAdmin #reonicOrderDetailPanel .reonicDetailTabPanels,
body.roleAdmin #reonicOrderDetailPanel .reonicDetailTabPanel {
  background: transparent;
}

body.roleAdmin #reonicOrderDetailPanel .reonicOptionCard,
body.roleAdmin #reonicOrderDetailPanel .calendarCheckCard,
body.roleAdmin #reonicOrderDetailPanel .reonicDocumentCard,
body.roleAdmin #reonicOrderDetailPanel .protocolDocumentsCard,
body.roleAdmin #reonicOrderDetailPanel .orderChangeBox,
body.roleAdmin #reonicOrderDetailPanel .customerImagesCard,
body.roleAdmin #reonicOrderDetailPanel .reonicEmailHistoryCard,
body.roleAdmin #reonicOrderDetailPanel .billingCard,
body.roleAdmin #reonicOrderDetailPanel .deliveryDateBox,
body.roleAdmin #reonicOrderDetailPanel .preparationUploadCard,
body.roleAdmin #reonicOrderDetailPanel .substructureBox {
  border: 1px solid rgba(101, 169, 226, .24);
  border-radius: 18px;
  background: rgba(1, 12, 34, .82);
  color: #ffffff;
  box-shadow: 0 26px 80px rgba(0, 0, 0, .32), inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.roleAdmin #reonicOrderDetailPanel .calendarCheckItem,
body.roleAdmin #reonicOrderDetailPanel .reonicDocumentLink,
body.roleAdmin #reonicOrderDetailPanel .protocolDocumentItem,
body.roleAdmin #reonicOrderDetailPanel .customerImageSection,
body.roleAdmin #reonicOrderDetailPanel .preparationDropZone,
body.roleAdmin #reonicOrderDetailPanel .preparationImageSummary span,
body.roleAdmin #reonicOrderDetailPanel .preparationImageCard,
body.roleAdmin #reonicOrderDetailPanel .customerImageThumb,
body.roleAdmin #reonicOrderDetailPanel .reonicImageThumb,
body.roleAdmin #reonicOrderDetailPanel .emailHistoryItem,
body.roleAdmin #reonicOrderDetailPanel .componentGroup li,
body.roleAdmin #reonicOrderDetailPanel .substructureSummaryCard,
body.roleAdmin #reonicOrderDetailPanel .billingSummaryBox,
body.roleAdmin #reonicOrderDetailPanel .billingPaymentPanel,
body.roleAdmin #reonicOrderDetailPanel .smartMeterBox,
body.roleAdmin #reonicOrderDetailPanel .roofTileWarning,
body.roleAdmin #reonicOrderDetailPanel .orderChangeOpen,
body.roleAdmin #reonicOrderDetailPanel .orderStatusRow p {
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: 16px;
  background: rgba(0, 18, 46, .86);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 14px 34px rgba(0, 0, 0, .18);
}

body.dashboardMode:is(.roleAdmin, .roleEmployee, .rolePartner) .recommendationForm,
body.dashboardMode:is(.roleAdmin, .roleEmployee, .rolePartner) .reviewBox,
body.dashboardMode:is(.roleAdmin, .roleEmployee, .rolePartner) .noticeBox,
body.dashboardMode:is(.roleAdmin, .roleEmployee, .rolePartner) .customerActionBox,
body.dashboardMode:is(.roleAdmin, .roleEmployee, .rolePartner) .partnerActionBox,
body.dashboardMode:is(.roleAdmin, .roleEmployee, .rolePartner) .adminAccountsPanel,
body.dashboardMode:is(.roleAdmin, .roleEmployee, .rolePartner) .accountingPanel,
body.dashboardMode:is(.roleAdmin, .roleEmployee, .rolePartner) .emailAutomationPanel {
  border: 1px solid rgba(101, 169, 226, .24);
  border-radius: 18px;
  background: rgba(1, 12, 34, .82);
  color: #ffffff;
  box-shadow: 0 26px 80px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .08);
}

@media (max-width: 760px) {
  body.roleAdmin .tableWrap:not(.reonicKanbanWrap),
  body.roleEmployee .tableWrap:not(.reonicKanbanWrap) {
    border-radius: 22px;
    padding: 14px !important;
  }

  body.roleAdmin .tableWrap table,
  body.roleEmployee .tableWrap table {
    min-width: 680px;
  }
}

/* Mobile-only admin hardening: prevent overflow without touching desktop */
@media (max-width: 760px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  body.roleAdmin .shell,
  body.roleAdmin .appLayout,
  body.roleAdmin .appContent,
  body.roleAdmin #dashboardView,
  body.roleAdmin .panel,
  body.roleAdmin .recommendationForm,
  body.roleAdmin .reviewBox,
  body.roleAdmin .customerActionBox,
  body.roleAdmin .reonicDetailPanel,
  body.roleAdmin .reonicDetailContent,
  body.roleAdmin .reonicOptionCard,
  body.roleAdmin .preparationUploadCard,
  body.roleAdmin .billingCard,
  body.roleAdmin .deliveryDateBox,
  body.roleAdmin .substructureBox,
  body.roleAdmin .tableWrap {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  body.roleAdmin .panel,
  body.roleAdmin #dashboardView.panel {
    padding: 10px !important;
  }

  body.roleAdmin .recommendationForm,
  body.roleAdmin .reviewBox,
  body.roleAdmin .customerActionBox,
  body.roleAdmin #reonicOrdersPanel.recommendationForm {
    padding: 16px !important;
    border-radius: 18px;
  }

  body.roleAdmin .dashboardHeadModern {
    min-height: 230px !important;
    padding: 120px 16px 20px !important;
    border-radius: 20px;
    overflow: hidden !important;
    background:
      linear-gradient(180deg, rgba(2, 8, 28, .14) 0%, rgba(2, 8, 28, .78) 58%, rgba(2, 8, 28, .98) 100%),
      url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center top / cover no-repeat,
      #020817;
  }

  body.roleAdmin .dashboardHeadModern .dashboardIdentity {
    max-width: 100% !important;
  }

  body.roleAdmin .dashboardHeadModern #welcomeTitle {
    max-width: 100% !important;
    font-size: clamp(28px, 10vw, 42px) !important;
    line-height: 1.04 !important;
    overflow-wrap: anywhere !important;
  }

  body.roleAdmin .adminSummary,
  body.roleAdmin .creditSummary,
  body.roleAdmin .accountingSummary,
  body.roleAdmin .formGrid,
  body.roleAdmin .partnerOrderDetailActions,
  body.roleAdmin .orderActionGrid,
  body.roleAdmin .substructurePreviewGrid,
  body.roleAdmin .preparationImageGrid,
  body.roleAdmin .reonicImageGrid,
  body.roleAdmin .calendarCheckGrid {
    grid-template-columns: 1fr !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  body.roleAdmin .adminMetric,
  body.roleAdmin .creditSummary div,
  body.roleAdmin .accountingMetric,
  body.roleAdmin .statCard,
  body.roleAdmin .kpiCard {
    min-width: 0 !important;
    min-height: 116px !important;
    padding: 16px !important;
    overflow: hidden !important;
  }

  body.roleAdmin .adminMetric strong,
  body.roleAdmin .creditSummary strong {
    font-size: clamp(26px, 10vw, 40px) !important;
    line-height: 1.05 !important;
    overflow-wrap: anywhere !important;
  }

  body.roleAdmin input,
  body.roleAdmin select,
  body.roleAdmin textarea,
  body.roleAdmin button {
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  body.roleAdmin .formHead {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    align-items: start !important;
  }

  body.roleAdmin .formHead h3,
  body.roleAdmin .reonicOptionHead strong,
  body.roleAdmin .componentGroup strong {
    overflow-wrap: anywhere !important;
  }

  body.roleAdmin .tableWrap {
    overflow: visible !important;
    padding: 0 !important;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  body.roleAdmin .tableWrap table,
  body.roleAdmin .tableWrap.reonicTableWrap .reonicTable {
    min-width: 0 !important;
    width: 100% !important;
    display: block !important;
    border-spacing: 0 !important;
  }

  body.roleAdmin .tableWrap thead {
    display: none !important;
  }

  body.roleAdmin .tableWrap tbody {
    display: grid !important;
    gap: 12px !important;
  }

  body.roleAdmin .tableWrap tr {
    display: grid !important;
    width: 100% !important;
    overflow: hidden !important;
    border: 1px solid rgba(72, 159, 223, .24);
    border-radius: 18px;
    background: rgba(12, 28, 64, .74);
  }

  body.roleAdmin .tableWrap td {
    display: grid !important;
    grid-template-columns: minmax(92px, 34%) minmax(0, 1fr) !important;
    gap: 10px !important;
    width: 100% !important;
    padding: 12px 14px !important;
    border: 0;
    border-bottom: 1px solid rgba(72, 159, 223, .16);
    border-radius: 0;
    background: transparent;
    overflow-wrap: anywhere !important;
  }

  body.roleAdmin .tableWrap td:last-child {
    border-bottom: 0;
  }

  body.roleAdmin .status,
  body.roleAdmin .reviewStatus,
  body.roleAdmin .friendStatus {
    width: fit-content !important;
    max-width: 100% !important;
    white-space: normal !important;
  }

  body.roleAdmin #reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record) {
    padding: 170px 14px 18px !important;
    border-radius: 18px;
    overflow: hidden !important;
    background:
      linear-gradient(180deg, rgba(2, 8, 28, .5) 0%, rgba(2, 8, 28, .9) 42%, rgba(2, 8, 28, .99) 100%),
      url("/assets/premium-customer-hero.jpg") center top / auto 210px no-repeat,
      #020817;
  }

  body.roleAdmin #reonicOrderDetailPanel .formHead,
  body.roleAdmin #reonicOrderDetailPanel #reonicDetailMeta,
  body.roleAdmin #reonicOrderDetailPanel .reonicDetailContent {
    max-width: 100% !important;
    margin-left: 0 !important;
  }

  body.roleAdmin #reonicOrderDetailPanel #reonicDetailTitle {
    font-size: clamp(34px, 12vw, 48px) !important;
    line-height: 1.02 !important;
    overflow-wrap: anywhere !important;
  }

  body.roleAdmin #reonicOrderDetailPanel .reonicCustomerMeta {
    gap: 10px !important;
  }

  body.roleAdmin #reonicOrderDetailPanel .reonicMetaItem {
    display: block !important;
    min-height: 0 !important;
    padding-left: 0 !important;
    overflow-wrap: anywhere !important;
  }

  body.roleAdmin #reonicOrderDetailPanel .reonicMetaIcon,
  body.roleAdmin #reonicOrderDetailPanel .reonicMetaItem::before,
  body.roleAdmin #reonicOrderDetailPanel .reonicMetaItem::after,
  body.roleAdmin #reonicOrderDetailPanel .reonicCustomerMeta p::before,
  body.roleAdmin #reonicOrderDetailPanel .reonicCustomerMeta p::after {
    display: none !important;
    content: none !important;
  }

  body.roleAdmin #reonicOrderDetailPanel .calendarCheckItem {
    min-height: 0 !important;
    padding: 16px !important;
  }

  body.roleAdmin #reonicOrderDetailPanel .calendarCheckItem::after,
  body.roleAdmin #reonicOrderDetailPanel .calendarCheckItem::before {
    display: none !important;
    content: none !important;
  }

  body.roleAdmin #reonicOrderDetailPanel .billingToggleRow {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body.roleAdmin #reonicOrderDetailPanel .billingToggleButton {
    min-height: 54px !important;
    padding: 0 10px !important;
    font-size: 22px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  body.roleAdmin #reonicOrderDetailPanel .billingSummaryBox,
  body.roleAdmin #reonicOrderDetailPanel .billingPaymentPanel,
  body.roleAdmin #reonicOrderDetailPanel .billingPaymentTerms,
  body.roleAdmin #reonicOrderDetailPanel .billingPaymentTerms input {
    width: 100% !important;
    min-width: 0 !important;
  }

  body.roleAdmin #reonicOrderDetailPanel .billingPaymentPanel {
    display: grid !important;
    grid-template-columns: 1fr !important;
    align-items: start !important;
  }

  body.roleAdmin #reonicOrderDetailPanel .orderStatusRow,
  body.roleAdmin #reonicOrderDetailPanel .orderActionGrid {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 380px) {
  body.roleAdmin #reonicOrderDetailPanel .billingToggleRow {
    grid-template-columns: 1fr !important;
  }

  body.roleAdmin .tableWrap td {
    grid-template-columns: 1fr !important;
  }
}

/* Desktop sidebar width fix: keep controls inside the rail and remove category chevrons. */
@media (min-width: 901px) {
  .appLayout {
    align-items: start;
  }

  .sidebarRail,
  .appSidebar {
    min-width: 0;
    max-width: 100%;
    overflow-x: hidden;
  }

  .appSidebar {
    top: 0 !important;
  }

  .appContent > :first-child:not(.hidden) {
    margin-top: 0 !important;
  }

  .sidebarTop {
    position: relative;
    grid-template-columns: minmax(0, 1fr);
    padding-right: 46px;
    column-gap: 10px;
  }

  .sidebarBrandTop {
    width: min(168px, 100%);
    min-width: 0;
  }

  .sidebarFooterRow .sidebarNotificationWrap {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
  }

  .sidebarControls {
    position: absolute;
    top: 0;
    right: -16px;
    width: 42px;
    display: flex;
    justify-content: center;
    z-index: 2;
  }

  .sidebarArrowButton {
    width: 42px;
    min-width: 42px;
    height: 42px;
    padding: 0;
  }

  .sidebarPinButton,
  .sidebarSectionChevron {
    display: none !important;
  }

  .sidebarNav,
  .sidebarSection,
  .sidebarSectionItems,
  .sidebarSectionTitleButton,
  .sidebarNavButton,
  .sidebarInlineLogoutButton,
  .sidebarInlineAdminPortalButton {
    min-width: 0;
    max-width: 100%;
  }

  .sidebarSectionTitleButton {
    justify-content: flex-start;
    gap: 0;
    padding-right: 10px;
  }

  .sidebarSectionTitleButton span,
  .sidebarNavLabel {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

/* Final partner signature modal contrast override. */
#partnerSubmitModal.partnerSubmitModal {
  background:
    radial-gradient(circle at 50% 18%, rgba(72, 159, 223, .18), transparent 34%),
    rgba(2, 9, 20, .72);
  backdrop-filter: blur(18px) saturate(1.2);
  -webkit-backdrop-filter: blur(18px) saturate(1.2);
}

#partnerSubmitModal .partnerSubmitModalCard {
  width: min(820px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  overflow: auto;
  text-align: left;
  color: #fff;
  border: 1px solid rgba(72, 159, 223, .34);
  border-radius: 24px;
  background:
    linear-gradient(145deg, rgba(8, 24, 51, .96), rgba(20, 27, 77, .86)),
    rgba(2, 9, 20, .92);
  box-shadow:
    0 32px 100px rgba(0, 0, 0, .48),
    inset 0 1px 0 rgba(255, 255, 255, .14);
}

#partnerSubmitModal .partnerSubmitModalCard h3 {
  padding-right: 44px;
  color: #fff;
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.08;
}

#partnerSubmitModal .partnerSubmitModalCard p {
  max-width: 680px;
  color: rgba(255, 255, 255, .76);
  font-size: 16px;
}

#partnerSubmitModal .partnerSubmitModalClose {
  color: #fff;
  border-color: rgba(255, 255, 255, .18);
  background: rgba(255, 255, 255, .1);
}

#partnerSubmitModal .partnerSubmitModalClose:hover {
  background: rgba(72, 159, 223, .28);
}

#partnerSubmitModal .partnerSubmitPreviewPaper {
  color: #fff;
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: 20px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, .045)),
    rgba(2, 9, 20, .26);
  padding: 18px;
}

#partnerSubmitModal .partnerSubmitPreviewHeader {
  border-color: rgba(72, 159, 223, .24);
}

#partnerSubmitModal .partnerSubmitPreviewHeader strong,
#partnerSubmitModal .partnerSubmitPreviewRows strong,
#partnerSubmitModal .partnerSubmitPreviewCosts strong {
  color: #fff;
}

#partnerSubmitModal .partnerSubmitPreviewHeader span,
#partnerSubmitModal .partnerSubmitPreviewRows span,
#partnerSubmitModal .partnerSubmitPreviewCosts span,
#partnerSubmitModal .partnerSubmitPreviewCosts small {
  color: rgba(255, 255, 255, .68);
}

#partnerSubmitModal .partnerSubmitPreviewRows div {
  border-bottom: 1px solid rgba(72, 159, 223, .18);
  background: rgba(255, 255, 255, .045);
  border-radius: 14px;
  padding: 10px 12px;
}

#partnerSubmitModal .partnerSubmitPreviewCosts {
  border-color: rgba(72, 159, 223, .34);
  background: rgba(72, 159, 223, .12);
}

#partnerSubmitModal .partnerSubmitModalActions {
  justify-content: flex-start;
}

#partnerSubmitModal .partnerSubmitModalActions button,
#partnerSubmitModal .partnerSubmitModalActions button:hover {
  color: #fff;
}

/* Last override: all visible admin dashboard headers stay compact. */
body.roleAdmin .dashboardHeadModern:not(.hidden) {
  min-height: clamp(190px, 18vw, 250px) !important;
  align-content: center !important;
  padding: clamp(24px, 2.8vw, 38px) clamp(30px, 4vw, 64px) !important;
  border-radius: 22px;
  overflow: hidden !important;
  background:
    linear-gradient(90deg, rgba(2, 8, 28, .98) 0%, rgba(4, 13, 38, .9) 30%, rgba(4, 13, 38, .48) 58%, rgba(4, 13, 38, .28) 100%),
    linear-gradient(180deg, rgba(5, 12, 34, .04) 0%, rgba(5, 12, 34, .16) 50%, rgba(5, 12, 34, .76) 100%),
    url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center center / cover no-repeat,
    #020817;
}

body.roleAdmin .dashboardHeadModern:not(.hidden) #welcomeTitle {
  font-size: clamp(34px, 4vw, 58px) !important;
  line-height: 1.02 !important;
}

@media (max-width: 980px) {
  body.roleAdmin .dashboardHeadModern:not(.hidden) {
    min-height: 220px !important;
    padding: 132px 18px 24px !important;
    align-content: end !important;
    background:
      linear-gradient(180deg, rgba(2, 8, 28, .18) 0%, rgba(2, 8, 28, .82) 60%, rgba(2, 8, 28, .98) 100%),
      url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg") center top / auto 230px no-repeat,
      #020817;
  }

  body.roleAdmin .dashboardHeadModern:not(.hidden) #welcomeTitle {
    font-size: clamp(30px, 9vw, 46px) !important;
  }
}

/* Last override: email automation action buttons and preview stay aligned. */
body.roleAdmin #emailAutomationPanel .emailAutomationActions {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-items: stretch !important;
}

body.roleAdmin #emailAutomationPanel .emailAutomationActions button {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 52px !important;
  margin: 0 !important;
  border-radius: 14px;
  align-self: stretch !important;
}

body.roleAdmin #emailAutomationPanel .emailAutomationPreviewButton {
  border: 1px solid rgba(72, 159, 223, .38);
  color: #ffffff;
  background: rgba(72, 159, 223, .18);
}

body.roleAdmin #emailAutomationPanel .emailAutomationDeleteButton {
  border: 1px solid rgba(255, 114, 114, .38);
  color: #ffffff;
  background: linear-gradient(135deg, rgba(129, 35, 35, .78), rgba(82, 18, 30, .72));
}

@media (max-width: 760px) {
  body.roleAdmin #emailAutomationPanel .emailAutomationActions {
    grid-template-columns: 1fr !important;
  }
}

/* Mobile Safari jumps badly with fixed full-page backgrounds while the address bar moves. */
@media (max-width: 980px), (pointer: coarse) {
  html,
  body {
    min-height: 100%;
  }

  body,
  body.dashboardMode {
    background-attachment: scroll;
    background-position: center top;
  }

  .shell {
    min-height: 100dvh;
  }
}

/* Canonical dashboard look: use this as the baseline for all portal work surfaces. */
body.dashboardMode .appContent {
  color: var(--ap-ui-text);
}

body.dashboardMode .recommendationForm,
body.dashboardMode .reviewBox,
body.dashboardMode .noticeBox,
body.dashboardMode .customerActionBox,
body.dashboardMode .partnerActionBox,
body.dashboardMode .tableWrap:not(.reonicKanbanWrap),
body.dashboardMode .statisticsPanel,
body.dashboardMode .statisticsHero,
body.dashboardMode .statisticsBlock,
body.dashboardMode .upcomingAppointments,
body.dashboardMode .montageCalendarPanel,
body.dashboardMode .montageCalendarShell,
body.dashboardMode .montageCalendarHero,
body.dashboardMode .montageCalendarToolbar,
body.dashboardMode .montageCalendarEventForm,
body.dashboardMode .montageCalendarGrid,
body.dashboardMode .adminSummary,
body.dashboardMode .creditSummary,
body.dashboardMode .partnerProjectsMapPanel,
body.dashboardMode #partnerOrderView,
body.dashboardMode #adminAccountsPanel,
body.dashboardMode #accountingPanel,
body.dashboardMode #accountingSettingsPanel,
body.dashboardMode #emailAutomationPanel,
body.dashboardMode #adminStatisticsPanel,
body.dashboardMode #partnerAdminOverviewPanel,
body.dashboardMode #partnerProjectsPanel,
body.dashboardMode #partnerOrderDetailBox,
body.dashboardMode #partnerAdminDetailBox,
body.dashboardMode #partnerAdminEditForm,
body.dashboardMode #customerDetailBox,
body.dashboardMode #reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record) {
  border: 1px solid var(--ap-ui-border);
  border-radius: 18px;
  background: var(--ap-ui-surface);
  color: var(--ap-ui-text);
  box-shadow: var(--ap-ui-shadow);
}

body.dashboardMode #reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record) {
  background:
    linear-gradient(90deg, rgba(2, 8, 28, .98) 0%, rgba(3, 12, 38, .9) 26%, rgba(4, 13, 38, .48) 50%, rgba(4, 13, 38, .12) 72%, rgba(4, 13, 38, .38) 100%),
    linear-gradient(180deg, rgba(5, 12, 34, .02) 0%, rgba(5, 12, 34, .12) 43%, var(--ap-ui-page) 100%),
    url("/assets/premium-customer-hero.jpg") center top / 100% clamp(300px, 26vw, 420px) no-repeat,
    var(--ap-ui-page);
}

body.dashboardMode #partnerOrderView,
body.dashboardMode #partnerOrderView h2,
body.dashboardMode #partnerOrderView .mutedText,
body.dashboardMode #partnerOrderForm label,
body.dashboardMode #partnerOrderForm small {
  color: var(--ap-ui-text);
}

body.dashboardMode #reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record)::before,
body.dashboardMode .recommendationForm::before,
body.dashboardMode .reviewBox::before,
body.dashboardMode .noticeBox::before,
body.dashboardMode .tableWrap:not(.reonicKanbanWrap)::before {
  background: transparent;
}

body.dashboardMode #reonicOrderDetailPanel .reonicDetailContent,
body.dashboardMode #reonicOrderDetailPanel .reonicDetailTabs,
body.dashboardMode #reonicOrderDetailPanel .reonicDetailTabPanels,
body.dashboardMode #reonicOrderDetailPanel .reonicDetailTabPanel {
  background: transparent;
}

body.dashboardMode .reonicOptionCard,
body.dashboardMode .calendarCheckCard,
body.dashboardMode .reonicDocumentCard,
body.dashboardMode .protocolDocumentsCard,
body.dashboardMode .orderChangeBox,
body.dashboardMode .customerImagesCard,
body.dashboardMode .reonicEmailHistoryCard,
body.dashboardMode .billingCard,
body.dashboardMode .deliveryDateBox,
body.dashboardMode .preparationUploadCard,
body.dashboardMode .substructureBox,
body.dashboardMode .adminMetric,
body.dashboardMode .accountingMetric,
body.dashboardMode .statCard,
body.dashboardMode .kpiCard,
body.dashboardMode .partnerProjectCard,
body.dashboardMode .partnerAdminOverviewCard,
body.dashboardMode .projectCard,
body.dashboardMode .customerCard,
body.dashboardMode .emailAutomationItem,
body.dashboardMode .emailAutomationCard,
body.dashboardMode .accountingInvoiceCard,
body.dashboardMode .statisticsBlock,
body.dashboardMode .partnerAdminStatCard,
body.dashboardMode .partnerProjectsMapCard,
body.dashboardMode .partnerProjectsHeader,
body.dashboardMode .payoutReleaseCard {
  border: 1px solid var(--ap-ui-border);
  border-radius: 18px;
  background: var(--ap-ui-surface);
  color: var(--ap-ui-text);
  box-shadow: var(--ap-ui-shadow);
}

body.dashboardMode .calendarCheckItem,
body.dashboardMode .reonicDocumentLink,
body.dashboardMode .protocolDocumentItem,
body.dashboardMode .customerImageSection,
body.dashboardMode .preparationDropZone,
body.dashboardMode .preparationImageSummary span,
body.dashboardMode .preparationImageCard,
body.dashboardMode .customerImageThumb,
body.dashboardMode .reonicImageThumb,
body.dashboardMode .emailHistoryItem,
body.dashboardMode .componentGroup li,
body.dashboardMode .substructureSummaryCard,
body.dashboardMode .billingSummaryBox,
body.dashboardMode .billingPaymentPanel,
body.dashboardMode .smartMeterBox,
body.dashboardMode .smartMeterOk,
body.dashboardMode .smartMeterWarning,
body.dashboardMode .roofTileWarning,
body.dashboardMode .orderChangeOpen,
body.dashboardMode .orderStatusRow p,
body.dashboardMode .adminAccountCard,
body.dashboardMode .adminAccountEmptyState,
body.dashboardMode .adminPermissionCheck,
body.dashboardMode .adminPermissionToggle,
body.dashboardMode .adminPermissionPills span,
body.dashboardMode .adminPermissionPills em,
body.dashboardMode .emailAutomationPreview,
body.dashboardMode .emailAutomationEditor,
body.dashboardMode .emailAutomationCardHeader,
body.dashboardMode .accountingInvoiceMain,
body.dashboardMode .accountingInvoiceAmount,
body.dashboardMode .partnerAdminStatsGrid,
body.dashboardMode .partnerAdminSortBar,
body.dashboardMode .partnerAdminOrdersList,
body.dashboardMode .partnerAdminOrderButton,
body.dashboardMode .partnerAdminDetailPriceSummary,
body.dashboardMode .partnerProjectField,
body.dashboardMode .partnerProjectsMapHead,
body.dashboardMode .partnerProjectsMapFilters,
body.dashboardMode .montageCalendarDay,
body.dashboardMode .montageCalendarWeekColumn,
body.dashboardMode .montageCalendarAgenda,
body.dashboardMode .montageCalendarEventPill,
body.dashboardMode .montageCalendarEventCard {
  border: 1px solid var(--ap-ui-border);
  border-radius: 16px;
  background: var(--ap-ui-card);
  color: var(--ap-ui-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 14px 34px rgba(0, 0, 0, .18);
}

body.dashboardMode .reonicDetailTabList,
body.dashboardMode .adminAccountTabs,
body.dashboardMode .billingToggleRow,
body.dashboardMode .montageMapScopeFilter,
body.dashboardMode .montageCalendarViewSwitch,
body.dashboardMode .partnerProjectSortControls {
  border: 1px solid var(--ap-ui-border);
  border-radius: 18px;
  background: var(--ap-ui-surface-strong);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode .reonicDetailTabButton,
body.dashboardMode .adminAccountTab,
body.dashboardMode .billingToggleButton,
body.dashboardMode .montageMapScopeFilter button,
body.dashboardMode .montageCalendarViewSwitch button,
body.dashboardMode .partnerProjectSortButton {
  border: 1px solid transparent;
  border-radius: 14px;
  background: var(--ap-ui-control);
  color: var(--ap-ui-muted-strong);
  box-shadow: none;
}

body.dashboardMode .reonicDetailTabButton.is-active,
body.dashboardMode .adminAccountTab.is-active,
body.dashboardMode .billingToggleButton.is-selected,
body.dashboardMode .montageMapScopeFilter button.active,
body.dashboardMode .montageCalendarViewSwitch button.active,
body.dashboardMode .reonicDetailTabButton:hover,
body.dashboardMode .adminAccountTab:hover,
body.dashboardMode .billingToggleButton:hover,
body.dashboardMode .montageMapScopeFilter button:hover,
body.dashboardMode .montageCalendarViewSwitch button:hover,
body.dashboardMode .partnerProjectSortButton.active,
body.dashboardMode .partnerProjectSortButton:hover {
  border-color: var(--ap-ui-border-strong);
  background: var(--ap-ui-button);
  color: var(--ap-ui-text);
  box-shadow: 0 16px 38px rgba(72, 159, 223, .22), inset 0 1px 0 rgba(255, 255, 255, .18);
}

body.dashboardMode .secondaryButton,
body.dashboardMode .bigInviteButton,
body.dashboardMode .printOrderButton,
body.dashboardMode .roofTileDoneButton,
body.dashboardMode .roofTilePrintButton,
body.dashboardMode .recommendationForm button[type="submit"],
body.dashboardMode .recommendationForm button[type="button"],
body.dashboardMode .noticeBox button {
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 14px;
  background: var(--ap-ui-button);
  color: var(--ap-ui-text);
  box-shadow: 0 16px 38px rgba(72, 159, 223, .22), inset 0 1px 0 rgba(255, 255, 255, .22);
}

body.dashboardMode input,
body.dashboardMode select,
body.dashboardMode textarea {
  border: 1px solid var(--ap-ui-border);
  background: var(--ap-ui-card);
  color: var(--ap-ui-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode input:focus,
body.dashboardMode select:focus,
body.dashboardMode textarea:focus {
  border-color: var(--ap-ui-border-strong);
  box-shadow: 0 0 0 4px rgba(72, 159, 223, .16), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.dashboardMode h1,
body.dashboardMode h2,
body.dashboardMode h3,
body.dashboardMode h4,
body.dashboardMode strong,
body.dashboardMode label {
  color: var(--ap-ui-text);
}

body.dashboardMode p,
body.dashboardMode small,
body.dashboardMode span,
body.dashboardMode .mutedText,
body.dashboardMode .tableSubtext,
body.dashboardMode .reonicDocumentBadge,
body.dashboardMode .reonicOptionHead span,
body.dashboardMode .customerImageSectionHead span {
  color: var(--ap-ui-muted);
}

body.dashboardMode .clickableReonicRow .montageProtocolNotice {
  display: inline-flex !important;
  margin-top: 8px !important;
  color: #ffffff;
}

body.dashboardMode .reonicOptionHead strong,
body.dashboardMode .customerImageSectionHead strong,
body.dashboardMode .reonicDocumentLink strong,
body.dashboardMode .protocolDocumentItem strong,
body.dashboardMode .emailHistoryItem strong,
body.dashboardMode .adminMetric strong,
body.dashboardMode .statCard strong {
  color: var(--ap-ui-text);
}

body.dashboardMode button span,
body.dashboardMode a.secondaryButton span,
body.dashboardMode .bigInviteButton span,
body.dashboardMode .reonicDetailTabButton span,
body.dashboardMode .adminAccountTab span {
  color: inherit;
}

body.dashboardMode .customerImageThumb img,
body.dashboardMode .reonicImageThumb img,
body.dashboardMode .preparationImagePreview img {
  background: var(--ap-ui-page);
}

/* Canonical dashboard enforcement: keep older page-specific rules from drifting. */
body.dashboardMode #accountView.panel,
body.dashboardMode #accountForm.loginForm,
body.dashboardMode #adminAccountsPanel.recommendationForm,
body.dashboardMode #adminAccountForm,
body.dashboardMode #employeeSummary.adminSummary,
body.dashboardMode #adminSummary.adminSummary,
body.dashboardMode #creditSummary.creditSummary,
body.dashboardMode #upcomingAppointments,
body.dashboardMode #adminStatisticsPanel.statisticsPanel,
body.dashboardMode #emailAutomationPanel.recommendationForm,
body.dashboardMode #accountingPanel.recommendationForm,
body.dashboardMode #accountingSettingsPanel.recommendationForm,
body.dashboardMode #reonicOrdersPanel.recommendationForm,
body.dashboardMode #partnerProjectsPanel.reviewBox,
body.dashboardMode #partnerOrderDetailBox.reviewBox,
body.dashboardMode #partnerAdminDetailBox.reviewBox,
body.dashboardMode #partnerAdminOverviewPanel,
body.dashboardMode #partnerAdminEditForm.recommendationForm,
body.dashboardMode #adminEmployeeEditForm.recommendationForm,
body.dashboardMode #customerDetailBox.reviewBox,
body.dashboardMode #customerAccessForm.noticeBox,
body.dashboardMode #customerProfileEditForm.recommendationForm,
body.dashboardMode #recommendationForm.recommendationForm,
body.dashboardMode #reviewBox.reviewBox {
  border: 1px solid var(--ap-ui-border);
  border-radius: 18px;
  background: var(--ap-ui-surface);
  color: var(--ap-ui-text);
  box-shadow: var(--ap-ui-shadow);
}

body.dashboardMode #accountView.panel::before,
body.dashboardMode #adminAccountsPanel.recommendationForm::before,
body.dashboardMode #adminEmployeeEditForm.recommendationForm::before,
body.dashboardMode #partnerAdminEditForm.recommendationForm::before,
body.dashboardMode #partnerProjectsPanel.reviewBox::before,
body.dashboardMode #partnerOrderDetailBox.reviewBox::before,
body.dashboardMode #partnerAdminDetailBox.reviewBox::before,
body.dashboardMode #customerDetailBox.reviewBox::before,
body.dashboardMode #reviewBox.reviewBox::before {
  background: transparent;
}

body.dashboardMode #adminAccountsPanel .adminAccountTabs,
body.dashboardMode #reonicOrderDetailPanel .reonicDetailTabList,
body.dashboardMode #adminAccountsPanel .adminAccountsLayout,
body.dashboardMode #accountingPanel .accountingSummary,
body.dashboardMode #accountingPanel .accountingList,
body.dashboardMode #emailAutomationPanel .emailAutomationList,
body.dashboardMode #adminStatisticsPanel .statisticsContent,
body.dashboardMode #partnerProjectsCards.partnerProjectsCards,
body.dashboardMode #partnerAdminOverviewList.partnerAdminOverviewList,
body.dashboardMode #partnerAdminOrders.partnerAdminOrders,
body.dashboardMode #upcomingAppointmentsList.appointmentList,
body.dashboardMode #montageCalendarGrid.montageCalendarGrid,
body.dashboardMode #partnerProjectsMapPanel.partnerProjectsMapPanel,
body.dashboardMode #montageMapPanel.partnerProjectsMapPanel,
body.dashboardMode #employeeSummary.adminSummary,
body.dashboardMode #adminSummary.adminSummary,
body.dashboardMode #creditSummary.creditSummary {
  border: 1px solid var(--ap-ui-border);
  border-radius: 18px;
  background: var(--ap-ui-surface-strong);
  color: var(--ap-ui-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode #adminAccountsPanel .adminAccountTab,
body.dashboardMode #reonicOrderDetailPanel .reonicDetailTabButton {
  border: 1px solid transparent;
  border-radius: 14px;
  background: var(--ap-ui-control);
  color: var(--ap-ui-muted-strong);
  box-shadow: none;
}

body.dashboardMode #adminAccountsPanel .adminAccountTab.is-active,
body.dashboardMode #adminAccountsPanel .adminAccountTab:hover,
body.dashboardMode #reonicOrderDetailPanel .reonicDetailTabButton.is-active,
body.dashboardMode #reonicOrderDetailPanel .reonicDetailTabButton:hover {
  border-color: var(--ap-ui-border-strong);
  background: var(--ap-ui-button);
  color: var(--ap-ui-text);
  box-shadow: 0 16px 38px rgba(72, 159, 223, .22), inset 0 1px 0 rgba(255, 255, 255, .18);
}

body.dashboardMode #accountView.panel h2,
body.dashboardMode #accountView.panel h3,
body.dashboardMode #accountView.panel h4,
body.dashboardMode #accountView.panel label,
body.dashboardMode #adminAccountsPanel h3,
body.dashboardMode #adminAccountsPanel h4,
body.dashboardMode #adminAccountsPanel label,
body.dashboardMode #employeeSummary strong,
body.dashboardMode #adminSummary strong {
  color: var(--ap-ui-text);
}

body.dashboardMode #accountView.panel p,
body.dashboardMode #accountView.panel small,
body.dashboardMode #accountView.panel span,
body.dashboardMode #adminAccountsPanel p,
body.dashboardMode #adminAccountsPanel small,
body.dashboardMode #adminAccountsPanel span,
body.dashboardMode #employeeSummary span,
body.dashboardMode #employeeSummary small,
body.dashboardMode #adminSummary span,
body.dashboardMode #adminSummary small {
  color: var(--ap-ui-muted);
}

body.dashboardMode #accountView.panel input,
body.dashboardMode #accountView.panel select,
body.dashboardMode #accountView.panel textarea,
body.dashboardMode #adminAccountsPanel input,
body.dashboardMode #adminAccountsPanel select,
body.dashboardMode #adminAccountsPanel textarea {
  border: 1px solid var(--ap-ui-border);
  border-radius: 14px;
  background: var(--ap-ui-card);
  color: var(--ap-ui-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode #accountView.panel button,
body.dashboardMode #adminAccountsPanel button,
body.dashboardMode #adminEmployeeEditForm button,
body.dashboardMode #partnerAdminEditForm button {
  border-radius: 14px;
}

/* Canonical spacing and contrast guardrails for dashboard pages. */
body.dashboardMode .recommendationForm,
body.dashboardMode .reviewBox,
body.dashboardMode .noticeBox,
body.dashboardMode .customerActionBox,
body.dashboardMode .partnerActionBox,
body.dashboardMode .tableWrap:not(.reonicKanbanWrap),
body.dashboardMode .statisticsPanel,
body.dashboardMode .upcomingAppointments,
body.dashboardMode .montageCalendarPanel,
body.dashboardMode .montageCalendarShell,
body.dashboardMode .adminSummary,
body.dashboardMode .creditSummary,
body.dashboardMode .partnerProjectsMapPanel,
body.dashboardMode #accountView.panel,
body.dashboardMode #accountForm.loginForm,
body.dashboardMode #adminAccountsPanel.recommendationForm,
body.dashboardMode #adminAccountForm.adminAccountForm,
body.dashboardMode #adminStatisticsPanel.statisticsPanel,
body.dashboardMode #emailAutomationPanel.recommendationForm,
body.dashboardMode #accountingPanel.recommendationForm,
body.dashboardMode #accountingSettingsPanel.recommendationForm,
body.dashboardMode #reonicOrdersPanel.recommendationForm,
body.dashboardMode #partnerProjectsPanel.reviewBox,
body.dashboardMode #partnerOrderDetailBox.reviewBox,
body.dashboardMode #partnerAdminDetailBox.reviewBox,
body.dashboardMode #partnerAdminOverviewPanel,
body.dashboardMode #partnerAdminEditForm.recommendationForm,
body.dashboardMode #adminEmployeeEditForm.recommendationForm,
body.dashboardMode #customerDetailBox.reviewBox,
body.dashboardMode #customerAccessForm.noticeBox,
body.dashboardMode #customerProfileEditForm.recommendationForm,
body.dashboardMode #recommendationForm.recommendationForm,
body.dashboardMode #reviewBox.reviewBox {
  padding: var(--ap-ui-panel-padding) !important;
  gap: var(--ap-ui-gap) !important;
}

body.dashboardMode .loginForm,
body.dashboardMode .recommendationForm,
body.dashboardMode .noticeBox,
body.dashboardMode .adminAccountForm,
body.dashboardMode .profileEditor,
body.dashboardMode .formGrid {
  gap: var(--ap-ui-gap) !important;
}

body.dashboardMode .loginForm > label:not(.adminPermissionCheck):not(.adminPermissionToggle),
body.dashboardMode .recommendationForm > label:not(.adminPermissionCheck):not(.adminPermissionToggle),
body.dashboardMode .noticeBox > label:not(.adminPermissionCheck):not(.adminPermissionToggle),
body.dashboardMode .adminAccountForm > label:not(.adminPermissionCheck):not(.adminPermissionToggle),
body.dashboardMode .profileEditor > label:not(.adminPermissionCheck):not(.adminPermissionToggle),
body.dashboardMode .formGrid > label:not(.adminPermissionCheck):not(.adminPermissionToggle),
body.dashboardMode .partnerPriceRuleGrid > label:not(.adminPermissionCheck):not(.adminPermissionToggle) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: start !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode .loginForm > label:not(.adminPermissionCheck):not(.adminPermissionToggle) > input,
body.dashboardMode .loginForm > label:not(.adminPermissionCheck):not(.adminPermissionToggle) > select,
body.dashboardMode .loginForm > label:not(.adminPermissionCheck):not(.adminPermissionToggle) > textarea,
body.dashboardMode .recommendationForm > label:not(.adminPermissionCheck):not(.adminPermissionToggle) > input,
body.dashboardMode .recommendationForm > label:not(.adminPermissionCheck):not(.adminPermissionToggle) > select,
body.dashboardMode .recommendationForm > label:not(.adminPermissionCheck):not(.adminPermissionToggle) > textarea,
body.dashboardMode .noticeBox > label:not(.adminPermissionCheck):not(.adminPermissionToggle) > input,
body.dashboardMode .noticeBox > label:not(.adminPermissionCheck):not(.adminPermissionToggle) > select,
body.dashboardMode .noticeBox > label:not(.adminPermissionCheck):not(.adminPermissionToggle) > textarea,
body.dashboardMode .formGrid > label:not(.adminPermissionCheck):not(.adminPermissionToggle) > input,
body.dashboardMode .formGrid > label:not(.adminPermissionCheck):not(.adminPermissionToggle) > select,
body.dashboardMode .formGrid > label:not(.adminPermissionCheck):not(.adminPermissionToggle) > textarea,
body.dashboardMode .partnerPriceRuleGrid > label:not(.adminPermissionCheck):not(.adminPermissionToggle) > input,
body.dashboardMode .partnerPriceRuleGrid > label:not(.adminPermissionCheck):not(.adminPermissionToggle) > select,
body.dashboardMode .partnerPriceRuleGrid > label:not(.adminPermissionCheck):not(.adminPermissionToggle) > textarea {
  margin-top: 0 !important;
  min-height: 56px !important;
}

body.dashboardMode .loginForm > button[type="submit"],
body.dashboardMode .recommendationForm > button[type="submit"],
body.dashboardMode .noticeBox > button[type="submit"],
body.dashboardMode .adminAccountForm > button[type="submit"],
body.dashboardMode .formActions {
  margin-top: 8px !important;
}

body.dashboardMode .statisticsContent,
body.dashboardMode .adminAccountsLayout,
body.dashboardMode .accountingSummary,
body.dashboardMode .accountingList,
body.dashboardMode .emailAutomationList,
body.dashboardMode .partnerProjectsCards,
body.dashboardMode .partnerAdminOverviewList,
body.dashboardMode .partnerAdminOrders,
body.dashboardMode .appointmentList,
body.dashboardMode .montageCalendarGrid,
body.dashboardMode .reonicDetailTabPanel,
body.dashboardMode .reonicDocumentsGrid,
body.dashboardMode .protocolDocumentsGrid,
body.dashboardMode .customerImageGrid,
body.dashboardMode .billingGrid,
body.dashboardMode .componentGrid,
body.dashboardMode #adminStatisticsPanel .statisticsContent,
body.dashboardMode #partnerAdminOverviewList.partnerAdminOverviewList,
body.dashboardMode #partnerProjectsCards.partnerProjectsCards,
body.dashboardMode #adminAccountsPanel .adminAccountsLayout,
body.dashboardMode #upcomingAppointmentsList.appointmentList {
  padding: var(--ap-ui-card-padding) !important;
  gap: var(--ap-ui-gap) !important;
}

/* Admin portal flattening: keep list rows/cards, remove redundant list wrapper surfaces. */
body.dashboardMode.roleAdmin #partnerProjectsCards.partnerProjectsCards,
body.dashboardMode.roleAdmin #partnerAdminOverviewList.partnerAdminOverviewList,
body.dashboardMode.roleAdmin #partnerAdminOrders.partnerAdminOrders,
body.dashboardMode.roleAdmin #upcomingAppointmentsList.appointmentList:has(.ap-list-v2) {
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode .statisticsHero,
body.dashboardMode .statisticsGrid,
body.dashboardMode .statisticsColumns,
body.dashboardMode .statisticsMiniGrid,
body.dashboardMode .insightList,
body.dashboardMode .partnerAdminStatsGrid,
body.dashboardMode .partnerProjectSortControls,
body.dashboardMode .partnerAdminOverviewCard,
body.dashboardMode .partnerAdminOverviewProjects,
body.dashboardMode .partnerAdminOverviewActions,
body.dashboardMode .partnerAdminOrdersList,
body.dashboardMode .adminAccountsGrid,
body.dashboardMode .emailAutomationCard,
body.dashboardMode .accountingInvoiceCard {
  gap: var(--ap-ui-gap) !important;
}

body.dashboardMode .statisticsHero > div,
body.dashboardMode .statCard,
body.dashboardMode .statisticsBlock,
body.dashboardMode .miniStat,
body.dashboardMode .insightList article,
body.dashboardMode .statisticsTableWrap,
body.dashboardMode .partnerAdminOverviewCard,
body.dashboardMode .partnerAdminStatCard,
body.dashboardMode .partnerAdminSortBar,
body.dashboardMode .partnerAdminOrderButton,
body.dashboardMode .adminAccountCard,
body.dashboardMode .emailAutomationItem,
body.dashboardMode .emailAutomationCard,
body.dashboardMode .accountingInvoiceCard,
body.dashboardMode .accountingMetric,
body.dashboardMode .calendarCheckCard,
body.dashboardMode .reonicOptionCard,
body.dashboardMode .reonicDocumentCard,
body.dashboardMode .protocolDocumentsCard,
body.dashboardMode .customerImagesCard,
body.dashboardMode .billingCard,
body.dashboardMode .preparationUploadCard,
body.dashboardMode .substructureBox {
  border: 1px solid var(--ap-ui-border);
  border-radius: 18px;
  background: var(--ap-ui-card);
  color: var(--ap-ui-text);
  box-shadow: var(--ap-ui-shadow);
}

body.dashboardMode .statisticsHero > div,
body.dashboardMode .statCard,
body.dashboardMode .statisticsBlock,
body.dashboardMode .miniStat,
body.dashboardMode .insightList article,
body.dashboardMode .statisticsTableWrap,
body.dashboardMode .partnerAdminOverviewCard,
body.dashboardMode .partnerAdminStatCard,
body.dashboardMode .partnerAdminOrderButton,
body.dashboardMode .adminAccountCard,
body.dashboardMode .emailAutomationItem,
body.dashboardMode .emailAutomationCard,
body.dashboardMode .accountingInvoiceCard,
body.dashboardMode .calendarCheckCard,
body.dashboardMode .reonicOptionCard,
body.dashboardMode .reonicDocumentCard,
body.dashboardMode .protocolDocumentsCard,
body.dashboardMode .customerImagesCard,
body.dashboardMode .billingCard,
body.dashboardMode .preparationUploadCard,
body.dashboardMode .substructureBox {
  padding: var(--ap-ui-card-padding) !important;
}

body.dashboardMode .partnerAdminSortBar,
body.dashboardMode .reonicDetailTabList,
body.dashboardMode .adminAccountTabs,
body.dashboardMode .billingToggleRow,
body.dashboardMode .montageMapScopeFilter,
body.dashboardMode .montageCalendarViewSwitch,
body.dashboardMode .partnerProjectSortControls {
  padding: 12px !important;
}

body.dashboardMode .statisticsHero > div *,
body.dashboardMode .statCard *,
body.dashboardMode .statisticsBlock *,
body.dashboardMode .miniStat *,
body.dashboardMode .insightList article *,
body.dashboardMode .statisticsTableWrap *,
body.dashboardMode .partnerAdminOverviewCard *,
body.dashboardMode .partnerAdminStatCard *,
body.dashboardMode .adminAccountCard *,
body.dashboardMode .emailAutomationItem *,
body.dashboardMode .accountingInvoiceCard * {
  color: inherit;
}

body.dashboardMode .statisticsHero > div strong,
body.dashboardMode .statCard strong,
body.dashboardMode .statisticsBlock strong,
body.dashboardMode .miniStat strong,
body.dashboardMode .insightList strong,
body.dashboardMode .statisticsTable th,
body.dashboardMode .partnerAdminOverviewCard strong,
body.dashboardMode .partnerAdminOverviewCard h3,
body.dashboardMode .partnerAdminOverviewCard h4,
body.dashboardMode .partnerAdminStatCard strong,
body.dashboardMode .adminAccountCard strong,
body.dashboardMode .emailAutomationItem strong,
body.dashboardMode .accountingInvoiceCard strong {
  color: var(--ap-ui-text);
}

body.dashboardMode .statisticsHero > div span,
body.dashboardMode .statisticsHero > div p,
body.dashboardMode .statCard span,
body.dashboardMode .statCard small,
body.dashboardMode .statisticsBlock span,
body.dashboardMode .statisticsBlock p,
body.dashboardMode .miniStat span,
body.dashboardMode .miniStat small,
body.dashboardMode .insightList p,
body.dashboardMode .statisticsTable td,
body.dashboardMode .partnerAdminOverviewCard span,
body.dashboardMode .partnerAdminOverviewCard p,
body.dashboardMode .partnerAdminStatCard span,
body.dashboardMode .adminAccountCard span,
body.dashboardMode .adminAccountCard p,
body.dashboardMode .emailAutomationItem span,
body.dashboardMode .emailAutomationItem p,
body.dashboardMode .accountingInvoiceCard span,
body.dashboardMode .accountingInvoiceCard p {
  color: var(--ap-ui-muted);
}

body.dashboardMode .statisticsTable {
  color: var(--ap-ui-text);
}

body.dashboardMode .statisticsTable tr,
body.dashboardMode .statisticsTable th,
body.dashboardMode .statisticsTable td {
  border-color: var(--ap-ui-border);
}

body.dashboardMode .partnerAdminOverviewList,
body.dashboardMode #partnerAdminOverviewList.partnerAdminOverviewList {
  overflow: hidden !important;
}

@media (max-width: 640px) {
  body.dashboardMode .recommendationForm,
  body.dashboardMode .reviewBox,
  body.dashboardMode .noticeBox,
  body.dashboardMode .statisticsPanel,
  body.dashboardMode #accountView.panel,
  body.dashboardMode #adminAccountsPanel.recommendationForm,
  body.dashboardMode #adminStatisticsPanel.statisticsPanel,
  body.dashboardMode #partnerAdminOverviewPanel,
  body.dashboardMode #customerDetailBox.reviewBox {
    padding: 18px !important;
  }

  body.dashboardMode .statisticsContent,
  body.dashboardMode .partnerAdminOverviewList,
  body.dashboardMode .adminAccountsLayout {
    padding: 14px !important;
  }
}

/* Single dashboard visual system: final override for legacy page-specific styles. */
body.dashboardMode .appContent :is(
  .panel,
  .recommendationForm,
  .reviewBox,
  .noticeBox,
  .adminAccountsPanel,
  .adminAccountForm,
  .statisticsPanel,
  .accountingPanel,
  .emailAutomationPanel,
  .partnerProjectsMapPanel,
  .upcomingAppointments,
  .montageCalendarPanel,
  .montageCalendarShell,
  #accountView,
  #accountForm,
  #adminAccountsPanel,
  #adminAccountForm,
  #adminEmployeeEditForm,
  #partnerAdminEditForm,
  #partnerAdminOverviewPanel,
  #partnerProjectsPanel,
  #partnerOrderDetailBox,
  #partnerOrderDetailForm,
  #customerDetailBox,
  #reonicOrderDetailPanel,
  #adminStatisticsPanel,
  #accountingPanel,
  #accountingSettingsPanel,
  #emailAutomationPanel
) {
  border-color: var(--ap-ui-border);
  background: var(--ap-ui-surface);
  color: var(--ap-ui-text);
  box-shadow: var(--ap-ui-shadow);
}

body.dashboardMode :is(
  .adminAccountForm,
  .partnerPriceRuleSection,
  .partnerPriceListSummaryBox,
  .partnerOrderCostEstimate,
  .resultBox,
  .adminAccountCard,
  .adminAccountEmptyState,
  .partnerAdminOverviewCard,
  .partnerAdminStatCard,
  .partnerProjectCard,
  .partnerProjectsHeader,
  .payoutReleaseCard,
  .accountingInvoiceCard,
  .accountingMetric,
  .emailAutomationItem,
  .emailAutomationCard,
  .emailAutomationPreview,
  .statisticsHero > div,
  .statCard,
  .statisticsBlock,
  .miniStat,
  .insightList article,
  .statisticsTableWrap,
  .calendarCheckCard,
  .calendarCheckItem,
  .reonicOptionCard,
  .reonicDocumentCard,
  .reonicDocumentLink,
  .protocolDocumentsCard,
  .protocolDocumentItem,
  .customerImagesCard,
  .customerImageSection,
  .billingCard,
  .billingSummaryBox,
  .billingPaymentPanel,
  .deliveryDateBox,
  .preparationUploadCard,
  .preparationDropZone,
  .substructureBox,
  .substructureSummaryCard,
  .smartMeterBox,
  .roofTileWarning,
  .orderChangeOpen,
  .montageCalendarDay,
  .montageCalendarEventCard,
  .montageCalendarEventPill,
  .partnerAdminOrderButton,
  .partnerProjectField
) {
  border: 1px solid var(--ap-ui-border);
  border-radius: 18px;
  background: var(--ap-ui-card);
  color: var(--ap-ui-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 16px 38px rgba(0, 0, 0, .2);
}

body.dashboardMode :is(
  #accountForm,
  #adminAccountForm,
  #adminEmployeeEditForm,
  #partnerAdminEditForm,
  .adminAccountForm,
  .partnerPriceRuleSection,
  .partnerPriceListSummaryBox,
  .partnerOrderCostEstimate,
  .resultBox,
  .adminAccountCard,
  .partnerAdminOverviewCard,
  .partnerProjectCard,
  .accountingInvoiceCard,
  .emailAutomationCard,
  .statisticsHero > div,
  .statCard,
  .statisticsBlock,
  .miniStat,
  .insightList article,
  .statisticsTableWrap,
  .calendarCheckCard,
  .reonicOptionCard,
  .reonicDocumentCard,
  .protocolDocumentsCard,
  .customerImagesCard,
  .billingCard,
  .preparationUploadCard,
  .substructureBox
) {
  padding: var(--ap-ui-card-padding) !important;
}

body.dashboardMode :is(
  .loginForm,
  .recommendationForm,
  .noticeBox,
  .adminAccountForm,
  .formGrid,
  .partnerPriceRuleGrid,
  .partnerPriceRuleSection,
  .statisticsContent,
  .statisticsHero,
  .statisticsGrid,
  .statisticsColumns,
  .statisticsMiniGrid,
  .insightList,
  .adminAccountsLayout,
  .adminAccountsList,
  .partnerAdminOverviewList,
  .partnerProjectsCards,
  .accountingList,
  .emailAutomationList,
  .reonicDetailTabPanel
) {
  gap: var(--ap-ui-gap) !important;
}

body.dashboardMode :is(
  .loginForm,
  .recommendationForm,
  .noticeBox,
  .adminAccountForm,
  .formGrid,
  .partnerPriceRuleGrid
) > label:not(.adminPermissionCheck):not(.adminPermissionToggle) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: start !important;
  margin: 0 !important;
  padding: 0 !important;
  min-width: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: var(--ap-ui-text);
}

body.dashboardMode :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  border: 1px solid var(--ap-ui-border);
  border-radius: 16px;
  background: var(--ap-ui-card);
  color: var(--ap-ui-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode :is(input:not([type="checkbox"]):not([type="radio"]), select) {
  min-height: 56px !important;
}

body.dashboardMode input[type="file"] {
  padding: 10px 14px !important;
}

body.dashboardMode input[type="file"]::file-selector-button {
  min-height: 44px !important;
  margin-right: 14px !important;
  border: 1px solid var(--ap-ui-border-strong);
  border-radius: 14px;
  background: var(--ap-ui-button);
  color: var(--ap-ui-text);
  font: inherit !important;
  font-weight: 800 !important;
}

body.dashboardMode :is(
  h1,
  h2,
  h3,
  h4,
  label,
  strong,
  th,
  button
) {
  color: var(--ap-ui-text);
}

body.dashboardMode :is(
  p,
  small,
  span,
  td,
  .mutedText,
  .formHint,
  .partnerPriceRuleSectionHead p
) {
  color: var(--ap-ui-muted);
}

body.dashboardMode .appContent :is(
  button:not(.ap-kanban-card):not(.ap-icon-button):not(.ap-kanban-column-more):not(.ap-view-toggle-button),
  .secondaryButton,
  .primaryButton,
  .bigInviteButton,
  .compactActionButton,
  .reviewButton
) {
  border-color: var(--ap-ui-border-strong);
  background: var(--ap-ui-button);
  color: var(--ap-ui-text);
  box-shadow: 0 16px 38px rgba(72, 159, 223, .22), inset 0 1px 0 rgba(255, 255, 255, .18);
}

body.dashboardMode .montageCalendarShell {
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
}

/* Sidebar is navigation chrome, not dashboard content. Keep its original compact look. */
body.dashboardMode .sidebarRail,
body.dashboardMode .appSidebar,
body.dashboardMode .sidebarTop,
body.dashboardMode .sidebarNav,
body.dashboardMode .sidebarFooter {
  color: #ffffff;
}

body.dashboardMode .sidebarBrandTop,
body.dashboardMode .sidebarBrandTop:hover {
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transform: none !important;
}

body.dashboardMode .sidebarBrandTop img {
  width: auto !important;
  height: 42px !important;
  object-fit: contain !important;
}

body.dashboardMode .sidebarSectionTitleButton,
body.dashboardMode .sidebarNavButton,
body.dashboardMode .sidebarInlineLogoutButton,
body.dashboardMode .sidebarInlineAdminPortalButton {
  border: 1px solid transparent;
  border-radius: 16px;
  background: transparent;
  color: rgba(255, 255, 255, .84);
  box-shadow: none;
}

body.dashboardMode .sidebarSectionTitleButton {
  min-height: 38px !important;
  padding: 0 10px !important;
  color: #ffffff;
  font-size: 16px !important;
  font-weight: 800 !important;
}

body.dashboardMode .sidebarNavButton {
  min-height: 42px !important;
  padding: 0 12px !important;
  font-weight: 500 !important;
}

body.dashboardMode .sidebarSectionTitleButton:hover,
body.dashboardMode .sidebarNavButton:hover,
body.dashboardMode .sidebarInlineLogoutButton:hover,
body.dashboardMode .sidebarInlineAdminPortalButton:hover {
  background: linear-gradient(135deg, rgba(72, 159, 223, .22), rgba(255, 255, 255, .08));
  border-color: rgba(72, 159, 223, .32);
  box-shadow: none;
  transform: translateX(3px) !important;
}

body.dashboardMode .sidebarNavButton.active,
body.dashboardMode .sidebarNavButton.isActive,
body.dashboardMode .sidebarNavButton[aria-current="page"],
body.dashboardMode .sidebarSectionTitleButton.active,
body.dashboardMode .sidebarSectionTitleButton.isActive,
body.dashboardMode .sidebarSectionTitleButton[aria-current="page"] {
  color: #ffffff;
  background: linear-gradient(135deg, rgba(72, 159, 223, .34), rgba(255, 255, 255, .1));
  border-color: rgba(72, 159, 223, .44);
  box-shadow: var(--ap-premium-glow), inset 0 1px 0 rgba(255, 255, 255, .18);
}

body.dashboardMode .sidebarNavButton span,
body.dashboardMode .sidebarSectionTitleButton span,
body.dashboardMode .sidebarNavLabel,
body.dashboardMode .sidebarProfileText span {
  color: inherit;
}

body.dashboardMode .sidebarControlButton,
body.dashboardMode .sidebarNotificationButton {
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 8px;
  background: rgba(255, 255, 255, .08);
  color: #ffffff;
  box-shadow: none;
}

body.dashboardMode .sidebarControlButton:hover,
body.dashboardMode .sidebarNotificationButton:hover {
  border-color: rgba(72, 159, 223, .46);
  background: rgba(72, 159, 223, .16);
  box-shadow: var(--ap-premium-glow), inset 0 1px 0 rgba(255, 255, 255, .16);
}

/* Dashboard metric tiles must never inherit the bright primary-button surface. */
body.dashboardMode :is(
  .adminMetric,
  .kpiCard,
  .statCard,
  .accountingMetric,
  .billingMetricCard,
  .creditSummary > div,
  .adminSummary > div,
  .statisticsMiniGrid > *,
  .statisticsGrid > *,
  .statisticsColumns > *
) {
  border: 1px solid var(--ap-ui-border);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(8, 22, 50, .94), rgba(2, 9, 25, .96));
  color: var(--ap-ui-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 16px 38px rgba(0, 0, 0, .2);
  transform: none !important;
}

body.dashboardMode :is(
  .adminMetric,
  .kpiCard,
  .statCard,
  .accountingMetric,
  .billingMetricCard,
  .creditSummary > div,
  .adminSummary > div,
  .statisticsMiniGrid > *,
  .statisticsGrid > *,
  .statisticsColumns > *
):hover {
  border-color: var(--ap-ui-border-strong);
  background:
    linear-gradient(145deg, rgba(3, 13, 34, .98), rgba(1, 7, 20, .98));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 18px 44px rgba(0, 0, 0, .28);
  transform: translateY(-1px) !important;
}

body.dashboardMode :is(
  .adminMetric,
  .kpiCard,
  .statCard,
  .accountingMetric,
  .billingMetricCard,
  .creditSummary > div,
  .adminSummary > div,
  .statisticsMiniGrid > *,
  .statisticsGrid > *,
  .statisticsColumns > *
) :is(span, small, p) {
  color: var(--ap-ui-muted);
}

body.dashboardMode :is(
  .adminMetric,
  .kpiCard,
  .statCard,
  .accountingMetric,
  .billingMetricCard,
  .creditSummary > div,
  .adminSummary > div,
  .statisticsMiniGrid > *,
  .statisticsGrid > *,
  .statisticsColumns > *
) :is(strong, b) {
  color: var(--ap-ui-text);
}

/* Email automation editor: keep it plain and avoid cards inside cards. */
body.dashboardMode #emailAutomationPanel .emailAutomationList {
  padding: 0 !important;
  gap: 18px !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #emailAutomationPanel .emailAutomationCard {
  display: grid !important;
  gap: 18px !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #emailAutomationPanel .emailAutomationCard:last-child {
  border-bottom: 0;
}

body.dashboardMode #emailAutomationPanel .emailAutomationCardHeader {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 18px !important;
  align-items: center !important;
  min-height: 0 !important;
  width: 100% !important;
  padding: 18px 20px !important;
  border: 1px solid var(--ap-ui-border);
  border-radius: 16px;
  background:
    linear-gradient(145deg, rgba(8, 22, 50, .94), rgba(2, 9, 25, .96));
  color: var(--ap-ui-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
  transform: none !important;
}

body.dashboardMode #emailAutomationPanel .emailAutomationCardHeader:hover {
  border-color: var(--ap-ui-border-strong);
  background:
    linear-gradient(145deg, rgba(3, 13, 34, .98), rgba(1, 7, 20, .98));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

body.dashboardMode #emailAutomationPanel .emailAutomationCardToggle {
  display: block !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  box-shadow: none;
  text-align: left !important;
  transform: none !important;
}

body.dashboardMode #emailAutomationPanel .emailAutomationCardToggle:hover {
  border: 0;
  background: transparent;
  box-shadow: none;
  transform: none !important;
}

body.dashboardMode #emailAutomationPanel .emailAutomationEnableToggle {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  width: 58px !important;
  height: 32px !important;
  padding: 0 !important;
  border: 0;
  border-radius: 999px;
  background: transparent;
  box-shadow: none;
  cursor: pointer !important;
}

body.dashboardMode #emailAutomationPanel .emailAutomationEnableToggle input {
  position: absolute !important;
  opacity: 0;
  pointer-events: none !important;
}

body.dashboardMode #emailAutomationPanel .emailAutomationEnableToggle span {
  position: relative !important;
  display: block !important;
  width: 58px !important;
  height: 32px !important;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 999px;
  background: rgba(255, 255, 255, .08);
  transition: background .16s ease, border-color .16s ease !important;
}

body.dashboardMode #emailAutomationPanel .emailAutomationEnableToggle span::after {
  content: "" !important;
  position: absolute !important;
  top: 4px !important;
  left: 4px !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 999px;
  background: rgba(255, 255, 255, .76);
  transition: transform .16s ease, background .16s ease !important;
}

body.dashboardMode #emailAutomationPanel .emailAutomationEnableToggle input:checked + span {
  border-color: rgba(72, 159, 223, .78);
  background: rgba(72, 159, 223, .52);
}

body.dashboardMode #emailAutomationPanel .emailAutomationEnableToggle input:checked + span::after {
  transform: translateX(26px) !important;
  background: #ffffff;
}

body.dashboardMode #emailAutomationPanel .emailAutomationEditor.hidden,
body.roleAdmin #emailAutomationPanel .emailAutomationEditor.hidden {
  display: none !important;
}

body.dashboardMode #emailAutomationPanel .emailAutomationEditor {
  display: grid !important;
  gap: 16px !important;
  padding: 0 20px 2px !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #emailAutomationPanel .emailAutomationEditor label {
  display: grid !important;
  gap: 10px !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #emailAutomationPanel .emailAutomationEditor textarea {
  min-height: 160px !important;
  resize: vertical !important;
}

body.dashboardMode #emailAutomationPanel .emailAutomationPreview {
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #emailAutomationPanel .emailAutomationPreviewPaper {
  max-width: 860px !important;
  margin: 0 !important;
  padding: 22px !important;
  border: 1px solid var(--ap-ui-border);
  border-radius: 16px;
  background:
    linear-gradient(145deg, rgba(8, 22, 50, .94), rgba(2, 9, 25, .96));
  color: var(--ap-ui-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode #emailAutomationPanel .emailAutomationPreviewBrand {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 34px !important;
  padding: 0 14px !important;
  border-radius: 999px;
  background: rgba(72, 159, 223, .18);
  color: var(--ap-ui-text);
}

body.dashboardMode #emailAutomationPanel .emailAutomationPreviewSystemBlock,
body.dashboardMode #emailAutomationPanel .emailAutomationPreviewSignature {
  border: 1px solid var(--ap-ui-border);
  border-radius: 14px;
  background: rgba(255, 255, 255, .035);
  color: var(--ap-ui-text);
}

/* Montage calendar: linked customer names are text, not blue buttons. */
body.dashboardMode .montageCalendarEventCard .montageCalendarCustomerLink,
body.dashboardMode .montageCalendarEventCard .montageCalendarCustomerLink:hover,
body.dashboardMode .montageCalendarEventCard .montageCalendarCustomerLink:focus-visible {
  display: inline !important;
  width: auto !important;
  max-width: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--ap-ui-text);
  box-shadow: none;
  font-size: clamp(13px, .82vw, 16px) !important;
  font-weight: 800 !important;
  line-height: 1.18 !important;
  text-align: left !important;
  transform: none !important;
}

body.dashboardMode .montageCalendarEventCard .montageCalendarCustomerLink:hover {
  text-decoration: underline;
  text-underline-offset: 3px !important;
}

body.dashboardMode .montageCalendarEventCard strong {
  color: var(--ap-ui-text);
  background: transparent;
}

body.dashboardMode .montageCalendarEventCard.cancelled,
body.dashboardMode .montageCalendarEventPill.cancelled {
  border-color: rgba(255, 134, 134, .42);
  border-left-color: rgba(255, 134, 134, .72);
  background: linear-gradient(145deg, rgba(46, 12, 22, .72), rgba(4, 15, 38, .92));
}

body.dashboardMode .montageCalendarEventCard .montageCalendarInlineEditButton {
  display: none !important;
}

body.dashboardMode .montageCalendarEventCard .montageCalendarInlineEditButton:hover {
  display: none !important;
}

/* Partner projects: one clean row per project, never cards inside table cells. */
body.dashboardMode #partnerProjectsCards.partnerProjectsCards {
  display: grid !important;
  gap: 12px !important;
  padding: 18px !important;
  overflow-x: auto !important;
  border: 1px solid var(--ap-ui-border);
  border-radius: 18px;
  background: var(--ap-ui-surface-strong);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode #partnerProjectsCards .partnerProjectMain {
  display: grid !important;
  grid-template-columns:
    minmax(96px, .85fr)
    minmax(150px, 1.1fr)
    minmax(260px, 2.2fr)
    minmax(140px, 1fr) !important;
  gap: 18px !important;
  align-items: center !important;
  min-width: 0 !important;
}

body.dashboardMode #partnerProjectsCards .partnerProjectMain.adminPartnerOrdersMain {
  grid-template-columns:
    minmax(96px, .85fr)
    minmax(150px, 1.1fr)
    minmax(260px, 2.2fr)
    minmax(140px, 1fr) !important;
  min-width: 0 !important;
}

body.dashboardMode #partnerProjectsCards .partnerProjectsHeader {
  padding: 0 18px 4px !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #partnerProjectsCards .partnerProjectCard {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 16px 18px !important;
  border: 1px solid var(--ap-ui-border);
  border-radius: 16px;
  background:
    linear-gradient(145deg, rgba(8, 22, 50, .94), rgba(2, 9, 25, .96));
  color: var(--ap-ui-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 12px 30px rgba(0, 0, 0, .18);
  text-align: left !important;
  transform: none !important;
}

body.dashboardMode #partnerProjectsCards .partnerProjectCard:has(.adminPartnerOrdersMain) {
  min-width: 0 !important;
}

body.dashboardMode #partnerProjectsCards .partnerProjectCard:hover {
  border-color: var(--ap-ui-border-strong);
  background:
    linear-gradient(145deg, rgba(3, 13, 34, .98), rgba(1, 7, 20, .98));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 16px 36px rgba(0, 0, 0, .24);
}

body.dashboardMode #partnerProjectsCards .partnerProjectField {
  min-width: 0 !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: inherit;
}

body.dashboardMode #partnerProjectsCards .partnerProjectCard .partnerProjectLabelInline {
  display: none !important;
}

body.dashboardMode #partnerProjectsCards .partnerProjectLabel,
body.dashboardMode #partnerProjectsCards .partnerProjectSortableLabel {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
  color: var(--ap-ui-muted);
  font-size: 13px !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
  line-height: 1.15 !important;
  text-transform: uppercase !important;
}

body.dashboardMode #partnerProjectsCards .partnerProjectSortableLabel {
  justify-content: flex-start !important;
}

body.dashboardMode #partnerProjectsCards .partnerProjectSortControls {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #partnerProjectsCards .partnerProjectSortButton {
  display: inline-grid !important;
  place-items: center !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  padding: 0 !important;
  border: 1px solid var(--ap-ui-border);
  border-radius: 999px;
  background: rgba(255, 255, 255, .04);
  color: var(--ap-ui-muted);
  box-shadow: none;
  font-size: 12px !important;
  line-height: 1 !important;
}

body.dashboardMode #partnerProjectsCards .partnerProjectSortButton:hover,
body.dashboardMode #partnerProjectsCards .partnerProjectSortButton.active {
  border-color: var(--ap-ui-border-strong);
  background: rgba(72, 159, 223, .18);
  color: var(--ap-ui-text);
}

body.dashboardMode #partnerProjectsCards .partnerProjectField strong,
body.dashboardMode #partnerProjectsCards .partnerProjectField > span:not(.partnerProjectLabel):not(.partnerProjectSortableLabel):not(.partnerProjectLabelInline) {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--ap-ui-text);
  font-size: 16px !important;
  font-weight: 850 !important;
  line-height: 1.18 !important;
  overflow-wrap: anywhere !important;
}

body.dashboardMode #partnerProjectsCards .reviewStatus {
  display: inline-flex !important;
  width: fit-content !important;
  min-height: 30px !important;
  padding: 0 12px !important;
  border-radius: 999px;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
}

@media (max-width: 900px) {
  body.dashboardMode #partnerProjectsCards.partnerProjectsCards {
    overflow-x: visible !important;
  }

  body.dashboardMode #partnerProjectsCards .partnerProjectsHeader {
    display: none !important;
  }

  body.dashboardMode #partnerProjectsCards .partnerProjectCard,
  body.dashboardMode #partnerProjectsCards .partnerProjectCard:has(.adminPartnerOrdersMain) {
    min-width: 0 !important;
  }

  body.dashboardMode #partnerProjectsCards .partnerProjectMain,
  body.dashboardMode #partnerProjectsCards .partnerProjectMain.adminPartnerOrdersMain {
    grid-template-columns: minmax(0, 1fr) !important;
    min-width: 0 !important;
    gap: 14px !important;
  }

  body.dashboardMode #partnerProjectsCards .partnerProjectCard .partnerProjectLabelInline {
    display: block !important;
  }
}

/* Reonic substructure toggle: rounded field, not a square legacy label box. */
body.dashboardMode .substructureBox .substructureToggle,
body.roleAdmin .substructureBox .substructureToggle,
body.roleEmployee .substructureBox .substructureToggle {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  min-height: 64px !important;
  padding: 14px 16px !important;
  border: 1px solid var(--ap-ui-border);
  border-radius: 16px;
  background:
    linear-gradient(145deg, rgba(8, 22, 50, .94), rgba(2, 9, 25, .96));
  color: var(--ap-ui-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode .substructureBox .substructureToggle input,
body.roleAdmin .substructureBox .substructureToggle input,
body.roleEmployee .substructureBox .substructureToggle input {
  flex: 0 0 auto !important;
  width: 22px !important;
  height: 22px !important;
  margin: 0 !important;
  border-radius: 6px;
}

body.dashboardMode .substructureBox .substructureToggle span,
body.roleAdmin .substructureBox .substructureToggle span,
body.roleEmployee .substructureBox .substructureToggle span {
  color: var(--ap-ui-text);
  font-size: 18px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
}

/* Partner order detail: admin and partner portal share the same hero view. */
body.partnerOrderDetailOnly #partnerOrderDetailBox.reviewBox {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  min-height: min(760px, calc(100vh - 32px)) !important;
  padding: clamp(28px, 2.4vw, 42px) !important;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 30px;
  background:
    linear-gradient(90deg, rgba(2, 8, 28, .98) 0%, rgba(3, 12, 38, .9) 26%, rgba(4, 13, 38, .48) 50%, rgba(4, 13, 38, .12) 72%, rgba(4, 13, 38, .38) 100%),
    linear-gradient(180deg, rgba(5, 12, 34, .02) 0%, rgba(5, 12, 34, .12) 43%, rgba(5, 12, 34, .9) 100%),
    url("/assets/premium-customer-hero.jpg") center top / 100% clamp(300px, 26vw, 420px) no-repeat,
    #020817;
  color: #ffffff;
  box-shadow: 0 38px 110px rgba(3, 8, 26, .48), inset 0 1px 0 rgba(255, 255, 255, .16);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox.reviewBox::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, 0) 12%),
    radial-gradient(circle at 20% 8%, rgba(72, 159, 223, .18), transparent 34%);
  pointer-events: none !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox > * {
  position: relative !important;
  z-index: 1 !important;
}

body.partnerOrderDetailOnly .partnerOrderDetailHead {
  max-width: min(520px, 46vw);
  margin: clamp(28px, 4vw, 58px) 0 clamp(14px, 1.6vw, 22px) clamp(16px, 1.6vw, 28px);
}

body.partnerOrderDetailOnly #partnerOrderDetailTitle {
  max-width: min(560px, 48vw) !important;
  margin: 0 !important;
  color: #ffffff;
  font-size: clamp(30px, 3.4vw, 58px) !important;
  line-height: 1.04 !important;
  letter-spacing: 0 !important;
  text-shadow: 0 14px 34px rgba(0, 0, 0, .44);
}

body.partnerOrderDetailOnly .partnerOrderDetailMeta {
  display: block !important;
  max-width: min(520px, 46vw) !important;
  margin: 0 0 clamp(22px, 2.2vw, 34px) clamp(16px, 1.6vw, 28px) !important;
  color: rgba(255, 255, 255, .9);
  font-size: inherit !important;
}

body.partnerOrderDetailOnly .partnerOrderHeroMeta {
  display: grid !important;
  gap: clamp(9px, .85vw, 14px) !important;
}

body.partnerOrderDetailOnly .partnerOrderHeroMetaItem {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 28px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 13px !important;
  min-height: 28px !important;
  margin: 0 !important;
}

body.partnerOrderDetailOnly .partnerOrderHeroIcon {
  display: inline-grid !important;
  place-items: center !important;
  grid-column: 1 !important;
  width: 23px !important;
  height: 23px !important;
  border: 2px solid rgba(232, 244, 255, .82);
  color: #ffffff;
  font-size: 12px !important;
  font-weight: 900 !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, .24);
}

body.partnerOrderDetailOnly .partnerOrderHeroMetaItem-phone .partnerOrderHeroIcon,
body.partnerOrderDetailOnly .partnerOrderHeroMetaItem-mail .partnerOrderHeroIcon,
body.partnerOrderDetailOnly .partnerOrderHeroMetaItem-advisor .partnerOrderHeroIcon,
body.partnerOrderDetailOnly .partnerOrderHeroMetaItem-pin .partnerOrderHeroIcon {
  padding: 4px;
  border-radius: 10px;
}

body.partnerOrderDetailOnly .partnerOrderHeroMetaItem strong,
body.partnerOrderDetailOnly .partnerOrderHeroMetaItem a {
  grid-column: 2 !important;
  color: #ffffff;
  font-size: clamp(15px, 1.05vw, 19px) !important;
  font-weight: 500 !important;
  text-decoration: none;
  overflow-wrap: anywhere !important;
  text-shadow: 0 10px 24px rgba(0, 0, 0, .36);
}

body.partnerOrderDetailOnly .partnerOrderHeroMetaItem small {
  grid-column: 2 !important;
  color: rgba(255, 255, 255, .78);
  font-size: clamp(13px, .95vw, 16px) !important;
  font-weight: 500 !important;
  overflow-wrap: anywhere !important;
}

body.partnerOrderDetailOnly .partnerOrderHeroStatus {
  display: inline-grid !important;
  grid-template-columns: 14px minmax(0, auto) !important;
  justify-self: start !important;
  gap: 8px 12px !important;
  min-height: 40px !important;
  padding: 6px 14px !important;
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: 12px;
  background: rgba(255, 255, 255, .11);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 18px 42px rgba(0, 0, 0, .22);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

body.partnerOrderDetailOnly .partnerOrderHeroStatusDot {
  width: 8px !important;
  height: 8px !important;
  align-self: center !important;
  margin-left: 3px !important;
  border-radius: 999px;
  background: #489FDF;
  box-shadow: 0 0 0 6px rgba(72, 159, 223, .16);
}

body.partnerOrderDetailOnly .partnerOrderHeroStatus strong,
body.partnerOrderDetailOnly .partnerOrderHeroStatus small {
  grid-column: 2 !important;
}

body.partnerOrderDetailOnly .partnerOrderHeroStatus small {
  display: block !important;
  max-width: min(560px, 72vw) !important;
  color: rgba(255, 255, 255, .72);
  font-size: clamp(12px, .85vw, 14px) !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailForm.recommendationForm,
body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderChatTop,
body.partnerOrderDetailOnly #partnerOrderDetailBox .chatMessages,
body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimate,
body.partnerOrderDetailOnly #partnerOrderDetailBox .chatAttachmentField {
  color: #ffffff;
  border: 1px solid rgba(72, 159, 223, .26);
  border-radius: 22px;
  background:
    linear-gradient(145deg, rgba(12, 24, 58, .9), rgba(6, 16, 42, .78)),
    rgba(255, 255, 255, .05);
  box-shadow: 0 28px 86px rgba(3, 9, 28, .32), inset 0 1px 0 rgba(255, 255, 255, .13);
  backdrop-filter: blur(22px) saturate(1.18);
  -webkit-backdrop-filter: blur(22px) saturate(1.18);
}

body.partnerOrderDetailOnly #partnerOrderDetailForm.recommendationForm {
  padding: clamp(18px, 2.2vw, 28px) !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox h3,
body.partnerOrderDetailOnly #partnerOrderDetailBox h4,
body.partnerOrderDetailOnly #partnerOrderDetailBox label,
body.partnerOrderDetailOnly #partnerOrderDetailBox small,
body.partnerOrderDetailOnly #partnerOrderDetailBox .mutedText,
body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderMetaSeparator,
body.partnerOrderDetailOnly #partnerOrderDetailBox .chatMessageHeader,
body.partnerOrderDetailOnly #partnerOrderDetailBox .chatMessageAuthor,
body.partnerOrderDetailOnly #partnerOrderDetailBox .chatMessageBody,
body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderImageCard span,
body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderFileLink,
body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderFileLink span,
body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimate span,
body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimate small,
body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimateRow strong {
  color: rgba(255, 255, 255, .9);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .step {
  color: rgba(255, 255, 255, .72);
}

body.partnerOrderDetailOnly #partnerOrderDetailForm input,
body.partnerOrderDetailOnly #partnerOrderDetailForm select,
body.partnerOrderDetailOnly #partnerOrderDetailForm textarea,
body.partnerOrderDetailOnly #partnerOrderMessageForm textarea,
body.partnerOrderDetailOnly #partnerOrderDetailBox input[type="file"] {
  border-color: rgba(72, 159, 223, .34);
  background: rgba(2, 12, 32, .72);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 12px 28px rgba(3, 9, 28, .16);
}

body.partnerOrderDetailOnly #partnerOrderDetailForm input:disabled,
body.partnerOrderDetailOnly #partnerOrderDetailForm select:disabled,
body.partnerOrderDetailOnly #partnerOrderDetailForm textarea:disabled {
  opacity: 1;
  color: rgba(255, 255, 255, .86);
  -webkit-text-fill-color: rgba(255, 255, 255, .86);
}

body.partnerOrderDetailOnly #partnerOrderDetailForm input:focus,
body.partnerOrderDetailOnly #partnerOrderDetailForm select:focus,
body.partnerOrderDetailOnly #partnerOrderDetailForm textarea:focus,
body.partnerOrderDetailOnly #partnerOrderMessageForm textarea:focus {
  border-color: rgba(72, 159, 223, .84);
  background: rgba(6, 18, 46, .88);
  box-shadow: 0 0 0 4px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .14);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox input[type="file"]::file-selector-button {
  border-color: rgba(72, 159, 223, .42);
  background: linear-gradient(135deg, rgba(72, 159, 223, .98), rgba(72, 159, 223, .78));
  color: #ffffff;
}

body.partnerOrderDetailOnly #partnerOrderDetailForm select option {
  color: #141B4D;
  background: #ffffff;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderImageCard,
body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderFileLink,
body.partnerOrderDetailOnly #partnerOrderDetailBox .chatMessage,
body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimateRow {
  border-color: rgba(72, 159, 223, .22);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .13), rgba(255, 255, 255, .06)),
    rgba(20, 27, 77, .46);
  box-shadow: 0 22px 56px rgba(3, 9, 28, .2), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderAttachmentHeading {
  color: #ffffff;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderImagePreviewButton {
  background: transparent;
  color: inherit;
  box-shadow: none;
  transform: none !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .chatMessageRight {
  border-color: rgba(72, 159, 223, .34);
  background: linear-gradient(135deg, rgba(72, 159, 223, .28), rgba(72, 159, 223, .12));
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderImageCard img {
  background: rgba(2, 12, 32, .72);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .chatBoxHeader {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
}

body.partnerOrderDetailOnly #partnerOrderClearChatButton {
  flex: 0 0 auto !important;
  width: auto !important;
  min-height: 38px !important;
  padding: 8px 14px !important;
  border-radius: 999px;
  font-size: 14px !important;
  font-weight: 800 !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .chatReplyQuote,
body.partnerOrderDetailOnly #partnerOrderReplyPreview {
  display: grid !important;
  gap: 4px !important;
  padding: 9px 12px !important;
  border-left: 3px solid rgba(72, 159, 223, .86);
  border-radius: 12px;
  background: rgba(72, 159, 223, .12);
  color: rgba(255, 255, 255, .86);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .chatReplyQuote {
  margin: 0 0 8px !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .chatReplyQuote strong,
body.partnerOrderDetailOnly #partnerOrderReplyPreview strong {
  color: #ffffff;
  font-size: 13px !important;
  line-height: 1.2 !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .chatReplyQuote span,
body.partnerOrderDetailOnly #partnerOrderReplyPreview span {
  display: -webkit-box !important;
  overflow: hidden !important;
  color: rgba(255, 255, 255, .72);
  font-size: 13px !important;
  line-height: 1.3 !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}

body.partnerOrderDetailOnly #partnerOrderReplyPreview {
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  margin: 2px 0 0 !important;
}

body.partnerOrderDetailOnly #partnerOrderReplyPreview.hidden,
body.partnerOrderDetailOnly #partnerOrderReplyPreview:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.partnerOrderDetailOnly #partnerOrderReplyPreview button,
body.partnerOrderDetailOnly #partnerOrderDetailBox .chatMessageActionButton {
  display: inline-grid !important;
  place-items: center !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 28px !important;
  padding: 5px 9px !important;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 999px;
  background: rgba(255, 255, 255, .08);
  color: rgba(255, 255, 255, .82);
  box-shadow: none;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

body.partnerOrderDetailOnly #partnerOrderReplyPreview button {
  width: 30px !important;
  height: 30px !important;
  padding: 0 !important;
  font-size: 18px !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .chatMessageActions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 10px !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .chatMessageRight .chatMessageActions {
  justify-content: flex-end !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .chatMessageActionButton:hover,
body.partnerOrderDetailOnly #partnerOrderReplyPreview button:hover {
  border-color: rgba(72, 159, 223, .46);
  background: rgba(72, 159, 223, .18);
  color: #ffffff;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .chatMessageDeleteButton:hover {
  border-color: rgba(255, 120, 120, .46);
  background: rgba(255, 120, 120, .16);
}

body.partnerOrderDetailOnly #partnerOrderMessageForm.chatComposer {
  gap: 10px !important;
}

body.partnerOrderDetailOnly #partnerOrderMessageForm .chatInputShell {
  position: relative !important;
  display: grid !important;
}

body.partnerOrderDetailOnly #partnerOrderMessageForm textarea {
  min-height: 96px !important;
  padding-right: 66px !important;
  resize: vertical !important;
}

body.partnerOrderDetailOnly #partnerOrderMessageForm .chatAttachButton {
  position: absolute !important;
  right: 14px !important;
  bottom: 14px !important;
  display: inline-grid !important;
  place-items: center !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border: 1px solid rgba(72, 159, 223, .42);
  border-radius: 999px;
  background: rgba(72, 159, 223, .18);
  color: #ffffff;
  box-shadow: 0 10px 24px rgba(3, 9, 28, .22), inset 0 1px 0 rgba(255, 255, 255, .16);
  cursor: pointer !important;
  transition: background .18s ease, border-color .18s ease, transform .18s ease !important;
}

body.partnerOrderDetailOnly #partnerOrderMessageForm .chatAttachButton:hover {
  border-color: rgba(72, 159, 223, .78);
  background: rgba(72, 159, 223, .32);
  transform: translateY(-1px) !important;
}

body.partnerOrderDetailOnly #partnerOrderMessageForm .chatAttachButton span {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  color: #ffffff;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 30px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  transform: none !important;
}

body.partnerOrderDetailOnly #partnerOrderMessageForm .chatAttachButton input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0;
  pointer-events: none !important;
}

body.partnerOrderDetailOnly #partnerOrderMessageForm .chatComposerFooter {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

body.partnerOrderDetailOnly #partnerOrderMessageForm .chatSelectedFiles {
  min-width: 0 !important;
  color: rgba(255, 255, 255, .72);
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.partnerOrderDetailOnly #partnerOrderMessageForm .chatSelectedFiles:empty {
  display: none !important;
}

body.partnerOrderDetailOnly #partnerOrderMessageForm .chatComposerFooter button[type="submit"] {
  flex: 0 0 auto !important;
  width: auto !important;
  min-height: 42px !important;
  padding: 10px 18px !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailForm.partnerOrderTabbedForm {
  gap: 18px !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailForm .partnerOrderDetailTabs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  padding: 10px !important;
  border: 1px solid rgba(72, 159, 223, .24);
  border-radius: 18px;
  background: rgba(2, 12, 32, .42);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.partnerOrderDetailOnly #partnerOrderDetailForm .partnerOrderDetailTab {
  width: auto !important;
  min-height: 48px !important;
  padding: 0 18px !important;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 14px;
  background: rgba(9, 22, 50, .82);
  color: rgba(255, 255, 255, .68);
  box-shadow: none;
  font-size: 15px !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailForm .partnerOrderDetailTab:hover {
  border-color: rgba(72, 159, 223, .38);
  background: rgba(5, 15, 36, .96);
  color: #ffffff;
  transform: none !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailForm .partnerOrderDetailTab.active {
  border-color: rgba(124, 190, 246, .68);
  background: linear-gradient(135deg, rgba(72, 159, 223, .98), rgba(53, 117, 184, .86));
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 12px 26px rgba(72, 159, 223, .2);
}

body.partnerOrderDetailOnly #partnerOrderDetailForm .partnerOrderDetailPanel {
  display: none !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailForm .partnerOrderDetailPanel.active {
  display: grid !important;
  gap: 18px !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailForm .partnerOrderInvoiceActions {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 14px !important;
}

body.partnerOrderDetailOnly #partnerOrderCreateInvoiceButton {
  width: auto !important;
  min-height: 46px !important;
  padding: 0 22px !important;
}

body.partnerOrderDetailOnly #partnerOrderInvoiceMessage {
  min-height: 0 !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailForm .partnerOrderDetailPanel .formGrid {
  margin: 0 !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailForm .partnerOrderAttachmentsSection {
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
}

/* Legacy chat upload fallback: old cached markup must not render as a card inside the composer. */
body.partnerOrderDetailOnly #partnerOrderMessageForm .chatAttachmentField {
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body.partnerOrderDetailOnly #partnerOrderMessageForm .chatAttachmentField input[type="file"] {
  min-height: 0 !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body .appContent :where(button:not(:disabled)):not(.partnerCardInteractive):not(.ap-card-interactive):not(.partnerHomeActionCard):not(.partnerProjectCard):not(.complaintProjectOption):not(.ap-list-v2-row):not(.ap-kanban-card):not(.ap-icon-button):not(.ap-kanban-column-more):not(.ap-view-toggle-button):hover {
  color: var(--ap-navy);
  border-color: rgba(255, 255, 255, .28);
  background: linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(72, 159, 223, .86));
  box-shadow: 0 22px 54px rgba(72, 159, 223, .32), inset 0 1px 0 rgba(255, 255, 255, .36);
}

body .appContent :where(button:not(:disabled)):not(.partnerCardInteractive):not(.ap-card-interactive):not(.partnerHomeActionCard):not(.partnerProjectCard):not(.complaintProjectOption):not(.ap-list-v2-row):not(.ap-kanban-card):not(.ap-icon-button):not(.ap-kanban-column-more):not(.ap-view-toggle-button):hover * {
  color: var(--ap-navy);
}

.sidebarCustomerSearchResults .sidebarCustomerSearchResultButton {
  position: relative !important;
  display: grid !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 14px 16px !important;
  border: 1px solid rgba(72, 159, 223, .28);
  border-left: 3px solid rgba(72, 159, 223, .72);
  border-radius: 12px;
  background:
    linear-gradient(145deg, rgba(5, 15, 36, .96), rgba(9, 22, 50, .88)),
    rgba(2, 9, 20, .94);
  color: #ffffff;
  box-shadow: 0 14px 32px rgba(3, 9, 28, .22), inset 0 1px 0 rgba(255, 255, 255, .08);
  text-align: left !important;
  transform: none !important;
}

.sidebarCustomerSearchResults .sidebarCustomerSearchResultButton:hover {
  border-color: rgba(72, 159, 223, .46);
  border-left-color: rgba(72, 159, 223, .96);
  background:
    linear-gradient(145deg, rgba(7, 18, 44, .98), rgba(4, 13, 32, .95)),
    rgba(2, 9, 20, .98);
  color: #ffffff;
  box-shadow: 0 16px 36px rgba(3, 9, 28, .28), inset 0 1px 0 rgba(255, 255, 255, .1);
  transform: none !important;
}

.sidebarCustomerSearchResults .sidebarCustomerSearchResultButton:hover * {
  color: inherit;
}

.sidebarCustomerSearchResults .sidebarCustomerSearchResultTopline {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 10px !important;
}

.sidebarCustomerSearchResults .sidebarCustomerSearchResultTopline strong {
  color: #ffffff;
  font-size: 15px !important;
  line-height: 1.2 !important;
  white-space: normal !important;
}

.sidebarCustomerSearchResults .sidebarCustomerSearchResultTopline small {
  justify-self: end !important;
  padding: 4px 8px !important;
  border: 1px solid rgba(72, 159, 223, .26);
  border-radius: 999px;
  background: rgba(72, 159, 223, .14);
  color: rgba(255, 255, 255, .78);
  font-size: 10px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
}

.sidebarCustomerSearchResults .sidebarCustomerSearchResultButton > span {
  display: block !important;
  overflow: hidden !important;
  color: rgba(255, 255, 255, .68);
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.28 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body .partnerOrderImagePreviewButton:hover {
  border-color: transparent;
  background: transparent;
  color: inherit;
  box-shadow: none;
  transform: none !important;
}

body .partnerOrderImagePreviewButton:hover * {
  color: inherit;
}

body .partnerOrderAttachmentDelete:hover,
body .partnerOrderAttachmentDelete:hover * {
  border-color: rgba(255, 255, 255, .42);
  background: rgba(128, 28, 42, .92);
  color: #ffffff;
  box-shadow: 0 14px 32px rgba(128, 28, 42, .32);
}

body .tableWrap .tableSortButton,
body .projectListTable .tableSortButton {
  display: inline !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: rgba(255, 255, 255, .68);
  box-shadow: none;
  font: inherit !important;
  font-weight: 900 !important;
  line-height: inherit !important;
  text-align: inherit !important;
  text-transform: inherit !important;
  cursor: pointer !important;
  transform: none !important;
}

body .tableWrap .tableSortButton:hover,
body .projectListTable .tableSortButton:hover,
body .tableWrap .tableSortButton:hover *,
body .projectListTable .tableSortButton:hover * {
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, .9);
  box-shadow: none;
  transform: none !important;
}

body .tableSortButton,
body.dashboardMode .tableSortButton,
body.roleAdmin .tableSortButton,
body.portalPartner .tableSortButton {
  display: inline !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: rgba(255, 255, 255, .7);
  box-shadow: none;
  font: inherit !important;
  font-weight: 900 !important;
  line-height: inherit !important;
  letter-spacing: 0 !important;
  text-align: inherit !important;
  text-transform: inherit !important;
  transform: none !important;
}

body .tableSortButton:hover,
body .tableSortButton:focus,
body .tableSortButton:focus-visible,
body.dashboardMode .tableSortButton:hover,
body.dashboardMode .tableSortButton:focus,
body.dashboardMode .tableSortButton:focus-visible,
body.roleAdmin .tableSortButton:hover,
body.roleAdmin .tableSortButton:focus,
body.roleAdmin .tableSortButton:focus-visible,
body.portalPartner .tableSortButton:hover,
body.portalPartner .tableSortButton:focus,
body.portalPartner .tableSortButton:focus-visible {
  border: 0;
  background: transparent;
  color: #ffffff;
  box-shadow: none;
  outline: none;
  text-decoration: none;
  transform: none !important;
}

body .tableSortButton *,
body .tableSortButton:hover *,
body.dashboardMode .tableSortButton *,
body.dashboardMode .tableSortButton:hover * {
  background: transparent;
  color: inherit;
  box-shadow: none;
}

body.portalPartner .partnerHomeActionCard,
body.partnerDashboardHome .partnerHomeActionCard,
body .partnerHomeActionCard {
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, .1);
  background:
    linear-gradient(180deg, rgba(14, 31, 96, .98) 0%, rgba(20, 27, 77, .96) 46%, rgba(5, 12, 40, .98) 100%),
    #141b4d;
  box-shadow: 0 22px 50px rgba(4, 10, 35, .28), inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.portalPartner .partnerHomeActionCard:hover,
body.partnerDashboardHome .partnerHomeActionCard:hover,
body .partnerHomeActionCard:hover {
  color: #ffffff;
  border-color: rgba(72, 159, 223, .72);
  background:
    linear-gradient(145deg, rgba(72, 159, 223, .28), rgba(6, 16, 42, .84)),
    rgba(255, 255, 255, .07);
  box-shadow: 0 30px 80px rgba(72, 159, 223, .2), inset 0 1px 0 rgba(255, 255, 255, .16);
  transform: translateY(-1px);
}

body.portalPartner .partnerHomeActionCard span,
body.portalPartner .partnerHomeActionCard strong,
body.portalPartner .partnerHomeActionCard small,
body.partnerDashboardHome .partnerHomeActionCard span,
body.partnerDashboardHome .partnerHomeActionCard strong,
body.partnerDashboardHome .partnerHomeActionCard small,
body .partnerHomeActionCard span,
body .partnerHomeActionCard strong,
body .partnerHomeActionCard small {
  color: rgba(255, 255, 255, .9);
}

body.rolePartner.profileStandaloneView.partnerDashboardHome .dashboardHeadModern,
body.portalPartner.profileStandaloneView.partnerDashboardHome .dashboardHeadModern {
  grid-template-columns: minmax(520px, 1fr) 220px !important;
  grid-template-areas:
    "identity identity"
    "advisor photo" !important;
  align-items: stretch !important;
  gap: 18px !important;
}

body.rolePartner.profileStandaloneView.partnerDashboardHome .advisorCard,
body.portalPartner.profileStandaloneView.partnerDashboardHome .advisorCard {
  min-height: 220px !important;
  height: 220px !important;
  padding: 18px 22px !important;
  display: grid !important;
  grid-template-columns: 112px minmax(0, 1fr) !important;
  align-items: center !important;
  background:
    linear-gradient(145deg, rgba(12, 24, 58, .9), rgba(6, 16, 42, .78)),
    rgba(255, 255, 255, .05);
}

body.rolePartner.profileStandaloneView.partnerDashboardHome .employeePhotoButton,
body.portalPartner.profileStandaloneView.partnerDashboardHome .employeePhotoButton {
  width: 220px !important;
  height: 220px !important;
  aspect-ratio: auto !important;
  align-self: stretch !important;
  justify-self: end !important;
  background: rgba(4, 14, 38, .62);
}

body.rolePartner.profileStandaloneView.partnerDashboardHome .employeePhotoButton img,
body.portalPartner.profileStandaloneView.partnerDashboardHome .employeePhotoButton img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

body.rolePartner.profileStandaloneView.partnerDashboardHome #profileView,
body.portalPartner.profileStandaloneView.partnerDashboardHome #profileView {
  margin-top: var(--ap-ui-gap) !important;
}

@media (max-width: 980px) {
  body.rolePartner.profileStandaloneView.partnerDashboardHome .dashboardHeadModern,
  body.portalPartner.profileStandaloneView.partnerDashboardHome .dashboardHeadModern {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "identity"
      "photo"
      "advisor" !important;
  }

  body.rolePartner.profileStandaloneView.partnerDashboardHome .employeePhotoButton,
  body.portalPartner.profileStandaloneView.partnerDashboardHome .employeePhotoButton,
  body.rolePartner.profileStandaloneView.partnerDashboardHome .advisorCard,
  body.portalPartner.profileStandaloneView.partnerDashboardHome .advisorCard {
    width: 100% !important;
    height: auto !important;
    min-height: 160px !important;
  }
}

body.dashboardMode .sidebarCustomerSearchResults,
body .sidebarCustomerSearchResults {
  gap: 10px !important;
  padding: 12px !important;
  border: 1px solid rgba(72, 159, 223, .34);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(8, 24, 51, .97), rgba(20, 27, 77, .94)),
    rgba(2, 9, 20, .96);
  box-shadow: 0 28px 86px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.dashboardMode .sidebarCustomerSearchResultButton,
body .sidebarCustomerSearchResultButton {
  display: grid !important;
  gap: 7px !important;
  min-height: 72px !important;
  padding: 13px 15px !important;
  border: 1px solid rgba(255, 255, 255, .13);
  border-left: 0;
  border-radius: 14px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .075), rgba(255, 255, 255, .035)),
    rgba(255, 255, 255, .045);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07), 0 12px 28px rgba(3, 9, 28, .16);
  text-align: left !important;
}

body.dashboardMode .sidebarCustomerSearchResultButton:hover,
body .sidebarCustomerSearchResultButton:hover {
  border-color: rgba(72, 159, 223, .48);
  background:
    linear-gradient(145deg, rgba(72, 159, 223, .18), rgba(255, 255, 255, .07)),
    rgba(255, 255, 255, .08);
  transform: none !important;
}

body.dashboardMode .sidebarCustomerSearchResultTopline,
body .sidebarCustomerSearchResultTopline {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 10px !important;
  align-items: start !important;
}

body.dashboardMode .sidebarCustomerSearchResultTopline strong,
body .sidebarCustomerSearchResultTopline strong {
  color: #ffffff;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1.22 !important;
  white-space: normal !important;
}

body.dashboardMode .sidebarCustomerSearchResultTopline small,
body .sidebarCustomerSearchResultTopline small {
  justify-self: end !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: rgba(255, 255, 255, .64);
  font-size: 9px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}

body.dashboardMode .sidebarCustomerSearchResultButton > span,
body .sidebarCustomerSearchResultButton > span {
  display: block !important;
  color: rgba(255, 255, 255, .68);
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  white-space: normal !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.dashboardMode .sidebarCustomerSearch input,
body .sidebarCustomerSearch input {
  min-height: 38px !important;
  padding: 0 12px !important;
  border-radius: 8px;
  font-size: 15px !important;
  font-weight: 700 !important;
}

body .partnerOrderImageCard .partnerOrderAttachmentDelete,
body .partnerOrderFileCard .partnerOrderAttachmentDelete,
body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderAttachmentDelete {
  position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  z-index: 5 !important;
  display: grid !important;
  place-items: center !important;
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  max-width: 26px !important;
  min-height: 26px !important;
  max-height: 26px !important;
  padding: 0 !important;
  border: 1px solid rgba(255, 255, 255, .42);
  border-radius: 999px;
  background: rgba(3, 9, 28, .78);
  color: #ffffff;
  box-shadow: 0 8px 18px rgba(3, 9, 28, .34);
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-align: center !important;
  transform: none !important;
}

body .partnerOrderImageCard .partnerOrderAttachmentDelete:hover,
body .partnerOrderFileCard .partnerOrderAttachmentDelete:hover,
body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderAttachmentDelete:hover {
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  min-height: 26px !important;
  border-color: rgba(255, 255, 255, .62);
  background: rgba(128, 28, 42, .94);
  color: #ffffff;
  box-shadow: 0 10px 22px rgba(128, 28, 42, .32);
  transform: scale(1.04) !important;
}

body.dashboardMode .partnerOrderAppointmentCard,
body.partnerOrderDetailOnly .partnerOrderAppointmentCard {
  border: 1px solid var(--ap-ui-border);
  border-radius: 16px;
  background: var(--ap-ui-card);
  color: var(--ap-ui-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 14px 34px rgba(0, 0, 0, .18);
}

body.dashboardMode .partnerOrderAppointmentCard:hover,
body.partnerOrderDetailOnly .partnerOrderAppointmentCard:hover {
  border-color: var(--ap-ui-border-strong);
  background: var(--ap-ui-card);
  color: var(--ap-ui-text);
}

body.dashboardMode .partnerOrderAppointmentCard.is-cancelled,
body.partnerOrderDetailOnly .partnerOrderAppointmentCard.is-cancelled {
  border-color: rgba(255, 134, 134, .42);
  background: linear-gradient(145deg, rgba(46, 12, 22, .72), rgba(4, 15, 38, .92));
}

.orderComponentSelectionBackdrop {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(2, 8, 24, .74);
  backdrop-filter: blur(14px);
}

.orderComponentSelectionModal {
  position: relative;
  display: flex;
  flex-direction: column;
  width: min(720px, 100%);
  max-height: calc(100dvh - 48px);
  padding: 34px;
  border: 1px solid var(--ap-ui-border);
  border-radius: 22px;
  background:
    radial-gradient(circle at 18% 0%, rgba(72, 159, 223, .16), transparent 34%),
    linear-gradient(145deg, rgba(6, 16, 42, .98), rgba(3, 10, 28, .98));
  color: var(--ap-ui-text);
  box-shadow: 0 34px 90px rgba(0, 0, 0, .42), inset 0 1px 0 rgba(255, 255, 255, .08);
}

.orderComponentSelectionModal h3 {
  margin: 4px 44px 8px 0;
  font-size: clamp(28px, 3vw, 42px);
}

.orderComponentSelectionModal .mutedText {
  margin-bottom: 24px;
}

.orderComponentSelectionClose {
  color: var(--ap-ui-text);
}

.orderComponentSelectionList {
  display: grid;
  gap: 12px;
  min-height: 0;
  overflow: auto;
  padding-right: 4px;
}

.orderComponentSelectionItem {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  padding: 16px 18px;
  border: 1px solid var(--ap-ui-border);
  border-radius: 16px;
  background: var(--ap-ui-card);
  cursor: pointer;
}

.orderComponentSelectionItem:hover {
  border-color: var(--ap-ui-border-strong);
  background: rgba(10, 28, 60, .96);
}

.orderComponentSelectionItem input {
  width: 22px;
  height: 22px;
  accent-color: var(--ap-ui-accent);
}

.orderComponentSelectionItem strong,
.orderComponentSelectionItem small {
  display: block;
}

.orderComponentSelectionItem strong {
  color: var(--ap-ui-text);
  font-size: 21px;
}

.orderComponentSelectionItem small {
  margin-top: 4px;
  color: var(--ap-ui-muted);
  font-size: 15px;
  line-height: 1.35;
}

.orderComponentSelectionActions {
  position: sticky;
  bottom: 0;
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 24px;
  padding-top: 16px;
  background: linear-gradient(180deg, rgba(3, 10, 28, 0), rgba(3, 10, 28, .98) 28%);
}

.orderComponentSelectionActions .bigInviteButton,
.orderComponentSelectionActions .secondaryButton {
  width: auto;
  min-width: 160px;
  margin: 0;
}

body.dashboardMode #partnerAdminEditForm .partnerAdminLogoPreview {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 16px;
  border: 1px solid var(--ap-ui-border);
  border-radius: 18px;
  background: var(--ap-ui-card);
  color: var(--ap-ui-muted);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode #partnerAdminEditForm .partnerAdminLogoPreview.hidden {
  display: none;
}

body.dashboardMode #partnerAdminEditForm .partnerAdminLogoPreview span {
  color: var(--ap-ui-muted);
  font-size: 15px;
  font-weight: 800;
}

body.dashboardMode #partnerAdminEditForm .partnerAdminLogoPreview img {
  width: 84px;
  height: 84px;
  border: 1px solid var(--ap-ui-border);
  border-radius: 14px;
  object-fit: contain;
  background: rgba(3, 10, 28, .72);
}

body.dashboardMode #partnerAdminEditForm .partnerPriceRuleSection {
  border-radius: 18px;
  background: var(--ap-ui-card);
}

@media (max-width: 760px) {
  body.partnerOrderDetailOnly #partnerOrderDetailBox.reviewBox {
    min-height: auto !important;
    padding: 24px 18px !important;
    border-radius: 22px;
    background:
      linear-gradient(180deg, rgba(2, 9, 28, .9) 0%, rgba(5, 14, 42, .8) 38%, rgba(5, 14, 42, .96) 100%),
      url("/assets/premium-customer-hero.jpg") center top / auto 360px no-repeat,
      #020817;
  }

  body.partnerOrderDetailOnly .partnerOrderDetailHead,
  body.partnerOrderDetailOnly .partnerOrderDetailMeta {
    max-width: 100%;
    margin-left: 0;
  }

  body.partnerOrderDetailOnly #partnerOrderDetailTitle {
    max-width: 100% !important;
    font-size: clamp(34px, 10vw, 56px) !important;
  }

  body.partnerOrderDetailOnly .partnerOrderHeroMetaItem {
    grid-template-columns: 38px minmax(0, 1fr) !important;
    gap: 16px !important;
  }

  body.partnerOrderDetailOnly .partnerOrderHeroIcon {
    width: 30px !important;
    height: 30px !important;
    border-width: 2px;
  }
}

/* App-wide button standard: matches the Baustellen-App detail buttons. */
body.dashboardMode :where(
  button:not([class]),
  .choiceButton,
  .primaryButton,
  .secondaryButton,
  .ghostButton,
  .dangerButton,
  .blueButton,
  .bigInviteButton,
  .projectDoneButton,
  .approvePayoutButton,
  .resendOverviewButton,
  .openReonicDetailButton,
  .editEmployeeButton,
  .adminActionButton,
  .compactActionButton,
  .reviewButton,
  .billingActionButton,
  .mapFilterButton,
  .uploadButton,
  .acceptSuggestionButton,
  .loginForm button,
  .formActions button,
  .recommendationForm button[type="submit"],
  .recommendationForm button[type="button"],
  .noticeBox button,
  .profileEditor button,
  .partnerSubmitModalActions button,
  .partnerOrderActionRow button,
  .partnerOrderDetailActions button,
  .chatComposer button,
  .emailAutomationEditor button,
  .orderComponentSelectionActions button,
  .montageCalendarEventForm button
):not(.modalCloseButton):not(.imagePreviewClose):not(.tableSortButton):not(.sidebarNavButton):not(.sidebarFooterButton):not(.sidebarCollapseButton):not(.sidebarNotificationButton):not(.mobileSidebarButton) {
  color: #ffffff;
  border: 1px solid rgba(72, 159, 223, .72);
  background:
    linear-gradient(180deg, rgba(38, 79, 114, .96) 0%, rgba(31, 70, 104, .98) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 14px 30px rgba(3, 9, 28, .2);
}

body.dashboardMode :where(
  button:not([class]),
  .choiceButton,
  .primaryButton,
  .secondaryButton,
  .ghostButton,
  .dangerButton,
  .blueButton,
  .bigInviteButton,
  .projectDoneButton,
  .approvePayoutButton,
  .resendOverviewButton,
  .openReonicDetailButton,
  .editEmployeeButton,
  .adminActionButton,
  .compactActionButton,
  .reviewButton,
  .billingActionButton,
  .mapFilterButton,
  .uploadButton,
  .acceptSuggestionButton,
  .loginForm button,
  .formActions button,
  .recommendationForm button[type="submit"],
  .recommendationForm button[type="button"],
  .noticeBox button,
  .profileEditor button,
  .partnerSubmitModalActions button,
  .partnerOrderActionRow button,
  .partnerOrderDetailActions button,
  .chatComposer button,
  .emailAutomationEditor button,
  .orderComponentSelectionActions button,
  .montageCalendarEventForm button
):not(.modalCloseButton):not(.imagePreviewClose):not(.tableSortButton):not(.sidebarNavButton):not(.sidebarFooterButton):not(.sidebarCollapseButton):not(.sidebarNotificationButton):not(.mobileSidebarButton):hover {
  color: #ffffff;
  border-color: rgba(78, 169, 235, .92);
  background:
    linear-gradient(180deg, rgba(49, 96, 134, .98) 0%, rgba(41, 86, 125, .98) 100%);
  box-shadow: 0 0 0 3px rgba(72, 159, 223, .14), 0 0 34px rgba(72, 159, 223, .2), 0 18px 42px rgba(3, 9, 28, .3), inset 0 1px 0 rgba(255, 255, 255, .14);
}

body.dashboardMode input[type="file"]::file-selector-button {
  color: #ffffff;
  border: 1px solid rgba(72, 159, 223, .72);
  background:
    linear-gradient(180deg, rgba(38, 79, 114, .96) 0%, rgba(31, 70, 104, .98) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 14px 30px rgba(3, 9, 28, .2);
}

body.dashboardMode input[type="file"]::file-selector-button:hover {
  color: #ffffff;
  border-color: rgba(78, 169, 235, .92);
  background:
    linear-gradient(180deg, rgba(49, 96, 134, .98) 0%, rgba(41, 86, 125, .98) 100%);
  box-shadow: 0 0 0 3px rgba(72, 159, 223, .14), 0 0 34px rgba(72, 159, 223, .2), 0 18px 42px rgba(3, 9, 28, .3), inset 0 1px 0 rgba(255, 255, 255, .14);
}

body.partnerDashboardHome .partnerHomeActionCard:hover,
body.portalPartner .partnerHomeActionCard:hover {
  color: #ffffff;
  border-color: rgba(72, 159, 223, .58);
  background:
    linear-gradient(180deg, rgba(33, 63, 95, .98) 0%, rgba(25, 49, 78, .98) 100%);
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .12), 0 16px 36px rgba(3, 9, 28, .28), inset 0 1px 0 rgba(255, 255, 255, .08);
  transform: translateY(-1px);
}

body.rolePartner.profileStandaloneView.partnerDashboardHome .dashboardHeadModern,
body.portalPartner.profileStandaloneView.partnerDashboardHome .dashboardHeadModern {
  min-height: clamp(220px, 22vw, 320px) !important;
  padding: clamp(30px, 4vw, 56px) !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas: "identity" !important;
  align-content: end !important;
}

body.rolePartner.profileStandaloneView.partnerDashboardHome .employeePhotoButton,
body.rolePartner.profileStandaloneView.partnerDashboardHome .advisorCard,
body.portalPartner.profileStandaloneView.partnerDashboardHome .employeePhotoButton,
body.portalPartner.profileStandaloneView.partnerDashboardHome .advisorCard {
  display: none !important;
}

body.dashboardMode .dashboardHeadModern::before {
  inset: -2px !important;
  border-radius: inherit;
  background:
    linear-gradient(90deg, rgba(2, 9, 20, .92), rgba(20, 27, 77, .64) 56%, rgba(2, 9, 20, .68)),
    linear-gradient(180deg, rgba(2, 9, 20, .58), rgba(2, 9, 20, .34));
}

body .partnerHomeActionCard:hover,
body .partnerHomeActionCard:focus,
body .partnerHomeActionCard:focus-visible,
body.partnerDashboardHome .partnerHomeActionCard:hover,
body.partnerDashboardHome .partnerHomeActionCard:focus,
body.partnerDashboardHome .partnerHomeActionCard:focus-visible,
body.portalPartner .partnerHomeActionCard:hover,
body.portalPartner .partnerHomeActionCard:focus,
body.portalPartner .partnerHomeActionCard:focus-visible {
  color: #ffffff;
  border-color: rgba(72, 159, 223, .58);
  background:
    linear-gradient(180deg, rgba(33, 63, 95, .98) 0%, rgba(25, 49, 78, .98) 100%);
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .12), 0 16px 36px rgba(3, 9, 28, .28), inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode.portalPartner.partnerDashboardHome button.partnerHomeActionCard:hover,
body.dashboardMode.portalPartner.partnerDashboardHome button.partnerHomeActionCard:focus,
body.dashboardMode.portalPartner.partnerDashboardHome button.partnerHomeActionCard:focus-visible,
body.dashboardMode.rolePartner.partnerDashboardHome button.partnerHomeActionCard:hover,
body.dashboardMode.rolePartner.partnerDashboardHome button.partnerHomeActionCard:focus,
body.dashboardMode.rolePartner.partnerDashboardHome button.partnerHomeActionCard:focus-visible {
  color: #ffffff;
  border-color: rgba(72, 159, 223, .58);
  background:
    linear-gradient(180deg, rgba(33, 63, 95, .98) 0%, rgba(25, 49, 78, .98) 100%);
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .12), 0 16px 36px rgba(3, 9, 28, .28), inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode .dashboardHeadModern {
  background-color: #020914;
  background-clip: padding-box;
  border-color: rgba(25, 49, 78, .96);
  outline: 1px solid rgba(2, 9, 20, .92);
  outline-offset: -1px;
}

body.dashboardMode.partnerDashboardHome .dashboardHeadModern {
  min-height: clamp(132px, 14vw, 178px) !important;
  padding: clamp(18px, 2.4vw, 30px) !important;
  grid-template-columns: minmax(360px, 1fr) 128px !important;
  grid-template-areas:
    "identity identity"
    "advisor photo" !important;
  gap: 12px !important;
}

body.dashboardMode.partnerDashboardHome .advisorCard {
  min-height: 118px !important;
  height: 118px !important;
  padding: 12px 16px !important;
  grid-template-columns: 72px minmax(0, 1fr) !important;
}

body.dashboardMode.partnerDashboardHome .advisorCard img {
  width: 64px !important;
  height: 64px !important;
}

body.dashboardMode.partnerDashboardHome .employeePhotoButton {
  width: 128px !important;
  height: 118px !important;
  min-height: 118px !important;
}

body.dashboardMode.partnerOrderEntryMode #partnerProjectsPanel {
  display: none !important;
}

body.dashboardMode .dashboardHeadModern::before {
  inset: -6px !important;
}

/* Portal UI foundation: dark premium dashboard surfaces based on the reference design. */
.portalHero,
.portalHeroCompact,
.portalSurface,
.portalFormSurface,
.portalList,
.portalListHeader,
.portalListRow,
.portalListCard {
  box-sizing: border-box;
  color: var(--portal-text);
}

.portalHero,
.portalHeroCompact {
  width: 100%;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-hero);
  background:
    linear-gradient(135deg, rgba(2, 8, 28, .82), rgba(4, 15, 38, .58)),
    var(--portal-surface);
  box-shadow: var(--portal-shadow), var(--portal-glow);
  overflow: hidden;
}

.portalHeroCompact {
  min-height: clamp(132px, 14vw, 178px);
}

.portalSurface,
.portalFormSurface,
.portalList {
  width: 100%;
  max-width: var(--portal-width-content);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-surface);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .035), rgba(255, 255, 255, .012)),
    var(--portal-surface);
  box-shadow: var(--portal-shadow);
}

.portalFormSurface {
  display: grid;
  gap: var(--ap-gap-loose);
  max-width: var(--portal-width-form);
}

.portalList {
  display: grid;
  gap: var(--portal-space-md);
  padding: var(--portal-space-lg);
}

.portalListHeader,
.portalListRow,
.portalListCard {
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: var(--portal-card);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 14px 34px rgba(0, 0, 0, .18);
}

.portalListHeader {
  color: var(--portal-muted);
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .02em;
}

.portalUploadDropzone {
  border: 1px dashed var(--portal-border-strong);
  border-radius: var(--portal-radius-card);
  background:
    linear-gradient(145deg, rgba(72, 159, 223, .12), rgba(255, 255, 255, .025)),
    var(--portal-card);
  padding: var(--portal-space-lg) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView.portalSurface {
  display: grid !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: var(--ap-space-6) !important;
  gap: var(--ap-gap-loose) !important;
  border-radius: var(--portal-radius-surface);
  border-color: var(--portal-border);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .035), rgba(255, 255, 255, .012)),
    var(--portal-surface);
  box-shadow: var(--portal-shadow);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView.portalSurface > h2,
body.dashboardMode.partnerOrderEntryMode #partnerOrderView.portalSurface > .mutedText {
  max-width: min(760px, 100%) !important;
  margin: 0 !important;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView.portalSurface > .linkButton {
  justify-self: start;
  width: auto !important;
  min-height: 42px !important;
  padding: 0 16px !important;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-control);
  background: var(--portal-card);
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView .portalFormSurface {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: var(--ap-space-6) !important;
  border-radius: var(--portal-radius-surface);
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView .portalUploadDropzone {
  color: var(--portal-text);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView .portalUploadDropzone small {
  color: var(--portal-muted);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView input[type="file"] {
  min-height: auto !important;
  padding: var(--ap-space-3) !important;
  border-style: solid;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderProjectPlanImages {
  display: grid;
  gap: var(--portal-space-sm);
  padding: var(--portal-space-md);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: var(--portal-card);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderProjectPlanImages.hidden {
  display: none;
}

body.dashboardMode.partnerOrderEntryMode .partnerOrderProjectPlanImageList {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: var(--portal-space-sm);
}

body.dashboardMode.partnerOrderEntryMode .partnerOrderProjectPlanImageList .partnerOrderProjectPlanPreview {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: rgba(4, 13, 34, .62);
  color: inherit;
  text-align: left;
  cursor: pointer;
}

body.dashboardMode.partnerOrderEntryMode .partnerOrderProjectPlanImageList .partnerOrderProjectPlanPreview:hover,
body.dashboardMode.partnerOrderEntryMode .partnerOrderProjectPlanImageList .partnerOrderProjectPlanPreview:focus-visible {
  border-color: var(--portal-border-strong);
  background:
    radial-gradient(circle at 18% 0%, rgba(72, 159, 223, .18), transparent 42%),
    rgba(4, 13, 34, .76);
  outline: none;
}

body.dashboardMode.partnerOrderEntryMode .partnerOrderProjectPlanImageList img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: calc(var(--portal-radius-card) - 6px);
  border: 1px solid rgba(72, 159, 223, .22);
}

body.dashboardMode.partnerOrderEntryMode .partnerOrderProjectPlanImageList span {
  color: var(--portal-text);
  font-weight: 700;
}

body.dashboardMode.partnerOrderEntryMode .partnerOrderProjectPlanImageList small {
  color: var(--portal-muted);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardProgress {
  display: grid;
  grid-template-columns: repeat(var(--partner-order-step-count, 4), minmax(0, 1fr));
  gap: var(--portal-space-sm);
  padding: var(--portal-space-sm);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: var(--portal-card);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton {
  position: relative;
  min-height: 48px;
  padding: 0 14px 0 38px;
  border: 1px solid transparent;
  border-radius: var(--portal-radius-control);
  background: rgba(7, 20, 47, .72);
  color: var(--portal-muted);
  box-shadow: none;
  font-size: .86rem;
  font-weight: 800;
  text-align: left;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton::before {
  content: "";
  position: absolute;
  left: 14px;
  top: 50%;
  width: 12px;
  height: 12px;
  border: 2px solid currentColor;
  border-radius: var(--portal-radius-pill);
  transform: translateY(-50%);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton.active,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton.isComplete {
  border-color: var(--portal-border-strong);
  background: var(--portal-button, var(--ap-ui-button));
  color: var(--portal-text);
  box-shadow: 0 14px 30px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .16);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton.isComplete::before {
  background: currentColor;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton.hidden,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton[hidden] {
  display: none !important;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStep {
  width: 100%;
  margin: 0;
  padding: var(--portal-space-lg);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: rgba(4, 15, 38, .72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStep.hidden,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStep[hidden] {
  display: none !important;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardSummary {
  display: grid;
  gap: var(--portal-space-md);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardSummary h3,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardSummary p {
  margin: 0;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardSummaryRows {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--portal-space-md);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardSummaryRows article {
  display: grid;
  gap: 6px;
  padding: var(--portal-space-md);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-control);
  background: var(--portal-card);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardSummaryRows span {
  color: var(--portal-muted);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .03em;
  text-transform: uppercase;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardSummaryRows strong {
  color: var(--portal-text);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardActions {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: var(--portal-space-sm) !important;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderWizardBackButton:disabled {
  opacity: .46;
  cursor: not-allowed;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderSubmitButton.hidden,
body.dashboardMode.partnerOrderEntryMode #partnerOrderWizardNextButton.hidden {
  display: none !important;
}

/* Partner order premium workflow refresh. */
body.dashboardMode.partnerOrderEntryMode #partnerOrderView.portalSurface {
  position: relative !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(72, 159, 223, .18), transparent 34%),
    linear-gradient(145deg, rgba(255, 255, 255, .035), rgba(255, 255, 255, .012)),
    var(--portal-surface);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView.portalSurface::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(72, 159, 223, .08), transparent 210px);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView.portalSurface > * {
  position: relative;
  z-index: 1;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView.portalSurface > h2 {
  color: var(--portal-text);
  font-size: clamp(1.8rem, 3vw, 2.55rem) !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView.portalSurface > .mutedText {
  max-width: min(840px, 100%) !important;
  color: var(--portal-muted);
  font-size: 1rem !important;
  line-height: 1.65 !important;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm.portalFormSurface {
  gap: var(--portal-space-xl) !important;
  padding: var(--portal-space-lg) 0 0 !important;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStep {
  position: relative;
  display: grid;
  gap: var(--portal-space-md);
  padding: calc(var(--portal-space-xl) + 10px) var(--portal-space-xl) var(--portal-space-xl);
  border-color: rgba(72, 159, 223, .2);
  background:
    radial-gradient(circle at 8% 0%, rgba(72, 159, 223, .12), transparent 34%),
    linear-gradient(145deg, rgba(8, 22, 50, .72), rgba(2, 9, 25, .54));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07), 0 20px 52px rgba(0, 0, 0, .18);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStep::before {
  grid-column: 1 / -1;
  display: block;
  color: var(--portal-text);
  font-size: clamp(1.18rem, 2vw, 1.45rem);
  font-weight: 900;
  line-height: 1.2;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm [data-partner-order-step="0"]::before {
  content: "Auftragstyp wählen";
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm [data-partner-order-step="1"]::before {
  content: "DC-Leistungsdaten";
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm [data-partner-order-step="2"]::before {
  content: "AC-Leistungsdaten";
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm [data-partner-order-step="3"]::before {
  content: "Kostenübersicht";
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm [data-partner-order-step="4"]::before {
  content: "Unterlagen vorbereiten";
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm [data-partner-order-step="5"]::before {
  content: "Kundendaten prüfen";
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm [data-partner-order-step="6"]::before {
  content: "Projektdaten abstimmen";
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm [data-partner-order-step="7"]::before {
  content: "Auftrag finalisieren";
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardSectionIntro,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderTypeSection {
  grid-column: 1 / -1;
  display: grid;
  gap: var(--ap-gap-tight);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardSectionIntro :is(h3, p),
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderTypeSection :is(h3, p) {
  margin: 0;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardSubsection {
  display: grid;
  gap: var(--ap-gap-tight);
  padding-top: var(--ap-space-md);
  border-top: 1px solid rgba(72, 159, 223, .16);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardSubsection :is(h4, p) {
  margin: 0;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardSubsection h4 {
  color: var(--ap-text);
  font-weight: 800;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderTypeCards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--ap-gap-default);
  margin-top: var(--ap-space-md);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderTypeCards button {
  display: grid;
  gap: var(--ap-gap-tight);
  min-height: 142px;
  padding: var(--ap-card-padding);
  border: 1px solid rgba(72, 159, 223, .22);
  border-radius: var(--portal-radius-control);
  background: rgba(2, 9, 25, .48);
  color: var(--portal-muted);
  text-align: left;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderTypeCards button strong {
  color: var(--portal-text);
  font-size: 1.05rem;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderTypeCards button span {
  color: var(--portal-muted);
  line-height: 1.45;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderTypeCards button:is(:hover, :focus-visible),
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderTypeCards button.active {
  border-color: rgba(124, 190, 246, .68);
  background:
    radial-gradient(circle at 16% 0%, rgba(72, 159, 223, .22), transparent 42%),
    linear-gradient(145deg, rgba(13, 37, 80, .96), rgba(4, 16, 42, .92));
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 18px 42px rgba(72, 159, 223, .18);
  transform: none !important;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderCostStep .partnerOrderCostEstimate {
  margin-top: var(--ap-space-sm);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderCostStep .partnerOrderCostEstimate.hidden {
  display: block !important;
}

@media (max-width: 860px) {
  body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderTypeCards {
    grid-template-columns: 1fr;
  }
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStep label {
  display: grid;
  gap: var(--ap-gap-tight);
  color: var(--portal-text);
  font-weight: 800;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStep :is(input, select, textarea) {
  border-color: rgba(72, 159, 223, .22);
  background: rgba(2, 9, 25, .48);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView .portalUploadDropzone {
  min-height: 148px;
  align-content: center;
  border-style: solid;
  background:
    radial-gradient(circle at 16% 0%, rgba(72, 159, 223, .22), transparent 38%),
    linear-gradient(145deg, rgba(8, 22, 50, .96), rgba(2, 9, 25, .88));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 16px 38px rgba(0, 0, 0, .2);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView .portalUploadDropzone:hover,
body.dashboardMode.partnerOrderEntryMode #partnerOrderView .portalUploadDropzone:focus-within {
  border-color: var(--portal-border-strong);
  background:
    radial-gradient(circle at 16% 0%, rgba(72, 159, 223, .26), transparent 38%),
    linear-gradient(145deg, rgba(6, 19, 45, .98), rgba(1, 7, 20, .95));
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .12), 0 18px 44px rgba(0, 0, 0, .24);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderUploadSection {
  display: grid;
  gap: var(--ap-gap-default);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderUploadLabel {
  color: rgba(235, 243, 255, .88);
  font-size: .86rem;
  font-weight: 850;
  letter-spacing: .01em;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderUploadSection small {
  color: var(--portal-muted);
  font-weight: 700;
  line-height: 1.45;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderEntryModeSelector {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ap-gap-tight);
  padding: var(--ap-space-1);
  border: 1px solid rgba(72, 159, 223, .2);
  border-radius: var(--portal-radius-control);
  background: rgba(2, 9, 25, .42);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderEntryModeSelector button {
  min-height: 46px;
  border: 1px solid transparent;
  border-radius: calc(var(--portal-radius-control) - var(--ap-space-1));
  background: transparent;
  color: var(--portal-muted);
  box-shadow: none;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderEntryModeSelector button.active {
  border-color: rgba(72, 159, 223, .34);
  background:
    linear-gradient(145deg, rgba(13, 37, 80, .96), rgba(4, 16, 42, .92));
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .09), 0 12px 28px rgba(0, 0, 0, .18);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderManualIntro {
  margin: 0;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView .partnerOrderUploadArea {
  display: grid;
  gap: var(--ap-gap-tight);
  min-height: auto;
  margin: 0;
  padding: var(--ap-space-4) !important;
  border-color: rgba(72, 159, 223, .28);
  border-radius: var(--portal-radius-control);
  background:
    linear-gradient(145deg, rgba(8, 22, 50, .9), rgba(2, 9, 25, .74));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView .partnerOrderUploadArea input[type="file"] {
  width: 100%;
  margin: 0;
  border-color: rgba(72, 159, 223, .24);
  border-radius: var(--portal-radius-control);
  background: rgba(2, 9, 25, .56);
  color: var(--portal-text);
}

body.dashboardMode.partnerOrderEntryMode #partnerModulePowerBlock {
  display: grid;
  gap: var(--ap-gap-default);
  padding: var(--portal-space-md);
  border: 1px solid rgba(72, 159, 223, .2);
  border-radius: var(--portal-radius-card);
  background: rgba(2, 9, 25, .36);
}

body.dashboardMode.partnerOrderEntryMode #partnerModulePowerBlock.hidden {
  display: none !important;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderModulePowerInputs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--ap-gap-default);
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomePremiumGrid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  width: 100% !important;
  max-width: none !important;
  gap: var(--portal-space-lg) !important;
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.portalPartner #partnerProjectsCards.partnerProjectsCards,
body.rolePartner #partnerProjectsCards.partnerProjectsCards {
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionCard {
  position: relative !important;
  display: grid !important;
  align-content: start !important;
  min-height: 210px !important;
  padding: var(--portal-space-xl) !important;
  gap: var(--portal-space-sm) !important;
  text-align: left !important;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-surface);
  background:
    radial-gradient(circle at 18% 0%, rgba(72, 159, 223, .2), transparent 32%),
    linear-gradient(145deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .012)),
    var(--portal-surface);
  color: var(--portal-text);
  box-shadow: var(--portal-shadow);
  overflow: hidden !important;
  transform: translateY(0) !important;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease !important;
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionCard::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(255, 255, 255, .08), transparent 42%);
  opacity: .5;
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionCard:hover,
body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionCard:focus-visible {
  transform: translateY(-3px) !important;
  border-color: var(--portal-border-strong);
  box-shadow: var(--portal-shadow), var(--portal-glow), 0 18px 48px rgba(72, 159, 223, .18);
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionIcon {
  position: relative;
  z-index: 1;
  display: inline-grid !important;
  place-items: center;
  width: 42px;
  height: 42px;
  margin-bottom: var(--portal-space-sm);
  border: 1px solid var(--portal-border-strong);
  border-radius: var(--portal-radius-pill);
  background: rgba(72, 159, 223, .16);
  color: var(--portal-text);
  font-size: 24px;
  font-weight: 800;
  line-height: 1;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 12px 28px rgba(72, 159, 223, .18);
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionCard > span:not(.partnerHomeActionIcon) {
  position: relative;
  z-index: 1;
  color: var(--portal-muted);
  font-size: .82rem !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
  text-transform: uppercase !important;
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionCard strong {
  position: relative;
  z-index: 1;
  color: var(--portal-text);
  font-size: clamp(22px, 2.2vw, 30px) !important;
  line-height: 1.06 !important;
  font-weight: 800 !important;
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionCard small {
  position: relative;
  z-index: 1;
  max-width: 34rem;
  color: var(--portal-muted);
  font-size: 15px !important;
  line-height: 1.5 !important;
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionCard em {
  position: relative;
  z-index: 1;
  align-self: end;
  justify-self: start;
  margin-top: var(--portal-space-md);
  padding: 7px 12px;
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: var(--portal-radius-pill);
  background: rgba(72, 159, 223, .12);
  color: var(--portal-muted);
  font-size: .78rem;
  font-style: normal;
  font-weight: 700;
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionCardSoon {
  opacity: .86;
}

body.dashboardMode.profileStandaloneView.portalPartner #profileView,
body.dashboardMode.profileStandaloneView.rolePartner #profileView {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

body.dashboardMode.profileStandaloneView.portalPartner #partnerProfileOverview.partnerProfileOverview,
body.dashboardMode.profileStandaloneView.rolePartner #partnerProfileOverview.partnerProfileOverview {
  display: grid;
  width: 100% !important;
  max-width: none !important;
  gap: var(--portal-space-xl);
  padding: var(--portal-space-xl) !important;
  border-radius: var(--portal-radius-surface);
  border-color: var(--portal-border);
  background:
    radial-gradient(circle at 12% 0%, rgba(72, 159, 223, .18), transparent 30%),
    linear-gradient(145deg, rgba(255, 255, 255, .035), rgba(255, 255, 255, .012)),
    var(--portal-surface);
  box-shadow: var(--portal-shadow);
}

body.dashboardMode.profileStandaloneView.portalPartner #partnerProfileOverview.hidden,
body.dashboardMode.profileStandaloneView.rolePartner #partnerProfileOverview.hidden {
  display: none !important;
}

.partnerProfileOverviewHero {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: var(--portal-space-lg);
  align-items: center;
}

.partnerProfileImageButton {
  position: relative;
  display: grid !important;
  place-items: center;
  width: clamp(118px, 12vw, 156px) !important;
  height: clamp(118px, 12vw, 156px) !important;
  padding: 0 !important;
  border: 1px solid var(--portal-border-strong);
  border-radius: 34px;
  background:
    linear-gradient(145deg, rgba(72, 159, 223, .14), rgba(255, 255, 255, .035)),
    var(--portal-card);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 18px 44px rgba(0, 0, 0, .24);
  overflow: hidden;
  cursor: pointer;
}

.partnerProfileImageButton img {
  width: 72%;
  height: 72%;
  object-fit: contain;
  border-radius: 24px;
}

.partnerProfileImageButton span {
  position: absolute;
  right: 10px;
  bottom: 10px;
  padding: 6px 10px;
  border: 1px solid rgba(72, 159, 223, .38);
  border-radius: var(--portal-radius-pill);
  background: rgba(2, 9, 20, .78);
  color: var(--portal-text);
  font-size: .72rem;
  font-weight: 700;
  opacity: .92;
}

.partnerProfileImageButton:hover,
.partnerProfileImageButton:focus-visible {
  transform: translateY(-2px);
  border-color: var(--portal-border-strong);
  box-shadow: var(--portal-shadow), var(--portal-glow);
}

.partnerProfileOverviewTitle {
  display: grid;
  gap: var(--portal-space-xs);
  min-width: 0;
}

.partnerProfileOverviewTitle span {
  color: var(--portal-muted);
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.partnerProfileOverviewTitle strong {
  color: var(--portal-text);
  font-size: clamp(30px, 4vw, 52px);
  line-height: 1.02;
  font-weight: 900;
}

.partnerProfileOverviewTitle small {
  color: var(--portal-muted);
  font-size: 1rem;
}

.partnerProfileStatus {
  justify-self: end;
  align-self: start;
  padding: 8px 13px;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-pill);
  background: rgba(72, 159, 223, .12);
  color: var(--portal-text);
  font-size: .82rem;
  font-weight: 800;
}

.partnerProfileTabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 6px;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: rgba(255, 255, 255, .035);
}

.partnerProfileTab {
  min-height: 40px;
  padding: 9px 14px !important;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: var(--portal-muted);
  font-size: .9rem !important;
  font-weight: 800 !important;
  box-shadow: none;
}

.partnerProfileTab.active,
.partnerProfileTab:hover,
.partnerProfileTab:focus-visible {
  border-color: var(--portal-border-strong);
  background: rgba(72, 159, 223, .16);
  color: var(--portal-text);
}

.partnerProfileTabPanels {
  display: grid;
  min-width: 0;
}

.partnerProfileTabPanel {
  display: none;
  min-width: 0;
}

.partnerProfileTabPanel.active {
  display: grid;
}

.partnerProfileSection {
  display: grid;
  gap: var(--portal-space-lg);
  min-width: 0;
  padding: 4px 0 0;
}

.partnerProfileDataCardHead {
  display: grid;
  gap: 4px;
}

.partnerProfileDataCardHead span {
  color: var(--portal-muted);
  font-size: .8rem;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.partnerProfileDataCardHead strong {
  color: var(--portal-text);
  font-size: clamp(20px, 2vw, 28px);
  line-height: 1.2;
}

.partnerProfileInfoGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: var(--portal-border);
}

.partnerProfileInfoGrid article {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: var(--portal-space-lg);
  background: rgba(255, 255, 255, .035);
}

.partnerProfileInfoGrid article span {
  color: var(--portal-muted);
  font-size: .8rem;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.partnerProfileInfoGrid article strong {
  color: var(--portal-text);
  font-size: 1.02rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.partnerProfileOverviewActions {
  display: flex;
  justify-content: flex-start;
}

body.dashboardMode.profileStandaloneView.portalPartner #partnerProfileOverview .partnerPriceListSummaryBox,
body.dashboardMode.profileStandaloneView.rolePartner #partnerProfileOverview .partnerPriceListSummaryBox {
  border-color: var(--portal-border);
  background: rgba(255, 255, 255, .04);
  color: var(--portal-text);
}

body.dashboardMode.profileStandaloneView.portalPartner #partnerProfileOverview .partnerPriceListSummaryBox p,
body.dashboardMode.profileStandaloneView.rolePartner #partnerProfileOverview .partnerPriceListSummaryBox p {
  color: var(--portal-text);
}

body.dashboardMode.profileStandaloneView.portalPartner #partnerProfileOverview .partnerPriceListSummaryBox a,
body.dashboardMode.profileStandaloneView.rolePartner #partnerProfileOverview .partnerPriceListSummaryBox a {
  color: var(--portal-accent);
}

.partnerProfilePriceGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}

.partnerProfilePriceGroup {
  display: grid;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: rgba(255, 255, 255, .03);
}

.partnerProfilePriceGroup h4 {
  margin: 0;
  padding: 14px 16px;
  border-bottom: 1px solid var(--portal-border);
  background: rgba(72, 159, 223, .1);
  color: var(--portal-text);
  font-size: 1rem;
}

.partnerProfilePriceRows {
  display: grid;
}

.partnerProfilePriceRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 12px;
  align-items: baseline;
  padding: 13px 16px;
  border-top: 1px solid rgba(255, 255, 255, .08);
}

.partnerProfilePriceRow:first-child {
  border-top: 0;
}

.partnerProfilePriceRow span {
  min-width: 0;
  color: var(--portal-text);
  font-weight: 800;
  overflow-wrap: anywhere;
}

.partnerProfilePriceRow strong {
  color: var(--portal-text);
  font-size: 1.02rem;
  white-space: nowrap;
}

.partnerProfilePriceRow small {
  grid-column: 1 / -1;
  color: var(--portal-muted);
  font-size: .78rem;
  font-weight: 700;
}

.partnerProfileEmptyText {
  margin: 0;
  padding: 16px;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: rgba(255, 255, 255, .035);
  color: var(--portal-muted);
  font-weight: 700;
}

@media (max-width: 720px) {
  .partnerProfileTabs {
    display: grid;
    grid-template-columns: 1fr;
  }

  .partnerProfileInfoGrid,
  .partnerProfilePriceGrid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px) {
  .partnerProfileOverviewHero {
    grid-template-columns: 1fr;
  }

  .partnerProfileStatus {
    justify-self: start;
  }
}

.partnerComplaintForm {
  display: grid;
  gap: var(--portal-space-lg);
}

.partnerComplaintForm {
  max-width: none;
}

.complaintProjectPicker {
  display: grid;
  gap: var(--portal-space-md);
}

.complaintProjectPicker label,
.partnerComplaintForm > label {
  display: grid;
  width: 100%;
  gap: 8px;
}

.complaintProjectPicker input,
.partnerComplaintForm textarea {
  width: 100%;
}

.complaintProjectResults {
  display: grid;
  gap: 10px;
  max-height: 244px;
  overflow: auto;
}

.complaintWizardProgress {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--portal-space-sm);
  padding: var(--portal-space-sm);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: var(--portal-card);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

.complaintWizardStepButton {
  position: relative;
  min-height: 50px;
  padding: 0 12px 0 42px !important;
  border: 1px solid transparent;
  border-radius: var(--portal-radius-control);
  background: rgba(7, 20, 47, .72);
  color: var(--portal-muted);
  box-shadow: none;
  font-size: .82rem;
  font-weight: 800;
  text-align: left;
}

.complaintWizardStepButton span {
  position: absolute;
  left: 12px;
  top: 50%;
  display: inline-flex;
  width: 20px;
  height: 20px;
  align-items: center;
  justify-content: center;
  border: 1px solid currentColor;
  border-radius: var(--portal-radius-pill);
  font-size: .72rem;
  transform: translateY(-50%);
}

.complaintWizardStepButton.active,
.complaintWizardStepButton.isComplete {
  border-color: var(--portal-border-strong);
  background: linear-gradient(145deg, rgba(8, 22, 50, .94), rgba(2, 9, 25, .96));
  color: var(--portal-text);
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .12), inset 0 1px 0 rgba(255, 255, 255, .12);
}

.complaintWizardStepButton.isComplete span {
  background: rgba(72, 159, 223, .22);
}

.complaintWizardStep {
  width: 100%;
  margin: 0;
  padding: var(--portal-space-lg);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: rgba(4, 15, 38, .72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

.complaintWizardStep.hidden,
.complaintWizardStep[hidden] {
  display: none !important;
}

.partnerComplaintForm .complaintWizardStep {
  position: relative;
}

.partnerComplaintForm .complaintWizardStepHead {
  display: grid;
  gap: var(--ap-gap-tight);
  max-width: min(760px, 100%);
}

.partnerComplaintForm .complaintWizardStepHead h4,
.partnerComplaintForm .complaintWizardStepHead p {
  margin: var(--ap-space-0);
}

.partnerComplaintForm .complaintWizardStepHead h4 {
  color: var(--portal-text);
  font-size: clamp(1.18rem, 2vw, 1.45rem);
  font-weight: 900;
  line-height: 1.2;
}

.partnerComplaintForm .complaintWizardStepHead p {
  max-width: 68ch;
  color: var(--portal-muted);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.55;
}

.partnerComplaintForm .complaintWizardStep > :not(.complaintWizardStepHead) {
  position: relative;
  z-index: 1;
}

.complaintWizardSummary {
  display: grid;
  gap: var(--portal-space-md);
}

.complaintWizardSummary h3,
.complaintWizardSummary p {
  margin: 0;
}

.complaintWizardSummaryRows {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--portal-space-md);
}

.complaintWizardSummaryRows article {
  display: grid;
  gap: 6px;
  padding: var(--portal-space-md);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-control);
  background: var(--portal-card);
}

.complaintWizardSummaryRows span {
  color: var(--portal-muted);
  font-size: .76rem;
  font-weight: 800;
  text-transform: uppercase;
}

.complaintWizardSummaryRows strong {
  color: var(--portal-text);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.complaintWizardActions {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: var(--portal-space-sm) !important;
}

.complaintWizardActions button {
  min-width: 150px !important;
  min-height: 44px !important;
  padding: 0 20px !important;
  border-radius: 14px;
}

#complaintWizardNextButton,
#complaintSubmitButton {
  min-width: 180px !important;
}

#complaintWizardBackButton:disabled {
  opacity: .46;
  cursor: not-allowed;
}

#complaintWizardNextButton:disabled {
  opacity: .46;
  cursor: not-allowed;
  transform: none !important;
  box-shadow: none;
}

#complaintWizardNextButton.hidden,
#complaintSubmitButton.hidden {
  display: none !important;
}

.complaintWizardProgress {
  align-items: start !important;
  gap: 0 !important;
  padding: 12px 10px 14px !important;
  border-color: rgba(72, 159, 223, .18);
  background: rgba(2, 9, 25, .42);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

.complaintWizardStepButton {
  display: grid !important;
  justify-items: center !important;
  align-content: start !important;
  min-height: 72px !important;
  padding: 42px 8px 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: rgba(201, 216, 234, .72);
  box-shadow: none;
  text-align: center !important;
  line-height: 1.25 !important;
}

.complaintWizardStepButton::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: 16px;
  left: calc(50% + 18px);
  width: calc(100% - 36px);
  height: 2px;
  border-radius: 999px;
  background: rgba(72, 159, 223, .24);
}

.complaintWizardStepButton:last-child::after {
  display: none;
}

.complaintWizardStepButton span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 1;
  left: 50% !important;
  top: 16px !important;
  width: 30px !important;
  height: 30px !important;
  border: 2px solid rgba(72, 159, 223, .34);
  border-radius: 999px;
  background: #041026;
  color: rgba(201, 216, 234, .72);
  box-shadow: 0 0 0 4px rgba(2, 9, 25, .92), inset 0 1px 0 rgba(255, 255, 255, .08);
  transform: translate(-50%, -50%) !important;
}

.complaintWizardStepButton.active,
.complaintWizardStepButton.isComplete {
  border: 0;
  background: transparent;
  color: var(--portal-text);
  box-shadow: none;
}

.complaintWizardStepButton.active span {
  border-color: rgba(72, 159, 223, .92);
  background: linear-gradient(145deg, rgba(72, 159, 223, .92), rgba(20, 27, 77, .92));
  color: #fff;
  box-shadow: 0 0 0 4px rgba(2, 9, 25, .92), 0 0 24px rgba(72, 159, 223, .28);
}

.complaintWizardStepButton.isComplete span {
  content: "";
  border-color: rgba(72, 159, 223, .74);
  background: rgba(13, 37, 80, .98);
  color: #fff;
  font-size: 0 !important;
}

.complaintWizardStepButton.isComplete span::after {
  content: none;
}

.complaintWizardStepButton.isComplete::after {
  background: rgba(72, 159, 223, .62);
}

.complaintProjectOption {
  width: 100%;
  display: grid;
  gap: 7px;
  padding: 16px 18px;
  border: 1px solid var(--ap-ui-border);
  border-radius: 16px;
  background:
    linear-gradient(145deg, rgba(8, 22, 50, .94), rgba(2, 9, 25, .96));
  color: var(--portal-text);
  text-align: left;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 12px 30px rgba(0, 0, 0, .16);
}

.complaintProjectOption:hover,
.complaintProjectOption.is-selected {
  border-color: var(--ap-ui-border-strong);
  background:
    linear-gradient(145deg, rgba(3, 13, 34, .98), rgba(1, 7, 20, .98));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 16px 36px rgba(0, 0, 0, .22);
}

.complaintProjectOption.is-selected {
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .08), 0 16px 36px rgba(0, 0, 0, .22);
}

.complaintProjectOption strong {
  color: var(--portal-text);
}

.complaintProjectOption span {
  color: var(--portal-muted);
}

.complaintAttachmentLink {
  padding: var(--portal-space-md) 0;
  border: 0;
  border-bottom: 1px solid var(--portal-border);
  border-radius: 0;
  background: transparent;
}

.complaintAttachmentList,
.complaintMessageList,
.complaintInlineForm {
  display: grid;
  gap: var(--portal-space-md);
}

.complaintAttachmentLink {
  display: grid;
  gap: 4px;
  text-decoration: none;
}

.complaintAttachmentLink span {
  color: var(--portal-text);
  font-weight: 800;
}

.complaintAttachmentLink small {
  color: var(--portal-muted);
}

body.dashboardMode.profileStandaloneView.portalPartner #profileForm.portalFormSurface,
body.dashboardMode.profileStandaloneView.rolePartner #profileForm.portalFormSurface {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

body.dashboardMode.portalPartner .complaintProjectOption,
body.dashboardMode.rolePartner .complaintProjectOption {
  border: 1px solid var(--ap-ui-border);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(8, 22, 50, .94), rgba(2, 9, 25, .96));
  background-color: #020914;
  background-image: linear-gradient(145deg, rgba(8, 22, 50, .94), rgba(2, 9, 25, .96));
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 12px 30px rgba(0, 0, 0, .18);
}

body.dashboardMode.portalPartner .complaintProjectOption:hover,
body.dashboardMode.portalPartner .complaintProjectOption:focus,
body.dashboardMode.portalPartner .complaintProjectOption:focus-visible,
body.dashboardMode.portalPartner .complaintProjectOption:active,
body.dashboardMode.portalPartner .complaintProjectOption.is-selected,
body.dashboardMode.rolePartner .complaintProjectOption:hover,
body.dashboardMode.rolePartner .complaintProjectOption:focus,
body.dashboardMode.rolePartner .complaintProjectOption:focus-visible,
body.dashboardMode.rolePartner .complaintProjectOption:active,
body.dashboardMode.rolePartner .complaintProjectOption.is-selected {
  border-color: var(--ap-ui-border-strong);
  background: linear-gradient(145deg, rgba(3, 13, 34, .98), rgba(1, 7, 20, .98));
  background-color: #010714;
  background-image: linear-gradient(145deg, rgba(3, 13, 34, .98), rgba(1, 7, 20, .98));
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 16px 36px rgba(0, 0, 0, .24);
  outline: none;
}

body.dashboardMode.portalPartner .complaintProjectOption.is-selected,
body.dashboardMode.rolePartner .complaintProjectOption.is-selected {
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .08), 0 16px 36px rgba(0, 0, 0, .24);
}

/* Partner portal shared stepper */
body.dashboardMode .partnerPortalStepper {
  display: grid !important;
  grid-template-columns: repeat(var(--partner-order-step-count, 4), minmax(0, 1fr));
  align-items: start !important;
  gap: 0 !important;
  padding: 12px 10px 14px !important;
  border: 1px solid rgba(72, 159, 223, .18);
  border-radius: var(--portal-radius-card);
  background: rgba(2, 9, 25, .42);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
  counter-reset: partner-portal-step;
}

body.dashboardMode .partnerPortalStepperStep {
  position: relative !important;
  display: grid;
  justify-items: center;
  align-content: start;
  min-height: 72px;
  padding: 42px 8px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: rgba(201, 216, 234, .72);
  box-shadow: none;
  font-size: .86rem;
  font-weight: 800;
  text-align: center;
  line-height: 1.25;
  counter-increment: partner-portal-step;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerPortalStepperStep.hidden,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerPortalStepperStep[hidden] {
  display: none !important;
}

body.dashboardMode .partnerPortalStepperStep::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: 16px;
  left: calc(50% + 18px);
  width: calc(100% - 36px);
  height: 2px;
  border-radius: 999px;
  background: rgba(72, 159, 223, .24);
}

body.dashboardMode .partnerPortalStepperStep:last-child::after {
  display: none;
}

body.dashboardMode .partnerPortalStepperStep::before,
body.dashboardMode .partnerPortalStepperStep > span {
  content: "";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 16px;
  width: 30px;
  height: 30px;
  border: 2px solid rgba(72, 159, 223, .34);
  border-radius: 999px;
  background: #041026;
  color: rgba(201, 216, 234, .72);
  box-shadow: 0 0 0 4px rgba(2, 9, 25, .92), inset 0 1px 0 rgba(255, 255, 255, .08);
  transform: translate(-50%, -50%);
}

body.dashboardMode .partnerPortalStepperStep.active,
body.dashboardMode .partnerPortalStepperStep.isComplete {
  border: 0;
  background: transparent;
  color: var(--portal-text);
  box-shadow: none;
}

body.dashboardMode .partnerPortalStepperStep.active::before,
body.dashboardMode .partnerPortalStepperStep.ap-step-active::before,
body.dashboardMode .partnerPortalStepperStep[aria-current="step"]::before,
body.dashboardMode .partnerPortalStepperStep.active > span,
body.dashboardMode .partnerPortalStepperStep.ap-step-active > span,
body.dashboardMode .partnerPortalStepperStep[aria-current="step"] > span {
  border-color: rgba(72, 159, 223, .92);
  background: linear-gradient(145deg, rgba(72, 159, 223, .92), rgba(20, 27, 77, .92));
  color: #fff;
  box-shadow: 0 0 0 4px rgba(2, 9, 25, .92), 0 0 24px rgba(72, 159, 223, .28);
}

body.dashboardMode .partnerPortalStepperStep.isComplete::before,
body.dashboardMode .partnerPortalStepperStep.isComplete > span {
  content: "";
  border-color: rgba(72, 159, 223, .74);
  background: rgba(13, 37, 80, .98);
  color: #fff;
}

body.dashboardMode .partnerPortalStepperStep.isComplete::before,
body.dashboardMode .partnerPortalStepperStep.isComplete > span::after {
  content: none;
}

body.dashboardMode .partnerPortalStepperStep.isComplete::after {
  background: rgba(72, 159, 223, .62);
}

/* Portal Layout System V2 */

/* Sections */
.ap-section {
  display: grid;
  gap: var(--ap-gap-default);
  min-width: 0;
  padding: var(--ap-space-0);
  border: 0;
  border-radius: var(--ap-space-0);
  background: transparent;
  box-shadow: none;
}

.ap-section + .ap-section {
  margin-top: var(--ap-section-gap);
}

.ap-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--ap-gap-default);
}

.ap-section-title,
.ap-section-description {
  margin: 0;
}

.ap-section-title {
  color: var(--portal-text);
  font-size: 1.2rem;
  font-weight: 850;
  line-height: 1.25;
}

.ap-section-description {
  max-width: var(--portal-width-form);
  color: var(--portal-muted);
  font-size: .9rem;
  font-weight: 600;
  line-height: 1.5;
}

.ap-section-body {
  display: grid;
  min-width: 0;
  gap: var(--ap-page-gap);
}

.ap-section-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ap-gap-default);
}

/* Filter Toolbar */
.ap-filter-toolbar-section {
  gap: var(--ap-gap-tight);
}

.ap-filter-toolbar-head {
  align-items: center;
}

.ap-filter-toolbar {
  display: grid;
  min-width: 0;
  gap: var(--ap-gap-tight);
}

.ap-filter-toolbar-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(12rem, auto) auto;
  align-items: stretch;
  gap: var(--ap-gap-default);
}

.ap-filter-toolbar-search,
.ap-filter-toolbar-filters,
.ap-filter-toolbar-filters label {
  min-width: 0;
  margin: 0;
}

.ap-filter-toolbar-filters {
  display: grid;
  align-items: stretch;
}

.ap-filter-toolbar-actions {
  display: flex;
  align-items: stretch;
  justify-content: flex-end;
}

.ap-filter-toolbar-actions .ap-button-secondary {
  height: 100%;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

.ap-filter-toolbar-label {
  position: absolute;
  width: var(--ap-space-1);
  height: var(--ap-space-1);
  margin: calc(var(--ap-space-1) * -1);
  padding: 0;
  clip-path: inset(50%);
  overflow: hidden;
  white-space: nowrap;
}

.ap-filter-toolbar-meta {
  min-height: 1.3em;
  margin: 0;
  color: var(--portal-muted);
  font-size: .82rem;
  font-weight: 700;
  line-height: 1.3;
}

@media (max-width: 980px) {
  .ap-filter-toolbar-main {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .ap-filter-toolbar-search {
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  .ap-filter-toolbar-main {
    grid-template-columns: minmax(0, 1fr);
  }

  .ap-filter-toolbar-search,
  .ap-filter-toolbar-filters,
  .ap-filter-toolbar-actions {
    grid-column: 1;
  }

  .ap-filter-toolbar-actions .ap-button-secondary {
    width: 100%;
  }
}

/* KPI */
.ap-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr));
  gap: var(--ap-gap-default);
}

.ap-kpi-card {
  display: grid;
  min-width: 0;
  gap: var(--ap-gap-tight);
  padding: var(--ap-card-padding);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: var(--portal-card);
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

.ap-kpi-label,
.ap-kpi-meta {
  color: var(--portal-muted);
  font-size: .82rem;
  font-weight: 700;
  line-height: 1.35;
}

.ap-kpi-value {
  color: var(--portal-text);
  font-size: 1.7rem;
  font-weight: 900;
  line-height: 1.1;
}

/* Badges */
.ap-badge {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  min-height: calc(var(--ap-space-5) + var(--ap-space-1));
  align-items: center;
  justify-content: center;
  gap: var(--ap-space-1);
  padding-inline: var(--ap-space-3);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-pill);
  background: rgba(193, 207, 224, .1);
  color: var(--portal-muted);
  box-shadow: none;
  font-size: .76rem;
  font-weight: 850;
  line-height: 1.15;
}

.ap-badge-neutral {
  border-color: rgba(193, 207, 224, .28);
  background: rgba(193, 207, 224, .1);
  color: rgba(224, 235, 248, .76);
}

.ap-badge-info {
  border-color: rgba(72, 159, 223, .36);
  background: rgba(72, 159, 223, .13);
  color: rgba(210, 234, 255, .92);
}

.ap-badge-success {
  border-color: rgba(73, 217, 143, .38);
  background: rgba(73, 217, 143, .13);
  color: #79e7af;
}

.ap-badge-warning {
  border-color: rgba(255, 217, 115, .36);
  background: rgba(255, 198, 78, .13);
  color: #ffd978;
}

.ap-badge-danger {
  border-color: rgba(255, 112, 112, .42);
  background: rgba(255, 112, 112, .13);
  color: #ff9d9d;
}

/* Cards */
.ap-card {
  width: 100%;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-surface);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .035), rgba(255, 255, 255, .012)),
    var(--portal-surface);
  color: var(--portal-text);
  box-shadow: var(--portal-shadow);
}

.ap-card-interactive {
  display: grid;
  width: 100%;
  border: 1px solid var(--ap-ui-border);
  border-radius: 16px;
  background:
    linear-gradient(145deg, rgba(8, 22, 50, .94), rgba(2, 9, 25, .96)),
    #020914;
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 12px 30px rgba(0, 0, 0, .18);
}

.ap-card-interactive:is(:hover, :focus, :focus-visible, :active),
.ap-card-interactive.ap-card-selected,
.ap-card-interactive.is-selected,
.ap-card-selected {
  border-color: var(--ap-ui-border-strong);
  background:
    linear-gradient(145deg, rgba(3, 13, 34, .98), rgba(1, 7, 20, .98)),
    #010714;
  color: var(--portal-text);
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .06), 0 16px 36px rgba(0, 0, 0, .24);
  outline: none;
}

@media (max-width: 760px) {
  .ap-section-head {
    display: grid;
  }
}

.ap-button-primary,
.ap-button-secondary,
.ap-button-danger {
  min-height: 44px;
  padding: 0 18px;
  border-radius: var(--portal-radius-control);
  font-weight: 800;
}

.ap-button-primary {
  border: 1px solid rgba(101, 189, 255, .5);
  background: var(--ap-ui-button);
  color: var(--portal-text);
  box-shadow: 0 14px 30px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .16);
}

.ap-button-secondary {
  border: 1px solid var(--portal-border);
  background: var(--portal-card);
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

.ap-button-danger {
  border: 1px solid rgba(255, 112, 112, .46);
  background: linear-gradient(135deg, rgba(176, 43, 43, .92), rgba(92, 18, 30, .88));
  color: #fff;
  box-shadow: 0 14px 30px rgba(176, 43, 43, .18), inset 0 1px 0 rgba(255, 255, 255, .14);
}

.ap-stepper {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: var(--portal-space-sm);
  padding: var(--portal-space-sm);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: rgba(2, 9, 25, .42);
}

.ap-step {
  position: relative;
  min-height: 48px;
  padding: 0 14px 0 46px;
  border: 1px solid transparent;
  border-radius: var(--portal-radius-control);
  background: transparent;
  color: var(--portal-muted);
  font-size: .86rem;
  font-weight: 800;
  text-align: left;
}

.ap-step::before {
  content: "";
  position: absolute;
  left: 18px;
  top: 50%;
  width: 14px;
  height: 14px;
  border: 2px solid currentColor;
  border-radius: var(--portal-radius-pill);
  transform: translateY(-50%);
}

.ap-step-active,
.ap-step-complete,
.ap-step.active,
.ap-step.isComplete {
  border-color: var(--portal-border-strong);
  color: var(--portal-text);
}

.ap-step-complete::before,
.ap-step.isComplete::before {
  content: "";
  display: grid;
  place-items: center;
  background: rgba(13, 37, 80, .98);
  color: #fff;
  font-size: .75rem;
  line-height: 1;
}

.ap-input,
.ap-select,
.ap-textarea {
  width: 100%;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-control);
  background: var(--ap-ui-control);
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
  font: inherit;
}

.ap-input,
.ap-select {
  min-height: 44px;
  padding: 0 14px;
}

.ap-textarea {
  min-height: 132px;
  padding: 12px 14px;
  resize: vertical;
}

.ap-input::placeholder,
.ap-textarea::placeholder {
  color: rgba(214, 231, 250, .48);
}

.ap-input:focus,
.ap-select:focus,
.ap-textarea:focus {
  outline: none;
  border-color: var(--portal-border-strong);
  box-shadow: 0 0 0 3px rgba(72, 159, 223, .16), inset 0 1px 0 rgba(255, 255, 255, .1);
}

.ap-upload {
  border: 1px dashed var(--portal-border-strong);
  border-radius: var(--portal-radius-card);
  background:
    linear-gradient(145deg, rgba(72, 159, 223, .12), rgba(255, 255, 255, .025)),
    var(--portal-card);
  color: var(--portal-text);
  padding: var(--portal-space-lg);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

/* Referral portal phase 2.2: align dashboard cards with Design System V2. */
body.portalReferral .customerActionBox.ap-card {
  grid-template-columns: minmax(0, 1.15fr) minmax(220px, .85fr);
  gap: clamp(18px, 3vw, 30px);
  padding: clamp(22px, 3vw, 34px) !important;
  border-color: rgba(72, 159, 223, .34);
  border-radius: 22px;
  background:
    linear-gradient(145deg, rgba(72, 159, 223, .14), rgba(255, 255, 255, .028)),
    linear-gradient(145deg, rgba(8, 22, 50, .94), rgba(2, 9, 25, .96));
  box-shadow: 0 24px 70px rgba(3, 9, 28, .36), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.portalReferral .customerActionBox.ap-card strong {
  max-width: 720px;
  font-size: clamp(1.45rem, 2.8vw, 2.35rem);
  line-height: 1.08;
}

body.portalReferral .customerActionButtons {
  align-self: stretch;
  justify-content: center;
}

body.portalReferral .customerActionButtons .bigInviteButton,
body.portalReferral #requestPayoutButton.ap-button-primary {
  min-height: 58px;
  border-radius: 16px;
}

body.portalReferral #creditSummary.creditSummary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--portal-space-md);
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.portalReferral #creditSummary.creditSummary > .ap-card {
  min-height: 132px;
  display: grid;
  align-content: center;
  gap: 10px;
  padding: clamp(18px, 2.4vw, 26px) !important;
  border-color: rgba(72, 159, 223, .3);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(72, 159, 223, .1), rgba(255, 255, 255, .02)),
    rgba(6, 18, 46, .86);
  box-shadow: 0 18px 42px rgba(3, 9, 28, .28), inset 0 1px 0 rgba(255, 255, 255, .1);
}

body.portalReferral #creditSummary.creditSummary > .ap-card strong {
  font-size: clamp(1.35rem, 2.2vw, 2rem);
  line-height: 1.1;
}

body.portalReferral .recommendationForm.ap-card,
body.portalReferral .noticeBox.ap-card,
body.portalReferral .reviewBox.ap-card {
  padding: clamp(20px, 3vw, 30px) !important;
  border-radius: 22px;
}

body.portalReferral #recommendationForm.recommendationForm.ap-card,
body.portalReferral #detailForm.recommendationForm.ap-card,
body.portalReferral #customerProfileEditForm.recommendationForm.ap-card {
  gap: var(--portal-space-lg) !important;
}

body.portalReferral .reviewBox.ap-card,
body.portalReferral #customerDetailBox.reviewBox.ap-card {
  align-items: flex-start;
  border-color: rgba(72, 159, 223, .32);
}

body.portalReferral #customerDetailBox.reviewBox.ap-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

body.portalReferral #customerDetailBox .reviewActions,
body.portalReferral #reviewBox .reviewActions {
  margin-top: var(--portal-space-sm);
}

body.portalReferral .emailHistoryItem {
  border: 1px solid rgba(72, 159, 223, .24);
  border-radius: 16px;
  background: rgba(2, 12, 32, .5);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

@media (max-width: 760px) {
  body.portalReferral .customerActionBox.ap-card,
  body.portalReferral #creditSummary.creditSummary {
    grid-template-columns: 1fr;
  }
}

/* Partner portal shared interactive card */
body.dashboardMode.portalPartner .partnerCardInteractive,
body.dashboardMode.rolePartner .partnerCardInteractive {
  border: 1px solid var(--ap-ui-border);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(8, 22, 50, .94), rgba(2, 9, 25, .96));
  background-color: #020914;
  background-image: linear-gradient(145deg, rgba(8, 22, 50, .94), rgba(2, 9, 25, .96));
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 12px 30px rgba(0, 0, 0, .18);
}

body.dashboardMode.portalPartner .partnerCardInteractive:hover,
body.dashboardMode.portalPartner .partnerCardInteractive:focus,
body.dashboardMode.portalPartner .partnerCardInteractive:focus-visible,
body.dashboardMode.portalPartner .partnerCardInteractive:active,
body.dashboardMode.portalPartner .partnerCardInteractive.is-selected,
body.dashboardMode.rolePartner .partnerCardInteractive:hover,
body.dashboardMode.rolePartner .partnerCardInteractive:focus,
body.dashboardMode.rolePartner .partnerCardInteractive:focus-visible,
body.dashboardMode.rolePartner .partnerCardInteractive:active,
body.dashboardMode.rolePartner .partnerCardInteractive.is-selected {
  border-color: var(--ap-ui-border-strong);
  background: linear-gradient(145deg, rgba(3, 13, 34, .98), rgba(1, 7, 20, .98));
  background-color: #010714;
  background-image: linear-gradient(145deg, rgba(3, 13, 34, .98), rgba(1, 7, 20, .98));
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 16px 36px rgba(0, 0, 0, .24);
  outline: none;
}

body.dashboardMode.portalPartner .partnerCardInteractive.is-selected,
body.dashboardMode.rolePartner .partnerCardInteractive.is-selected {
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .08), 0 16px 36px rgba(0, 0, 0, .24);
}

@media (max-width: 820px) {
  body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomePremiumGrid {
    grid-template-columns: 1fr !important;
  }

  body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionCard {
    min-height: 180px !important;
    padding: var(--portal-space-lg) !important;
  }

  .partnerProfileOverviewHero,
  .partnerProfileInfoGrid {
    grid-template-columns: 1fr;
  }

  .partnerProfileStatus {
    justify-self: start;
  }

  body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardProgress,
  body.dashboardMode .partnerPortalStepper,
  .complaintWizardProgress,
  body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardSummaryRows {
    grid-template-columns: 1fr;
  }

  body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderEntryModeSelector,
  body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderModulePowerInputs {
    grid-template-columns: 1fr;
  }

  body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton,
  body.dashboardMode .partnerPortalStepperStep,
  .complaintWizardStepButton {
    justify-items: start;
    min-height: 48px;
    padding: 0 12px 0 46px;
    text-align: left;
  }

  body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton::before,
  body.dashboardMode .partnerPortalStepperStep::before,
  body.dashboardMode .partnerPortalStepperStep > span,
  .complaintWizardStepButton span {
    left: 20px;
    top: 50%;
  }

  body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton::after,
  body.dashboardMode .partnerPortalStepperStep::after,
  .complaintWizardStepButton::after {
    left: 20px;
    top: calc(50% + 18px);
    width: 2px;
    height: calc(100% - 34px);
  }

  .complaintWizardSummaryRows {
    grid-template-columns: 1fr;
  }

  body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardActions {
    justify-content: stretch;
  }

  body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardActions > button,
  .complaintWizardActions > button {
    flex: 1 1 100%;
  }

  body.dashboardMode.portalPartner #partnerComplaintForm .complaintWizardActions,
  body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardActions {
    grid-template-columns: 1fr 1fr !important;
  }

  body.dashboardMode.portalPartner #partnerComplaintForm .complaintWizardActions [data-complaint-action="list"],
  body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardActions [data-complaint-action="list"] {
    grid-column: 1 / -1;
  }

  body.dashboardMode.portalPartner #partnerComplaintForm #complaintWizardBackButton,
  body.dashboardMode.rolePartner #partnerComplaintForm #complaintWizardBackButton {
    grid-column: 1;
  }

  body.dashboardMode.portalPartner #partnerComplaintForm #complaintWizardNextButton,
  body.dashboardMode.portalPartner #partnerComplaintForm #complaintSubmitButton,
  body.dashboardMode.rolePartner #partnerComplaintForm #complaintWizardNextButton,
  body.dashboardMode.rolePartner #partnerComplaintForm #complaintSubmitButton {
    grid-column: 2;
  }
}

.complaintDangerActions,
.partnerOrderCalculationEditor {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.complaintDangerActions {
  justify-items: end;
}

.partnerOrderCalculationEditor {
  padding-top: 14px;
  border-top: 1px solid rgba(72, 159, 223, .18);
}

.partnerOrderCalculationEditorHead {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.partnerOrderCalculationEditorHead div {
  display: grid;
  gap: 4px;
}

.partnerOrderCalculationRows {
  display: grid;
  gap: 10px;
}

.partnerOrderCalculationRow {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) minmax(160px, 1fr) minmax(120px, .7fr) auto;
  gap: 10px;
  align-items: end;
  padding: 12px;
  border: 1px solid rgba(72, 159, 223, .18);
  border-radius: 14px;
  background: rgba(2, 12, 32, .42);
}

.partnerOrderCalculationRow label {
  display: grid;
  gap: 6px;
}

body.partnerComplaintWorkflowMode #partnerProjectsCards #partnerComplaintForm.partnerComplaintForm.ap-card {
  display: grid !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: var(--ap-gap-loose) !important;
  overflow: visible !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  background-color: transparent;
  background-image: none;
  box-shadow: none;
}

body.partnerComplaintWorkflowMode #partnerProjectsCards #partnerComplaintForm.partnerComplaintForm.ap-card::before {
  display: none !important;
}

body.partnerComplaintWorkflowMode #partnerProjectsCards #partnerComplaintForm.partnerComplaintForm.ap-card > * {
  position: relative;
  z-index: 1;
}

/* Portal design guardrail: no white/light-blue hover or selected card surfaces */
:is(
  .partnerProjectCard.partnerCardInteractive,
  .complaintProjectOption.partnerCardInteractive,
  .ap-card-interactive:not(.partnerHomeActionCard)
) {
  border-color: var(--ap-ui-border);
  background: linear-gradient(145deg, rgba(8, 22, 50, .94), rgba(2, 9, 25, .96));
  background-color: #020914;
  background-image: linear-gradient(145deg, rgba(8, 22, 50, .94), rgba(2, 9, 25, .96));
  color: var(--portal-text);
}

:is(
  .partnerProjectCard.partnerCardInteractive,
  .complaintProjectOption.partnerCardInteractive,
  .ap-card-interactive:not(.partnerHomeActionCard)
):is(:hover, :focus, :focus-visible, :active, .is-selected, [aria-selected="true"], [aria-current="true"]) {
  border-color: var(--ap-ui-border-strong);
  background: linear-gradient(145deg, rgba(3, 13, 34, .98), rgba(1, 7, 20, .98));
  background-color: #010714;
  background-image: linear-gradient(145deg, rgba(3, 13, 34, .98), rgba(1, 7, 20, .98));
  color: var(--portal-text);
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .06), 0 16px 36px rgba(0, 0, 0, .24);
  outline: none;
}

:is(
  .partnerProjectCard.partnerCardInteractive,
  .complaintProjectOption.partnerCardInteractive,
  .ap-card-interactive:not(.partnerHomeActionCard)
):is(:hover, :focus, :focus-visible, :active, .is-selected, [aria-selected="true"], [aria-current="true"]) * {
  background-color: transparent;
  background-image: none;
}

.partnerPortalStepper,
.complaintWizardProgress,
#partnerOrderForm .partnerOrderWizardProgress {
  background: rgba(2, 9, 25, .42);
  background-color: rgba(2, 9, 25, .42);
  background-image: none;
}

:is(
  .partnerPortalStepperStep,
  .complaintWizardStepButton,
  #partnerOrderForm .partnerOrderWizardStepButton
):is(:hover, :focus, :focus-visible, :active, .active, .isComplete, [aria-current="step"], [aria-current="true"]) {
  background: transparent;
  background-color: transparent;
  background-image: none;
  color: var(--portal-text);
  box-shadow: none;
}

:is(
  .partnerPortalStepperStep,
  .complaintWizardStepButton,
  #partnerOrderForm .partnerOrderWizardStepButton
):is(:hover, :focus, :focus-visible, :active, .active, .isComplete, [aria-current="step"], [aria-current="true"])::before,
:is(
  .partnerPortalStepperStep,
  .complaintWizardStepButton,
  #partnerOrderForm .partnerOrderWizardStepButton
):is(:hover, :focus, :focus-visible, :active, .active, .isComplete, [aria-current="step"], [aria-current="true"]) > span {
  border-color: rgba(72, 159, 223, .82);
  background: linear-gradient(145deg, rgba(13, 37, 80, .98), rgba(4, 16, 42, .98));
  background-color: #0d2550;
  background-image: linear-gradient(145deg, rgba(13, 37, 80, .98), rgba(4, 16, 42, .98));
  color: #fff;
  box-shadow: 0 0 0 4px rgba(2, 9, 25, .92), 0 0 22px rgba(72, 159, 223, .22);
}

body.dashboardMode.portalPartner .complaintProjectOption.partnerCardInteractive,
body.dashboardMode.rolePartner .complaintProjectOption.partnerCardInteractive {
  position: relative !important;
  min-height: 92px !important;
  padding: 18px 20px !important;
  gap: 9px !important;
  align-content: center !important;
  border-color: rgba(72, 159, 223, .22);
  border-radius: var(--portal-radius-card);
  background:
    radial-gradient(circle at 16% 0%, rgba(72, 159, 223, .14), transparent 36%),
    linear-gradient(145deg, rgba(8, 22, 50, .98), rgba(2, 9, 25, .95));
  background-color: #020914;
  background-image:
    radial-gradient(circle at 16% 0%, rgba(72, 159, 223, .14), transparent 36%),
    linear-gradient(145deg, rgba(8, 22, 50, .98), rgba(2, 9, 25, .95));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 14px 34px rgba(0, 0, 0, .2);
}

body.dashboardMode.portalPartner .complaintProjectOption.partnerCardInteractive strong,
body.dashboardMode.rolePartner .complaintProjectOption.partnerCardInteractive strong {
  color: var(--portal-text);
  font-size: 1.02rem !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
}

body.dashboardMode.portalPartner .complaintProjectOption.partnerCardInteractive span,
body.dashboardMode.rolePartner .complaintProjectOption.partnerCardInteractive span {
  color: rgba(201, 216, 234, .76);
  font-size: .9rem !important;
  font-weight: 650 !important;
  line-height: 1.4 !important;
}

body.dashboardMode.portalPartner .complaintProjectOption.partnerCardInteractive:hover,
body.dashboardMode.portalPartner .complaintProjectOption.partnerCardInteractive:focus,
body.dashboardMode.portalPartner .complaintProjectOption.partnerCardInteractive:focus-visible,
body.dashboardMode.portalPartner .complaintProjectOption.partnerCardInteractive:active,
body.dashboardMode.rolePartner .complaintProjectOption.partnerCardInteractive:hover,
body.dashboardMode.rolePartner .complaintProjectOption.partnerCardInteractive:focus,
body.dashboardMode.rolePartner .complaintProjectOption.partnerCardInteractive:focus-visible,
body.dashboardMode.rolePartner .complaintProjectOption.partnerCardInteractive:active {
  border-color: rgba(72, 159, 223, .46);
  background:
    radial-gradient(circle at 16% 0%, rgba(72, 159, 223, .18), transparent 36%),
    linear-gradient(145deg, rgba(5, 18, 45, .98), rgba(1, 7, 20, .98));
  background-color: #010714;
  background-image:
    radial-gradient(circle at 16% 0%, rgba(72, 159, 223, .18), transparent 36%),
    linear-gradient(145deg, rgba(5, 18, 45, .98), rgba(1, 7, 20, .98));
  box-shadow: 0 0 0 1px rgba(72, 159, 223, .16), inset 0 1px 0 rgba(255, 255, 255, .08), 0 18px 42px rgba(0, 0, 0, .28);
}

body.dashboardMode.portalPartner .complaintProjectOption.partnerCardInteractive.is-selected,
body.dashboardMode.portalPartner .complaintProjectOption.partnerCardInteractive.ap-card-selected,
body.dashboardMode.rolePartner .complaintProjectOption.partnerCardInteractive.is-selected,
body.dashboardMode.rolePartner .complaintProjectOption.partnerCardInteractive.ap-card-selected {
  border-color: rgba(72, 159, 223, .72);
  background:
    radial-gradient(circle at 16% 0%, rgba(72, 159, 223, .18), transparent 36%),
    linear-gradient(145deg, rgba(5, 18, 45, .98), rgba(1, 7, 20, .98));
  background-color: #010714;
  background-image:
    radial-gradient(circle at 16% 0%, rgba(72, 159, 223, .18), transparent 36%),
    linear-gradient(145deg, rgba(5, 18, 45, .98), rgba(1, 7, 20, .98));
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .24), inset 0 1px 0 rgba(255, 255, 255, .08), 0 20px 48px rgba(0, 0, 0, .3);
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintProjectPicker,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintProjectPicker {
  gap: 10px !important;
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintProjectPicker label,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintProjectPicker label {
  gap: 6px !important;
  color: rgba(201, 216, 234, .76);
  font-size: .82rem !important;
  font-weight: 800 !important;
}

body.dashboardMode.portalPartner #partnerComplaintForm #complaintProjectSearch,
body.dashboardMode.rolePartner #partnerComplaintForm #complaintProjectSearch {
  min-height: 44px !important;
  padding-block: 10px !important;
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintProjectResults,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintProjectResults {
  gap: 9px !important;
  max-height: 222px !important;
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintWizardActions,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardActions {
  display: grid !important;
  grid-template-columns: minmax(120px, max-content) 1fr max-content max-content;
  align-items: center !important;
  gap: var(--ap-gap-tight) !important;
  margin-top: var(--ap-space-0) !important;
  padding-top: var(--ap-space-2) !important;
  border-top: 1px solid rgba(72, 159, 223, .16);
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintWizardActions > button,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardActions > button {
  flex: initial !important;
  min-height: 44px !important;
  min-width: 0 !important;
  border-radius: 14px;
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintWizardActions [data-complaint-action="list"],
body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardActions [data-complaint-action="list"] {
  grid-column: 1;
  justify-self: start;
  padding-inline: var(--ap-space-3) !important;
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  color: rgba(201, 216, 234, .72);
}

body.dashboardMode.portalPartner #partnerComplaintForm #complaintWizardBackButton,
body.dashboardMode.rolePartner #partnerComplaintForm #complaintWizardBackButton {
  grid-column: 3;
  min-width: 112px !important;
  padding-inline: var(--ap-space-4) !important;
}

body.dashboardMode.portalPartner #partnerComplaintForm #complaintWizardNextButton,
body.dashboardMode.portalPartner #partnerComplaintForm #complaintSubmitButton,
body.dashboardMode.rolePartner #partnerComplaintForm #complaintWizardNextButton,
body.dashboardMode.rolePartner #partnerComplaintForm #complaintSubmitButton {
  grid-column: 4;
  min-width: 174px !important;
  padding-inline: var(--ap-space-5) !important;
}

body.dashboardMode.portalPartner #partnerComplaintForm #complaintWizardNextButton.hidden,
body.dashboardMode.portalPartner #partnerComplaintForm #complaintSubmitButton.hidden,
body.dashboardMode.rolePartner #partnerComplaintForm #complaintWizardNextButton.hidden,
body.dashboardMode.rolePartner #partnerComplaintForm #complaintSubmitButton.hidden {
  display: none !important;
}

body.dashboardMode.portalPartner .complaintProjectOption.partnerCardInteractive,
body.dashboardMode.rolePartner .complaintProjectOption.partnerCardInteractive {
  min-height: 86px !important;
  padding-right: 52px !important;
}

body.dashboardMode.portalPartner .complaintProjectOption.partnerCardInteractive::after,
body.dashboardMode.rolePartner .complaintProjectOption.partnerCardInteractive::after {
  content: none;
  position: absolute;
  right: 18px;
  top: 50%;
  display: inline-flex;
  width: 26px;
  height: 26px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(72, 159, 223, .22);
  border-radius: 999px;
  color: rgba(201, 216, 234, .66);
  font-size: .95rem;
  font-weight: 900;
  transform: translateY(-50%);
  transition: border-color .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease;
}

body.dashboardMode.portalPartner .complaintProjectOption.partnerCardInteractive:hover::after,
body.dashboardMode.portalPartner .complaintProjectOption.partnerCardInteractive:focus-visible::after,
body.dashboardMode.portalPartner .complaintProjectOption.partnerCardInteractive.is-selected::after,
body.dashboardMode.portalPartner .complaintProjectOption.partnerCardInteractive.ap-card-selected::after,
body.dashboardMode.rolePartner .complaintProjectOption.partnerCardInteractive:hover::after,
body.dashboardMode.rolePartner .complaintProjectOption.partnerCardInteractive:focus-visible::after,
body.dashboardMode.rolePartner .complaintProjectOption.partnerCardInteractive.is-selected::after,
body.dashboardMode.rolePartner .complaintProjectOption.partnerCardInteractive.ap-card-selected::after {
  border-color: rgba(72, 159, 223, .58);
  color: var(--portal-text);
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .12);
  transform: translate(2px, -50%);
}

/* Partner workflow focus: collapse project search after selection and reduce admin partner chrome. */
body.dashboardMode.portalPartner #partnerComplaintForm .complaintSelectedProjectSummary,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintSelectedProjectSummary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
  border: 1px solid rgba(72, 159, 223, .26);
  border-radius: var(--portal-radius-card);
  background:
    radial-gradient(circle at 16% 0%, rgba(72, 159, 223, .14), transparent 36%),
    linear-gradient(145deg, rgba(8, 22, 50, .94), rgba(2, 9, 25, .96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 14px 34px rgba(0, 0, 0, .18);
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintSelectedProjectSummary.hidden,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintSelectedProjectSummary.hidden {
  display: none !important;
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintSelectedProjectSummary > div,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintSelectedProjectSummary > div {
  display: grid;
  gap: 5px;
  min-width: 0;
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintSelectedProjectSummary span,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintSelectedProjectSummary span {
  color: rgba(201, 216, 234, .68);
  font-size: .74rem;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintSelectedProjectSummary strong,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintSelectedProjectSummary strong {
  overflow: hidden;
  color: var(--portal-text);
  font-size: 1.02rem;
  font-weight: 900;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintSelectedProjectSummary small,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintSelectedProjectSummary small {
  color: var(--portal-muted);
  font-size: .88rem;
  line-height: 1.35;
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintSelectedProjectSummary button,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintSelectedProjectSummary button {
  min-height: 38px !important;
  padding-inline: 14px !important;
  white-space: nowrap;
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintProjectPicker.has-selected-project,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintProjectPicker.has-selected-project {
  gap: 10px !important;
}

/* Partner complaint workflow phase 4: keep the stepper in the flow, not in a separate box. */
body.dashboardMode.portalPartner #partnerComplaintForm.partnerComplaintForm,
body.dashboardMode.rolePartner #partnerComplaintForm.partnerComplaintForm {
  gap: var(--ap-section-gap) !important;
}

body.dashboardMode.portalPartner #partnerComplaintForm .portalSurfaceHead,
body.dashboardMode.rolePartner #partnerComplaintForm .portalSurfaceHead {
  display: grid !important;
  gap: var(--ap-gap-tight) !important;
  max-width: min(840px, 100%) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode.portalPartner #partnerComplaintForm .portalSurfaceHead h3,
body.dashboardMode.rolePartner #partnerComplaintForm .portalSurfaceHead h3 {
  margin: 0 !important;
  color: var(--portal-text);
  font-size: clamp(1.8rem, 3vw, 2.55rem) !important;
  font-weight: 900 !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
}

body.dashboardMode.portalPartner #partnerComplaintForm .portalSurfaceHead .mutedText,
body.dashboardMode.rolePartner #partnerComplaintForm .portalSurfaceHead .mutedText {
  max-width: min(840px, 100%) !important;
  margin: 0 !important;
  color: var(--portal-muted);
  font-size: 1rem !important;
  line-height: 1.65 !important;
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintWizardStep,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardStep {
  position: relative !important;
  display: grid !important;
  overflow: visible !important;
  gap: var(--portal-space-md) !important;
  padding: calc(var(--portal-space-xl) + 10px) var(--portal-space-xl) var(--portal-space-xl) !important;
  border-color: rgba(72, 159, 223, .2);
  border-radius: var(--portal-radius-card);
  background:
    radial-gradient(circle at 8% 0%, rgba(72, 159, 223, .12), transparent 34%),
    linear-gradient(145deg, rgba(8, 22, 50, .72), rgba(2, 9, 25, .54));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07), 0 20px 52px rgba(0, 0, 0, .18);
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintWizardStep::before,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardStep::before {
  display: none !important;
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintWizardStepHead,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardStepHead {
  margin-bottom: var(--ap-space-2) !important;
  position: relative;
  z-index: 1;
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintWizardSummaryRows article,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardSummaryRows article {
  padding: var(--portal-space-md) !important;
  border-color: var(--portal-border);
  background: var(--portal-card);
  box-shadow: none;
}

body.dashboardMode.portalPartner #partnerComplaintForm .partnerPortalStepper,
body.dashboardMode.portalPartner #partnerComplaintForm .complaintWizardProgress,
body.dashboardMode.rolePartner #partnerComplaintForm .partnerPortalStepper,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardProgress {
  margin: 0 !important;
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintWizardProgress,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardProgress {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintWizardStep,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardStep {
  margin-top: 0 !important;
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintWizardStep.hidden,
body.dashboardMode.portalPartner #partnerComplaintForm .complaintWizardStep[hidden],
body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardStep.hidden,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardStep[hidden] {
  display: none !important;
}

body.dashboardMode.roleAdmin:is(.partnerComplaintWorkflowMode, .partnerOrderEntryMode) .dashboardHeadModern,
body.dashboardMode.roleAdmin:is(.partnerComplaintWorkflowMode, .partnerOrderEntryMode) .advisorCard {
  display: none !important;
}

body.dashboardMode.roleAdmin:is(.partnerComplaintWorkflowMode, .partnerOrderEntryMode) .adminImpersonationBanner {
  margin: 0 0 10px;
  padding: 8px 12px;
  border-radius: 12px;
  font-size: .82rem;
  line-height: 1.35;
}

@media (max-width: 760px) {
  body.dashboardMode.portalPartner #partnerComplaintForm .complaintSelectedProjectSummary,
  body.dashboardMode.rolePartner #partnerComplaintForm .complaintSelectedProjectSummary {
    grid-template-columns: 1fr;
  }

  body.dashboardMode.portalPartner #partnerComplaintForm .complaintSelectedProjectSummary button,
  body.dashboardMode.rolePartner #partnerComplaintForm .complaintSelectedProjectSummary button {
    justify-self: start;
  }
}

/* Sidebar V2: DESIGN FROZEN. Content-system selectors must stay scoped to .appContent. */
.ap-sidebar,
body.dashboardMode .appSidebar {
  border-color: rgba(72, 159, 223, .18);
  border-radius: 20px;
  background:
    radial-gradient(circle at 18% 0%, rgba(72, 159, 223, .11), transparent 34%),
    linear-gradient(180deg, rgba(8, 22, 50, .98), rgba(2, 9, 25, .96));
  box-shadow: 0 22px 58px rgba(2, 9, 25, .28), inset 0 1px 0 rgba(255, 255, 255, .08);
}

.ap-sidebar-section,
body.dashboardMode .sidebarSection {
  gap: var(--ap-space-1) !important;
}

body.dashboardMode .sidebarSection + .sidebarSection {
  margin-top: var(--ap-space-3) !important;
}

body.dashboardMode .sidebarSectionItems {
  gap: var(--ap-space-1) !important;
  padding-left: 0 !important;
}

.ap-sidebar-item,
body.dashboardMode .sidebarNavButton {
  position: relative !important;
  min-height: 34px !important;
  padding: var(--ap-space-2) var(--ap-space-3) var(--ap-space-2) var(--ap-space-5) !important;
  border: 0;
  border-radius: var(--ap-space-2);
  background: transparent;
  color: rgba(235, 243, 255, .7);
  box-shadow: none;
  font-size: .88rem !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  transform: none !important;
}

.ap-sidebar-item::before,
body.dashboardMode .sidebarNavButton::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 var(--ap-space-2);
  width: var(--ap-space-1);
  border-radius: var(--portal-radius-pill);
  background: transparent;
}

.ap-sidebar-item:hover,
.ap-sidebar-item:focus-visible,
body.dashboardMode .sidebarNavButton:hover,
body.dashboardMode .sidebarNavButton:focus-visible {
  border-color: transparent;
  background: rgba(255, 255, 255, .045);
  color: #ffffff;
  box-shadow: none;
  transform: none !important;
}

.ap-sidebar-item.isActive,
.ap-sidebar-item[aria-current="page"],
body.dashboardMode .sidebarNavButton.active,
body.dashboardMode .sidebarNavButton.isActive,
body.dashboardMode .sidebarNavButton[aria-current="page"] {
  border-color: transparent;
  background: rgba(8, 22, 50, .72);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055);
  transform: none !important;
}

.ap-sidebar-item.isActive::before,
.ap-sidebar-item[aria-current="page"]::before,
body.dashboardMode .sidebarNavButton.active::before,
body.dashboardMode .sidebarNavButton.isActive::before,
body.dashboardMode .sidebarNavButton[aria-current="page"]::before {
  background: rgba(72, 159, 223, .76);
  box-shadow: none;
}

body.dashboardMode .sidebarSectionTitleButton {
  min-height: 38px !important;
  padding: 0 var(--ap-space-2) !important;
  border-color: transparent;
  border-radius: 10px;
  background: transparent;
  box-shadow: none;
  color: rgba(255, 255, 255, .9);
  font-size: 1rem !important;
  font-weight: 400 !important;
}

body.dashboardMode .sidebarSectionTitleButton:hover,
body.dashboardMode .sidebarSectionTitleButton:focus-visible {
  border-color: transparent;
  background: rgba(255, 255, 255, .045);
  box-shadow: none;
  transform: none !important;
}

body.dashboardMode .sidebarSectionTitleButton.active,
body.dashboardMode .sidebarSectionTitleButton.isActive,
body.dashboardMode .sidebarSectionTitleButton[aria-current="page"] {
  border-color: transparent;
  background: rgba(72, 159, 223, .12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}

.ap-sidebar-search,
body.dashboardMode .sidebarCustomerSearch {
  gap: 8px !important;
  margin-top: 14px !important;
}

.ap-sidebar-search input,
body.dashboardMode .sidebarCustomerSearch input,
body .sidebarCustomerSearch input {
  min-height: 40px !important;
  border-color: rgba(72, 159, 223, .24);
  border-radius: 12px;
  background: rgba(2, 12, 32, .64);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
}

.ap-sidebar-search input:focus,
body.dashboardMode .sidebarCustomerSearch input:focus,
body .sidebarCustomerSearch input:focus {
  border-color: rgba(72, 159, 223, .64);
  background: rgba(4, 15, 38, .88);
  box-shadow: 0 0 0 3px rgba(72, 159, 223, .14), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.dashboardMode .sidebarCustomerSearchResultButton,
body .sidebarCustomerSearchResultButton,
body.dashboardMode .sidebarCustomerSearchResultButton:hover,
body .sidebarCustomerSearchResultButton:hover {
  background:
    linear-gradient(145deg, rgba(6, 18, 44, .94), rgba(2, 9, 25, .9));
  color: #ffffff;
}

body.dashboardMode .sidebarCustomerSearchResultButton:hover,
body .sidebarCustomerSearchResultButton:hover {
  border-color: rgba(72, 159, 223, .44);
  box-shadow: 0 16px 36px rgba(3, 9, 28, .24), inset 0 1px 0 rgba(255, 255, 255, .1);
}

.ap-sidebar-footer,
body.dashboardMode .sidebarFooter {
  gap: var(--ap-space-2) !important;
  margin-top: auto !important;
  padding-top: var(--ap-space-3) !important;
  border-top-color: rgba(72, 159, 223, .16);
}

body.dashboardMode .sidebarFooterRow {
  gap: var(--ap-space-2) !important;
  align-items: center !important;
}

body.dashboardMode .sidebarInlineLogoutButton,
body.dashboardMode .sidebarInlineAdminPortalButton {
  min-height: 34px !important;
  padding: var(--ap-space-2) var(--ap-space-3) !important;
  border: 0;
  border-radius: var(--ap-space-2);
  background: transparent;
  color: rgba(235, 243, 255, .72);
  box-shadow: none;
  font-size: .86rem !important;
  font-weight: 400 !important;
  transform: none !important;
}

body.dashboardMode .sidebarInlineLogoutButton:hover,
body.dashboardMode .sidebarInlineAdminPortalButton:hover,
body.dashboardMode .sidebarInlineLogoutButton:focus-visible,
body.dashboardMode .sidebarInlineAdminPortalButton:focus-visible {
  border-color: transparent;
  background: rgba(255, 255, 255, .045);
  color: #ffffff;
  box-shadow: none;
  transform: none !important;
}

body.dashboardMode .sidebarFooter .sidebarNotificationButton {
  min-width: 34px !important;
  min-height: 34px !important;
  padding: 0 var(--ap-space-2) !important;
  border-color: rgba(72, 159, 223, .14);
  border-radius: var(--ap-space-2);
  background: rgba(255, 255, 255, .035);
  box-shadow: none;
}

body.dashboardMode .sidebarFooter .sidebarNotificationButton:hover,
body.dashboardMode .sidebarFooter .sidebarNotificationButton:focus-visible {
  border-color: rgba(72, 159, 223, .24);
  background: rgba(255, 255, 255, .055);
  box-shadow: none;
}

body.dashboardMode.sidebarCollapsed .sidebarRail,
body.dashboardMode.sidebarCollapsed .appSidebar {
  width: 72px !important;
  min-width: 72px !important;
  max-width: 72px !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible !important;
}

body.dashboardMode.sidebarCollapsed .sidebarTop {
  display: grid !important;
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode.sidebarCollapsed .sidebarBrandTop,
body.dashboardMode.sidebarCollapsed .sidebarProfileCard,
body.dashboardMode.sidebarCollapsed .sidebarCustomerSearch,
body.dashboardMode.sidebarCollapsed .sidebarNav,
body.dashboardMode.sidebarCollapsed .sidebarFooter,
body.dashboardMode.sidebarCollapsed .sidebarNotificationWrap {
  display: none !important;
}

body.dashboardMode.sidebarCollapsed .sidebarControls {
  position: static !important;
  width: 42px !important;
  height: 42px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  pointer-events: auto !important;
}

body.dashboardMode.sidebarCollapsed .sidebarArrowButton {
  position: static !important;
  width: 42px !important;
  min-width: 42px !important;
  height: 42px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: 12px;
  background: rgba(8, 22, 50, .72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
  color: #ffffff;
  transform: none !important;
}

body.dashboardMode.sidebarCollapsed .sidebarArrowButton:hover,
body.dashboardMode.sidebarCollapsed .sidebarArrowButton:focus-visible {
  border-color: rgba(72, 159, 223, .52);
  background: rgba(12, 35, 72, .82);
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .12), inset 0 1px 0 rgba(255, 255, 255, .12);
}

/* Partner workflow focus mode: remove hero chrome while order/complaint workflows are active. */
body.dashboardMode:is(.partnerComplaintWorkflowMode, .partnerOrderEntryMode) .dashboardHeadModern,
body.dashboardMode:is(.partnerComplaintWorkflowMode, .partnerOrderEntryMode) .advisorCard {
  display: none !important;
}

body.dashboardMode:is(.partnerComplaintWorkflowMode, .partnerOrderEntryMode) .adminImpersonationBanner {
  margin: 0 0 8px !important;
  padding: 7px 11px !important;
  border-radius: 12px;
  font-size: .8rem !important;
  line-height: 1.3 !important;
}

body.dashboardMode:is(.partnerComplaintWorkflowMode, .partnerOrderEntryMode) .appContent {
  gap: 12px !important;
}

body.dashboardMode.partnerComplaintWorkflowMode #partnerProjectsPanel.reviewBox {
  position: relative !important;
  display: grid !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: var(--ap-space-6) !important;
  gap: var(--ap-gap-loose) !important;
  overflow: hidden !important;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-surface);
  background:
    radial-gradient(circle at 10% 0%, rgba(72, 159, 223, .18), transparent 34%),
    linear-gradient(145deg, rgba(255, 255, 255, .035), rgba(255, 255, 255, .012)),
    var(--portal-surface);
  box-shadow: var(--portal-shadow);
}

body.dashboardMode.partnerComplaintWorkflowMode #partnerProjectsPanel.reviewBox::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(72, 159, 223, .08), transparent 210px);
}

body.dashboardMode.partnerComplaintWorkflowMode #partnerProjectsPanel.reviewBox > * {
  position: relative;
  z-index: 1;
}

body.dashboardMode.partnerComplaintWorkflowMode #partnerProjectsCards.partnerProjectsCards {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  background-color: transparent;
  background-image: none;
  box-shadow: none;
}

body.dashboardMode.partnerComplaintWorkflowMode #partnerProjectsBackButton.linkButton {
  justify-self: start;
  width: auto !important;
  min-height: 44px;
  padding: 0 16px !important;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-control);
  background: var(--portal-card);
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode.partnerComplaintWorkflowMode #partnerProjectsBackButton.linkButton:hover,
body.dashboardMode.partnerComplaintWorkflowMode #partnerProjectsBackButton.linkButton:focus-visible {
  border-color: var(--portal-border-strong);
  background: rgba(10, 28, 60, .96);
  color: var(--portal-text);
}

body.dashboardMode.portalPartner #partnerComplaintForm #complaintWizardBackButton,
body.dashboardMode.rolePartner #partnerComplaintForm #complaintWizardBackButton {
  border-color: var(--portal-border);
  background: var(--portal-card);
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode.portalPartner #partnerComplaintForm #complaintWizardBackButton:not(:disabled):hover,
body.dashboardMode.portalPartner #partnerComplaintForm #complaintWizardBackButton:not(:disabled):focus-visible,
body.dashboardMode.rolePartner #partnerComplaintForm #complaintWizardBackButton:not(:disabled):hover,
body.dashboardMode.rolePartner #partnerComplaintForm #complaintWizardBackButton:not(:disabled):focus-visible {
  border-color: var(--portal-border-strong);
  background: rgba(10, 28, 60, .96);
}

body.dashboardMode .partnerPortalStepperStep.active::before,
body.dashboardMode .partnerPortalStepperStep.ap-step-active::before,
body.dashboardMode .partnerPortalStepperStep[aria-current="step"]::before,
body.dashboardMode .partnerPortalStepperStep.active > span,
body.dashboardMode .partnerPortalStepperStep.ap-step-active > span,
body.dashboardMode .partnerPortalStepperStep[aria-current="step"] > span {
  border-color: rgba(72, 159, 223, .92);
  background: linear-gradient(145deg, rgba(72, 159, 223, .92), rgba(20, 27, 77, .92));
  background-color: rgba(72, 159, 223, .92);
  background-image: linear-gradient(145deg, rgba(72, 159, 223, .92), rgba(20, 27, 77, .92));
  color: #fff;
  box-shadow: 0 0 0 4px rgba(2, 9, 25, .92), 0 0 24px rgba(72, 159, 223, .28);
}

body.dashboardMode .partnerPortalStepperStep.isComplete::before,
body.dashboardMode .partnerPortalStepperStep.isComplete > span {
  border-color: rgba(72, 159, 223, .74);
  background: rgba(13, 37, 80, .98);
  background-color: rgba(13, 37, 80, .98);
  background-image: none;
  color: #fff;
}

/* Form Controls V2: shared authenticated form controls use the same light,
   readable surface as the portal workspace. */
.ap-input,
.ap-select,
.ap-textarea,
body.dashboardMode :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  width: 100% !important;
  border: 1px solid rgba(72, 159, 223, .22);
  border-radius: 15px;
  background: rgba(255, 255, 255, .94);
  color: var(--portal-text-primary);
  -webkit-text-fill-color: var(--portal-text-primary);
  box-shadow: inset 0 1px 0 #ffffff, 0 8px 20px rgba(29, 76, 111, .05);
  font: inherit !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.ap-input,
.ap-select,
body.dashboardMode :is(input:not([type="checkbox"]):not([type="radio"]), select) {
  min-height: 50px !important;
  padding: 0 15px !important;
}

.ap-textarea,
body.dashboardMode textarea {
  min-height: 136px !important;
  padding: 14px 15px !important;
  line-height: 1.5 !important;
  resize: vertical;
}

.ap-select,
body.dashboardMode select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 42px !important;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--portal-text-secondary) 50%),
    linear-gradient(135deg, var(--portal-text-secondary) 50%, transparent 50%),
    none;
  background-position:
    calc(100% - 22px) 50%,
    calc(100% - 16px) 50%,
    0 0;
  background-size:
    6px 6px,
    6px 6px,
    100% 100%;
  background-repeat: no-repeat;
}

.ap-select option,
body.dashboardMode select option {
  background: #ffffff;
  color: var(--portal-text-primary);
  font-weight: 400;
}

.ap-input::placeholder,
.ap-textarea::placeholder,
body.dashboardMode :is(input, textarea)::placeholder {
  color: var(--portal-text-muted);
  font-weight: 400;
}

.ap-input:focus,
.ap-select:focus,
.ap-textarea:focus,
body.dashboardMode :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus {
  outline: none;
  border-color: rgba(72, 159, 223, .72);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  -webkit-text-fill-color: var(--portal-text-primary);
  box-shadow: var(--portal-focus-ring), var(--portal-shadow-sm);
}

.ap-select:focus,
body.dashboardMode select:focus {
  background-image:
    linear-gradient(45deg, transparent 50%, var(--portal-text-primary) 50%),
    linear-gradient(135deg, var(--portal-text-primary) 50%, transparent 50%),
    none;
}

/* Select V2: accessible portal listbox with a synchronized native form control. */
.ap-select-v2 {
  position: relative;
  width: 100%;
  min-width: 0;
}

.ap-select-v2-native {
  position: absolute !important;
  width: var(--ap-space-1) !important;
  height: var(--ap-space-1) !important;
  min-height: 0 !important;
  margin: calc(var(--ap-space-1) * -1) !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
  border: 0;
  white-space: nowrap !important;
}

.ap-select-v2-trigger {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  width: 100%;
  min-width: 0;
  min-height: var(--ap-control-height);
  padding: 0 var(--ap-space-3) 0 var(--ap-space-4);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-control);
  background: var(--ap-ui-control);
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
  font: inherit;
  font-weight: 750;
  text-align: left;
  cursor: pointer;
}

.ap-select-v2-trigger:hover {
  border-color: var(--portal-border-strong);
  background: rgba(8, 22, 50, .94);
  color: var(--portal-text);
}

.ap-select-v2-trigger:focus-visible,
.ap-select-v2-trigger.is-open {
  border-color: var(--portal-border-strong);
  background: var(--ap-ui-control);
  color: var(--portal-text);
  box-shadow: 0 0 0 var(--ap-space-1) rgba(72, 159, 223, .14), inset 0 1px 0 rgba(255, 255, 255, .1);
  outline: none;
}

.ap-select-v2-trigger:disabled {
  opacity: .52;
  cursor: not-allowed;
}

.ap-select-v2-value {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ap-select-v2-icon {
  display: grid;
  width: var(--ap-space-5);
  place-items: center;
  color: var(--portal-muted);
  font-size: 1rem;
  line-height: 1;
  transition: transform .16s ease;
}

.ap-select-v2-trigger.is-open .ap-select-v2-icon {
  transform: rotate(180deg);
}

.ap-select-v2-menu {
  position: fixed;
  z-index: var(--ap-z-popover);
  display: grid;
  gap: var(--ap-space-1);
  min-width: min(100%, 12rem);
  padding: var(--ap-space-2);
  overflow-y: auto;
  overscroll-behavior: contain;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-control);
  background: var(--ap-ui-surface-strong);
  color: var(--portal-text);
  box-shadow: 0 var(--ap-space-4) var(--ap-space-7) rgba(0, 0, 0, .32), inset 0 1px 0 rgba(255, 255, 255, .07);
  scrollbar-color: rgba(72, 159, 223, .48) transparent;
}

.ap-select-v2-menu[hidden] {
  display: none;
}

.ap-select-v2-option {
  position: relative;
  display: grid;
  min-height: var(--ap-space-7);
  align-content: center;
  gap: var(--ap-space-1);
  padding: var(--ap-space-2) var(--ap-space-3);
  border-radius: calc(var(--portal-radius-control) - var(--ap-space-1));
  background: transparent;
  color: var(--portal-muted);
  cursor: pointer;
}

.ap-select-v2-option:is(:hover, .is-active) {
  background: rgba(255, 255, 255, .05);
  color: var(--portal-text);
}

.ap-select-v2-option.is-selected {
  padding-left: var(--ap-space-4);
  background: rgba(72, 159, 223, .12);
  color: var(--portal-text);
}

.ap-select-v2-option.is-selected::before {
  content: "";
  position: absolute;
  inset: var(--ap-space-2) auto var(--ap-space-2) 0;
  width: var(--ap-space-1);
  border-radius: var(--portal-radius-pill);
  background: var(--portal-accent);
}

.ap-select-v2-option.is-disabled {
  opacity: .44;
  cursor: not-allowed;
}

.ap-select-v2-option.is-disabled:hover {
  background: transparent;
  color: var(--portal-muted);
}

.ap-select-v2-option-label {
  color: inherit;
  font-size: .86rem;
  font-weight: 800;
  line-height: 1.25;
}

.ap-select-v2-option-meta {
  color: var(--portal-muted);
  font-size: .72rem;
  font-weight: 600;
  line-height: 1.3;
}

.ap-select-v2-empty {
  margin: 0;
  padding: var(--ap-space-3);
  color: var(--portal-muted);
  font-size: .82rem;
  text-align: center;
}

body.dashboardMode :is(
  .loginForm,
  .recommendationForm,
  .noticeBox,
  .adminAccountForm,
  .profileEditor,
  .formGrid,
  .partnerPriceRuleGrid,
  .partnerComplaintForm,
  #partnerOrderForm,
  #partnerOrderDetailForm,
  #partnerComplaintMessageForm,
  #partnerComplaintAttachmentForm
) > label:not(.adminPermissionCheck):not(.adminPermissionToggle),
body.dashboardMode :is(.partnerOrderWizardStep, .complaintWizardStep) label {
  gap: 9px !important;
  color: rgba(235, 243, 255, .84);
  font-size: .83rem !important;
  font-weight: 850 !important;
  letter-spacing: .01em !important;
}

/* Portal-wide Design System V2 audit alignment.
   Final layer: keep legacy portal areas on the same visual language as the partner order workflow. */
body.dashboardMode :is(
  #choiceView.panel,
  #loginView.panel,
  #forgotView.panel,
  #accountView.panel,
  #detailView.panel,
  #helpView.panel,
  #passwordView.panel,
  #confirmView.panel,
  #partnerOrderView.portalSurface,
  #partnerProjectsPanel.reviewBox,
  #partnerOrderDetailBox.reviewBox,
  #partnerAdminDetailBox.reviewBox,
  #customerDetailBox.reviewBox,
  #reviewBox.reviewBox,
  #partnerProfileOverview.portalSurface,
  #adminAccountsPanel.recommendationForm,
  #accountingPanel.recommendationForm,
  #accountingSettingsPanel.recommendationForm,
  #emailAutomationPanel.recommendationForm,
  #reonicOrdersPanel.recommendationForm,
  #reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record),
  #adminStatisticsPanel.statisticsPanel,
  #partnerAdminOverviewPanel,
  #partnerAdminEditForm.recommendationForm,
  #adminEmployeeEditForm.recommendationForm,
  #customerProfileEditForm.recommendationForm,
  #recommendationForm.recommendationForm,
  #customerAccessForm.noticeBox,
  #customerEmailForm.noticeBox,
  .customerActionBox.ap-card,
  .noticeBox.ap-card,
  .reviewBox.ap-card,
  .recommendationForm.ap-card,
  .portalSurface.ap-card
) {
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-surface);
  background:
    radial-gradient(circle at 10% 0%, rgba(72, 159, 223, .18), transparent 34%),
    linear-gradient(145deg, rgba(255, 255, 255, .035), rgba(255, 255, 255, .012)),
    var(--portal-surface);
  color: var(--portal-text);
  box-shadow: var(--portal-shadow);
}

body.dashboardMode :is(
  #choiceView.panel,
  #loginView.panel,
  #forgotView.panel,
  #accountView.panel,
  #detailView.panel,
  #helpView.panel,
  #passwordView.panel,
  #confirmView.panel,
  #partnerProjectsPanel.reviewBox,
  #partnerOrderDetailBox.reviewBox,
  #partnerAdminDetailBox.reviewBox,
  #customerDetailBox.reviewBox,
  #reviewBox.reviewBox,
  #adminAccountsPanel.recommendationForm,
  #accountingPanel.recommendationForm,
  #accountingSettingsPanel.recommendationForm,
  #emailAutomationPanel.recommendationForm,
  #reonicOrdersPanel.recommendationForm,
  #reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record),
  #adminStatisticsPanel.statisticsPanel,
  #partnerAdminEditForm.recommendationForm,
  #adminEmployeeEditForm.recommendationForm,
  #customerProfileEditForm.recommendationForm,
  #recommendationForm.recommendationForm,
  #customerAccessForm.noticeBox,
  #customerEmailForm.noticeBox
)::before {
  content: "";
  position: absolute;
  inset: var(--ap-space-0);
  pointer-events: none;
  background: linear-gradient(180deg, rgba(72, 159, 223, .08), transparent calc(var(--ap-space-8) + var(--ap-space-8) + var(--ap-space-8) + var(--ap-space-8)));
}

body.dashboardMode :is(
  #choiceView.panel,
  #loginView.panel,
  #forgotView.panel,
  #accountView.panel,
  #detailView.panel,
  #helpView.panel,
  #passwordView.panel,
  #confirmView.panel,
  #partnerProjectsPanel.reviewBox,
  #partnerOrderDetailBox.reviewBox,
  #partnerAdminDetailBox.reviewBox,
  #customerDetailBox.reviewBox,
  #reviewBox.reviewBox,
  #adminAccountsPanel.recommendationForm,
  #accountingPanel.recommendationForm,
  #accountingSettingsPanel.recommendationForm,
  #emailAutomationPanel.recommendationForm,
  #reonicOrdersPanel.recommendationForm,
  #reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record),
  #adminStatisticsPanel.statisticsPanel,
  #partnerAdminEditForm.recommendationForm,
  #adminEmployeeEditForm.recommendationForm,
  #customerProfileEditForm.recommendationForm,
  #recommendationForm.recommendationForm,
  #customerAccessForm.noticeBox,
  #customerEmailForm.noticeBox
) > * {
  position: relative;
  z-index: 1;
}

body.dashboardMode :is(
  .tableWrap:not(.reonicKanbanWrap),
  .statisticsContent,
  .statisticsTableWrap,
  .accountingSummary,
  .accountingList,
  .emailAutomationList,
  .adminAccountsLayout,
  .partnerAdminStatsGrid,
  .partnerAdminOrdersList,
  .partnerProjectsMapPanel,
  .montageCalendarShell,
  .montageCalendarGrid,
  .montageCalendarAgenda,
  .partnerOrderDetailPanel,
  .partnerOrderAttachmentsSection,
  .chatBox,
  .complaintWizardStep,
  .partnerOrderWizardStep,
  .complaintWizardSummaryRows article,
  .partnerOrderWizardSummaryRows article
) {
  border: 1px solid rgba(72, 159, 223, .2);
  border-radius: var(--portal-radius-card);
  background:
    linear-gradient(145deg, rgba(8, 22, 50, .72), rgba(2, 9, 25, .58));
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07), 0 20px 52px rgba(0, 0, 0, .18);
}

body.dashboardMode :is(
  .adminMetric,
  .statCard,
  .kpiCard,
  .billingCard,
  .partnerProjectCard,
  .partnerAdminOverviewCard,
  .partnerAdminOrderButton,
  .projectCard,
  .customerCard,
  .emailAutomationItem,
  .emailAutomationCard,
  .accountingInvoiceCard,
  .reonicOptionCard,
  .reonicDocumentCard,
  .protocolDocumentItem,
  .calendarCheckCard,
  .upcomingAppointmentCard,
  .partnerOrderAppointmentCard,
  .partnerOrderImageCard,
  .partnerOrderFileCard,
  .complaintProjectOption,
  .partnerProjectsHeader,
  .clickableRow
) {
  border: 1px solid rgba(72, 159, 223, .24);
  border-radius: var(--portal-radius-card);
  background:
    linear-gradient(145deg, rgba(8, 22, 50, .9), rgba(2, 9, 25, .82));
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 14px 34px rgba(0, 0, 0, .18);
}

body.dashboardMode :is(
  .adminMetric,
  .statCard,
  .billingCard,
  .partnerProjectCard,
  .partnerAdminOrderButton,
  .emailAutomationItem,
  .emailAutomationCard,
  .accountingInvoiceCard,
  .reonicOptionCard,
  .reonicDocumentCard,
  .protocolDocumentItem,
  .calendarCheckCard,
  .upcomingAppointmentCard,
  .partnerOrderAppointmentCard,
  .complaintProjectOption,
  .clickableRow
):is(:hover, :focus, :focus-visible, :active, .active, .is-selected, .ap-card-selected) {
  border-color: var(--portal-border-strong);
  background:
    linear-gradient(145deg, rgba(6, 20, 51, .96), rgba(1, 7, 20, .96));
  color: var(--portal-text);
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .16), 0 18px 44px rgba(0, 0, 0, .24), inset 0 1px 0 rgba(255, 255, 255, .09);
  outline: none;
}

body.dashboardMode .tableWrap {
  padding: var(--ap-space-0) !important;
  overflow: hidden !important;
}

body.dashboardMode .tableWrap table,
body.dashboardMode .projectListTable,
body.dashboardMode .statisticsTable,
body.dashboardMode .reonicTable {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: var(--ap-space-0) !important;
  color: var(--portal-text);
  background: transparent;
}

body.dashboardMode :is(.tableWrap, .statisticsTableWrap) :is(thead, th) {
  color: rgba(228, 239, 252, .86);
  background: rgba(2, 9, 25, .72);
  font-size: .78rem !important;
  font-weight: 850 !important;
  letter-spacing: .01em !important;
}

body.dashboardMode :is(.tableWrap, .statisticsTableWrap) :is(th, td) {
  border-bottom: 1px solid rgba(72, 159, 223, .14);
  color: var(--portal-text);
}

body.dashboardMode :is(.tableWrap, .statisticsTableWrap) tbody tr {
  background: rgba(2, 9, 25, .34);
  transition: background .16s ease, box-shadow .16s ease, color .16s ease;
}

body.dashboardMode :is(.tableWrap, .statisticsTableWrap) tbody tr:hover {
  background: rgba(8, 22, 50, .78);
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 0 0 1px rgba(72, 159, 223, .12);
}

body.dashboardMode .tableWrap.reonicTableWrap {
  padding: var(--ap-space-0) !important;
  border: 0;
  background: transparent;
  box-shadow: none;
  overflow-x: auto !important;
  overflow-y: visible !important;
}

body.dashboardMode .tableWrap.reonicTableWrap::before {
  display: none !important;
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable {
  display: block !important;
  width: 100% !important;
  min-width: 980px;
  border-collapse: separate !important;
  border-spacing: var(--ap-space-0) !important;
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable thead,
body.dashboardMode .tableWrap.reonicTableWrap .reonicTable tbody {
  display: grid !important;
  gap: var(--ap-gap-default) !important;
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable thead tr,
body.dashboardMode .tableWrap.reonicTableWrap .reonicTable tbody tr {
  display: grid !important;
  grid-template-columns: minmax(360px, 1.25fr) minmax(300px, .95fr) minmax(140px, .34fr) minmax(170px, .42fr);
  align-items: center;
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable thead tr {
  border: 1px solid rgba(72, 159, 223, .14);
  border-radius: var(--ap-radius-md);
  background: rgba(2, 9, 25, .58);
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable th {
  display: flex !important;
  align-items: center;
  width: auto !important;
  min-width: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  white-space: nowrap;
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable th {
  padding: var(--ap-space-2) var(--ap-space-5) var(--ap-space-3) !important;
  color: rgba(228, 239, 252, .74);
  font-size: .78rem !important;
  font-weight: 900 !important;
  text-transform: uppercase;
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable .tableSortButton {
  min-height: auto !important;
  padding: var(--ap-space-0) !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: rgba(228, 239, 252, .86);
  box-shadow: none;
  text-transform: uppercase;
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable .tableSortButton:hover,
body.dashboardMode .tableWrap.reonicTableWrap .reonicTable .tableSortButton:focus,
body.dashboardMode .tableWrap.reonicTableWrap .reonicTable .tableSortButton:focus-visible {
  border: 0;
  background: transparent;
  color: #ffffff;
  box-shadow: none;
  outline: none;
  transform: none !important;
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable tbody tr {
  overflow: hidden;
  border: 1px solid rgba(72, 159, 223, .22);
  border-radius: var(--ap-radius-lg);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, .08), rgba(72, 159, 223, .035)),
    rgba(5, 18, 46, .76);
  box-shadow: none;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable tbody tr:hover {
  border-color: rgba(72, 159, 223, .46);
  background:
    linear-gradient(145deg, rgba(72, 159, 223, .18), rgba(255, 255, 255, .045)),
    rgba(8, 24, 58, .9);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 18px 44px rgba(72, 159, 223, .12);
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable tbody td {
  display: flex !important;
  align-items: center;
  width: auto !important;
  min-width: 0;
  border: 0;
  background: transparent;
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable tbody td:first-child strong {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable tbody td:first-child {
  border-radius: var(--ap-radius-lg) 0 0 var(--ap-radius-lg);
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable tbody td:last-child {
  border-radius: 0 var(--ap-radius-lg) var(--ap-radius-lg) 0;
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable tbody tr:hover td {
  background: transparent;
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable .reonicModuleStatus {
  justify-content: center;
  min-width: 170px;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.dashboardMode :is(
  .primaryButton,
  .secondaryButton,
  .ghostButton,
  .bigInviteButton,
  .compactActionButton,
  .reviewButton,
  .billingActionButton,
  .adminActionButton,
  .mapFilterButton,
  .uploadButton,
  .tableSortButton,
  .ap-button-primary,
  .ap-button-secondary
) {
  min-height: calc(var(--ap-space-6) + var(--ap-space-3)) !important;
  border-radius: var(--portal-radius-control);
  font-weight: 800 !important;
  letter-spacing: 0 !important;
}

body.dashboardMode :is(
  .secondaryButton,
  .ghostButton,
  .compactActionButton,
  .reviewButton,
  .billingActionButton,
  .adminActionButton,
  .mapFilterButton,
  .tableSortButton,
  .ap-button-secondary
) {
  border: 1px solid var(--portal-border);
  background: var(--portal-card);
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode :is(
  .primaryButton,
  .bigInviteButton,
  .ap-button-primary
) {
  border: 1px solid rgba(101, 189, 255, .5);
  background: var(--ap-ui-button);
  color: var(--portal-text);
  box-shadow: 0 14px 30px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .16);
}

body.dashboardMode :is(
  .primaryButton,
  .secondaryButton,
  .ghostButton,
  .bigInviteButton,
  .compactActionButton,
  .reviewButton,
  .billingActionButton,
  .adminActionButton,
  .mapFilterButton,
  .uploadButton,
  .tableSortButton,
  .ap-button-primary,
  .ap-button-secondary
):is(:hover, :focus-visible) {
  border-color: var(--portal-border-strong);
  color: var(--portal-text);
  box-shadow: 0 0 0 var(--ap-space-1) rgba(72, 159, 223, .14), 0 18px 42px rgba(3, 9, 28, .3), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.dashboardMode :is(.dangerButton, .ap-button-danger, .dangerSoftButton) {
  border: 1px solid rgba(255, 112, 112, .46);
  border-radius: var(--portal-radius-control);
  background: linear-gradient(135deg, rgba(176, 43, 43, .92), rgba(92, 18, 30, .88));
  color: #fff;
  box-shadow: 0 14px 30px rgba(176, 43, 43, .18), inset 0 1px 0 rgba(255, 255, 255, .14);
}

body.dashboardMode :is(
  .portalUploadDropzone,
  .ap-upload,
  .preparationDropZone,
  .chatAttachmentField,
  .partnerOrderUploadArea
) {
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: var(--portal-radius-card);
  background:
    linear-gradient(145deg, rgba(8, 22, 50, .9), rgba(2, 9, 25, .74));
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07);
}

body.dashboardMode :is(
  .portalUploadDropzone,
  .ap-upload,
  .preparationDropZone,
  .chatAttachmentField,
  .partnerOrderUploadArea
):is(:hover, :focus-within) {
  border-color: var(--portal-border-strong);
  background:
    linear-gradient(145deg, rgba(6, 20, 51, .96), rgba(1, 7, 20, .9));
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .12), inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode :is(.empty, .emptyState, .adminAccountEmptyState) {
  padding: var(--ap-space-5) !important;
  border: 1px solid rgba(72, 159, 223, .2);
  border-radius: var(--portal-radius-card);
  background: rgba(2, 9, 25, .42);
  color: var(--portal-muted);
}

body.dashboardMode :is(h2, h3, h4) {
  color: var(--portal-text);
  letter-spacing: 0 !important;
}

body.dashboardMode :is(.step, .partnerProjectLabel, .partnerProjectSortableLabel, .partnerProjectLabelInline) {
  color: rgba(235, 243, 255, .84);
  font-weight: 850 !important;
  letter-spacing: .01em !important;
}

body.dashboardMode :is(.mutedText, small, .tableSubtext, .partnerProjectField span) {
  color: var(--portal-muted);
}

body.dashboardMode #partnerComplaintForm .complaintWizardStepButton:is(.active, .ap-step-active, [aria-current="step"])::before,
body.dashboardMode #partnerComplaintForm .complaintWizardStepButton:is(.active, .ap-step-active, [aria-current="step"]) > span {
  content: counter(partner-complaint-step) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: absolute !important;
  z-index: 1 !important;
  left: 50% !important;
  top: 16px !important;
  width: 30px !important;
  height: 30px !important;
  border: 2px solid rgba(72, 159, 223, .92);
  border-radius: 999px;
  background: linear-gradient(145deg, rgba(72, 159, 223, .92), rgba(20, 27, 77, .92));
  background-color: rgba(72, 159, 223, .92);
  background-image: linear-gradient(145deg, rgba(72, 159, 223, .92), rgba(20, 27, 77, .92));
  color: #fff;
  box-shadow: 0 0 0 4px rgba(2, 9, 25, .92), 0 0 24px rgba(72, 159, 223, .28);
  transform: translate(-50%, -50%) !important;
}

/* Admin montage calendar V2: one premium surface, compact controls, six-day work week. */
body.dashboardMode #montageCalendarPanel.montageCalendarPanel {
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #montageCalendarPanel .montageCalendarShell.portalSurface {
  display: grid !important;
  gap: var(--ap-gap-default) !important;
  padding: var(--ap-surface-padding) !important;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-hero);
  background:
    radial-gradient(circle at 14% 0%, rgba(72, 159, 223, .2), transparent 34%),
    linear-gradient(145deg, rgba(7, 21, 48, .96), rgba(1, 7, 20, .98));
  color: var(--portal-text);
  box-shadow: var(--portal-shadow), var(--portal-glow);
  overflow: hidden !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarHero,
body.dashboardMode #montageCalendarPanel .montageCalendarToolbar,
body.dashboardMode #montageCalendarPanel #montageCalendarGrid.montageCalendarGrid {
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #montageCalendarPanel .montageCalendarHero {
  display: flex !important;
  align-items: end !important;
  justify-content: space-between !important;
  gap: var(--ap-gap-default) !important;
  min-height: 0 !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarHero h3 {
  margin: 0 0 var(--ap-space-2) !important;
  font-size: clamp(30px, 4.2vw, 54px) !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarHero .mutedText {
  max-width: 68ch !important;
  margin: 0 !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarActions,
body.dashboardMode #montageCalendarPanel .montageCalendarToolbar {
  display: flex !important;
  align-items: center !important;
  gap: var(--ap-gap-tight) !important;
  flex-wrap: wrap !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarToolbar {
  justify-content: flex-start !important;
  padding-block: var(--ap-space-2) !important;
  border-block: 1px solid rgba(72, 159, 223, .16);
}

body.dashboardMode #montageCalendarPanel .montageCalendarToolbar > strong {
  flex: 1 1 24ch !important;
  min-width: 18ch !important;
  color: var(--portal-text);
  font-size: clamp(18px, 2vw, 24px) !important;
  line-height: 1.2 !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarViewSwitch {
  display: inline-flex !important;
  gap: var(--ap-space-1) !important;
  padding: var(--ap-space-1) !important;
  border: 1px solid rgba(72, 159, 223, .2);
  border-radius: var(--portal-radius-pill);
  background: rgba(2, 9, 25, .46);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

body.dashboardMode #montageCalendarPanel .montageCalendarViewSwitch button {
  min-height: calc(var(--ap-space-6) + var(--ap-space-2)) !important;
  padding-inline: var(--ap-space-4) !important;
  border-radius: var(--portal-radius-pill);
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #montageCalendarPanel .montageCalendarViewSwitch button.active {
  border-color: rgba(72, 159, 223, .58);
  background: var(--ap-ui-button);
  color: var(--portal-text);
  box-shadow: 0 12px 28px rgba(72, 159, 223, .18), inset 0 1px 0 rgba(255, 255, 255, .12);
}

body.dashboardMode #montageCalendarPanel .montageCalendarNewEventToggle {
  margin-left: auto !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarEventForm.hidden {
  display: none !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarEventForm {
  display: grid !important;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, .72fr) !important;
  gap: var(--ap-gap-default) !important;
  align-items: end !important;
  padding: var(--ap-card-padding) !important;
  border: 1px solid rgba(72, 159, 223, .18);
  border-radius: var(--portal-radius-card);
  background: rgba(2, 9, 25, .42);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

body.dashboardMode #montageCalendarPanel .montageCalendarFormHead {
  display: grid !important;
  gap: var(--ap-space-1) !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarFormHead span {
  color: var(--portal-muted);
}

body.dashboardMode #montageCalendarPanel .montageCalendarEventForm label {
  display: grid !important;
  gap: var(--ap-space-2) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: rgba(235, 243, 255, .84);
  font-weight: 850 !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarEventForm .fullWidth {
  grid-column: span 2 !important;
}

body.dashboardMode #montageCalendarPanel #montageCalendarGrid.montageCalendarGrid {
  min-height: 0 !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarWeek {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: var(--ap-gap-tight) !important;
  width: 100% !important;
  overflow: visible !important;
  padding: 0 !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarWeekColumn {
  display: grid !important;
  align-content: start !important;
  gap: var(--ap-gap-tight) !important;
  min-height: clamp(300px, 34vw, 480px) !important;
  padding: var(--ap-space-3) !important;
  border: 1px solid rgba(72, 159, 223, .16);
  border-radius: var(--portal-radius-card);
  background: rgba(2, 9, 25, .34);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}

body.dashboardMode #montageCalendarPanel .montageCalendarWeekColumn header {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: var(--ap-space-2) !important;
  margin: 0 !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarWeekColumn header span,
body.dashboardMode #montageCalendarPanel .montageCalendarWeekColumn header strong {
  white-space: nowrap !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarWeekColumn > div {
  display: grid !important;
  gap: var(--ap-gap-tight) !important;
  min-width: 0 !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarEventCard {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: var(--ap-space-2) var(--ap-space-3) !important;
  min-width: 0 !important;
  padding: var(--ap-space-3) !important;
  border: 1px solid rgba(72, 159, 223, .22);
  border-left: 3px solid rgba(72, 159, 223, .82);
  border-radius: var(--portal-radius-control);
  background: linear-gradient(145deg, rgba(8, 22, 50, .86), rgba(2, 9, 25, .8));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

body.dashboardMode #montageCalendarPanel .montageCalendarEventCard:is(:hover, :focus-within) {
  border-color: rgba(72, 159, 223, .56);
  border-left-color: rgba(101, 189, 255, .94);
  background: linear-gradient(145deg, rgba(13, 37, 80, .92), rgba(2, 9, 25, .9));
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .12), 0 18px 42px rgba(3, 9, 28, .24), inset 0 1px 0 rgba(255, 255, 255, .1);
  transform: translateY(-1px) !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarEventMeta,
body.dashboardMode #montageCalendarPanel .montageCalendarEventBody {
  grid-column: 1 / -1 !important;
  min-width: 0 !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarEventMeta {
  display: flex !important;
  align-items: center !important;
  gap: var(--ap-space-2) !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarTypeBadge {
  display: inline-flex !important;
  align-items: center !important;
  min-height: calc(var(--ap-space-5) + var(--ap-space-1)) !important;
  padding-inline: var(--ap-space-3) !important;
  border: 1px solid rgba(72, 159, 223, .26);
  border-radius: var(--portal-radius-pill);
  background: rgba(72, 159, 223, .14);
  color: rgba(235, 243, 255, .88);
}

body.dashboardMode #montageCalendarPanel .montageCalendarEventBody {
  display: grid !important;
  gap: var(--ap-space-1) !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarEventBody strong,
body.dashboardMode #montageCalendarPanel .montageCalendarEventBody span,
body.dashboardMode #montageCalendarPanel .montageCalendarEventBody small,
body.dashboardMode #montageCalendarPanel .montageCalendarEventMeta b,
body.dashboardMode #montageCalendarPanel .montageCalendarEventMeta small {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.dashboardMode #montageCalendarPanel .montageCalendarCustomerLink,
body.dashboardMode #montageCalendarPanel .montageCalendarCustomerLink:hover,
body.dashboardMode #montageCalendarPanel .montageCalendarCustomerLink:focus-visible {
  justify-self: start !important;
  width: auto !important;
  min-height: 44px;
  padding-inline: var(--ap-space-3) !important;
  border: 1px solid rgba(72, 159, 223, .24);
  border-radius: var(--portal-radius-pill);
  background: rgba(2, 9, 25, .38);
  color: var(--portal-text);
  box-shadow: none;
  font-size: .82rem !important;
  text-decoration: none;
}

@media (max-width: 920px) {
  body.dashboardMode #montageCalendarPanel .montageCalendarHero,
  body.dashboardMode #montageCalendarPanel .montageCalendarToolbar {
    align-items: stretch !important;
    flex-direction: column !important;
  }

  body.dashboardMode #montageCalendarPanel .montageCalendarNewEventToggle {
    margin-left: 0 !important;
  }

  body.dashboardMode #montageCalendarPanel .montageCalendarEventForm,
  body.dashboardMode #montageCalendarPanel .montageCalendarWeek {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.dashboardMode #montageCalendarPanel .montageCalendarEventForm .fullWidth {
    grid-column: auto !important;
  }

  body.dashboardMode #montageCalendarPanel .montageCalendarWeekColumn {
    min-height: 0 !important;
  }
}

body.dashboardMode #accountingPanel.hidden,
body.dashboardMode #accountingSettingsPanel.hidden {
  display: none !important;
}

/* Accounting V2: compact ERP-style invoice overview without nested cards. */
body.dashboardMode #accountingPanel.recommendationForm:not(.hidden) {
  display: grid !important;
  gap: var(--ap-gap-default) !important;
  padding: var(--ap-surface-padding) !important;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-hero);
  background:
    radial-gradient(circle at 12% 0%, rgba(72, 159, 223, .2), transparent 34%),
    linear-gradient(145deg, rgba(7, 21, 48, .96), rgba(1, 7, 20, .98));
  color: var(--portal-text);
  box-shadow: var(--portal-shadow), var(--portal-glow);
}

body.dashboardMode #accountingPanel .formHead {
  align-items: end !important;
  gap: var(--ap-gap-default) !important;
  margin: 0 !important;
}

body.dashboardMode #accountingPanel .formHead h3 {
  margin: 0 !important;
  font-size: clamp(30px, 4.2vw, 54px) !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

body.dashboardMode #accountingPanel .accountingSummary {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: var(--ap-gap-tight) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #accountingPanel .accountingMetric {
  display: grid !important;
  align-content: center !important;
  gap: var(--ap-space-1) !important;
  min-height: 0 !important;
  padding: var(--ap-space-4) !important;
  border: 1px solid rgba(72, 159, 223, .18);
  border-radius: var(--portal-radius-card);
  background: rgba(2, 9, 25, .38);
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
  transform: none !important;
}

body.dashboardMode #accountingPanel .accountingMetric:hover {
  border-color: rgba(72, 159, 223, .3);
  background: rgba(5, 17, 42, .54);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07);
}

body.dashboardMode #accountingPanel .accountingMetric span,
body.dashboardMode #accountingPanel .accountingMetric small {
  color: var(--portal-muted);
  font-size: .84rem !important;
  line-height: 1.25 !important;
}

body.dashboardMode #accountingPanel .accountingMetric strong {
  color: var(--portal-text);
  font-size: clamp(22px, 2.4vw, 32px) !important;
  line-height: 1.05 !important;
}

body.dashboardMode #accountingPanel .accountingList {
  display: grid !important;
  gap: var(--ap-gap-tight) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #accountingPanel .accountingInvoiceCard {
  display: grid !important;
  grid-template-columns: minmax(24ch, 1.5fr) minmax(16ch, .8fr) auto !important;
  align-items: center !important;
  gap: var(--ap-gap-default) !important;
  min-width: 0 !important;
  padding: var(--ap-space-4) !important;
  border: 1px solid rgba(72, 159, 223, .18);
  border-radius: var(--portal-radius-card);
  background: linear-gradient(145deg, rgba(8, 22, 50, .78), rgba(2, 9, 25, .72));
  color: var(--portal-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
}

body.dashboardMode #accountingPanel .accountingInvoiceCard:is(:hover, :focus-within) {
  border-color: rgba(72, 159, 223, .42);
  background: linear-gradient(145deg, rgba(12, 33, 73, .84), rgba(2, 9, 25, .8));
  box-shadow: 0 0 0 2px rgba(72, 159, 223, .1), 0 18px 42px rgba(3, 9, 28, .2), inset 0 1px 0 rgba(255, 255, 255, .08);
  transform: translateY(-1px) !important;
}

body.dashboardMode #accountingPanel .accountingInvoiceMain,
body.dashboardMode #accountingPanel .accountingInvoiceAmount {
  display: grid !important;
  gap: var(--ap-space-1) !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #accountingPanel .accountingInvoiceMain strong,
body.dashboardMode #accountingPanel .accountingInvoiceAmount strong {
  color: var(--portal-text);
  font-size: 1.08rem !important;
  line-height: 1.15 !important;
}

body.dashboardMode #accountingPanel .accountingInvoiceMain p,
body.dashboardMode #accountingPanel .accountingInvoiceMain small,
body.dashboardMode #accountingPanel .accountingInvoiceAmount small {
  min-width: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: var(--portal-muted);
  line-height: 1.3 !important;
}

body.dashboardMode #accountingPanel .accountingInvoiceMain p {
  color: rgba(235, 243, 255, .9);
  font-weight: 850 !important;
}

body.dashboardMode #accountingPanel .accountingStatusBadge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: fit-content !important;
  min-height: calc(var(--ap-space-5) + var(--ap-space-1)) !important;
  padding-inline: var(--ap-space-3) !important;
  border: 1px solid rgba(255, 217, 115, .36);
  border-radius: var(--portal-radius-pill);
  background: rgba(255, 198, 78, .13);
  color: #ffd978;
  font-size: .82rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

body.dashboardMode #accountingPanel .accountingStatusBadge.is-paid {
  border-color: rgba(73, 217, 143, .38);
  background: rgba(73, 217, 143, .13);
  color: #79e7af;
}

body.dashboardMode #accountingPanel .accountingStatusBadge.is-overdue {
  border-color: rgba(255, 112, 112, .42);
  background: rgba(255, 112, 112, .13);
  color: #ff9d9d;
}

body.dashboardMode #accountingPanel .accountingStatusBadge.is-cancelled {
  border-color: rgba(193, 207, 224, .28);
  background: rgba(193, 207, 224, .1);
  color: rgba(214, 231, 250, .7);
}

body.dashboardMode #accountingPanel .accountingInvoiceActions {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: var(--ap-gap-tight) !important;
  min-width: 0 !important;
  flex-wrap: wrap !important;
}

body.dashboardMode #accountingPanel .accountingInvoiceActions :is(a, button) {
  min-height: calc(var(--ap-space-6) + var(--ap-space-2)) !important;
  padding-inline: var(--ap-space-4) !important;
  border-radius: var(--portal-radius-control);
  font-size: .88rem !important;
  white-space: nowrap !important;
}

body.dashboardMode #accountingPanel .accountingSuccessButton,
body.roleAdmin #accountingPanel .accountingSuccessButton,
body.dashboardMode #accountingPanel .accountingSuccessButton:is(:hover, :focus-visible),
body.roleAdmin #accountingPanel .accountingSuccessButton:is(:hover, :focus-visible) {
  border: 1px solid rgba(73, 217, 143, .46);
  background: linear-gradient(135deg, rgba(38, 138, 91, .92), rgba(21, 91, 63, .9));
  color: #ffffff;
  box-shadow: 0 14px 30px rgba(73, 217, 143, .12), inset 0 1px 0 rgba(255, 255, 255, .14);
}

@media (max-width: 980px) {
  body.dashboardMode #accountingPanel .accountingSummary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  body.dashboardMode #accountingPanel .accountingInvoiceCard {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  body.dashboardMode #accountingPanel .accountingInvoiceActions {
    justify-content: flex-start !important;
  }
}

@media (max-width: 640px) {
  body.dashboardMode #accountingPanel .accountingSummary {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Partner price rules V2: compact row configurator. */
.partnerPriceRuleMatrix {
  gap: var(--ap-section-gap) !important;
}

.partnerPriceConfigurator {
  display: grid;
  gap: var(--ap-section-gap);
}

.partnerPriceRuleGroup {
  display: grid;
  gap: var(--ap-space-sm);
  min-width: 0;
}

.partnerPriceRuleGroup h5 {
  margin: 0;
  color: var(--portal-text);
  font-size: .95rem;
  font-weight: 900;
}

.partnerPriceRuleRows {
  display: grid;
  gap: 0;
  min-width: 0;
  border-block: 1px solid rgba(140, 174, 211, .16);
}

.partnerPriceRuleHeader,
.partnerPriceRuleRow {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(12rem, .75fr) minmax(10rem, .65fr);
  align-items: center;
  gap: var(--ap-gap-default);
  min-width: 0;
  padding-block: var(--ap-space-sm);
  border-bottom: 1px solid rgba(140, 174, 211, .12);
}

.partnerPriceRuleHeader {
  color: var(--portal-muted);
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.partnerPriceRuleRow:last-child {
  border-bottom: 0;
}

.partnerPriceRuleRow > span:first-child {
  min-width: 0;
  color: var(--portal-text);
  font-weight: 850;
  overflow-wrap: anywhere;
}

.partnerPriceRuleFixedModel {
  color: var(--portal-muted);
  font-weight: 800;
}

.partnerPriceRuleRow .ap-input,
.partnerPriceRuleRow .ap-select {
  width: 100%;
}

@media (max-width: 900px) {
  .partnerPriceRuleHeader {
    display: none;
  }

  .partnerPriceRuleRow {
    grid-template-columns: 1fr;
    gap: var(--ap-space-sm);
  }

  .partnerPriceRuleRows {
    border-top: 0;
  }
}

body.partnerOrderDetailOnly #partnerOrderDetailBox.partnerOrderCalculationTabActive #partnerOrderDetailForm.partnerOrderTabbedForm,
body.portalPartner #partnerOrderDetailBox.partnerOrderCalculationTabActive #partnerOrderDetailForm.partnerOrderTabbedForm,
body.roleAdmin #partnerOrderDetailBox.partnerOrderCalculationTabActive #partnerOrderDetailForm.partnerOrderTabbedForm {
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox.partnerOrderCalculationTabActive #partnerOrderDetailForm .partnerOrderDetailTabs,
body.portalPartner #partnerOrderDetailBox.partnerOrderCalculationTabActive #partnerOrderDetailForm .partnerOrderDetailTabs,
body.roleAdmin #partnerOrderDetailBox.partnerOrderCalculationTabActive #partnerOrderDetailForm .partnerOrderDetailTabs {
  padding: 0 0 18px !important;
  border: 0;
  border-bottom: 1px solid rgba(140, 174, 211, .18);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox.partnerOrderCalculationTabActive #partnerOrderDetailForm .partnerOrderDetailTab,
body.portalPartner #partnerOrderDetailBox.partnerOrderCalculationTabActive #partnerOrderDetailForm .partnerOrderDetailTab,
body.roleAdmin #partnerOrderDetailBox.partnerOrderCalculationTabActive #partnerOrderDetailForm .partnerOrderDetailTab {
  min-height: 42px !important;
  border-radius: 10px;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox.partnerOrderCalculationTabActive .partnerOrderDetailPanel[data-partner-order-panel="calculation"],
body.portalPartner #partnerOrderDetailBox.partnerOrderCalculationTabActive .partnerOrderDetailPanel[data-partner-order-panel="calculation"],
body.roleAdmin #partnerOrderDetailBox.partnerOrderCalculationTabActive .partnerOrderDetailPanel[data-partner-order-panel="calculation"] {
  gap: 18px !important;
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimate,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimate,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimate {
  display: grid;
  gap: var(--ap-space-lg);
  margin: 0;
  padding: clamp(8px, 1vw, 12px) 0 0;
  color: var(--portal-text);
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimateHead,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimateHead,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimateHead {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: var(--ap-space-lg);
  padding-bottom: clamp(18px, 2vw, 26px);
  border-bottom: 1px solid rgba(140, 174, 211, .18);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimateHead > div:first-child,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimateHead > div:first-child,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimateHead > div:first-child {
  display: grid;
  gap: 8px;
  min-width: 0;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimate strong,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimate strong,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimate strong {
  color: var(--portal-text);
  font-size: clamp(1.35rem, 2vw, 2.1rem);
  line-height: 1.15;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimate span,
body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimate small,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimate span,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimate small,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimate span,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimate small {
  color: var(--portal-muted);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimateTotal,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimateTotal,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimateTotal {
  color: var(--portal-accent);
  font-size: clamp(2.6rem, 5vw, 4.4rem);
  font-weight: 950;
  line-height: .95;
  white-space: nowrap;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimateRows,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimateRows,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimateRows {
  display: grid;
  gap: 0;
  min-width: 0;
  border-block: 1px solid rgba(140, 174, 211, .14);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimateRow,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimateRow,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimateRow {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr) minmax(7rem, auto);
  align-items: center;
  gap: var(--ap-gap-default);
  min-width: 0;
  padding: 16px 0;
  border: 0;
  border-bottom: 1px solid rgba(140, 174, 211, .12);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimateRow:last-child,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimateRow:last-child,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimateRow:last-child {
  border-bottom: 0;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimateRow > span:first-child,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimateRow > span:first-child,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimateRow > span:first-child {
  color: var(--portal-text);
  font-weight: 900;
  overflow-wrap: anywhere;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimateRow > span:nth-child(2),
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimateRow > span:nth-child(2),
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimateRow > span:nth-child(2) {
  color: var(--portal-muted);
  font-weight: 800;
  text-align: right;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimateRow > strong,
body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimateRow > strong,
body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimateRow > strong {
  color: var(--portal-text);
  font-size: 1.05rem;
  font-weight: 950;
  text-align: right;
  white-space: nowrap;
}

@media (max-width: 760px) {
  body.partnerOrderDetailOnly #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .formGrid,
  body.portalPartner #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .formGrid,
  body.roleAdmin #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .formGrid {
    grid-template-columns: 1fr !important;
  }

  body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimate,
  body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimate,
  body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimate {
    padding: 16px 0;
  }

  body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimateHead,
  body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimateRow,
  body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimateHead,
  body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimateRow,
  body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimateHead,
  body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimateRow {
    grid-template-columns: 1fr;
    align-items: start;
  }

  body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimateRow,
  body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimateRow,
  body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimateRow {
    gap: 5px;
  }

  body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimateRow > span:nth-child(2),
  body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderCostEstimateRow > strong,
  body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimateRow > span:nth-child(2),
  body.portalPartner #partnerOrderDetailBox .partnerOrderCostEstimateRow > strong,
  body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimateRow > span:nth-child(2),
  body.roleAdmin #partnerOrderDetailBox .partnerOrderCostEstimateRow > strong {
    text-align: left;
  }
}

body.partnerOrderDetailOnly #partnerOrderDetailBox #partnerOrderDetailForm.partnerOrderTabbedForm,
body.portalPartner #partnerOrderDetailBox #partnerOrderDetailForm.partnerOrderTabbedForm,
body.roleAdmin #partnerOrderDetailBox #partnerOrderDetailForm.partnerOrderTabbedForm {
  gap: clamp(22px, 2.4vw, 34px) !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox #partnerOrderDetailForm .partnerOrderDetailTabs,
body.portalPartner #partnerOrderDetailBox #partnerOrderDetailForm .partnerOrderDetailTabs,
body.roleAdmin #partnerOrderDetailBox #partnerOrderDetailForm .partnerOrderDetailTabs {
  gap: clamp(10px, 1.15vw, 18px) !important;
  padding: 0 0 clamp(18px, 2vw, 26px) !important;
  border: 0;
  border-bottom: 1px solid rgba(140, 174, 211, .18);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox #partnerOrderDetailForm .partnerOrderDetailPanel,
body.portalPartner #partnerOrderDetailBox #partnerOrderDetailForm .partnerOrderDetailPanel,
body.roleAdmin #partnerOrderDetailBox #partnerOrderDetailForm .partnerOrderDetailPanel {
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox #partnerOrderDetailForm .partnerOrderDetailPanel.active,
body.portalPartner #partnerOrderDetailBox #partnerOrderDetailForm .partnerOrderDetailPanel.active,
body.roleAdmin #partnerOrderDetailBox #partnerOrderDetailForm .partnerOrderDetailPanel.active {
  gap: clamp(22px, 2.3vw, 32px) !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .formGrid,
body.portalPartner #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .formGrid,
body.roleAdmin #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .formGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 clamp(28px, 4vw, 64px);
  border-top: 0;
  border-bottom: 1px solid rgba(140, 174, 211, .14);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .formGrid > label,
body.portalPartner #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .formGrid > label,
body.roleAdmin #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .formGrid > label {
  display: grid;
  gap: 8px;
  min-width: 0;
  margin: 0 !important;
  padding: 16px 0;
  border: 0;
  border-bottom: 1px solid rgba(140, 174, 211, .12);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--portal-muted);
  font-size: .92rem;
  font-weight: 850;
  line-height: 1.25;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .formGrid > label > input,
body.partnerOrderDetailOnly #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .formGrid > label > select,
body.portalPartner #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .formGrid > label > input,
body.portalPartner #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .formGrid > label > select,
body.roleAdmin #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .formGrid > label > input,
body.roleAdmin #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .formGrid > label > select {
  width: 100%;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--portal-text);
  -webkit-text-fill-color: var(--portal-text);
  opacity: 1;
  font-size: clamp(1.2rem, 1.45vw, 1.55rem);
  font-weight: 950;
  line-height: 1.28;
  appearance: none;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .partnerOrderNotesSection,
body.portalPartner #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .partnerOrderNotesSection,
body.roleAdmin #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .partnerOrderNotesSection {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: 0;
  border-bottom: 1px solid rgba(140, 174, 211, .14);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailActions,
body.portalPartner #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailActions,
body.roleAdmin #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailActions {
  margin-top: clamp(8px, 1.2vw, 18px);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .partnerOrderNotesSection label,
body.portalPartner #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .partnerOrderNotesSection label,
body.roleAdmin #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .partnerOrderNotesSection label {
  display: grid;
  gap: 8px;
  padding: 16px 0 !important;
  color: var(--portal-muted);
  font-size: .92rem;
  font-weight: 850;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .partnerOrderNotesSection textarea,
body.portalPartner #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .partnerOrderNotesSection textarea,
body.roleAdmin #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel:is([data-partner-order-panel="customer"], [data-partner-order-panel="order"]) .partnerOrderNotesSection textarea {
  min-height: 0 !important;
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
  color: var(--portal-text);
  -webkit-text-fill-color: var(--portal-text);
  opacity: 1;
  font-size: clamp(1.2rem, 1.45vw, 1.55rem);
  font-weight: 950;
  resize: none;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel[data-partner-order-panel="order"] input[type="hidden"],
body.portalPartner #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel[data-partner-order-panel="order"] input[type="hidden"],
body.roleAdmin #partnerOrderDetailBox #partnerOrderDetailForm:not(.isEditing) .partnerOrderDetailPanel[data-partner-order-panel="order"] input[type="hidden"] {
  display: none !important;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .chatBoxHeader,
body.portalPartner #partnerOrderDetailBox .chatBoxHeader,
body.roleAdmin #partnerOrderDetailBox .chatBoxHeader {
  display: grid;
  grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: var(--ap-space-lg);
  align-items: start;
  padding: 0 0 clamp(18px, 2vw, 26px);
  border-bottom: 1px solid rgba(140, 174, 211, .16);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .chatBoxHeader h4,
body.portalPartner #partnerOrderDetailBox .chatBoxHeader h4,
body.roleAdmin #partnerOrderDetailBox .chatBoxHeader h4 {
  margin: 0;
  color: var(--portal-text);
  font-size: clamp(1.25rem, 1.6vw, 1.75rem);
  font-weight: 950;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .chatBoxHeader .mutedText,
body.portalPartner #partnerOrderDetailBox .chatBoxHeader .mutedText,
body.roleAdmin #partnerOrderDetailBox .chatBoxHeader .mutedText {
  margin: 0;
  color: var(--portal-muted);
  font-size: clamp(.95rem, 1.15vw, 1.15rem);
  font-weight: 750;
  line-height: 1.4;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderAttachmentsSection,
body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderNotesSection,
body.portalPartner #partnerOrderDetailBox .partnerOrderAttachmentsSection,
body.portalPartner #partnerOrderDetailBox .partnerOrderNotesSection,
body.roleAdmin #partnerOrderDetailBox .partnerOrderAttachmentsSection,
body.roleAdmin #partnerOrderDetailBox .partnerOrderNotesSection {
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderImageGallery,
body.portalPartner #partnerOrderDetailBox .partnerOrderImageGallery,
body.roleAdmin #partnerOrderDetailBox .partnerOrderImageGallery {
  grid-template-columns: repeat(auto-fit, minmax(180px, 240px));
  gap: clamp(16px, 1.6vw, 24px);
  align-items: start;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox #partnerOrderImageGallery,
body.portalPartner #partnerOrderDetailBox #partnerOrderImageGallery,
body.roleAdmin #partnerOrderDetailBox #partnerOrderImageGallery {
  grid-template-columns: 1fr;
  gap: clamp(28px, 3vw, 44px);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderImageGroup,
body.portalPartner #partnerOrderDetailBox .partnerOrderImageGroup,
body.roleAdmin #partnerOrderDetailBox .partnerOrderImageGroup {
  display: grid;
  gap: var(--ap-space-md);
  min-width: 0;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderAttachmentHeading,
body.portalPartner #partnerOrderDetailBox .partnerOrderAttachmentHeading,
body.roleAdmin #partnerOrderDetailBox .partnerOrderAttachmentHeading {
  margin: 0;
  color: var(--portal-text);
  font-size: clamp(1.05rem, 1.25vw, 1.35rem);
  font-weight: 950;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderImageCard,
body.portalPartner #partnerOrderDetailBox .partnerOrderImageCard,
body.roleAdmin #partnerOrderDetailBox .partnerOrderImageCard {
  gap: 8px;
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderImagePreviewButton,
body.portalPartner #partnerOrderDetailBox .partnerOrderImagePreviewButton,
body.roleAdmin #partnerOrderDetailBox .partnerOrderImagePreviewButton {
  gap: 10px !important;
  color: var(--portal-text);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderImageCard img,
body.portalPartner #partnerOrderDetailBox .partnerOrderImageCard img,
body.roleAdmin #partnerOrderDetailBox .partnerOrderImageCard img {
  height: 170px;
  border: 1px solid rgba(72, 159, 223, .3);
  border-radius: 8px;
  background: rgba(2, 12, 32, .62);
  box-shadow: none;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderImageCard span,
body.portalPartner #partnerOrderDetailBox .partnerOrderImageCard span,
body.roleAdmin #partnerOrderDetailBox .partnerOrderImageCard span {
  color: var(--portal-text);
  font-size: .92rem;
  font-weight: 850;
  line-height: 1.25;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderAttachmentSourceBadge,
body.portalPartner #partnerOrderDetailBox .partnerOrderAttachmentSourceBadge,
body.roleAdmin #partnerOrderDetailBox .partnerOrderAttachmentSourceBadge {
  border-color: rgba(72, 159, 223, .32);
  background: transparent;
  color: var(--portal-muted);
  box-shadow: none;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderFileList,
body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderAppointmentsList,
body.portalPartner #partnerOrderDetailBox .partnerOrderFileList,
body.portalPartner #partnerOrderDetailBox .partnerOrderAppointmentsList,
body.roleAdmin #partnerOrderDetailBox .partnerOrderFileList,
body.roleAdmin #partnerOrderDetailBox .partnerOrderAppointmentsList {
  gap: 0;
  border-block: 1px solid rgba(140, 174, 211, .14);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderFileCard,
body.portalPartner #partnerOrderDetailBox .partnerOrderFileCard,
body.roleAdmin #partnerOrderDetailBox .partnerOrderFileCard {
  border-bottom: 1px solid rgba(140, 174, 211, .12);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderFileCard:last-child,
body.portalPartner #partnerOrderDetailBox .partnerOrderFileCard:last-child,
body.roleAdmin #partnerOrderDetailBox .partnerOrderFileCard:last-child {
  border-bottom: 0;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderFileLink,
body.portalPartner #partnerOrderDetailBox .partnerOrderFileLink,
body.roleAdmin #partnerOrderDetailBox .partnerOrderFileLink {
  padding: 16px 42px 16px 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--portal-text);
  box-shadow: none;
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderFileLink span,
body.portalPartner #partnerOrderDetailBox .partnerOrderFileLink span,
body.roleAdmin #partnerOrderDetailBox .partnerOrderFileLink span {
  color: var(--portal-muted);
}

body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderAppointmentCard,
body.portalPartner #partnerOrderDetailBox .partnerOrderAppointmentCard,
body.roleAdmin #partnerOrderDetailBox .partnerOrderAppointmentCard {
  padding: 16px 0 !important;
  border: 0;
  border-bottom: 1px solid rgba(140, 174, 211, .12);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transform: none !important;
}

@media (max-width: 760px) {
  body.partnerOrderDetailOnly #partnerOrderDetailBox .chatBoxHeader,
  body.portalPartner #partnerOrderDetailBox .chatBoxHeader,
  body.roleAdmin #partnerOrderDetailBox .chatBoxHeader {
    grid-template-columns: 1fr;
  }

  body.partnerOrderDetailOnly #partnerOrderDetailBox .partnerOrderImageGallery,
  body.portalPartner #partnerOrderDetailBox .partnerOrderImageGallery,
  body.roleAdmin #partnerOrderDetailBox .partnerOrderImageGallery {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  }
}

/* Portal Layout System V2: Complaints */
.complaintOverviewSection,
.complaintDetailLayout {
  display: grid;
  min-width: 0;
  gap: var(--ap-section-gap);
}

.complaintOverviewSection > .ap-section-body {
  gap: var(--ap-gap-default);
}

.complaintPremiumList .ap-list-v2-value,
.complaintPremiumList .ap-list-v2-cell {
  min-width: 0;
}

.complaintPremiumList .ap-list-v2-cell-primary,
.complaintPremiumList .ap-list-v2-cell-secondary {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.complaintPremiumList .ap-list-v2-cell-primary {
  color: var(--portal-text);
  font-weight: 850;
}

.complaintPremiumList .ap-list-v2-cell-secondary {
  margin-top: var(--ap-space-1);
  color: var(--portal-muted);
  font-size: .78rem;
  font-weight: 650;
}

.complaintPremiumList .ap-list-v2-cell-slot-badge .ap-list-v2-value,
.complaintPremiumList .ap-list-v2-cell-slot-action .ap-list-v2-value {
  display: flex;
  align-items: center;
}

.complaintPremiumList .ap-list-v2-cell-slot-action .ap-list-v2-value {
  justify-content: flex-end;
}

.complaintPremiumList .ap-list-v2-action {
  min-height: calc(var(--ap-space-6) + var(--ap-space-1));
  padding-inline: var(--ap-space-3);
  font-size: .78rem;
}

.complaintStatusBadge,
.complaintPriorityBadge {
  flex: 0 0 auto;
}

.complaintBadgeGroup {
  justify-content: flex-end;
}

.complaintDetailLayout > .ap-section {
  padding-bottom: var(--ap-section-gap);
  border-bottom: 1px solid rgba(140, 174, 211, .14);
}

.complaintDetailLayout > .ap-section:last-child {
  padding-bottom: var(--ap-space-0);
  border-bottom: 0;
}

.complaintFacts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
  gap: var(--ap-gap-default) var(--ap-gap-loose);
  margin: 0;
}

.complaintFact {
  min-width: 0;
}

.complaintFact dt {
  color: var(--portal-muted);
  font-size: .76rem;
  font-weight: 750;
}

.complaintFact dd {
  margin: var(--ap-space-1) 0 0;
  color: var(--portal-text);
  font-size: .95rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.complaintDescription {
  color: var(--portal-text);
  font-weight: 650;
  line-height: 1.65;
  white-space: pre-wrap;
}

.complaintDetailLayout .complaintAttachmentList,
.complaintDetailLayout .complaintTimeline {
  gap: var(--ap-space-0);
  border-block: 1px solid rgba(140, 174, 211, .14);
}

.complaintDetailLayout .complaintAttachmentLink {
  padding-block: var(--ap-space-3);
  border-bottom-color: rgba(140, 174, 211, .12);
}

.complaintDetailLayout .complaintAttachmentLink:last-child {
  border-bottom: 0;
}

.complaintDetailLayout .complaintMessage {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: var(--ap-space-3) var(--ap-space-0) var(--ap-space-3) var(--ap-space-4);
  border: 0;
  border-bottom: 1px solid rgba(140, 174, 211, .12);
  border-left: var(--ap-space-1) solid rgba(193, 207, 224, .26);
  border-radius: var(--ap-space-0);
  background: transparent;
  box-shadow: none;
}

.complaintDetailLayout .complaintMessage-admin {
  border-left-color: rgba(72, 159, 223, .7);
}

.complaintDetailLayout .complaintMessage:last-child {
  border-bottom: 0;
}

.complaintDetailLayout .complaintInlineForm {
  margin-top: var(--ap-gap-default);
}

.complaintDetailLayout .complaintInlineForm > label,
.complaintDetailLayout .complaintMetaForm {
  width: 100%;
}

.complaintDangerSection .ap-section-head {
  align-items: center;
}

@media (max-width: 760px) {
  .complaintPremiumList .ap-list-v2-cell-primary,
  .complaintPremiumList .ap-list-v2-cell-secondary {
    overflow: visible;
    white-space: normal;
  }

  .complaintPremiumList .ap-list-v2-cell-slot-action .ap-list-v2-value,
  .complaintBadgeGroup {
    justify-content: flex-start;
  }

  .complaintPremiumList .ap-list-v2-action {
    width: 100%;
  }

  .complaintDangerSection .ap-section-head {
    align-items: stretch;
  }
}

/* Portal Layout System V2: Kanban */
.ap-view-toggle {
  display: inline-flex;
  align-items: center;
  gap: var(--ap-space-1);
  padding: var(--ap-space-1);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-control);
  background: rgba(2, 9, 25, .5);
}

body.dashboardMode .ap-view-toggle-button {
  min-height: calc(var(--ap-space-6) + var(--ap-space-1));
  padding-inline: var(--ap-space-3);
  border: 0;
  border-radius: calc(var(--portal-radius-control) - var(--ap-space-1));
  background: transparent;
  color: var(--portal-muted);
  box-shadow: none;
  font-size: .8rem;
  font-weight: 850;
}

body.dashboardMode .ap-view-toggle-button:is(:hover, :focus-visible) {
  border: 0;
  background: rgba(255, 255, 255, .04);
  color: var(--portal-text);
  box-shadow: none;
}

body.dashboardMode .ap-view-toggle-button.active {
  background: rgba(72, 159, 223, .18);
  color: var(--portal-text);
}

body.dashboardMode .tableWrap.reonicKanbanWrap {
  min-width: 0;
  margin-top: var(--ap-space-4);
  padding: var(--ap-space-4);
  overflow: hidden;
}

body.dashboardMode .tableWrap.reonicKanbanWrap.hasKanbanDetail {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(24rem, 30rem);
  align-items: start;
  gap: var(--ap-gap-default);
}

#reonicKanbanBoard {
  min-width: 0;
}

#reonicOrdersPanel .ap-filter-toolbar-filters {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--ap-gap-tight);
}

.ap-kanban {
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-color: rgba(72, 159, 223, .58) rgba(2, 9, 25, .42);
}

.ap-kanban-track {
  display: flex;
  width: max-content;
  min-width: 100%;
  align-items: stretch;
  gap: var(--ap-gap-default);
  padding-bottom: var(--ap-space-2);
}

.ap-kanban-column {
  display: grid;
  width: clamp(18.75rem, 21vw, 20rem);
  min-width: 18.75rem;
  flex: 0 0 auto;
  grid-template-rows: auto minmax(14rem, calc(100vh - 22rem));
  gap: var(--ap-space-2);
  transition: width .16s ease;
}

.ap-kanban-column.is-empty {
  width: 15rem;
  min-width: 15rem;
  grid-template-rows: auto auto;
}

.ap-kanban-column.is-busy {
  width: clamp(20rem, 22vw, 21.25rem);
}

.ap-kanban-column-head {
  display: flex;
  min-height: var(--ap-space-7);
  align-items: center;
  justify-content: space-between;
  gap: var(--ap-gap-tight);
  padding-inline: var(--ap-space-1);
}

.ap-kanban-column-head h4 {
  margin: 0;
  color: var(--portal-text);
  font-size: .82rem;
  font-weight: 900;
  line-height: 1.25;
}

.ap-kanban-column-head .ap-badge {
  min-width: var(--ap-space-5);
  min-height: var(--ap-space-5);
  padding-inline: var(--ap-space-1);
  border: 0;
  background: rgba(255, 255, 255, .045);
  justify-content: center;
}

.ap-kanban-column-body {
  display: flex;
  min-height: 14rem;
  flex-direction: column;
  gap: var(--ap-gap-default);
  padding: var(--ap-space-1);
  overflow-y: auto;
  border: 1px solid transparent;
  border-radius: var(--portal-radius-control);
  background: rgba(1, 8, 21, .18);
  transition: background .16s ease, box-shadow .16s ease;
}

.ap-kanban-column.is-empty .ap-kanban-column-body {
  min-height: 0;
  overflow: visible;
}

.ap-kanban-column.is-exception {
  padding-left: var(--ap-space-2);
  border-left: 1px solid rgba(239, 177, 72, .14);
}

.ap-kanban-column.is-exception .ap-kanban-column-head h4 {
  color: rgba(247, 216, 158, .88);
}

.ap-kanban-column.is-drop-target .ap-kanban-column-body {
  border-color: rgba(72, 159, 223, .34);
  background: rgba(72, 159, 223, .055);
  box-shadow: inset 0 0 0 1px rgba(72, 159, 223, .08);
}

body.dashboardMode .ap-kanban-card {
  position: relative;
  display: grid;
  width: 100%;
  min-height: 11.5rem;
  padding: var(--ap-space-4);
  gap: var(--ap-space-2);
  overflow: visible;
  border: 1px solid rgba(140, 174, 211, .12);
  border-radius: var(--portal-radius-control);
  background: rgba(2, 11, 27, .82);
  color: var(--portal-text);
  box-shadow: 0 var(--ap-space-1) var(--ap-space-3) rgba(0, 0, 0, .13);
  text-align: left;
  transform: none;
  transition: none;
  cursor: grab;
}

body.dashboardMode .ap-kanban-card:is(:hover, :focus-visible) {
  border-color: rgba(140, 174, 211, .2);
  background: rgba(5, 16, 35, .9);
  box-shadow: 0 var(--ap-space-1) var(--ap-space-3) rgba(0, 0, 0, .15);
  outline: none;
}

body.dashboardMode .ap-kanban-card:active {
  cursor: grabbing;
}

body.dashboardMode .ap-kanban-card.is-dragging {
  z-index: 2;
  border-color: rgba(72, 159, 223, .34);
  opacity: .9;
  box-shadow: 0 var(--ap-space-3) var(--ap-space-7) rgba(0, 0, 0, .32);
  transform: translateY(calc(var(--ap-space-1) * -1));
}

body.dashboardMode .ap-kanban-card.is-selected {
  border-color: rgba(72, 159, 223, .28);
  background: rgba(2, 10, 26, .96);
}

body.dashboardMode .ap-kanban-card.is-selected::before {
  position: absolute;
  top: var(--ap-space-2);
  bottom: var(--ap-space-2);
  left: 0;
  width: var(--ap-space-1);
  border-radius: 0 var(--portal-radius-control) var(--portal-radius-control) 0;
  background: var(--portal-accent);
  content: "";
}

.ap-kanban-card-top {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: var(--ap-gap-tight);
}

.ap-kanban-card-project {
  min-width: 0;
  overflow: hidden;
  color: rgba(184, 205, 229, .58);
  font-size: .66rem;
  font-weight: 700;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ap-kanban-origin-badge {
  height: var(--ap-space-4);
  min-height: var(--ap-space-4);
  flex: 0 0 auto;
  padding-inline: var(--ap-space-2);
  border-color: rgba(140, 174, 211, .14);
  font-size: .58rem;
  letter-spacing: 0;
}

.ap-kanban-origin-badge.is-own {
  background: rgba(72, 159, 223, .09);
  color: rgba(157, 211, 250, .82);
}

.ap-kanban-origin-badge.is-partner {
  background: rgba(166, 151, 207, .09);
  color: rgba(205, 194, 232, .82);
}

.ap-kanban-card-customer {
  display: -webkit-box;
  overflow: hidden;
  color: var(--portal-text);
  font-size: 1.12rem;
  font-weight: 900;
  line-height: 1.3;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.ap-kanban-card-performance,
.ap-kanban-card-date {
  display: flex;
  min-width: 0;
  align-items: baseline;
  gap: var(--ap-space-2);
}

.ap-kanban-card-performance {
  justify-content: start;
  color: rgba(196, 214, 234, .68);
  font-size: .79rem;
  font-weight: 700;
}

.ap-kanban-card-date time {
  overflow: hidden;
  color: rgba(232, 241, 251, .82);
  font-size: .74rem;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ap-kanban-card-badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ap-space-1);
  align-self: end;
  margin-top: auto;
  padding-top: var(--ap-space-1);
}

.ap-kanban-card-badges .ap-badge {
  max-width: 5.5rem;
  height: var(--ap-space-4);
  min-height: var(--ap-space-4);
  padding-inline: var(--ap-space-1);
  border-color: rgba(140, 174, 211, .12);
  background: rgba(255, 255, 255, .035);
  color: rgba(205, 222, 240, .72);
  font-size: .6rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ap-kanban-card-badges .ap-kanban-card-warning {
  max-width: 9rem;
  margin-right: auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ap-kanban-column-more {
  width: 100%;
  min-height: var(--ap-space-6);
  padding: var(--ap-space-2);
  border: 0;
  border-radius: var(--portal-radius-control);
  background: transparent;
  color: rgba(113, 190, 244, .76);
  font: inherit;
  font-size: .72rem;
  font-weight: 850;
  cursor: pointer;
}

.ap-kanban-column-more:is(:hover, :focus-visible) {
  background: rgba(72, 159, 223, .06);
  color: rgba(166, 216, 251, .92);
  outline: none;
}

.ap-kanban-empty {
  margin: var(--ap-space-3) auto;
  color: rgba(184, 205, 229, .5);
  font-size: .7rem;
  font-weight: 650;
  text-align: center;
}

.ap-kanban-detail-panel {
  position: sticky;
  top: var(--ap-space-4);
  width: 100%;
  max-height: calc(100vh - (2 * var(--ap-space-4)));
  padding: var(--ap-space-7);
  overflow-y: auto;
  border-left: 1px solid rgba(140, 174, 211, .14);
  background: rgba(3, 12, 29, .88);
  scrollbar-color: rgba(72, 159, 223, .42) transparent;
}

.ap-kanban-detail-panel:not(.hidden) {
  animation: ap-kanban-panel-in .16s ease-out;
}

@keyframes ap-kanban-panel-in {
  from {
    opacity: .88;
    transform: translateX(var(--ap-space-2));
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.ap-kanban-detail-head,
.ap-kanban-detail-actions,
.ap-kanban-detail-badges {
  display: flex;
  align-items: center;
  gap: var(--ap-gap-tight);
}

.ap-kanban-detail-head {
  justify-content: space-between;
  gap: var(--ap-gap-default);
}

.ap-kanban-detail-head h3 {
  margin: var(--ap-space-1) 0 0;
  font-size: 1.55rem;
  line-height: 1.2;
}

body.dashboardMode .ap-kanban-detail-head .ap-icon-button {
  width: var(--ap-space-7);
  min-width: var(--ap-space-7);
  height: var(--ap-space-7);
  min-height: var(--ap-space-7);
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(184, 205, 229, .68);
  box-shadow: none;
  font-size: 1.2rem;
}

body.dashboardMode .ap-kanban-detail-head .ap-icon-button:is(:hover, :focus-visible) {
  border: 0;
  background: rgba(255, 255, 255, .05);
  color: var(--portal-text);
  box-shadow: none;
}

.ap-kanban-detail-kicker,
.ap-kanban-detail-status label > span {
  color: var(--portal-muted);
  font-size: .72rem;
  font-weight: 850;
}

.ap-kanban-detail-badges {
  flex-wrap: wrap;
  margin-top: var(--ap-space-3);
}

.ap-kanban-detail-badges .ap-kanban-origin-badge {
  order: -1;
}

.ap-kanban-detail-list {
  display: grid;
  margin: 0;
}

.ap-kanban-detail-list > div {
  display: grid;
  grid-template-columns: minmax(7rem, .8fr) minmax(0, 1.5fr);
  gap: var(--ap-gap-default);
  padding-block: var(--ap-space-3);
  border-bottom: 1px solid rgba(140, 174, 211, .12);
}

.ap-kanban-detail-list dt {
  color: var(--portal-muted);
  font-size: .76rem;
  font-weight: 750;
}

.ap-kanban-detail-list dd {
  min-width: 0;
  margin: 0;
  color: var(--portal-text);
  font-size: .86rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.ap-kanban-detail-status {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: var(--ap-gap-tight);
  padding-block: var(--ap-space-2);
}

.ap-kanban-detail-status label {
  display: grid;
  gap: var(--ap-space-2);
}

.ap-kanban-detail-status .ap-button-secondary {
  min-height: var(--ap-space-7);
  padding-inline: var(--ap-space-3);
  white-space: nowrap;
}

.ap-kanban-detail-actions {
  justify-content: flex-end;
  padding-top: var(--ap-space-2);
}

.ap-kanban-detail-actions .ap-button-primary {
  min-height: var(--ap-space-7);
  padding-inline: var(--ap-space-4);
}

.ap-kanban-detail-loading {
  margin: var(--ap-space-3) 0 0;
  color: var(--portal-muted);
  font-size: .78rem;
}

.ap-kanban-detail-section {
  padding-block: var(--ap-space-5);
  border-top: 1px solid rgba(140, 174, 211, .12);
}

.ap-kanban-detail-section > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--ap-gap-tight);
  margin-bottom: var(--ap-space-3);
}

.ap-kanban-detail-section h4 {
  margin: 0;
  color: rgba(232, 241, 251, .9);
  font-size: .84rem;
  font-weight: 900;
}

.ap-kanban-detail-section > header span {
  color: rgba(184, 205, 229, .54);
  font-size: .68rem;
  font-weight: 750;
}

.ap-kanban-detail-history {
  display: grid;
  gap: var(--ap-space-3);
  margin: 0;
  padding: 0;
  list-style: none;
}

.ap-kanban-detail-history li {
  position: relative;
  display: grid;
  gap: var(--ap-space-1);
  padding-left: var(--ap-space-4);
}

.ap-kanban-detail-history li::before {
  position: absolute;
  top: .42rem;
  left: 0;
  width: var(--ap-space-2);
  height: var(--ap-space-2);
  border-radius: 50%;
  background: rgba(72, 159, 223, .58);
  content: "";
}

.ap-kanban-detail-history span,
.ap-kanban-detail-comments p,
.ap-kanban-detail-documents a {
  color: rgba(222, 235, 248, .84);
  font-size: .76rem;
  font-weight: 750;
}

.ap-kanban-detail-history small,
.ap-kanban-detail-documents small {
  color: rgba(184, 205, 229, .52);
  font-size: .66rem;
}

.ap-kanban-detail-comments {
  display: grid;
  gap: var(--ap-space-2);
}

.ap-kanban-detail-comments p {
  margin: 0;
  padding-left: var(--ap-space-3);
  border-left: 1px solid rgba(140, 174, 211, .16);
  line-height: 1.45;
}

.ap-kanban-detail-documents {
  display: grid;
}

.ap-kanban-detail-documents a {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: var(--ap-gap-tight);
  padding-block: var(--ap-space-2);
  border-bottom: 1px solid rgba(140, 174, 211, .09);
  text-decoration: none;
}

.ap-kanban-detail-documents a:hover {
  color: var(--portal-text);
}

.ap-kanban-detail-documents a span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ap-kanban-detail-empty {
  margin: 0;
  color: rgba(184, 205, 229, .5);
  font-size: .72rem;
  font-weight: 650;
}

@media (max-width: 1100px) {
  body.dashboardMode .tableWrap.reonicKanbanWrap.hasKanbanDetail {
    display: block;
  }

  .ap-kanban-detail-panel {
    position: fixed;
    z-index: 120;
    inset: var(--ap-space-3) var(--ap-space-3) var(--ap-space-3) auto;
    width: min(88vw, 30rem);
    max-height: none;
    border: 1px solid rgba(140, 174, 211, .18);
    border-radius: var(--portal-radius-surface);
    background: rgba(3, 13, 31, .98);
    box-shadow: 0 var(--ap-space-4) var(--ap-space-8) rgba(0, 0, 0, .36);
  }
}

@media (max-width: 760px) {
  #reonicOrdersPanel .ap-filter-toolbar-filters {
    grid-template-columns: minmax(0, 1fr);
  }

  .ap-filter-toolbar-actions {
    align-items: stretch;
  }

  .ap-view-toggle {
    width: 100%;
  }

  .ap-view-toggle-button {
    flex: 1;
  }

  body.dashboardMode .tableWrap.reonicKanbanWrap {
    padding: var(--ap-space-2);
  }

  .ap-kanban-track {
    width: max-content;
  }

  .ap-kanban-column,
  .ap-kanban-column.is-empty,
  .ap-kanban-column.is-busy {
    width: min(84vw, 19rem);
    min-width: min(84vw, 19rem);
    grid-template-rows: auto minmax(14rem, calc(100vh - 19rem));
  }

  body.dashboardMode .tableWrap.reonicKanbanWrap.hasKanbanDetail {
    display: block;
  }

  .ap-kanban-detail-panel {
    inset: var(--ap-space-2) var(--ap-space-2) var(--ap-space-2) auto;
    width: calc(100vw - (2 * var(--ap-space-2)));
  }

  .ap-kanban-detail-status {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Project Record V1 release boundary: keep legacy Reonic detail layout unchanged. */
.reonicDetailPanel:not(.is-project-record) .projectRecordLayout {
  display: block;
  margin-top: 0;
}

.reonicDetailPanel:not(.is-project-record) .projectRecordNavigation,
.reonicDetailPanel:not(.is-project-record) #projectRecordHeroContent {
  display: none;
}

body.dashboardMode #reonicOrderDetailPanel.is-project-record {
  padding: 0;
  overflow: visible;
  border: 0;
  background: var(--ap-ui-page);
  box-shadow: none;
}

body.dashboardMode #reonicOrderDetailPanel.is-project-record::before {
  content: none;
}

/* Partner inquiry workspace: separate inquiries from projects and guide creation. */
body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeWorkspace {
  display: grid;
  gap: clamp(28px, 4vw, 48px);
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionSection {
  display: grid;
  gap: var(--portal-space-lg);
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeSectionHead {
  display: grid;
  gap: 5px;
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeSectionHead > span,
body.dashboardMode #partnerInquiryView .partnerInquiryWorkspaceHeader > span,
body.dashboardMode #partnerInquiryView .partnerInquiryStepIntro > span {
  color: #71b9ee;
  font-size: .78rem;
  font-weight: 850;
  letter-spacing: .09em;
  text-transform: uppercase;
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeSectionHead h3 {
  margin: 0;
  color: var(--portal-text);
  font-size: clamp(20px, 2.2vw, 28px);
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionSectionCompact .partnerHomePremiumGrid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionSectionCompact .partnerHomeActionCard {
  min-height: 185px !important;
}

body.dashboardMode #partnerInquiryView.partnerInquiryWorkspace {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
  color: var(--portal-text);
}

body.dashboardMode #partnerInquiryView.partnerInquiryWorkspace::before {
  content: none !important;
  display: none !important;
}

body.dashboardMode #partnerInquiryView.partnerInquiryWorkspace:not(.hidden) {
  display: grid;
  gap: var(--portal-space-xl);
}

body.dashboardMode #partnerInquiryView .partnerInquiryBackButton {
  justify-self: start;
  color: #93c9f1;
}

body.dashboardMode #partnerInquiryView .partnerInquiryWorkspaceHeader {
  display: grid;
  max-width: 780px;
  gap: 8px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryWorkspaceHeader h2 {
  margin: 0;
  color: var(--portal-text);
  font-size: clamp(28px, 4vw, 46px);
  line-height: 1.06;
}

body.dashboardMode #partnerInquiryView .partnerInquiryWorkspaceHeader p,
body.dashboardMode #partnerInquiryView .partnerInquiryStepIntro p,
body.dashboardMode #partnerInquiryView .partnerInquirySuccess p {
  margin: 0;
  color: var(--portal-muted);
  line-height: 1.6;
}

body.dashboardMode #partnerInquiryView .partnerInquiryWizard,
body.dashboardMode #partnerInquiryView .partnerInquiryListCard,
body.dashboardMode #partnerInquiryView .partnerInquiryDetailCard,
body.dashboardMode #partnerInquiryView .partnerInquirySuccess {
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-surface);
  background:
    radial-gradient(circle at 15% 0%, rgba(72, 159, 223, .13), transparent 32%),
    linear-gradient(145deg, rgba(7, 20, 49, .95), rgba(2, 9, 25, .94));
  color: var(--portal-text);
  box-shadow: var(--portal-shadow);
}

body.dashboardMode #partnerInquiryView .partnerInquiryWizard {
  display: grid;
  width: 100%;
  min-height: 0;
  gap: clamp(16px, 2vw, 24px);
  padding: clamp(18px, 2.4vw, 30px);
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepper {
  margin: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepButton::before {
  content: counter(partner-portal-step);
  font-size: .82rem;
  font-weight: 900;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepButton {
  border: 0;
  background: transparent;
  background-color: transparent;
  background-image: none;
  color: rgba(201, 216, 234, .72);
  box-shadow: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepButton:is(
  .active,
  .ap-step-active,
  .isComplete,
  .ap-step-complete,
  [aria-current="step"]
) {
  background: transparent;
  background-color: transparent;
  background-image: none;
  color: var(--portal-text);
  box-shadow: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepButton.isComplete::before {
  content: "";
}

body.dashboardMode #partnerInquiryView .partnerInquiryWizardStep:not(.hidden) {
  display: grid;
  align-content: start;
  gap: var(--portal-space-xl);
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepIntro {
  display: grid;
  max-width: 760px;
  gap: 7px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepIntro h3 {
  margin: 0;
  color: var(--portal-text);
  font-size: clamp(20px, 2.4vw, 28px);
}

body.dashboardMode #partnerInquiryView .formGrid,
body.dashboardMode #partnerInquiryView .partnerInquiryChoiceGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

body.dashboardMode #partnerInquiryView label {
  display: grid;
  align-content: start;
  gap: 8px;
  color: var(--portal-text);
  font-weight: 750;
}

body.dashboardMode #partnerInquiryView .fullWidth {
  grid-column: 1 / -1;
}

body.dashboardMode #partnerInquiryView .partnerInquiryPowerPreview {
  padding: 16px 18px;
  border: 1px solid rgba(72, 159, 223, .2);
  border-radius: var(--portal-radius-card);
  background: rgba(72, 159, 223, .08);
  color: #b9d9ef;
  font-weight: 750;
}

body.dashboardMode #partnerInquiryView .partnerInquiryReview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryReviewRow {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid rgba(72, 159, 223, .16);
  border-radius: var(--portal-radius-card);
  background: rgba(2, 9, 25, .5);
}

body.dashboardMode #partnerInquiryView .partnerInquiryReviewRow span {
  color: var(--portal-muted);
  font-size: .8rem;
  font-weight: 800;
  text-transform: uppercase;
}

body.dashboardMode #partnerInquiryView .partnerInquiryReviewRow strong {
  overflow-wrap: anywhere;
  color: var(--portal-text);
}

body.dashboardMode #partnerInquiryView .partnerInquiryWizardActions {
  align-self: end;
  justify-content: flex-end;
  padding-top: var(--portal-space-md);
  border-top: 1px solid rgba(72, 159, 223, .14);
}

body.dashboardMode #partnerInquiryView .partnerInquiryLengthField input[type="number"] {
  min-height: 42px;
  border: 1px solid #8cb8d9;
  border-radius: 10px;
  background: #f8fbff;
  color: #10233a;
  caret-color: #10233a;
}

body.dashboardMode #partnerInquiryView .partnerInquiryLengthField input[type="number"]::placeholder {
  color: #48647e;
  opacity: 1;
}

body.dashboardMode #partnerInquiryView .partnerInquiryLengthField input[type="number"]:focus {
  border-color: #2d9cdb;
  box-shadow: 0 0 0 3px rgba(45, 156, 219, .28);
  outline: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryLengthField input[type="number"][aria-invalid="true"] {
  border-color: #dd5d68;
  box-shadow: 0 0 0 3px rgba(221, 93, 104, .2);
}

body.dashboardMode #partnerInquiryView .partnerInquiryGridOperator {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(114, 201, 255, .38);
  border-radius: 12px;
  background: rgba(72, 159, 223, .08);
}

body.dashboardMode #partnerInquiryView .partnerInquiryAddressAutocomplete {
  position: relative;
  display: grid;
  gap: 8px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryAddressAutocomplete > label {
  width: 100%;
}

body.dashboardMode #partnerInquiryView .partnerInquiryAddressSuggestions {
  position: absolute;
  z-index: var(--ap-z-popover);
  top: 76px;
  right: 0;
  left: 0;
  display: grid;
  gap: 2px;
  overflow: auto;
  padding: 6px;
  border: 1px solid var(--portal-border-strong);
  border-radius: var(--portal-radius-control);
  background: var(--portal-surface-elevated);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-lg);
}

body.dashboardMode #partnerInquiryView .partnerInquiryAddressSuggestions > button {
  display: grid;
  gap: 3px;
  min-width: 0;
  min-height: 52px;
  padding: 10px 14px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--portal-text-secondary);
  text-align: left;
}

body.dashboardMode #partnerInquiryView .partnerInquiryAddressSuggestions > button strong {
  color: var(--portal-text-primary);
}

body.dashboardMode #partnerInquiryView .partnerInquiryAddressSuggestions > button:hover,
body.dashboardMode #partnerInquiryView .partnerInquiryAddressSuggestions > button:focus-visible,
body.dashboardMode #partnerInquiryView .partnerInquiryAddressSuggestions > button[aria-selected="true"] {
  background: var(--portal-accent-soft);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-focus-ring);
  outline: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryAddressSuggestions span,
body.dashboardMode #partnerInquiryView .partnerInquiryAddressHint,
body.dashboardMode #partnerInquiryView .partnerInquiryGeoapifyAttribution {
  color: var(--portal-text-muted);
  font-size: .86rem;
}

body.dashboardMode #partnerInquiryView .partnerInquiryAddressHint { margin: 0; }
body.dashboardMode #partnerInquiryView .partnerInquiryGeoapifyAttribution { width: fit-content; }

body.dashboardMode #partnerInquiryView .partnerInquiryGridOperator > p {
  margin: 0;
  color: var(--portal-muted);
}

body.dashboardMode #partnerInquiryView .partnerInquiryGridOperatorActions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryGridOperatorConfirm {
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: start;
  font-weight: 650;
}

body.dashboardMode #partnerInquiryView .partnerInquiryListToolbar {
  display: flex;
  justify-content: flex-end;
}

body.dashboardMode #partnerInquiryView .partnerInquiryList,
body.dashboardMode #partnerInquiryView .partnerInquiryListSurface,
body.dashboardMode #partnerInquiryView .partnerInquiryDetailSurface {
  display: grid;
  gap: var(--portal-space-lg);
}

body.dashboardMode #partnerInquiryView .partnerInquiryList {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.dashboardMode #partnerInquiryView .partnerInquiryListCard,
body.dashboardMode #partnerInquiryView .partnerInquiryDetailCard {
  display: grid;
  gap: 12px;
  padding: var(--portal-space-xl);
}

body.dashboardMode #partnerInquiryView .partnerInquiryDetailCard {
  gap: var(--portal-space-xl);
}

body.dashboardMode #partnerInquiryView .partnerInquiryDetailHeading,
body.dashboardMode #partnerInquiryView .partnerInquiryCalculationHead,
body.dashboardMode #partnerInquiryView .partnerInquiryContactCard {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--portal-space-lg);
}

body.dashboardMode #partnerInquiryView .partnerInquiryDetailHeading > div,
body.dashboardMode #partnerInquiryView .partnerInquiryCalculationHead > div {
  display: grid;
  gap: 5px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryDetailHeading span {
  color: #71b9ee;
  font-size: .78rem;
  font-weight: 850;
  letter-spacing: .09em;
  text-transform: uppercase;
}

body.dashboardMode #partnerInquiryView .partnerInquiryDetailHeading > strong {
  color: var(--portal-muted);
  font-size: .84rem;
}

body.dashboardMode #partnerInquiryView .partnerInquiryProgress {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryProgress li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(109, 142, 177, .16);
  border-radius: var(--portal-radius-card);
  color: rgba(201, 216, 234, .55);
}

body.dashboardMode #partnerInquiryView .partnerInquiryProgress li > span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: rgba(109, 142, 177, .12);
  font-size: .78rem;
}

body.dashboardMode #partnerInquiryView .partnerInquiryProgress li > strong {
  min-width: 0;
  font-size: .78rem;
  line-height: 1.3;
}

body.dashboardMode #partnerInquiryView .partnerInquiryProgress li.isReached {
  border-color: rgba(72, 159, 223, .38);
  background: rgba(72, 159, 223, .08);
  color: var(--portal-text);
}

body.dashboardMode #partnerInquiryView .partnerInquiryProgress li.isReached > span {
  background: rgba(72, 159, 223, .24);
  color: #a7ddff;
}

body.dashboardMode #partnerInquiryView .partnerInquiryDetailGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--portal-space-md);
}

body.dashboardMode #partnerInquiryView .partnerInquiryDetailSection,
body.dashboardMode #partnerInquiryView .partnerInquiryContactCard,
body.dashboardMode #partnerInquiryView .partnerInquiryCalculationCard {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: clamp(18px, 2.5vw, 26px);
  border: 1px solid rgba(72, 159, 223, .17);
  border-radius: var(--portal-radius-card);
  background: rgba(2, 9, 25, .48);
}

body.dashboardMode #partnerInquiryView .partnerInquiryDetailSectionWide {
  grid-column: 1 / -1;
}

body.dashboardMode #partnerInquiryView .partnerInquirySectionLabel {
  color: #71b9ee;
  font-size: .74rem;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

body.dashboardMode #partnerInquiryView .partnerInquiryDetailSection > p,
body.dashboardMode #partnerInquiryView .partnerInquiryContactCard p,
body.dashboardMode #partnerInquiryView .partnerInquiryCalculationCard p,
body.dashboardMode #partnerInquiryView .partnerInquiryContactCard h4,
body.dashboardMode #partnerInquiryView .partnerInquiryCalculationCard h4 {
  margin: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryDetailRow {
  display: grid;
  grid-template-columns: minmax(100px, .55fr) minmax(0, 1fr);
  gap: 12px;
  padding-top: 9px;
  border-top: 1px solid rgba(72, 159, 223, .1);
}

body.dashboardMode #partnerInquiryView .partnerInquiryDetailRow > span,
body.dashboardMode #partnerInquiryView .partnerInquiryAttachmentList span {
  color: var(--portal-muted);
  font-size: .86rem;
}

body.dashboardMode #partnerInquiryView .partnerInquiryDetailRow > strong {
  min-width: 0;
  overflow-wrap: anywhere;
  text-align: right;
}

body.dashboardMode #partnerInquiryView .partnerInquiryAttachmentList {
  display: grid;
  gap: 9px;
  margin: 0;
  padding: 0;
  list-style: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryAttachmentList li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 10px;
  background: rgba(72, 159, 223, .07);
}

body.dashboardMode #partnerInquiryView .partnerInquiryContactCard {
  grid-template-columns: minmax(0, 1fr) auto;
}

body.dashboardMode #partnerInquiryView .partnerInquiryContactCard > div:first-child {
  display: grid;
  gap: 5px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryCalculationCard {
  gap: var(--portal-space-md);
  border-color: rgba(72, 159, 223, .3);
  background:
    radial-gradient(circle at 10% 0%, rgba(72, 159, 223, .12), transparent 38%),
    rgba(2, 9, 25, .56);
}

body.dashboardMode #partnerInquiryView .partnerInquiryCalculationCard form,
body.dashboardMode #partnerInquiryView .partnerInquiryCalculationAction {
  display: grid;
  grid-template-columns: minmax(210px, .55fr) minmax(0, 1fr) auto;
  align-items: end;
  gap: var(--portal-space-md);
}

body.dashboardMode #partnerInquiryView .partnerInquiryCalculationCard form > p,
body.dashboardMode #partnerInquiryView .partnerInquiryCalculationAction > p {
  align-self: center;
}

body.dashboardMode #partnerInquiryView .partnerInquiryAcceptedText {
  color: #9de4bd;
  font-weight: 800;
}

body.dashboardMode #partnerInquiryView.partnerInquiryWorkspace.is-record-view {
  width: min(100%, 1440px);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecord {
  display: grid;
  gap: var(--portal-space-xl);
  min-width: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordToolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--portal-space-md);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordBack {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  margin: 0;
  padding: 9px 14px;
  border: 1px solid rgba(72, 159, 223, .28);
  border-radius: 999px;
  background: rgba(72, 159, 223, .08);
  color: #b9dcf5;
  text-decoration: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordBack:hover,
body.dashboardMode #partnerInquiryView .partnerInquiryRecordBack:focus-visible {
  border-color: rgba(72, 159, 223, .58);
  background: rgba(72, 159, 223, .16);
  color: var(--portal-text);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordHero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: clamp(20px, 3vw, 34px);
  padding: clamp(24px, 4vw, 46px);
  border: 1px solid rgba(72, 159, 223, .26);
  border-radius: var(--portal-radius-surface);
  background:
    radial-gradient(circle at 8% 0%, rgba(72, 159, 223, .2), transparent 34%),
    linear-gradient(145deg, rgba(9, 30, 63, .98), rgba(2, 10, 27, .96));
  box-shadow: var(--portal-shadow);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordIdentity {
  display: grid;
  align-content: start;
  gap: 10px;
  min-width: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordEyebrow,
body.dashboardMode #partnerInquiryView .partnerInquiryRecordPanelHead > span,
body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavigation > span {
  color: #71b9ee;
  font-size: .75rem;
  font-weight: 850;
  letter-spacing: .09em;
  text-transform: uppercase;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordIdentity h2 {
  margin: 0;
  color: var(--portal-text);
  font-size: clamp(30px, 4vw, 52px);
  line-height: 1.03;
  outline: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordFacts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  color: var(--portal-muted);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordFacts span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 5px 10px;
  border: 1px solid rgba(72, 159, 223, .15);
  border-radius: 999px;
  background: rgba(2, 9, 25, .32);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordStatus {
  display: grid;
  align-content: start;
  justify-items: end;
  gap: 10px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordStatus > strong {
  color: var(--portal-muted);
  font-size: .84rem;
  letter-spacing: .04em;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordHero > .partnerInquiryProgress {
  grid-column: 1 / -1;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordLayout {
  display: grid;
  grid-template-columns: minmax(200px, 238px) minmax(0, 1fr);
  align-items: start;
  gap: clamp(18px, 3vw, 34px);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavigation {
  position: sticky;
  top: 18px;
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: rgba(4, 17, 40, .94);
  box-shadow: var(--portal-shadow);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavigation > span {
  padding: 8px 10px 10px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavItem {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  background-image: none;
  color: var(--portal-muted);
  font: inherit;
  font-weight: 750;
  text-align: left;
  cursor: pointer;
  box-shadow: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavItem:hover,
body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavItem:focus-visible {
  color: var(--portal-text);
  background: rgba(72, 159, 223, .08);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavItem.is-active {
  border-color: rgba(72, 159, 223, .28);
  background: rgba(72, 159, 223, .18);
  color: #cceaff;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordContent {
  min-width: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordPanel {
  display: grid;
  gap: var(--portal-space-xl);
  min-height: 420px;
  padding: clamp(22px, 3.5vw, 40px);
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-surface);
  background:
    radial-gradient(circle at 0% 0%, rgba(72, 159, 223, .1), transparent 32%),
    rgba(3, 13, 32, .94);
  box-shadow: var(--portal-shadow);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordPanel.hidden {
  display: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordPanelHead {
  display: grid;
  gap: 6px;
  padding-bottom: var(--portal-space-md);
  border-bottom: 1px solid rgba(72, 159, 223, .13);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordPanelHead h3 {
  margin: 0;
  color: var(--portal-text);
  font-size: clamp(24px, 3vw, 34px);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordDecision {
  display: grid;
  gap: var(--portal-space-lg);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordDecision > .formMessage:empty {
  display: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryListCardHead {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryListCard h3,
body.dashboardMode #partnerInquiryView .partnerInquiryListCard p,
body.dashboardMode #partnerInquiryView .partnerInquiryDetailCard h3 {
  margin: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryReference {
  color: var(--portal-muted);
  font-size: .8rem;
  font-weight: 800;
}

body.dashboardMode #partnerInquiryView .partnerInquiryEmptyState,
body.dashboardMode #partnerInquiryView .partnerInquirySuccess {
  display: grid;
  justify-items: start;
  gap: var(--portal-space-md);
  padding: clamp(24px, 5vw, 52px);
}

body.dashboardMode #partnerInquiryView .partnerInquirySuccessIcon {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: 999px;
  background: rgba(72, 159, 223, .2);
  color: #87cdfb;
  font-size: 1.5rem;
  font-weight: 900;
}

body.dashboardMode #partnerInquiryView .partnerInquirySuccess h2 {
  margin: 0;
  color: var(--portal-text);
}

@media (max-width: 900px) {
  body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionSectionCompact .partnerHomePremiumGrid,
  body.dashboardMode #partnerInquiryView .partnerInquiryList {
    grid-template-columns: 1fr !important;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryProgress {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryContactCard,
  body.dashboardMode #partnerInquiryView .partnerInquiryCalculationCard form,
  body.dashboardMode #partnerInquiryView .partnerInquiryCalculationAction {
    grid-template-columns: 1fr;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryRecordLayout {
    grid-template-columns: 1fr;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavigation {
    position: static;
    grid-template-columns: repeat(4, minmax(150px, 1fr));
    overflow-x: auto;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavigation > span {
    display: none;
  }
}

@media (max-width: 760px) {
  body.dashboardMode #partnerInquiryView .formGrid,
  body.dashboardMode #partnerInquiryView .partnerInquiryChoiceGrid,
  body.dashboardMode #partnerInquiryView .partnerInquiryReview {
    grid-template-columns: 1fr;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryDetailGrid,
  body.dashboardMode #partnerInquiryView .partnerInquiryProgress {
    grid-template-columns: 1fr;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryDetailSectionWide {
    grid-column: auto;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryDetailHeading,
  body.dashboardMode #partnerInquiryView .partnerInquiryCalculationHead,
  body.dashboardMode #partnerInquiryView .partnerInquiryContactCard,
  body.dashboardMode #partnerInquiryView .partnerInquiryAttachmentList li {
    align-items: stretch;
    flex-direction: column;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryRecordToolbar,
  body.dashboardMode #partnerInquiryView .partnerInquiryRecordHero {
    grid-template-columns: 1fr;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryRecordToolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryRecordStatus {
    justify-items: start;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavigation {
    grid-template-columns: repeat(4, minmax(135px, 1fr));
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryRecordPanel {
    min-height: 0;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryDetailRow {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryDetailRow > strong {
    text-align: left;
  }

  body.dashboardMode #partnerInquiryView .fullWidth {
    grid-column: auto;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryWizardActions > button,
  body.dashboardMode #partnerInquiryView .partnerInquirySuccess .formActions > button {
    flex: 1 1 100%;
  }
}

/* Partner inquiry V2 final cascade boundary. */
body.dashboardMode #partnerInquiryView .partnerInquiryWizard {
  min-height: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepButton::before,
body.dashboardMode #partnerInquiryView .partnerInquiryStepButton.isComplete::before {
  content: none !important;
  display: none !important;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordSubsection.partnerInquiryContactCard,
body.dashboardMode #partnerInquiryView .partnerInquiryRecordSubsection.partnerInquiryCalculationCard {
  padding: 0 0 var(--portal-space-lg);
  border: 0;
  border-bottom: 1px solid rgba(72, 159, 223, .13);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordSubsection.partnerInquiryCalculationCard:last-child,
body.dashboardMode #partnerInquiryView .partnerInquiryRecordSubsection.partnerInquiryContactCard:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryListLead {
  margin: 0;
  color: var(--portal-muted);
}

body.dashboardMode #partnerInquiryView .partnerInquiryMissingSummary:not(.hidden) {
  display: grid;
  gap: 8px;
  padding: 14px 16px;
  border: 1px solid rgba(246, 154, 154, .45);
  border-radius: 12px;
  background: rgba(126, 36, 48, .16);
  color: #ffd9dc;
}

body.dashboardMode #partnerInquiryView .partnerInquiryMissingSummary ul {
  display: grid;
  gap: 4px;
  margin: 0;
  padding-left: 20px;
}

body.dashboardMode #partnerInquiryView .portalSelectTrigger:hover,
body.dashboardMode #partnerInquiryView .portalSelectTrigger:focus-visible,
body.dashboardMode #partnerInquiryView .portalSelectTrigger.isOpen {
  border-color: rgba(113, 185, 238, .68);
  background: rgba(11, 32, 62, .94);
  color: #f5f9ff;
  box-shadow: none;
}

body.dashboardMode #partnerInquiryView .portalSelectTrigger:hover * {
  color: inherit;
}

body.dashboardMode #partnerInquiryView .portalSelectTrigger[aria-invalid="true"] {
  border-color: #f69a9a;
}

body.dashboardMode.partnerInquiryMode .dashboardHeadModern:not(.hidden) {
  min-height: clamp(180px, 18vw, 220px) !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas: "identity" !important;
  align-content: end !important;
  gap: 0 !important;
  padding: clamp(24px, 3.5vw, 42px) !important;
  background-position: center 44%;
  background-size: cover;
}

body.dashboardMode.partnerInquiryMode .dashboardHeadModern:not(.hidden) .dashboardIdentity {
  max-width: 760px !important;
  gap: 8px !important;
  padding-top: 0 !important;
}

body.dashboardMode.partnerInquiryMode .dashboardHeadModern:not(.hidden) #welcomeTitle {
  font-size: clamp(30px, 4.2vw, 52px) !important;
  line-height: 1.02 !important;
}

@media (max-width: 760px) {
  body.dashboardMode.partnerInquiryMode .dashboardHeadModern:not(.hidden) {
    min-height: clamp(140px, 38vw, 180px) !important;
    padding: 22px 18px !important;
  }

  body.dashboardMode.partnerInquiryMode .dashboardHeadModern:not(.hidden) #welcomeTitle {
    font-size: clamp(27px, 9vw, 38px) !important;
  }
}

/* Partner home closure: the hero contains identity only and must wrap on narrow screens. */
body.dashboardMode.partnerDashboardHome:not(.profileStandaloneView) .dashboardHeadModern:not(.hidden) {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas: "identity" !important;
  align-content: end !important;
  gap: 0 !important;
}

body.dashboardMode.partnerDashboardHome:not(.profileStandaloneView) .advisorCard,
body.dashboardMode.partnerDashboardHome:not(.profileStandaloneView) .employeePhotoButton {
  display: none !important;
}

body.dashboardMode.partnerDashboardHome:not(.profileStandaloneView) .dashboardIdentity {
  min-width: 0 !important;
  max-width: 100% !important;
}

body.dashboardMode.partnerDashboardHome:not(.profileStandaloneView) #welcomeTitle {
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere;
  word-break: normal;
}

@media (max-width: 760px) {
  body.dashboardMode.partnerDashboardHome:not(.profileStandaloneView) .dashboardHeadModern:not(.hidden) {
    min-height: clamp(132px, 38vw, 174px) !important;
    padding: 22px 18px !important;
  }

  body.dashboardMode.partnerDashboardHome:not(.profileStandaloneView) #welcomeTitle {
    font-size: clamp(28px, 8.4vw, 36px) !important;
    line-height: 1.06 !important;
  }
}

/* Partner portal typography closure: keep Poppins, restore a readable hierarchy. */
body.portalPartner.rolePartner :is(#dashboardView, #partnerOrderView, #profileView, #partnerSubmitModal, #appLoadingModal, #sidebarNotificationPanel, #hamburgerMenuPanel) {
  font-weight: 400;
}

body.portalPartner.rolePartner
  :is(#dashboardView, #partnerOrderView, #profileView, #partnerSubmitModal, #appLoadingModal, #sidebarNotificationPanel, #hamburgerMenuPanel)
  :is(p, li, td, dd, small, span, input, select, textarea, option, .mutedText, .formHint) {
  font-weight: 400 !important;
}

body.portalPartner.rolePartner
  :is(#dashboardView, #partnerOrderView, #profileView, #partnerSubmitModal, #appLoadingModal, #sidebarNotificationPanel, #hamburgerMenuPanel)
  :is(button, label, legend, a, .sidebarNavButton, .sidebarInlineLogoutButton, .sidebarInlineAdminPortalButton, .partnerInquiryRecordNavItem, .partnerInquiryStepButton, .partnerOrderWizardStepButton, .partnerOrderDetailTab),
body.portalPartner.rolePartner
  :is(#dashboardView, #partnerOrderView, #profileView, #partnerSubmitModal, #appLoadingModal, #sidebarNotificationPanel, #hamburgerMenuPanel)
  :is(button, a) > span,
body.portalPartner.rolePartner
  :is(#dashboardView, #partnerOrderView, #profileView, #partnerSubmitModal, #appLoadingModal, #sidebarNotificationPanel, #hamburgerMenuPanel)
  .partnerHomeActionCard > span:not(.partnerHomeActionIcon) {
  font-weight: 500 !important;
}

body.portalPartner.rolePartner
  :is(#dashboardView, #partnerOrderView, #profileView, #partnerSubmitModal, #appLoadingModal, #sidebarNotificationPanel, #hamburgerMenuPanel)
  :is(h3, h4, h5, h6, strong, th, .step, .status, .ap-badge, .reviewStatus, .notificationItemState, .sidebarNotificationCount, .sidebarSectionTitleButton, .partnerInquiryRecordEyebrow, .partnerInquiryRecordStatus > strong, .partnerInquiryRecordPanelHead > span, .partnerInquiryWorkspaceHeader > span, .partnerInquiryStepIntro > span, .partnerHomeSectionHead > span) {
  font-weight: 600 !important;
}

body.portalPartner.rolePartner
  :is(#dashboardView, #partnerOrderView, #profileView, #partnerSubmitModal, #appLoadingModal, #sidebarNotificationPanel, #hamburgerMenuPanel)
  :is(h1, h2, #welcomeTitle, .partnerInquiryRecordIdentity h2) {
  font-weight: 700 !important;
}

body.portalPartner.rolePartner #dashboardView #partnerInquiryView.partnerInquiryWorkspace {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body.portalPartner.rolePartner #dashboardView #partnerInquiryView.partnerInquiryWorkspace::before {
  content: none !important;
  display: none !important;
}

body.portalPartner.rolePartner #dashboardView #partnerInquiryView .partnerInquiryRecordToolbar {
  padding: 0 !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* Portal Light Workspace V1: authoritative authenticated surface boundary. */
body.dashboardMode {
  color-scheme: light;
  --ap-ui-page: #edf6fc;
  --ap-ui-surface: var(--portal-surface-default);
  --ap-ui-surface-strong: var(--portal-surface-active);
  --ap-ui-card: var(--portal-surface-muted);
  --ap-ui-card-soft: rgba(234, 244, 251, .72);
  --ap-ui-control: rgba(255, 255, 255, .9);
  --ap-ui-border: var(--portal-surface-border);
  --ap-ui-border-strong: var(--portal-surface-border-active);
  --ap-ui-text: var(--portal-text-primary);
  --ap-ui-muted: var(--portal-text-muted);
  --ap-ui-muted-strong: var(--portal-text-secondary);
  --ap-ui-shadow: var(--portal-shadow-soft);
  --portal-bg: var(--ap-ui-page);
  --portal-surface: var(--portal-surface-default);
  --portal-surface-soft: var(--portal-surface-muted);
  --portal-card: var(--portal-surface-muted);
  --portal-border: var(--portal-surface-border);
  --portal-border-strong: var(--portal-surface-border-active);
  --portal-text: var(--portal-text-primary);
  --portal-muted: var(--portal-text-muted);
  --portal-shadow: var(--portal-shadow-soft);
  --ink: var(--portal-text-primary);
  --muted: var(--portal-text-muted);
  --line: var(--portal-surface-border);
  --surface: var(--portal-surface-default);
  --field: rgba(255, 255, 255, .9);
  background: var(--portal-workspace-bg);
  color: var(--portal-text-primary);
}

/* Reset legacy cinematic page overlays after their declarations. */
body.dashboardMode::before,
body.dashboardMode::after {
  content: none;
  display: none;
}

body.dashboardMode .shell {
  width: min(1920px, calc(100% - 24px));
}

body.dashboardMode .appContent {
  min-height: calc(100dvh - 24px);
  color: var(--portal-text-primary);
  background: transparent;
}

body.dashboardMode .appContent :is(h1, h2, h3, h4, h5, h6, legend, label, dt, dd, strong, th) {
  color: var(--portal-text-primary);
}

body.dashboardMode .appContent :is(p, li, small, figcaption, .mutedText, .tableSubtext, .formHint) {
  color: var(--portal-text-secondary);
}

body.dashboardMode .appContent :is(.error, .errorMessage, .dangerText, [role="alert"]) {
  color: #9f2434;
}

body.dashboardMode .appContent :is(p, li, dd, td, a, span, strong, small, label) {
  overflow-wrap: anywhere;
  word-break: normal;
}

body.dashboardMode .dashboardHeadModern:not(.hidden) {
  min-height: 0;
  padding: clamp(24px, 3vw, 38px);
  overflow: hidden;
  border: 1px solid var(--portal-surface-border);
  border-radius: var(--portal-radius-lg);
  background: var(--portal-surface-default);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
  backdrop-filter: blur(var(--portal-backdrop-blur)) saturate(1.08);
  -webkit-backdrop-filter: blur(var(--portal-backdrop-blur)) saturate(1.08);
}

body.dashboardMode .dashboardHeadModern::before,
body.dashboardMode .dashboardHeadModern::after {
  content: none;
  display: none;
}

body.dashboardMode .dashboardHeadModern :is(#welcomeTitle, #dashboardRole, .step, span, strong, small) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode .dashboardHeadModern :is(.advisorCard, .dashboardActions) {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode .appContent :where(
  .ap-card,
  .portalSurface,
  .partnerInquirySurface,
  .projectRecordDefinition > div,
  .projectRecordMediaItem,
  .projectRecordDocumentList > a,
  .partnerInquiryDetailRow,
  .partnerInquiryReviewRow,
  .partnerInquiryUploadItem,
  .partnerInquiryDocumentCard
) {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode .appContent :where(
  .recommendationForm,
  .reviewBox,
  .noticeBox,
  .customerActionBox,
  .partnerActionBox,
  .tableWrap:not(.reonicKanbanWrap),
  .statisticsPanel,
  .statisticsHero,
  .statisticsBlock,
  .upcomingAppointments,
  .montageCalendarPanel,
  .montageCalendarShell,
  .montageCalendarHero,
  .montageCalendarToolbar,
  .montageCalendarEventForm,
  .montageCalendarGrid,
  .adminSummary,
  .creditSummary,
  .partnerProjectsMapPanel,
  .partnerProjectsPanel,
  .partnerInquiryWorkspace,
  .partnerInquiryRecordHero,
  .partnerInquiryRecordNavigation,
  .partnerInquiryRecordPanel,
  .projectRecordHero,
  .projectRecordNavigation,
  .projectRecordSection,
  .reonicDetailPanel,
  .reviewModalCard,
  .modalCard,
  .partnerSubmitModalCard,
  .orderComponentSelectionModal,
  #accountView,
  #partnerOrderView,
  #adminAccountsPanel,
  #accountingPanel,
  #accountingSettingsPanel,
  #emailAutomationPanel,
  #adminStatisticsPanel,
  #partnerAdminOverviewPanel,
  #partnerOrderDetailBox,
  #partnerAdminDetailBox,
  #partnerAdminEditForm,
  #customerDetailBox,
  #internalRouteState
) {
  border: 1px solid var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
  backdrop-filter: blur(var(--portal-backdrop-blur)) saturate(1.08);
  -webkit-backdrop-filter: blur(var(--portal-backdrop-blur)) saturate(1.08);
}

body.dashboardMode .appContent :where(
  .adminMetric,
  .accountingMetric,
  .statCard,
  .kpiCard,
  .partnerProjectCard,
  .partnerAdminOverviewCard,
  .partnerAdminOrderButton,
  .projectCard,
  .customerCard,
  .emailAutomationItem,
  .emailAutomationCard,
  .accountingInvoiceCard,
  .reonicOptionCard,
  .reonicDocumentCard,
  .protocolDocumentsCard,
  .protocolDocumentItem,
  .calendarCheckCard,
  .upcomingAppointmentCard,
  .partnerOrderAppointmentCard,
  .partnerOrderImageCard,
  .partnerOrderFileCard,
  .complaintProjectOption,
  .partnerProjectsHeader,
  .clickableRow,
  .ap-list-v2-row,
  .partnerInquiryListCard,
  .partnerInquiryRecordSubsection,
  .task-card,
  .task-detail-panel
) {
  border: 1px solid var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode .appContent :where(
  .adminMetric,
  .statCard,
  .partnerProjectCard,
  .partnerAdminOrderButton,
  .emailAutomationItem,
  .reonicOptionCard,
  .upcomingAppointmentCard,
  .partnerOrderAppointmentCard,
  .complaintProjectOption,
  .clickableRow,
  .ap-list-v2-row
):is(:hover, :focus-visible, :active, .active, .is-selected, .ap-card-selected) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode .appContent :where(.projectRecordHero, .partnerInquiryRecordHero) {
  height: auto;
  min-height: 0;
  max-height: none;
  padding: clamp(24px, 3.5vw, 42px);
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode .projectRecordHero :is(h2, h3, p, span, strong),
body.dashboardMode #partnerInquiryView .partnerInquiryRecordHero :is(h2, h3, p, span, strong) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode :where(
  .projectRecordNavigation,
  .partnerInquiryRecordNavigation,
  .reonicDetailTabList,
  .adminAccountTabs,
  .partnerOrderDetailTabs,
  .task-detail-tabs
) {
  border: 1px solid var(--portal-surface-border);
  background: var(--portal-surface-default);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode :where(
  .projectRecordNavItem,
  .partnerInquiryRecordNavItem,
  .reonicDetailTabButton,
  .adminAccountTab,
  .partnerOrderDetailTab,
  .task-detail-tab
) {
  display: flex;
  min-height: 44px;
  align-items: center;
  gap: 10px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--portal-text-secondary);
  box-shadow: none;
}

body.dashboardMode :where(
  .projectRecordNavItem.is-active,
  .projectRecordNavItem[aria-current="page"],
  .partnerInquiryRecordNavItem.is-active,
  .partnerInquiryRecordNavItem[aria-selected="true"],
  .reonicDetailTabButton.is-active,
  .reonicDetailTabButton[aria-selected="true"],
  .adminAccountTab.is-active,
  .adminAccountTab[aria-selected="true"],
  .partnerOrderDetailTab.active,
  .partnerOrderDetailTab[aria-selected="true"],
  .task-detail-tab[aria-selected="true"]
) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode :where(
  .projectRecordSection,
  .partnerInquiryRecordPanel:not(.hidden),
  .partnerOrderDetailPanel:not(.hidden),
  .reonicDetailTabPanel:not(.hidden),
  .task-detail-content
) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode .appContent :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea),
body.dashboardMode :where(.ap-select-v2-trigger, .portalSelectTrigger) {
  border: 1px solid var(--portal-surface-border);
  background-color: rgba(255, 255, 255, .94);
  color: var(--portal-text-primary);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .98), 0 8px 20px rgba(29, 76, 111, .05);
}

body.dashboardMode .appContent select {
  background-image:
    linear-gradient(45deg, transparent 50%, var(--portal-text-secondary) 50%),
    linear-gradient(135deg, var(--portal-text-secondary) 50%, transparent 50%),
    linear-gradient(145deg, rgba(255, 255, 255, .96), rgba(240, 248, 253, .92));
}

body.dashboardMode .appContent select option {
  background: #f8fbfe;
  color: var(--portal-text-primary);
}

body.dashboardMode .appContent :is(input, textarea)::placeholder {
  color: #526b82;
  opacity: 1;
}

body.dashboardMode :where(.ap-select-v2-menu, .portalSelectMenu) {
  border-color: var(--portal-surface-border-active);
  background: rgba(255, 255, 255, .98);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode :where(.ap-select-v2-option, .portalSelectOption) {
  color: var(--portal-text-secondary);
}

body.dashboardMode :where(.ap-select-v2-option, .portalSelectOption):is(:hover, .is-active, .is-selected, [aria-selected="true"]) {
  background: var(--portal-accent-soft);
  color: var(--portal-text-primary);
}

body.dashboardMode .appContent :where(
  .ap-button-primary,
  .primaryButton,
  button[type="submit"]:not(.linkButton):not(.secondaryButton)
) {
  border-color: rgba(24, 113, 177, .42);
  background: linear-gradient(135deg, #3f9cdd, #247fc1);
  color: #ffffff;
  box-shadow: 0 12px 28px rgba(35, 126, 190, .22);
}

body.dashboardMode .appContent .dangerLinkButton,
body.dashboardMode .appContent .linkButton.dangerLinkButton,
body.dashboardMode .appContent .dangerButton {
  border-color: rgba(177, 43, 61, .36);
  background: rgba(255, 241, 243, .94);
  color: #9f2434;
}

/* Shared component normalization for legacy portal feature shells. */
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderTypeCards button,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStep :is(input, select, textarea),
body.dashboardMode.partnerOrderEntryMode #partnerOrderView .portalUploadDropzone {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderTypeCards button:is(:hover, :focus-visible, .active),
body.dashboardMode.partnerOrderEntryMode #partnerOrderView .portalUploadDropzone:is(:hover, :focus-within) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardProgress,
body.dashboardMode .complaintWizardProgress,
body.dashboardMode .partnerPortalStepper {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  color: var(--portal-text-secondary);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton,
body.dashboardMode .complaintWizardStepButton,
body.dashboardMode .partnerPortalStepperStep {
  color: var(--portal-text-secondary);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton::before,
body.dashboardMode .complaintWizardStepButton span,
body.dashboardMode .partnerPortalStepperStep::before,
body.dashboardMode .partnerPortalStepperStep > span {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-secondary);
  box-shadow: 0 0 0 4px rgba(237, 246, 252, .96);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton.active::before,
body.dashboardMode .complaintWizardStepButton.active span,
body.dashboardMode .partnerPortalStepperStep:is(.active, .ap-step-active, [aria-current="step"])::before,
body.dashboardMode .partnerPortalStepperStep:is(.active, .ap-step-active, [aria-current="step"]) > span,
body.dashboardMode .partnerPortalStepperStep.isComplete::before,
body.dashboardMode .partnerPortalStepperStep.isComplete > span {
  border-color: #2f8ecf;
  background: linear-gradient(145deg, #55aae3, #287fbd);
  color: #ffffff;
  box-shadow: 0 0 0 4px rgba(224, 241, 252, .98), 0 8px 22px rgba(44, 133, 194, .2);
}

body.dashboardMode.portalPartner .complaintProjectOption,
body.dashboardMode.rolePartner .complaintProjectOption,
body.dashboardMode.portalPartner .partnerCardInteractive,
body.dashboardMode.rolePartner .partnerCardInteractive {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-color: transparent;
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode.portalPartner .complaintProjectOption:is(:hover, :focus, :focus-visible, :active, .is-selected),
body.dashboardMode.rolePartner .complaintProjectOption:is(:hover, :focus, :focus-visible, :active, .is-selected),
body.dashboardMode.portalPartner .partnerCardInteractive:is(:hover, :focus, :focus-visible, :active, .is-selected),
body.dashboardMode.rolePartner .partnerCardInteractive:is(:hover, :focus, :focus-visible, :active, .is-selected) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  background-color: transparent;
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable thead tr,
body.dashboardMode .tableWrap.reonicTableWrap .reonicTable .tableSortButton {
  border-color: var(--portal-surface-border);
  background: rgba(221, 237, 248, .72);
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable th {
  color: var(--portal-text-secondary);
}

body.dashboardMode #montageCalendarPanel .montageCalendarEventCard,
body.dashboardMode #accountingPanel .accountingMetric,
body.dashboardMode #accountingPanel .accountingInvoiceCard,
body.dashboardMode .ap-kanban-card,
body.dashboardMode .ap-kanban-detail-panel,
body.dashboardMode .ap-kanban-column-body {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode #montageCalendarPanel .montageCalendarEventCard:is(:hover, :focus-within),
body.dashboardMode #accountingPanel .accountingMetric:hover,
body.dashboardMode #accountingPanel .accountingInvoiceCard:is(:hover, :focus-within),
body.dashboardMode .ap-kanban-card:is(:hover, :focus-visible, .is-selected) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode .ap-kanban-card :is(.ap-kanban-card-project, .ap-kanban-card-performance, .ap-kanban-card-date time, .ap-kanban-card-customer),
body.dashboardMode .ap-kanban-detail-panel :is(h2, h3, h4, p, span, strong, small, label),
body.dashboardMode #accountingPanel :is(.accountingMetric, .accountingInvoiceCard) :is(span, small, strong) {
  color: var(--portal-text-secondary);
}

body.dashboardMode .ap-kanban-card :is(.ap-kanban-card-customer, strong),
body.dashboardMode #accountingPanel :is(.accountingMetric, .accountingInvoiceCard) strong {
  color: var(--portal-text-primary);
}

body.dashboardMode .appContent :where(
  .secondaryButton,
  .ap-button-secondary,
  .ghostButton,
  .linkButton,
  .projectRecordStatusToggle,
  .projectRecordStatusCancel
) {
  border: 1px solid var(--portal-surface-border-active);
  background: rgba(255, 255, 255, .78);
  color: #176fae;
  box-shadow: none;
}

body.dashboardMode .appContent button :is(span, strong),
body.dashboardMode .appContent a[class*="button"] :is(span, strong) {
  color: inherit;
}

body.dashboardMode .appContent .tableWrap {
  padding: 0;
  overflow-x: auto;
  background: var(--portal-surface-default);
}

body.dashboardMode .appContent :where(.tableWrap, .statisticsTableWrap) table {
  color: var(--portal-text-primary);
  background: transparent;
}

body.dashboardMode .appContent :where(.tableWrap, .statisticsTableWrap) :is(thead, th) {
  background: rgba(221, 237, 248, .72);
  color: var(--portal-text-primary);
}

body.dashboardMode .appContent :where(.tableWrap, .statisticsTableWrap) :is(th, td) {
  border-color: rgba(43, 119, 173, .13);
  color: var(--portal-text-primary);
}

body.dashboardMode .appContent :where(.tableWrap, .statisticsTableWrap) tbody tr {
  background: rgba(255, 255, 255, .46);
}

body.dashboardMode .appContent :where(.tableWrap, .statisticsTableWrap) tbody tr:hover {
  background: rgba(218, 237, 250, .74);
  color: var(--portal-text-primary);
  box-shadow: inset 3px 0 0 var(--portal-accent);
}

body.dashboardMode :where(.reviewModalOverlay, .modalOverlay, .partnerSubmitModal, .imagePreviewOverlay) {
  background: rgba(6, 18, 38, .56);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

body.dashboardMode :where(.reviewModalCard, .modalCard, .partnerSubmitModalCard, .orderComponentSelectionModal) {
  border: 1px solid var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: 0 34px 90px rgba(6, 31, 55, .26);
}

body.dashboardMode :where(.reviewModalCard, .modalCard, .partnerSubmitModalCard, .orderComponentSelectionModal) :is(h2, h3, h4, p, span, label, strong) {
  color: var(--portal-text-primary);
}

.portalIcon {
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  color: currentColor;
  pointer-events: none;
}

.portalIconMirrored {
  transform: scaleX(-1);
}

.hamburgerMenuPanel button {
  align-items: center;
  gap: 10px;
}

.sidebarSectionTitleMain {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 11px;
}

.sidebarSectionIcon,
.sidebarNavIcon,
.sidebarUtilityIcon {
  width: 21px;
  height: 21px;
  flex-basis: 21px;
}

.projectRecordNavIcon,
.partnerInquiryRecordNavIcon {
  color: #347eaf;
}

.projectRecordMediaIcon {
  width: 24px;
  height: 24px;
  color: var(--portal-accent);
}

body.dashboardMode .appSidebar {
  color-scheme: dark;
  border-color: var(--portal-sidebar-border);
  background: var(--portal-sidebar-bg);
  color: #f4f8fd;
  box-shadow: 0 24px 62px rgba(3, 15, 34, .26), inset 0 1px 0 rgba(255, 255, 255, .08);
}

body.dashboardMode .appSidebar :is(label, p, span, strong, small) {
  color: inherit;
}

body.dashboardMode .appSidebar :is(.sidebarSectionTitleButton, .sidebarNavButton) {
  min-height: 44px;
  color: rgba(235, 244, 252, .8);
}

body.dashboardMode .appSidebar .sidebarSectionTitleButton {
  font-weight: 400;
}

body.dashboardMode .appSidebar .sidebarNavButton {
  padding-inline: 14px;
  gap: 11px;
  font-weight: 400;
}

body.dashboardMode .appSidebar :where(
  .sidebarSectionTitleButton.active,
  .sidebarSectionTitleButton[aria-current="page"],
  .sidebarSection.hasActiveItem > .sidebarSectionTitleButton,
  .sidebarNavButton.active,
  .sidebarNavButton[aria-current="page"]
) {
  border: 1px solid rgba(255, 255, 255, .72);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode .appSidebar :where(
  .sidebarSectionTitleButton.active,
  .sidebarSectionTitleButton[aria-current="page"],
  .sidebarSection.hasActiveItem > .sidebarSectionTitleButton,
  .sidebarNavButton.active,
  .sidebarNavButton[aria-current="page"]
) .portalIcon {
  color: var(--portal-accent);
}

body.dashboardMode .appSidebar .sidebarNavButton[aria-current="page"]::before {
  content: none;
  display: none;
}

/* Keep every selected workspace destination in the same light surface family.
   These explicit selectors intentionally outrank the legacy sidebar/record rules. */
body.dashboardMode .appSidebar .sidebarSection.sidebarSection.hasActiveItem > .sidebarSectionTitleButton.sidebarSectionTitleButton,
body.dashboardMode .appSidebar .sidebarNavButton.sidebarNavButton.active,
body.dashboardMode .appSidebar .sidebarNavButton.sidebarNavButton[aria-current="page"],
body.dashboardMode .projectRecordNavigation .projectRecordNavItem.projectRecordNavItem.is-active,
body.dashboardMode .projectRecordNavigation .projectRecordNavItem.projectRecordNavItem[aria-current="page"],
body.dashboardMode .partnerInquiryRecordNavigation .partnerInquiryRecordNavItem.partnerInquiryRecordNavItem.is-active,
body.dashboardMode .partnerInquiryRecordNavigation .partnerInquiryRecordNavItem.partnerInquiryRecordNavItem[aria-selected="true"] {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  background-color: var(--portal-surface-active);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode .appSidebar :is(input, .sidebarCustomerSearchResults) {
  color-scheme: dark;
}

.sidebarNotificationBell {
  display: grid;
  place-items: center;
}

.loadingCursorPretzel,
.globalLoadingSpinner,
.partnerSubmitModalSpinner,
.addressLookupInlineSpinner {
  border: 3px solid rgba(72, 159, 223, .24);
  border-top-color: var(--portal-accent);
  border-radius: 50%;
  background: transparent;
  box-shadow: none;
}

.globalLoadingSpinner::before {
  content: none;
}

:where(.modalCloseButton, .partnerSubmitModalClose, .imagePreviewClose) {
  font-size: 0;
}

body.dashboardMode :is(button, a[href], input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid #1684ca;
  outline-offset: 3px;
  box-shadow: var(--portal-focus-ring);
}

body.dashboardMode [data-inquiry-record-title]:focus-visible {
  border-radius: var(--portal-radius-sm);
  outline: 3px solid #1684ca;
  outline-offset: 6px;
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  body.dashboardMode {
    --portal-surface-muted: #edf6fc;
    --portal-surface-default: #f7fbfe;
    --portal-surface-active: #ffffff;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.dashboardMode *,
  body.dashboardMode *::before,
  body.dashboardMode *::after {
    scroll-behavior: auto;
    transition-duration: .01ms;
    animation-duration: .01ms;
    animation-iteration-count: 1;
  }
}



@media (max-width: 980px) {
  body.dashboardMode .shell {
    width: 100%;
    padding: 0;
  }

  body.dashboardMode .appLayout {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  body.dashboardMode .appContent {
    min-height: 100dvh;
    padding: 12px;
  }

  body.dashboardMode .appSidebar {
    position: fixed;
    top: 8px;
    bottom: 8px;
    left: 8px;
    z-index: 10020;
    width: min(330px, calc(100vw - 32px));
    max-height: calc(100dvh - 16px);
  }

  body.dashboardMode :where(.projectRecordNavigation, .partnerInquiryRecordNavigation) {
    position: static;
  }
}

@media (max-width: 760px) {
  body.dashboardMode .dashboardHeadModern:not(.hidden),
  body.dashboardMode.partnerInquiryMode .dashboardHeadModern:not(.hidden),
  body.dashboardMode.partnerDashboardHome:not(.profileStandaloneView) .dashboardHeadModern:not(.hidden) {
    min-height: 0;
    padding: 20px;
    border-radius: var(--portal-radius-md);
  }

  body.dashboardMode :where(.projectRecordLayout, .partnerInquiryRecordLayout) {
    grid-template-columns: minmax(0, 1fr);
  }

  body.dashboardMode :where(.projectRecordNavigation, .partnerInquiryRecordNavigation) {
    grid-template-columns: repeat(4, minmax(148px, 1fr));
    overflow-x: auto;
    scroll-snap-type: x proximity;
  }

  body.dashboardMode :where(.projectRecordNavItem, .partnerInquiryRecordNavItem) {
    scroll-snap-align: start;
  }

  body.dashboardMode :where(.reviewModalCard, .modalCard, .partnerSubmitModalCard, .orderComponentSelectionModal) {
    width: min(100%, calc(100vw - 24px));
    max-height: calc(100dvh - 24px);
    overflow-y: auto;
  }

  body.dashboardMode .appContent :where(table, .reonicTable) {
    min-width: 720px;
  }
}

/* Portal Light Workspace V1 — high-specificity legacy compatibility bridge.
   Keep the existing portal contracts while preventing older cinematic rules
   from reintroducing dark work surfaces outside the primary sidebar. */
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderEntryModeSelector,
body.dashboardMode.partnerOrderEntryMode #partnerOrderView .partnerOrderUploadArea,
body.dashboardMode :is(.portalUploadDropzone, .ap-upload, .preparationDropZone, .chatAttachmentField, .partnerOrderUploadArea),
body.dashboardMode.portalPartner #partnerComplaintForm .complaintWizardStep,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardStep,
body.dashboardMode :is(.empty, .emptyState, .adminAccountEmptyState) {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-color: var(--portal-surface-muted);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderEntryModeSelector button,
body.dashboardMode.partnerOrderEntryMode #partnerOrderView .partnerOrderUploadArea input[type="file"] {
  border-color: var(--portal-surface-border);
  background: var(--ap-ui-control);
  background-color: var(--ap-ui-control);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderEntryModeSelector button.active,
body.dashboardMode :is(.portalUploadDropzone, .ap-upload, .preparationDropZone, .chatAttachmentField, .partnerOrderUploadArea):is(:hover, :focus-within) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  background-color: var(--portal-surface-active);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderUploadLabel,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderUploadSection small {
  color: var(--portal-text-secondary);
}

body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailForm .partnerOrderDetailTabs {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-color: var(--portal-surface-muted);
  background-image: none;
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailForm .partnerOrderDetailTab {
  border-color: transparent;
  background: transparent;
  background-color: transparent;
  background-image: none;
  color: var(--portal-text-secondary);
  box-shadow: none;
  font-weight: 600;
}

body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailForm .partnerOrderDetailTab:is(:hover, :focus-visible),
body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailForm .partnerOrderDetailTab.active {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  background-color: var(--portal-surface-active);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode .partnerOrderAppointmentCard.is-cancelled,
body.dashboardMode.partnerOrderDetailOnly .partnerOrderAppointmentCard.is-cancelled {
  border-color: rgba(159, 36, 52, .38);
  background: rgba(255, 239, 241, .94);
  background-color: rgba(255, 239, 241, .94);
  background-image: none;
  color: #7f1f2d;
}

body.dashboardMode #partnerSubmitModal .partnerSubmitPreviewPaper,
body.dashboardMode #partnerSubmitModal .partnerSubmitPreviewRows div,
body.dashboardMode #partnerSubmitModal .partnerSubmitPreviewCosts,
body.dashboardMode .orderComponentSelectionItem,
body.dashboardMode .orderComponentSelectionActions {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-color: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
}

body.dashboardMode #partnerSubmitModal :is(.partnerSubmitPreviewHeader, .partnerSubmitPreviewRows, .partnerSubmitPreviewCosts) :is(strong, span, small),
body.dashboardMode .orderComponentSelectionItem :is(strong, small) {
  color: inherit;
}

body.dashboardMode .orderComponentSelectionItem:hover {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  background-color: var(--portal-surface-active);
  background-image: none;
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode.portalPartner .complaintProjectOption,
body.dashboardMode.rolePartner .complaintProjectOption,
body.dashboardMode.portalPartner .partnerCardInteractive,
body.dashboardMode.rolePartner .partnerCardInteractive {
  background: var(--portal-surface-muted);
  background-color: var(--portal-surface-muted);
  background-image: none;
}

body.dashboardMode.portalPartner .complaintProjectOption:is(:hover, :focus, :focus-visible, :active, .is-selected),
body.dashboardMode.rolePartner .complaintProjectOption:is(:hover, :focus, :focus-visible, :active, .is-selected),
body.dashboardMode.portalPartner .partnerCardInteractive:is(:hover, :focus, :focus-visible, :active, .is-selected),
body.dashboardMode.rolePartner .partnerCardInteractive:is(:hover, :focus, :focus-visible, :active, .is-selected) {
  background: var(--portal-surface-active);
  background-color: var(--portal-surface-active);
  background-image: none;
}

body.dashboardMode .appContent .projectRecordStatusMessage.is-error,
body.dashboardMode .appContent :is(.error, .errorMessage, .dangerText, [role="alert"]) {
  color: #9f2434;
}

body.dashboardMode .appContent .projectRecordStatusMessage.is-warning,
body.dashboardMode .appContent :is(.warningMessage, .warningText) {
  color: #7a5200;
}

body.dashboardMode .appContent :is(.successMessage, .successText) {
  color: #17613f;
}

body.dashboardMode .partnerInquiryRecordNavigation .partnerInquiryRecordNavItem.partnerInquiryRecordNavItem.is-active,
body.dashboardMode .partnerInquiryRecordNavigation .partnerInquiryRecordNavItem.partnerInquiryRecordNavItem[aria-selected="true"],
body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavItem.partnerInquiryRecordNavItem.is-active,
body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavItem.partnerInquiryRecordNavItem[aria-selected="true"],
body.dashboardMode #reonicOrderDetailPanel .projectRecordNavigation .projectRecordNavItem.projectRecordNavItem.is-active,
body.dashboardMode #reonicOrderDetailPanel .projectRecordNavigation .projectRecordNavItem.projectRecordNavItem[aria-current="page"] {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  background-color: var(--portal-surface-active);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordHero,
body.dashboardMode #partnerInquiryView .partnerInquiryRecordPanel:not(.hidden),
body.dashboardMode #reonicOrderDetailPanel .projectRecordHero,
body.dashboardMode #reonicOrderDetailPanel .projectRecordSection,
body.dashboardMode #partnerOrderDetailBox .partnerOrderDetailPanel.active,
body.dashboardMode #customerDetailBox,
body.dashboardMode #partnerAdminDetailBox,
body.dashboardMode #reonicKanbanDetailPanel:not(.hidden) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  background-color: var(--portal-surface-active);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode #reonicOrderDetailPanel .reonicMetaIcon:not(.reonicMetaIcon-status),
body.dashboardMode.partnerOrderDetailOnly .partnerOrderHeroIcon {
  border: 1px solid var(--portal-surface-border-active);
  border-radius: 9px;
  background: var(--portal-accent-soft);
  color: var(--portal-accent);
  box-shadow: none;
  transform: none;
}

body.dashboardMode #reonicOrderDetailPanel .reonicMetaIcon-status {
  border: 0;
  background: var(--portal-accent);
  box-shadow: 0 0 0 6px var(--portal-accent-soft);
}

/* The former photographic order-detail heroes are workspace surfaces now.
   This final boundary deliberately outranks their legacy role-specific rules. */
body.dashboardMode.roleAdmin #reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record),
body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailBox.reviewBox {
  min-height: 0;
  padding: clamp(24px, 3vw, 38px);
  border: 1px solid var(--portal-surface-border-active);
  border-radius: var(--portal-radius-lg);
  background: var(--portal-surface-default);
  background-color: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode.roleAdmin #reonicOrderDetailPanel.reonicDetailPanel:not(.is-project-record)::before,
body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailBox.reviewBox::before {
  content: none;
  display: none;
  background: none;
}

body.dashboardMode.roleAdmin #reonicOrderDetailPanel .formHead,
body.dashboardMode.partnerOrderDetailOnly .partnerOrderDetailHead {
  max-width: none;
  margin: 0 0 18px;
  gap: 16px;
}

body.dashboardMode.roleAdmin #reonicOrderDetailPanel #reonicDetailTitle,
body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailTitle {
  max-width: none;
  margin: 0;
  color: var(--portal-text-primary);
  font-size: clamp(28px, 3vw, 44px);
  font-weight: 700;
  line-height: 1.08;
  text-shadow: none;
}

body.dashboardMode.roleAdmin #reonicOrderDetailPanel #reonicDetailMeta,
body.dashboardMode.partnerOrderDetailOnly .partnerOrderDetailMeta {
  max-width: none;
  margin: 0 0 24px;
  color: var(--portal-text-secondary);
}

body.dashboardMode.roleAdmin #reonicOrderDetailPanel .reonicCustomerMeta :is(strong, a),
body.dashboardMode.partnerOrderDetailOnly .partnerOrderHeroMetaItem :is(strong, a) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode.partnerOrderDetailOnly .partnerOrderHeroMetaItem small {
  color: var(--portal-text-secondary);
  text-shadow: none;
}

body.dashboardMode.partnerOrderDetailOnly .partnerOrderHeroStatus,
body.dashboardMode.roleAdmin #reonicOrderDetailPanel .reonicMetaStatus {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode.roleAdmin #reonicOrderDetailPanel #closeReonicDetailButton {
  min-height: 44px;
  color: var(--portal-accent);
  text-shadow: none;
}

body.dashboardMode.roleAdmin #reonicOrderDetailPanel :where(
  .reonicDetailTabList,
  .reonicOptionCard,
  .calendarCheckCard,
  .reonicDocumentCard,
  .protocolDocumentsCard,
  .orderChangeBox,
  .customerImagesCard,
  .reonicEmailHistoryCard,
  .billingCard,
  .deliveryDateBox,
  .preparationUploadCard,
  .substructureBox
) {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-color: var(--portal-surface-muted);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode.roleAdmin #reonicOrderDetailPanel :where(
  .calendarCheckItem,
  .reonicDocumentLink,
  .protocolDocumentItem,
  .customerImageSection,
  .preparationDropZone,
  .preparationImageSummary span,
  .preparationImageCard,
  .customerImageThumb,
  .reonicImageThumb,
  .emailHistoryItem,
  .componentGroup li,
  .substructureSummaryCard,
  .billingSummaryBox,
  .billingPaymentPanel,
  .smartMeterBox,
  .roofTileWarning
) {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-color: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode.roleAdmin #reonicOrderDetailPanel .reonicDetailTabButton {
  min-height: 44px;
  border-color: transparent;
  background: transparent;
  color: var(--portal-text-secondary);
  box-shadow: none;
}

body.dashboardMode.roleAdmin #reonicOrderDetailPanel .reonicDetailTabButton:is(.is-active, :hover, :focus-visible) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode.roleAdmin #reonicOrderDetailPanel :is(input, select, textarea) {
  border-color: var(--portal-surface-border);
  background: var(--ap-ui-control);
  color: var(--portal-text-primary);
}

body.dashboardMode.roleAdmin #reonicOrderDetailPanel :is(
  .reonicOptionHead span,
  .reonicDocumentBadge,
  .customerImageSectionHead span,
  .protocolDocumentItem span,
  .emailHistoryItem span,
  .emailHistoryItem small,
  .mutedText
) {
  color: var(--portal-text-secondary);
}

body.dashboardMode.roleAdmin #reonicOrderDetailPanel :is(
  .reonicOptionHead strong,
  .reonicDocumentLink strong,
  .customerImageSectionHead strong,
  .protocolDocumentItem strong,
  .emailHistoryItem strong
) {
  color: var(--portal-text-primary);
}

body.dashboardMode :is(.sidebarInlineLogoutButton, .sidebarInlineAdminPortalButton, .modalCloseButton, .imagePreviewClose, .partnerSubmitModalClose) {
  min-width: 44px;
  min-height: 44px;
}

/* Portal Light Workspace V1: shared feature-shell normalization. */
body.dashboardMode.partnerOrderEntryMode #partnerModulePowerBlock,
body.dashboardMode.portalReferral .customerActionBox.ap-card,
body.dashboardMode.portalReferral #creditSummary.creditSummary > .ap-card,
body.dashboardMode.portalReferral :is(.emailHistoryList, .emailHistoryItem),
body.dashboardMode #montageCalendarPanel .montageCalendarShell.portalSurface,
body.dashboardMode #montageCalendarPanel .montageCalendarViewSwitch,
body.dashboardMode #montageCalendarPanel .montageCalendarEventForm,
body.dashboardMode #montageCalendarPanel .montageCalendarWeekColumn,
body.dashboardMode #accountingPanel.recommendationForm:not(.hidden),
body.dashboardMode #accountingSettingsPanel.recommendationForm:not(.hidden),
body.dashboardMode #emailAutomationPanel .emailAutomationPreviewPaper,
body.dashboardMode .substructureBox .substructureToggle,
body.dashboardMode.roleAdmin .substructureBox .substructureToggle,
body.dashboardMode.roleEmployee .substructureBox .substructureToggle {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-color: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode #montageCalendarPanel :is(.montageCalendarWeekColumn, .montageCalendarEventForm),
body.dashboardMode #accountingPanel :is(.accountingMetric, .accountingInvoiceCard),
body.dashboardMode.portalReferral #creditSummary.creditSummary > .ap-card,
body.dashboardMode.portalReferral :is(.emailHistoryList, .emailHistoryItem),
body.dashboardMode #emailAutomationPanel :is(.emailAutomationPreviewSystemBlock, .emailAutomationPreviewSignature),
body.dashboardMode.roleAdmin #reonicOrderDetailPanel :is(.substructureToggle, .partnerOrderDetailPanel, .chatMessage, .chatReplyQuote),
body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailBox :is(.partnerOrderDetailPanel, .partnerOrderHeroMetaItem, .partnerOrderAttachmentSection, .partnerOrderImageCard, .partnerOrderFileCard, .chatBox, .chatMessage, .chatReplyQuote),
body.dashboardMode.partnerOrderDetailOnly #partnerOrderReplyPreview {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-color: var(--portal-surface-muted);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode #montageCalendarPanel :is(.montageCalendarWeekColumn, .montageCalendarEventForm, .montageCalendarViewSwitch) :is(strong, span, small, label),
body.dashboardMode #accountingPanel :is(.accountingMetric, .accountingInvoiceCard) :is(strong, span, small, p),
body.dashboardMode #emailAutomationPanel .emailAutomationPreviewPaper :is(strong, span, small, p),
body.dashboardMode .substructureBox .substructureToggle :is(strong, span),
body.dashboardMode.roleAdmin #reonicOrderDetailPanel :is(.substructureToggle, .partnerOrderDetailPanel, .chatMessage, .chatReplyQuote) :is(strong, span, small, p),
body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailBox :is(.partnerOrderDetailPanel, .partnerOrderHeroMetaItem, .partnerOrderAttachmentSection, .partnerOrderImageCard, .partnerOrderFileCard, .chatBox, .chatMessage, .chatReplyQuote) :is(strong, span, small, p),
body.dashboardMode.partnerOrderDetailOnly #partnerOrderReplyPreview :is(strong, span) {
  color: inherit;
  text-shadow: none;
}

body.dashboardMode.portalPartner.partnerDashboardHome button.partnerHomeActionCard:is(:hover, :focus, :focus-visible),
body.dashboardMode.rolePartner.partnerDashboardHome button.partnerHomeActionCard:is(:hover, :focus, :focus-visible),
body.dashboardMode #montageCalendarPanel .montageCalendarEventCard:is(:hover, :focus-within),
body.dashboardMode #accountingPanel .accountingMetric:hover,
body.dashboardMode #accountingPanel .accountingInvoiceCard:is(:hover, :focus-within) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  background-color: var(--portal-surface-active);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

#reonicOrderDetailPanel .calendarCheckItem::after {
  content: none;
  display: none;
}

#reonicOrderDetailPanel .calendarCheckItem::before {
  content: none;
  display: none;
}

body.dashboardMode #reonicOrderDetailPanel .calendarCheckIcon {
  position: absolute;
  top: 28px;
  right: 28px;
  display: inline-grid;
  width: 56px;
  height: 56px;
  place-items: center;
  border: 1px solid var(--portal-surface-border-active);
  border-radius: 999px;
  background: var(--portal-accent-soft);
  color: var(--portal-accent);
  box-shadow: none;
}

body.dashboardMode #reonicOrderDetailPanel .calendarCheckIcon .portalIcon {
  width: 28px;
  height: 28px;
}

body.dashboardMode :is(
  .sidebarNotificationButton,
  .sidebarControlButton,
  .sidebarArrowButton,
  .sidebarPinButton,
  .mobileSidebarButton,
  .hamburgerMenuButton,
  .ap-icon-button,
  .tableSortButton,
  .ap-list-v2-sort-button,
  .projectRecordSortButton,
  .attachmentDeleteButton,
  .partnerInquiryAttachmentDelete,
  .imagePreviewPrev,
  .imagePreviewNext,
  .lightboxPrev,
  .lightboxNext,
  #partnerOrderReplyPreview button,
  #partnerOrderMessageForm .chatAttachButton
) {
  min-width: 44px;
  min-height: 44px;
}

body.dashboardMode #partnerProjectsCards .partnerProjectSortButton,
body.dashboardMode .ap-list-v2 .ap-list-v2-sort-button,
body.dashboardMode #reonicOrderDetailPanel .imageDeleteButton,
body.dashboardMode .partnerOrderAttachmentDelete,
body.dashboardMode .sidebarFooter .sidebarNotificationButton,
body.dashboardMode.sidebarCollapsed .sidebarControls,
body.dashboardMode.sidebarCollapsed .sidebarArrowButton,
body.dashboardMode .ap-kanban-detail-head .ap-icon-button {
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
}

body.dashboardMode .ap-view-toggle {
  min-height: 52px;
  padding: 4px;
  border-color: var(--portal-surface-border);
  background: rgba(255, 255, 255, .72);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode .ap-view-toggle-button {
  min-height: 44px;
  color: var(--portal-text-secondary);
}

body.dashboardMode .ap-view-toggle-button:is(:hover, :focus-visible),
body.dashboardMode .ap-view-toggle-button.active {
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
}

body.dashboardMode .ap-kanban-column-more {
  min-height: 44px;
  color: var(--portal-text-primary);
}

body.dashboardMode .ap-kanban-column-more:is(:hover, :focus-visible) {
  background: var(--portal-accent-soft);
  color: #0b466e;
}

body.dashboardMode .ap-kanban-detail-head .ap-icon-button {
  border: 1px solid var(--portal-surface-border);
  background: rgba(255, 255, 255, .78);
  color: var(--portal-text-primary);
}

body.dashboardMode .ap-kanban-detail-head .ap-icon-button:is(:hover, :focus-visible) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: #0d4f7d;
}

body.dashboardMode #partnerInquiryView .portalSelectTrigger:is(:hover, :focus-visible, .isOpen) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  background-color: var(--portal-surface-active);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: 0 0 0 3px var(--portal-accent-soft);
}

/* Semantic status chips retain meaning and accessible contrast on light surfaces. */
body.dashboardMode :is(.status, .reviewStatus, .projectStatusBadge, .partnerStatusBadge, .tag, .badge, .ap-badge) {
  border-color: rgba(33, 108, 158, .3);
  background: rgba(219, 239, 252, .94);
  color: #145d8f;
  box-shadow: none;
}

body.dashboardMode :is(
  .status.in_bearbeitung,
  .status.payout_requested,
  .status.warning,
  .status.is-warning,
  .ap-badge-warning,
  .accountingStatusBadge
) {
  border-color: rgba(154, 99, 0, .34);
  background: rgba(255, 243, 204, .96);
  color: #714800;
}

body.dashboardMode :is(
  .status.ausgezahlt,
  .status.zur_auszahlung_bereit,
  .status.paid,
  .status.success,
  .status.is-success,
  .ap-badge-success,
  .accountingStatusBadge.is-paid
) {
  border-color: rgba(23, 112, 70, .34);
  background: rgba(222, 246, 234, .96);
  color: #125d3a;
}

body.dashboardMode :is(
  .status.danger,
  .status.error,
  .status.is-danger,
  .status.is-error,
  .ap-badge-danger,
  .accountingStatusBadge.is-overdue
) {
  border-color: rgba(159, 36, 52, .32);
  background: rgba(255, 231, 235, .96);
  color: #8c2030;
}

body.dashboardMode :is(.ap-badge-neutral, .accountingStatusBadge.is-cancelled) {
  border-color: rgba(68, 91, 112, .26);
  background: rgba(230, 237, 243, .96);
  color: #3b5368;
}

body.dashboardMode :is(.ap-badge-info, .status.offen, .status.reonicStatus) {
  border-color: rgba(33, 108, 158, .3);
  background: rgba(219, 239, 252, .94);
  color: #145d8f;
}

/* Partner order record: every descendant workspace surface follows the light boundary. */
body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailForm.recommendationForm,
body.dashboardMode.roleAdmin #partnerOrderDetailForm.recommendationForm,
body.dashboardMode.portalPartner #partnerOrderDetailForm.recommendationForm,
body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailBox :is(.partnerOrderChatTop, .chatMessages, .partnerOrderCostEstimate, .chatAttachmentField),
body.dashboardMode.roleAdmin #partnerOrderDetailBox :is(.partnerOrderChatTop, .chatMessages, .partnerOrderCostEstimate, .chatAttachmentField),
body.dashboardMode.portalPartner #partnerOrderDetailBox :is(.partnerOrderChatTop, .chatMessages, .partnerOrderCostEstimate, .chatAttachmentField) {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-color: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailBox :is(.partnerOrderImageCard, .partnerOrderFileLink, .chatMessage, .partnerOrderCostEstimateRow),
body.dashboardMode.roleAdmin #partnerOrderDetailBox :is(.partnerOrderImageCard, .partnerOrderFileLink, .chatMessage, .partnerOrderCostEstimateRow),
body.dashboardMode.portalPartner #partnerOrderDetailBox :is(.partnerOrderImageCard, .partnerOrderFileLink, .chatMessage, .partnerOrderCostEstimateRow) {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-color: var(--portal-surface-muted);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailBox :is(h3, h4, label, small, .mutedText, .step, .partnerOrderDetailMeta, .partnerOrderMetaSeparator, .chatMessageHeader, .chatMessageAuthor, .chatMessageBody, .partnerOrderImageCard span, .partnerOrderFileLink, .partnerOrderFileLink span, .partnerOrderCostEstimate span, .partnerOrderCostEstimate small, .partnerOrderCostEstimateRow strong, .partnerOrderAttachmentHeading),
body.dashboardMode.roleAdmin #partnerOrderDetailBox :is(h3, h4, label, small, .mutedText, .step, .partnerOrderDetailMeta, .partnerOrderMetaSeparator, .chatMessageHeader, .chatMessageAuthor, .chatMessageBody, .partnerOrderImageCard span, .partnerOrderFileLink, .partnerOrderFileLink span, .partnerOrderCostEstimate span, .partnerOrderCostEstimate small, .partnerOrderCostEstimateRow strong, .partnerOrderAttachmentHeading),
body.dashboardMode.portalPartner #partnerOrderDetailBox :is(h3, h4, label, small, .mutedText, .step, .partnerOrderDetailMeta, .partnerOrderMetaSeparator, .chatMessageHeader, .chatMessageAuthor, .chatMessageBody, .partnerOrderImageCard span, .partnerOrderFileLink, .partnerOrderFileLink span, .partnerOrderCostEstimate span, .partnerOrderCostEstimate small, .partnerOrderCostEstimateRow strong, .partnerOrderAttachmentHeading) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailForm :is(input, select, textarea),
body.dashboardMode.roleAdmin #partnerOrderDetailForm :is(input, select, textarea),
body.dashboardMode.portalPartner #partnerOrderDetailForm :is(input, select, textarea),
body.dashboardMode.partnerOrderDetailOnly #partnerOrderMessageForm textarea,
body.dashboardMode.roleAdmin #partnerOrderMessageForm textarea,
body.dashboardMode.portalPartner #partnerOrderMessageForm textarea,
body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailBox input[type="file"],
body.dashboardMode.roleAdmin #partnerOrderDetailBox input[type="file"],
body.dashboardMode.portalPartner #partnerOrderDetailBox input[type="file"] {
  border-color: var(--portal-surface-border);
  background: rgba(255, 255, 255, .94);
  background-color: rgba(255, 255, 255, .94);
  background-image: none;
  color: var(--portal-text-primary);
  -webkit-text-fill-color: var(--portal-text-primary);
  box-shadow: inset 0 1px 0 #ffffff;
}

body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailForm :is(input, select, textarea):focus,
body.dashboardMode.roleAdmin #partnerOrderDetailForm :is(input, select, textarea):focus,
body.dashboardMode.portalPartner #partnerOrderDetailForm :is(input, select, textarea):focus,
body.dashboardMode.partnerOrderDetailOnly #partnerOrderMessageForm textarea:focus,
body.dashboardMode.roleAdmin #partnerOrderMessageForm textarea:focus,
body.dashboardMode.portalPartner #partnerOrderMessageForm textarea:focus {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: 0 0 0 3px var(--portal-accent-soft);
}

body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailBox .reviewStatus.reviewPending,
body.dashboardMode.roleAdmin #partnerOrderDetailBox .reviewStatus.reviewPending,
body.dashboardMode.portalPartner #partnerOrderDetailBox .reviewStatus.reviewPending {
  border-color: rgba(154, 99, 0, .34);
  background: rgba(255, 243, 204, .96);
  color: #714800;
}

body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailBox .reviewStatus.reviewInfo,
body.dashboardMode.roleAdmin #partnerOrderDetailBox .reviewStatus.reviewInfo,
body.dashboardMode.portalPartner #partnerOrderDetailBox .reviewStatus.reviewInfo {
  border-color: rgba(33, 108, 158, .3);
  background: rgba(219, 239, 252, .94);
  color: #145d8f;
}

body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailBox .reviewStatus.reviewDone,
body.dashboardMode.roleAdmin #partnerOrderDetailBox .reviewStatus.reviewDone,
body.dashboardMode.portalPartner #partnerOrderDetailBox .reviewStatus.reviewDone {
  border-color: rgba(23, 112, 70, .34);
  background: rgba(222, 246, 234, .96);
  color: #125d3a;
}

body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailBox .reviewStatus.reviewUnknown,
body.dashboardMode.roleAdmin #partnerOrderDetailBox .reviewStatus.reviewUnknown,
body.dashboardMode.portalPartner #partnerOrderDetailBox .reviewStatus.reviewUnknown,
body.dashboardMode #accountingPanel .accountingStatusBadge.is-cancelled {
  border-color: rgba(68, 91, 112, .26);
  background: rgba(230, 237, 243, .96);
  color: #3b5368;
}

body.dashboardMode #accountingPanel .accountingStatusBadge {
  border-color: rgba(154, 99, 0, .34);
  background: rgba(255, 243, 204, .96);
  color: #714800;
}

body.dashboardMode #accountingPanel .accountingStatusBadge.is-paid {
  border-color: rgba(23, 112, 70, .34);
  background: rgba(222, 246, 234, .96);
  color: #125d3a;
}

body.dashboardMode #accountingPanel .accountingStatusBadge.is-overdue {
  border-color: rgba(159, 36, 52, .32);
  background: rgba(255, 231, 235, .96);
  color: #8c2030;
}

body.dashboardMode.partnerOrderDetailOnly #partnerOrderClearChatButton,
body.dashboardMode.roleAdmin #partnerOrderClearChatButton,
body.dashboardMode.portalPartner #partnerOrderClearChatButton,
body.dashboardMode.partnerOrderDetailOnly #partnerOrderDetailBox .chatMessageActionButton,
body.dashboardMode.roleAdmin #partnerOrderDetailBox .chatMessageActionButton,
body.dashboardMode.portalPartner #partnerOrderDetailBox .chatMessageActionButton {
  min-height: 44px;
}

body.dashboardMode.profileStandaloneView #profileView,
body.dashboardMode.roleAdmin.partnerAccountMode #accountView.panel {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-color: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode.profileStandaloneView #profileView .profileEditor,
body.dashboardMode.roleAdmin.partnerAccountMode .partnerPriceRuleSection,
body.dashboardMode #emailAutomationPanel .emailAutomationCardHeader {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-color: var(--portal-surface-muted);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode #emailAutomationPanel .emailAutomationCardHeader:hover {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  background-color: var(--portal-surface-active);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode.profileStandaloneView #profileView :is(h2, label, .formMessage),
body.dashboardMode.roleAdmin.partnerAccountMode #accountView :is(#accountTitle, #accountIntro, label, small, .partnerPriceRuleSectionHead h4, .partnerPriceRuleSectionHead p) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode.profileStandaloneView #profileView input,
body.dashboardMode.roleAdmin.partnerAccountMode #accountView :is(input, select, textarea) {
  border-color: var(--portal-surface-border);
  background: rgba(255, 255, 255, .94);
  background-color: rgba(255, 255, 255, .94);
  background-image: none;
  color: var(--portal-text-primary);
  -webkit-text-fill-color: var(--portal-text-primary);
  box-shadow: inset 0 1px 0 #ffffff;
}

body.dashboardMode.roleAdmin.partnerAccountMode #accountView :is(input, select, textarea):focus {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: 0 0 0 3px var(--portal-accent-soft);
}

/* Shared portal confirmation and prompt surface. */
.portalDialogOverlay {
  position: fixed;
  inset: 0;
  z-index: 12000;
  display: grid;
  place-items: center;
  padding: clamp(16px, 4vw, 48px);
  overflow: auto;
  background: rgba(3, 16, 29, .58);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  animation: portalDialogFadeIn 140ms ease-out;
}

.portalDialog {
  width: min(100%, 560px);
  max-height: calc(100dvh - 32px);
  overflow: auto;
  border: 1px solid rgba(28, 100, 145, .24);
  border-radius: 24px;
  background: rgba(249, 253, 255, .98);
  color: #10263a;
  box-shadow: 0 28px 80px rgba(1, 19, 34, .32);
  animation: portalDialogEnter 170ms ease-out;
}

.portalDialogHeader {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 26px 26px 0;
}

.portalDialogHeading {
  display: flex;
  align-items: center;
  gap: 13px;
  min-width: 0;
}

.portalDialogHeading h2 {
  margin: 0;
  color: #10263a;
  font: 600 clamp(1.2rem, 3vw, 1.55rem)/1.25 "Poppins", sans-serif;
  letter-spacing: -.02em;
}

.portalDialogHeadingIcon {
  display: inline-grid;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 14px;
  background: rgba(61, 158, 214, .14);
  color: #176b9e;
}

.portalDialog.is-danger .portalDialogHeadingIcon {
  background: rgba(181, 41, 57, .1);
  color: #9f2434;
}

.portalDialogIcon,
.portalDialogButtonIcon {
  width: 21px;
  height: 21px;
}

.portalDialogClose {
  display: inline-grid;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  padding: 0;
  place-items: center;
  border: 1px solid rgba(28, 100, 145, .22);
  border-radius: 14px;
  background: rgba(234, 245, 251, .9);
  color: #244a64;
  cursor: pointer;
}

.portalDialogClose:is(:hover, :focus-visible) {
  border-color: rgba(28, 100, 145, .45);
  background: #dfeff8;
  color: #102f45;
  outline: none;
  box-shadow: 0 0 0 3px rgba(61, 158, 214, .2);
}

.portalDialogForm {
  display: grid;
  gap: 22px;
  padding: 18px 26px 26px;
}

.portalDialogDescription {
  margin: 0;
  color: #4e6475;
  font: 400 .98rem/1.65 "Poppins", sans-serif;
  white-space: pre-line;
}

.portalDialogField {
  display: grid;
  gap: 8px;
}

.portalDialogInputLabel {
  color: #244a64;
  font: 500 .9rem/1.35 "Poppins", sans-serif;
}

.portalDialogInput {
  width: 100%;
  min-height: 48px;
  box-sizing: border-box;
  padding: 11px 14px;
  border: 1px solid rgba(28, 100, 145, .32);
  border-radius: 14px;
  background: #fff;
  color: #10263a;
  font: 400 1rem/1.45 "Poppins", sans-serif;
}

textarea.portalDialogInput {
  min-height: 112px;
  resize: vertical;
}

.portalDialogInput:focus {
  border-color: #2988bd;
  outline: none;
  box-shadow: 0 0 0 3px rgba(61, 158, 214, .2);
}

.portalDialogActions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding-top: 2px;
}

.portalDialogButton {
  display: inline-flex;
  min-width: 132px;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 18px;
  border: 1px solid transparent;
  border-radius: 14px;
  font: 500 .94rem/1.3 "Poppins", sans-serif;
  cursor: pointer;
}

.portalDialogButtonSecondary {
  border-color: rgba(28, 100, 145, .25);
  background: rgba(234, 245, 251, .82);
  color: #244a64;
}

.portalDialogButtonPrimary {
  border-color: #287fae;
  background: #2d8dc0;
  color: #fff;
  box-shadow: 0 8px 20px rgba(40, 127, 174, .18);
}

.portalDialogButtonPrimary.is-danger {
  border-color: #9b2838;
  background: #a92c3e;
  box-shadow: 0 8px 20px rgba(169, 44, 62, .16);
}

.portalDialogButton:is(:hover, :focus-visible) {
  outline: none;
  transform: translateY(-1px);
  box-shadow: 0 0 0 3px rgba(61, 158, 214, .2);
}

.portalDialogButtonPrimary.is-danger:is(:hover, :focus-visible) {
  background: #8e2131;
  box-shadow: 0 0 0 3px rgba(181, 41, 57, .17);
}

@keyframes portalDialogFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes portalDialogEnter {
  from { opacity: 0; transform: translateY(10px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 600px) {
  .portalDialogOverlay {
    align-items: end;
    padding: 12px;
  }

  .portalDialog {
    width: 100%;
    max-height: calc(100dvh - 24px);
    border-radius: 22px;
  }

  .portalDialogHeader {
    padding: 21px 20px 0;
  }

  .portalDialogForm {
    padding: 16px 20px 20px;
  }

  .portalDialogActions {
    flex-direction: column-reverse;
  }

  .portalDialogButton {
    width: 100%;
    min-height: 48px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portalDialogOverlay,
  .portalDialog {
    animation: none;
  }

  .portalDialogButton:is(:hover, :focus-visible) {
    transform: none;
  }
}

/* Final shared component coverage for the authenticated light workspace. */
body.dashboardMode #partnerProjectsCards .partnerProjectCard {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-color: var(--portal-surface-muted);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode #partnerProjectsCards .partnerProjectCard:is(:hover, :focus-visible) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  background-color: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm.recommendationForm,
body.dashboardMode.portalPartner.partnerOrderEntryMode #partnerOrderForm.recommendationForm {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-color: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm :is(label, small, .mutedText, h2, h3, h4, legend),
body.dashboardMode.portalPartner.partnerOrderEntryMode #partnerOrderForm :is(label, small, .mutedText, h2, h3, h4, legend) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm :is(input, select, textarea),
body.dashboardMode.portalPartner.partnerOrderEntryMode #partnerOrderForm :is(input, select, textarea) {
  border-color: var(--portal-surface-border);
  background: rgba(255, 255, 255, .94);
  background-color: rgba(255, 255, 255, .94);
  background-image: none;
  color: var(--portal-text-primary);
  -webkit-text-fill-color: var(--portal-text-primary);
  box-shadow: inset 0 1px 0 #ffffff;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardProgress {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-color: var(--portal-surface-default);
  background-image: none;
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton {
  background: transparent;
  background-color: transparent;
  background-image: none;
  color: var(--portal-text-secondary);
  box-shadow: none;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton::after {
  background: var(--portal-surface-border-active);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton::before {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-secondary);
  box-shadow: 0 0 0 4px rgba(237, 246, 252, .96);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton:is(.active, .isComplete) {
  background: transparent;
  color: var(--portal-text-primary);
}

body.dashboardMode.roleAdmin #emailAutomationPanel .emailAutomationCard,
body.dashboardMode.roleAdmin #emailAutomationPanel .emailAutomationEditor {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-color: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode.roleAdmin #emailAutomationPanel .emailAutomationCard:hover {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  background-color: var(--portal-surface-active);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode.roleAdmin #emailAutomationPanel :is(
  .emailAutomationCardText strong,
  .emailAutomationCardText p,
  .emailAutomationEditor label,
  .emailAutomationEditor label small,
  .emailAutomationEditor .mutedText
) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode.roleAdmin #emailAutomationPanel .emailAutomationEditor textarea {
  border-color: var(--portal-surface-border);
  background: rgba(255, 255, 255, .94);
  color: var(--portal-text-primary);
  -webkit-text-fill-color: var(--portal-text-primary);
  box-shadow: inset 0 1px 0 #ffffff;
}

body.dashboardMode.roleAdmin #accountingSettingsForm,
body.dashboardMode.roleAdmin #accountingSettingsForm label,
body.dashboardMode.roleAdmin #accountingSettingsMessage {
  color: var(--portal-text-primary);
}

body.dashboardMode.roleAdmin #accountingSettingsForm :is(input, textarea) {
  border-color: var(--portal-surface-border);
  background: rgba(255, 255, 255, .94);
  color: var(--portal-text-primary);
  -webkit-text-fill-color: var(--portal-text-primary);
  box-shadow: inset 0 1px 0 #ffffff;
}

body.dashboardMode.portalReferral #dashboardView :is(h2, h3, h4),
body.dashboardMode.portalReferral :is(
  .customerActionBox strong,
  .creditSummary strong,
  .reviewBox strong,
  .tableWrap strong,
  .recommendationForm label,
  .noticeBox label,
  .customerActionBox span,
  .reviewBox .step,
  .tableWrap th,
  .mutedText,
  .customerActionBox p,
  .reviewBox p,
  .noticeBox p,
  .creditSummary span,
  .tableSubtext,
  .tableWrap .mutedText
) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode #emailAutomationPanel .emailAutomationEnableToggle {
  min-height: 44px;
}

body.dashboardMode.roleAdmin.partnerAccountMode #accountView #accountBackButton,
body.dashboardMode.partnerOrderDetailOnly #partnerOrderMessageForm .chatComposerFooter button[type="submit"],
body.dashboardMode.partnerOrderDetailOnly #partnerOrderMessageForm .chatAttachButton {
  min-height: 44px;
}

body.dashboardMode.roleAdmin.partnerAccountMode #accountView #accountBackButton {
  padding: 8px 12px;
}

body.dashboardMode.partnerOrderDetailOnly #partnerOrderMessageForm .chatAttachButton {
  width: 44px;
  height: 44px;
  min-width: 44px;
}

body.dashboardMode .appContent :is(
  .adminMetric,
  .statCard,
  .kpiCard,
  .billingCard,
  .emailAutomationItem,
  .accountingInvoiceCard,
  .reonicOptionCard,
  .reonicDocumentCard,
  .protocolDocumentItem,
  .calendarCheckCard,
  .upcomingAppointmentCard,
  .partnerOrderAppointmentCard,
  .partnerOrderImageCard,
  .partnerOrderFileCard
) {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-color: var(--portal-surface-muted);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode .appContent :is(
  #partnerOrderForm,
  #partnerOrderDetailForm,
  #accountingSettingsForm,
  .recommendationForm,
  .noticeBox,
  .profileEditor,
  .formGrid,
  .partnerInquiryCreateForm,
  .partnerInquiryRevisionForm,
  .partnerInquiryManagerForm
) :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  border-color: var(--portal-surface-border);
  background: rgba(255, 255, 255, .94);
  background-color: rgba(255, 255, 255, .94);
  background-image: none;
  color: var(--portal-text-primary);
  -webkit-text-fill-color: var(--portal-text-primary);
  box-shadow: inset 0 1px 0 #ffffff;
}

body.dashboardMode .appContent :is(
  #partnerOrderForm,
  #partnerOrderDetailForm,
  #accountingSettingsForm,
  .recommendationForm,
  .noticeBox,
  .profileEditor,
  .formGrid,
  .partnerInquiryCreateForm,
  .partnerInquiryRevisionForm,
  .partnerInquiryManagerForm
) :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: 0 0 0 3px var(--portal-accent-soft);
}

/* Component-level ownership closes the remaining legacy visual declarations
   without an override cascade. */
body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavigation,
body.dashboardMode #partnerInquiryView .partnerInquiryRecordPanel,
body.dashboardMode #partnerInquiryView .partnerInquiryRecordSubsection {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode #reonicOrderDetailPanel,
body.dashboardMode #reonicOrderDetailPanel .reonicOptionCard,
body.dashboardMode #reonicOrderDetailPanel.is-project-record .projectRecordHero,
body.dashboardMode #reonicOrderDetailPanel.is-project-record .projectRecordNavigationPanel,
body.dashboardMode #reonicOrderDetailPanel.is-project-record .projectRecordSection,
body.dashboardMode #reonicOrderDetailPanel.is-project-record .projectRecordDefinition > div {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode #reonicOrderDetailPanel :is(h2, h3, h4, p, strong, span, a),
body.dashboardMode #reonicOrderDetailPanel.is-project-record :is(h2, h3, h4, p, strong, span, a),
body.dashboardMode .appContent :is(#partnerOrderForm, form.recommendationForm) > label:not(.adminPermissionCheck):not(.adminPermissionToggle) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode.roleAdmin .dashboardHead.dashboardHeadModern {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
}

/* Shared secondary navigation and list states. */
body.dashboardMode .partnerAdminDetailTabs {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode .partnerAdminDetailTab {
  min-height: 44px;
  border-color: transparent;
  background: transparent;
  color: var(--portal-text-secondary);
  box-shadow: none;
}

body.dashboardMode .partnerAdminDetailTab:is(:hover, :focus-visible, .active) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode .appContent .ap-list-v2 .ap-list-v2-row:is(
  .is-active,
  .is-selected,
  [aria-current="true"],
  [aria-current="page"],
  [aria-selected="true"]
) {
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: inset 4px 0 0 var(--portal-accent);
}

body.dashboardMode .appContent .ap-list-v2-intro .partnerProjectsTitleLink {
  min-height: 44px;
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  color: var(--portal-text-secondary);
  box-shadow: none;
}

body.dashboardMode .appContent .ap-list-v2-intro .partnerProjectsTitleLink:is(:hover, :focus-visible) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode.portalPartner #partnerComplaintForm .complaintProjectOption.partnerCardInteractive span,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintProjectOption.partnerCardInteractive span {
  color: var(--portal-text-secondary);
}

body.dashboardMode .appContent #partnerProjectsBackButton.linkButton,
body.dashboardMode .appContent #partnerComplaintForm #complaintWizardBackButton {
  min-height: 44px;
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  color: var(--portal-text-secondary);
  box-shadow: none;
}

body.dashboardMode .appContent #partnerProjectsBackButton.linkButton:is(:hover, :focus-visible),
body.dashboardMode .appContent #partnerComplaintForm #complaintWizardBackButton:not(:disabled):is(:hover, :focus-visible) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode .appContent #montageCalendarPanel .montageCalendarCustomerLink,
body.dashboardMode .appContent #montageCalendarPanel .montageCalendarCustomerLink:is(:hover, :focus-visible) {
  min-height: 44px;
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: none;
}

/* Reonic uses the same record surfaces for administrators and employees. */
body.dashboardMode:is(.roleAdmin, .roleEmployee) #reonicOrderDetailPanel :is(
  .reonicDetailTabList,
  .reonicOptionCard,
  .calendarCheckCard,
  .reonicDocumentCard,
  .protocolDocumentsCard,
  .orderChangeBox,
  .customerImagesCard,
  .reonicEmailHistoryCard,
  .billingCard,
  .deliveryDateBox,
  .preparationUploadCard,
  .substructureBox
) {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode:is(.roleAdmin, .roleEmployee) #reonicOrderDetailPanel :is(
  .calendarCheckItem,
  .reonicDocumentLink,
  .protocolDocumentItem,
  .customerImageSection,
  .preparationDropZone,
  .preparationImageSummary span,
  .preparationImageCard,
  .customerImageThumb,
  .reonicImageThumb,
  .emailHistoryItem,
  .componentGroup li,
  .substructureSummaryCard,
  .billingSummaryBox,
  .billingPaymentPanel,
  .smartMeterBox,
  .smartMeterOk,
  .smartMeterWarning,
  .roofTileWarning,
  .orderChangeOpen,
  .orderStatusRow p
) {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode:is(.roleAdmin, .roleEmployee) #reonicOrderDetailPanel .reonicDetailTabButton {
  min-height: 44px;
  border-color: transparent;
  background: transparent;
  color: var(--portal-text-secondary);
  box-shadow: none;
}

body.dashboardMode:is(.roleAdmin, .roleEmployee) #reonicOrderDetailPanel .reonicDetailTabButton:is(.is-active, :hover, :focus-visible) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode:is(.roleAdmin, .roleEmployee) #reonicOrderDetailPanel :is(input, select, textarea) {
  border-color: var(--portal-surface-border);
  background: rgba(255, 255, 255, .94);
  color: var(--portal-text-primary);
  -webkit-text-fill-color: var(--portal-text-primary);
  box-shadow: inset 0 1px 0 #ffffff;
}

body.dashboardMode:is(.roleAdmin, .roleEmployee) #reonicOrderDetailPanel :is(
  .reonicOptionHead span,
  .reonicDocumentBadge,
  .customerImageSectionHead span,
  .protocolDocumentItem span,
  .emailHistoryItem span,
  .emailHistoryItem small,
  .advisorCard span,
  .advisorCard small,
  .componentGroup li span,
  .calendarCheckItem span,
  .billingSummaryBox p,
  .roofTileWarning p,
  .roofTileWarning li span,
  .mutedText
) {
  color: var(--portal-text-secondary);
}

body.dashboardMode:is(.roleAdmin, .roleEmployee) #reonicOrderDetailPanel :is(
  .reonicOptionHead strong,
  .reonicDocumentLink strong,
  .customerImageSectionHead strong,
  .protocolDocumentItem strong,
  .emailHistoryItem strong,
  .advisorCard strong,
  .componentGroup li strong,
  .billingSummaryBox strong,
  .roofTileWarning strong
) {
  color: var(--portal-text-primary);
}

/* Final component-owned light surfaces. These selectors mirror the owning
   legacy components so the shared workspace tokens win by source ownership. */
body.dashboardMode #partnerSubmitModal .partnerSubmitModalCard {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: 0 34px 90px rgba(6, 31, 55, .26);
}

body.dashboardMode #partnerSubmitModal .partnerSubmitModalCard :is(h2, h3, h4, p, span, label, strong) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode #partnerSubmitModal .partnerSubmitModalClose,
body.dashboardMode #partnerSubmitModal .partnerSubmitPreviewPaper {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode #partnerSubmitModal .partnerSubmitModalClose:is(:hover, :focus-visible) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
}

body.dashboardMode #emailAutomationPanel .emailAutomationCardHeader,
body.dashboardMode #emailAutomationPanel .emailAutomationCardHeader:hover {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode #emailAutomationPanel .emailAutomationCardHeader :is(h2, h3, h4, p, span, strong, small) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode #partnerInquiryView :is(
  .partnerInquiryWizard,
  .partnerInquiryListCard,
  .partnerInquiryDetailCard,
  .partnerInquirySuccess,
  .partnerInquiryEmptyState,
  .partnerInquiryNotifications
) {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode #partnerInquiryView :is(
  .partnerInquiryReviewRow,
  .partnerInquiryDetailSection,
  .partnerInquiryContactCard,
  .partnerInquiryCalculationCard,
  .partnerInquiryPowerPreview,
  .partnerInquiryProgress li,
  .partnerInquiryAttachmentList li,
  .partnerInquiryChoiceCard,
  .partnerInquiryComponentBlock,
  .partnerInquiryToggleCard,
  .partnerInquiryUploadItem,
  .partnerInquiryDocumentCard,
  .partnerInquiryReviewSection,
  .partnerInquiryNotification
) {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryChoiceCard:is(:hover, :focus-within, :has(input:checked)),
body.dashboardMode #partnerInquiryView .partnerInquiryToggleCard:has(input:checked),
body.dashboardMode #partnerInquiryView .partnerInquiryNotification.isUnread {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode #partnerInquiryView :is(
  .partnerInquiryComponentBlock > h4,
  .partnerInquiryChoiceCard strong,
  .partnerInquiryToggleCard strong,
  .partnerInquiryUploadInfo > strong,
  .partnerInquiryDocumentCard strong,
  .partnerInquiryReviewHead h4,
  .partnerInquiryNotificationsHead h3,
  .partnerInquiryNotification strong
) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode #partnerInquiryView :is(
  .partnerInquiryChoiceCard small,
  .partnerInquiryToggleCard small,
  .partnerInquiryUploadInfo > span,
  .partnerInquiryDocumentCard span,
  .partnerInquiryNotification p
) {
  color: var(--portal-text-secondary);
  text-shadow: none;
}

body.dashboardMode #partnerInquiryView :is(
  .partnerInquiryWorkspaceHeader h2,
  .partnerInquiryStepIntro h3,
  .partnerInquiryStepButton,
  .partnerInquiryStepButton.active,
  .partnerInquiryStepButton.ap-step-active,
  .partnerInquiryStepButton.isComplete,
  .partnerInquiryStepButton.ap-step-complete,
  .partnerInquiryStepButton[aria-current="step"],
  .partnerInquiryReviewRow strong,
  .partnerInquiryDetailRow strong,
  .partnerInquiryProgress li,
  .partnerInquiryProgress li.isReached,
  .partnerInquiryProgress li.isReached > span,
  .partnerInquiryPowerPreview
) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode #partnerInquiryView :is(
  .partnerInquiryWorkspaceHeader p,
  .partnerInquiryStepIntro p,
  .partnerInquirySuccess p,
  .partnerInquiryReviewRow span,
  .partnerInquiryDetailHeading > strong,
  .partnerInquiryDetailRow > span,
  .partnerInquiryAttachmentList span
) {
  color: var(--portal-text-secondary);
  text-shadow: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryMissingSummary:not(.hidden) {
  border-color: rgba(174, 55, 73, .32);
  background: rgba(255, 236, 239, .94);
  color: #7b2636;
}

body.dashboardMode #partnerInquiryView .partnerInquiryAcceptedText {
  color: #16673d;
}

body.dashboardMode:is(.roleAdmin, .roleEmployee) #reonicOrderDetailPanel .roofTileWarning li {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  color: var(--portal-text-primary);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStep {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStep::before,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardSummaryRows :is(span, strong) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode .appContent .tableWrap:not(.reonicKanbanWrap) tbody td {
  border-color: var(--portal-surface-border);
  background: rgba(255, 255, 255, .62);
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode .appContent .tableWrap:not(.reonicKanbanWrap) tbody tr:hover td {
  border-color: var(--portal-surface-border-active);
  background: rgba(225, 240, 250, .88);
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable tbody tr {
  border-color: var(--portal-surface-border);
  background: rgba(255, 255, 255, .62);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode .tableWrap.reonicTableWrap .reonicTable tbody tr:hover {
  border-color: var(--portal-surface-border-active);
  background: rgba(225, 240, 250, .88);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

/* Portal Design System Closure 01
   This final component boundary owns the authenticated partner, employee and
   admin workspaces. It deliberately contains no override flags: semantic
   tokens and component classes are the only authority from this point on. */
body.dashboardMode {
  color-scheme: light;
  min-height: 100dvh;
  overflow-x: clip;
  isolation: isolate;
  background: var(--portal-background);
  color: var(--portal-text-primary);
}

body.dashboardMode::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  display: block;
  pointer-events: none;
  background:
    radial-gradient(circle at 10% 8%, color-mix(in srgb, var(--portal-background-accent) 88%, transparent) 0, transparent 31%),
    radial-gradient(circle at 91% 21%, rgba(72, 159, 223, .18) 0, transparent 32%),
    linear-gradient(145deg, var(--portal-background) 0%, #f9fcfe 47%, var(--portal-background-accent) 100%);
  background-repeat: no-repeat;
  background-attachment: fixed;
}

body.dashboardMode::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  display: block;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(255, 255, 255, .1), transparent 28%, transparent 72%, rgba(255, 255, 255, .12));
}

body.dashboardMode :where(.shell, .appLayout, .appContent, #dashboardView, .partnerInquiryWorkspace) {
  background: transparent;
  background-image: none;
}

body.dashboardMode .shell {
  position: relative;
  z-index: 1;
  width: min(1920px, calc(100% - 24px));
  min-height: calc(100dvh - 24px);
  margin: 12px auto;
}

body.dashboardMode .appLayout {
  align-items: stretch;
  gap: clamp(16px, 2vw, 30px);
}

body.dashboardMode :where(.sidebarRail, .sidebarShell) {
  background: transparent;
  background-image: none;
  box-shadow: none;
}

body.dashboardMode .appSidebar {
  overflow: hidden;
  border: 1px solid var(--portal-sidebar-border);
  border-radius: var(--portal-radius-hero);
  background: var(--portal-sidebar-background);
  color: var(--portal-text-inverse);
  box-shadow: var(--portal-shadow-lg);
}

body.dashboardMode .appSidebar :where(.sidebarNavButton, .sidebarInlineLogoutButton, .sidebarInlineAdminPortalButton) {
  min-height: 44px;
  border: 1px solid transparent;
  border-radius: var(--portal-radius-control);
  color: rgba(240, 248, 255, .8);
}

body.dashboardMode .appSidebar :where(.sidebarNavButton, .sidebarInlineLogoutButton, .sidebarInlineAdminPortalButton):is(:hover, :focus-visible, .active, [aria-current="page"]) {
  border-color: rgba(116, 195, 247, .34);
  background: rgba(72, 159, 223, .2);
  color: var(--portal-text-inverse);
  outline: none;
  box-shadow: 0 0 0 3px rgba(72, 159, 223, .16);
}

body.dashboardMode .appContent {
  min-width: 0;
  min-height: calc(100dvh - 24px);
  padding-bottom: clamp(32px, 5vw, 72px);
}

.portalHero {
  position: relative;
  isolation: isolate;
  min-height: 0;
  overflow: hidden;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-hero);
  box-shadow: var(--portal-shadow-md);
}

.portalHero--plain {
  background: var(--portal-surface);
  color: var(--portal-text-primary);
}

.portalHero--media {
  min-height: clamp(240px, 29vw, 390px);
  background-color: var(--portal-surface-dark);
  background-position: center;
  background-size: cover;
  color: var(--portal-text-inverse);
}

.portalHero--media::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  display: block;
  pointer-events: none;
  background: linear-gradient(92deg, rgba(2, 13, 34, .94) 0%, rgba(3, 18, 43, .76) 48%, rgba(4, 20, 45, .34) 100%);
}

.portalHero--media[data-portal-hero-media="customer"],
.projectRecordHero.portalHero--media {
  background-image: url("/assets/premium-customer-hero.jpg");
}

.portalHero--media[data-portal-hero-media="order"],
.portalRecord--media {
  background-image: url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg");
}

body.dashboardMode .dashboardHeadModern.portalHero {
  padding: clamp(24px, 3vw, 40px);
  border-radius: var(--portal-radius-hero);
}

body.dashboardMode .dashboardHeadModern.portalHero--plain {
  border-color: var(--portal-border);
  background: var(--portal-surface);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-md);
}

body.dashboardMode .dashboardHeadModern.portalHero--plain::before,
body.dashboardMode .dashboardHeadModern.portalHero--plain::after {
  content: none;
  display: none;
}

body.dashboardMode .dashboardHeadModern.portalHero--plain :where(#dashboardRole, #welcomeTitle, .step, span, strong, small) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode .dashboardHeadModern.portalHero--media :where(#dashboardRole, #welcomeTitle, .step, span, strong, small),
body.dashboardMode .portalHero--media :where(h1, h2, h3, h4, p, span, strong, small, a, button) {
  color: var(--portal-text-inverse);
  text-shadow: 0 2px 18px rgba(0, 0, 0, .35);
}

body.dashboardMode .dashboardHeadModern.portalHero--media[data-portal-hero-media="customer"] {
  border-color: rgba(115, 194, 246, .36);
  background-color: var(--portal-surface-dark);
  background-image: url("/assets/premium-customer-hero.jpg");
  background-position: center;
  background-size: cover;
  color: var(--portal-text-inverse);
}

body.dashboardMode .dashboardHeadModern.portalHero--media[data-portal-hero-media="order"] {
  border-color: rgba(115, 194, 246, .36);
  background-color: var(--portal-surface-dark);
  background-image: url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg");
  background-position: center;
  background-size: cover;
  color: var(--portal-text-inverse);
}

body.dashboardMode .portalHeroMeta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 18px;
}

body.dashboardMode .portalHeroMeta.hidden {
  display: none;
}

body.dashboardMode .portalHeroMetaItem {
  display: inline-grid;
  gap: 2px;
  min-width: min(100%, 132px);
  padding: 8px 12px;
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: var(--portal-radius-control);
  background: rgba(2, 18, 43, .46);
  color: var(--portal-text-inverse);
  backdrop-filter: blur(8px);
}

body.dashboardMode .portalHeroMetaItem small {
  color: rgba(241, 248, 255, .72);
  font-size: .68rem;
  font-weight: 500;
  letter-spacing: .05em;
  text-transform: uppercase;
}

body.dashboardMode .portalHeroMetaItem strong {
  color: var(--portal-text-inverse);
  font-size: .82rem;
  font-weight: 600;
  overflow-wrap: anywhere;
}

body.dashboardMode .portalHeroMetaItem--success {
  border-color: rgba(97, 215, 156, .46);
}

body.dashboardMode .portalHeroMetaItem--warning {
  border-color: rgba(255, 205, 92, .5);
}

body.dashboardMode .dashboardHeadModern.portalHero--media::before,
body.dashboardMode #reonicOrderDetailPanel .projectRecordHero.portalHero--media::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  display: block;
  pointer-events: none;
  background: linear-gradient(92deg, rgba(2, 13, 34, .94), rgba(3, 18, 43, .72) 52%, rgba(4, 20, 45, .28));
}

body.dashboardMode #reonicOrderDetailPanel .projectRecordHero.portalHero--media {
  isolation: isolate;
  min-height: clamp(240px, 29vw, 390px);
  border-color: rgba(115, 194, 246, .36);
  background-color: var(--portal-surface-dark);
  background-image: url("/assets/premium-customer-hero.jpg");
  background-position: center;
  background-size: cover;
  color: var(--portal-text-inverse);
  box-shadow: var(--portal-shadow-lg);
}

body.dashboardMode .portalRecord--media {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: var(--portal-radius-hero);
  background-color: var(--portal-surface-dark);
  background-position: center top;
  background-size: 100% clamp(230px, 27vw, 360px);
  background-repeat: no-repeat;
}

body.dashboardMode #partnerOrderDetailBox.portalRecord--media {
  border-color: rgba(115, 194, 246, .36);
  background-color: var(--portal-surface-dark);
  background-image: url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg");
  color: var(--portal-text-inverse);
  box-shadow: var(--portal-shadow-lg);
}

body.dashboardMode #partnerOrderDetailBox .partnerOrderDetailHead.portalHero--media {
  isolation: isolate;
  min-height: clamp(230px, 27vw, 350px);
  align-content: end;
  padding: clamp(24px, 3.5vw, 42px);
  border-color: rgba(115, 194, 246, .36);
  background-color: var(--portal-surface-dark);
  background-image: url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg");
  background-position: center;
  background-size: cover;
  color: var(--portal-text-inverse);
  box-shadow: var(--portal-shadow-lg);
}

body.dashboardMode #partnerOrderDetailBox .partnerOrderDetailHead.portalHero--media::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  display: block;
  pointer-events: none;
  background: linear-gradient(92deg, rgba(2, 13, 34, .94), rgba(3, 18, 43, .7) 54%, rgba(4, 20, 45, .24));
}

body.dashboardMode #partnerOrderDetailBox .partnerOrderDetailHead.portalHero--media :where(h2, h3, h4, p, span, strong, small) {
  color: var(--portal-text-inverse);
  text-shadow: 0 2px 18px rgba(0, 0, 0, .35);
}

body.dashboardMode .portalRecord--media::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  z-index: -1;
  height: clamp(230px, 27vw, 360px);
  pointer-events: none;
  background: linear-gradient(92deg, rgba(2, 13, 34, .9), rgba(3, 18, 43, .62) 58%, rgba(4, 20, 45, .22));
}

body.dashboardMode .portalRecord--media > :where(.detailBackButton, .partnerOrderDetailHead, .partnerOrderDetailTabs) {
  position: relative;
  z-index: 1;
}

body.dashboardMode .portalRecord--media > :where(.detailBackButton, .partnerOrderDetailHead) :where(h1, h2, h3, p, span, strong, button),
body.dashboardMode .portalRecord--media > :where(.detailBackButton, .partnerOrderDetailHead) {
  color: var(--portal-text-inverse);
}

:is(.portalSurface, .portalPanel, .portalCard, .partnerInquirySurface) {
  border: 1px solid var(--portal-border);
  background: var(--portal-surface);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-sm);
}

.portalSurface {
  border-radius: var(--portal-radius-panel);
}

.portalPanel {
  border-radius: var(--portal-radius-panel);
}

.portalCard {
  border-radius: var(--portal-radius-card);
}

body.dashboardMode .appContent :where(.portalSurface, .portalPanel, .portalCard, .partnerInquirySurface) {
  border-color: var(--portal-border);
  background: var(--portal-surface);
  background-image: none;
  color: var(--portal-text-primary);
}

body.dashboardMode .appContent :where(.portalInteractiveCard, .ap-card-interactive, .clickableRow) {
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: var(--portal-surface);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-sm);
  transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

body.dashboardMode .appContent :where(.portalInteractiveCard, .ap-card-interactive, .clickableRow):is(:hover, :focus-visible, :focus-within) {
  border-color: var(--portal-border-strong);
  background: var(--portal-accent-soft);
  color: var(--portal-text-primary);
  outline: none;
  box-shadow: var(--portal-shadow-md), var(--portal-focus-ring);
  transform: translateY(-2px);
}

body.dashboardMode .appContent :where(.portalInteractiveCard, .ap-card-interactive, .clickableRow):focus-visible {
  box-shadow: var(--portal-focus-ring), var(--portal-shadow-md);
}

body.dashboardMode .appContent :where(.partnerHomeActionCard.portalInteractiveCard) {
  background: var(--portal-surface);
  color: var(--portal-text-primary);
}

body.dashboardMode .appContent :where(.partnerHomeActionCard.portalInteractiveCard) :where(span, strong, small, em, svg) {
  color: inherit;
}

body.dashboardMode .appContent :where(.partnerHomeActionCard.portalInteractiveCard):is(:hover, :focus-visible) {
  border-color: rgba(84, 173, 234, .62);
  background: var(--portal-surface-dark);
  color: var(--portal-text-inverse);
  box-shadow: var(--portal-shadow-lg), var(--portal-focus-ring);
}

body.dashboardMode .appContent :where(.partnerHomeActionCard.portalInteractiveCard):is(:hover, :focus-visible) :where(span, strong, small, em, svg) {
  color: var(--portal-text-inverse);
  fill: currentColor;
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionCard.portalInteractiveCard:is(:hover, :focus-visible),
body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionCard.portalInteractiveCard:is(:hover, :focus-visible) :where(span, strong, small, em, svg) {
  color: var(--portal-text-inverse);
}

body.dashboardMode.partnerDashboardHome #partnerProjectsCards .partnerHomeActionCard.portalInteractiveCard:is(:hover, :focus-visible) {
  background: var(--portal-surface-dark);
}

body.dashboardMode .partnerHomeWorkspace,
body.dashboardMode .partnerHomeActionSection,
body.dashboardMode .partnerHomeSectionHead,
body.dashboardMode .partnerInquiryGroups,
body.dashboardMode .partnerInquiryGroup {
  border: 0;
  background: transparent;
  background-image: none;
  box-shadow: none;
}

body.dashboardMode .partnerHomeSectionHead :where(h2, h3, p, span),
body.dashboardMode .partnerInquiryGroupHeader :where(h2, h3, p, span) {
  color: var(--portal-text-primary);
}

body.dashboardMode .partnerInquiryGroups {
  display: grid;
  gap: clamp(28px, 4vw, 46px);
}

body.dashboardMode .partnerInquiryGroup {
  display: grid;
  gap: clamp(16px, 2.2vw, 24px);
  padding: 0;
}

body.dashboardMode .partnerInquiryGroupHeader {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  padding: 0 clamp(2px, .5vw, 8px);
}

body.dashboardMode .partnerInquiryGroupHeader h3 {
  margin: 4px 0 0;
  font-size: clamp(1.35rem, 2vw, 1.8rem);
}

body.dashboardMode .partnerInquiryGroupEyebrow {
  color: var(--portal-text-muted);
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
}

body.dashboardMode .partnerInquiryLegacyHint {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 9px;
  border: 1px solid var(--portal-border);
  border-radius: 999px;
  background: var(--portal-surface-subtle);
  color: var(--portal-text-muted);
  font-size: .72rem;
  font-weight: 500;
}

body.dashboardMode .partnerInquiryListToolbar {
  display: flex;
  justify-content: flex-end;
  margin: clamp(20px, 3vw, 34px) 0 clamp(24px, 3.5vw, 40px);
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode .partnerInquiryListSurface {
  display: grid;
  gap: 24px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode .partnerInquiryList {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
  gap: clamp(16px, 2vw, 24px);
}

body.dashboardMode #partnerInquiryView .partnerInquiryListCard,
body.dashboardMode #partnerInquiryView .partnerInquiryEmptyState {
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: var(--portal-surface);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-sm);
}

body.dashboardMode #partnerInquiryView .partnerInquiryListCard:is(:hover, :focus-within) {
  border-color: var(--portal-border-strong);
  background: var(--portal-surface-elevated);
  box-shadow: var(--portal-shadow-md);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecord {
  display: grid;
  gap: clamp(18px, 2.5vw, 30px);
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordToolbar {
  display: flex;
  justify-content: flex-end;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordBack {
  min-height: 46px;
  border: 1px solid var(--action-primary-border);
  border-radius: var(--portal-radius-control);
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
  box-shadow: var(--action-primary-shadow);
}

body.dashboardMode #partnerInquiryView .partnerInquiryListActionCard {
  max-width: 430px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryListActionCard .partnerHomeActionCard {
  width: 100%;
}

body.dashboardMode #partnerOrderDetailBox > .partnerPortalBackAction {
  justify-self: end;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordBack:is(:hover, :focus-visible) {
  border-color: var(--action-primary-hover-border);
  background: var(--action-primary-hover-bg);
  color: var(--action-primary-text);
  outline: none;
  box-shadow: var(--action-primary-focus), var(--action-primary-hover-shadow);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordHero {
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-hero);
  background: var(--portal-surface);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-md);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordLayout {
  display: grid;
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
  align-items: start;
  gap: clamp(18px, 2.4vw, 30px);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavigation,
body.dashboardMode #partnerInquiryView .partnerInquiryRecordPanel:not(.hidden) {
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-panel);
  background: var(--portal-surface);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-sm);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavigation {
  position: sticky;
  top: 18px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavItem {
  min-height: 46px;
  border: 1px solid transparent;
  border-radius: var(--portal-radius-control);
  background: transparent;
  color: var(--portal-text-secondary);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavItem:is(:hover, :focus-visible) {
  border-color: var(--portal-border);
  background: var(--portal-accent-soft);
  color: var(--portal-text-primary);
  outline: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavItem:is(.is-active, [aria-selected="true"]) {
  border-color: var(--portal-border-strong);
  background: var(--portal-surface-dark);
  color: var(--portal-text-inverse);
  box-shadow: var(--portal-shadow-sm);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavItem:is(.is-active, [aria-selected="true"]) :where(span, strong, svg) {
  color: var(--portal-text-inverse);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordPanel:not(.hidden) {
  padding: clamp(20px, 3vw, 34px);
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordSubsection {
  border: 0;
  border-bottom: 1px solid var(--portal-border);
  border-radius: 0;
  background: transparent;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryRecordSubsection:last-child {
  border-bottom: 0;
}

body.dashboardMode #partnerInquiryView :where(.partnerInquiryDetailRow, .partnerInquiryReviewRow) {
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--portal-border) 72%, transparent);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #partnerInquiryView :where(.partnerInquiryDetailRow, .partnerInquiryReviewRow):last-child {
  border-bottom: 0;
}

body.dashboardMode :where(.ap-button-primary, .ap-button-secondary, .secondaryButton, .linkButton, .dangerButton, .ap-icon-button) {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 10px 18px;
  border: 1px solid transparent;
  border-radius: var(--portal-radius-control);
  font: 500 .94rem/1.25 var(--ap-font);
  text-decoration: none;
  cursor: pointer;
  transition: border-color 150ms ease, background-color 150ms ease, color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.ap-button-primary {
  border-color: var(--action-primary-border);
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
  box-shadow: var(--action-primary-shadow);
}

.ap-button-secondary {
  border-color: var(--portal-border-strong);
  background: var(--portal-surface);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-sm);
}

body.dashboardMode :where(.ap-button-primary, button[type="submit"]):not(:disabled):hover {
  border-color: var(--action-primary-hover-border);
  background: var(--action-primary-hover-bg);
  color: var(--action-primary-text);
  box-shadow: var(--action-primary-hover-shadow);
  transform: translateY(-1px);
}

body.dashboardMode :where(.ap-button-secondary, .secondaryButton, .linkButton):not(:disabled):hover {
  border-color: var(--portal-border-strong);
  background: var(--portal-accent-soft);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-sm);
}

body.dashboardMode :where(.dangerButton, .dangerLinkButton) {
  border-color: color-mix(in srgb, var(--portal-error) 40%, transparent);
  background: color-mix(in srgb, var(--portal-error) 9%, var(--portal-surface));
  color: var(--portal-error);
}

body.dashboardMode :where(.dangerButton, .dangerLinkButton):not(:disabled):hover {
  border-color: var(--portal-error);
  background: var(--portal-error);
  color: var(--portal-text-inverse);
}

body.dashboardMode :where(button, a[href], input, textarea, select, [tabindex]):focus-visible {
  outline: none;
  box-shadow: var(--portal-focus-ring);
}

body.dashboardMode :where(button, input, textarea, select):disabled,
body.dashboardMode [aria-disabled="true"] {
  cursor: not-allowed;
  opacity: .58;
  filter: saturate(.65);
}

body.dashboardMode .appContent :where(input:not([type="checkbox"]):not([type="radio"]), textarea),
body.dashboardMode :where(.portalSelectTrigger, .ap-select-v2-trigger) {
  min-height: 48px;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-control);
  background: var(--portal-surface-elevated);
  color: var(--portal-text-primary);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8), var(--portal-shadow-sm);
}

body.dashboardMode .appContent :where(input:not([type="checkbox"]):not([type="radio"]), textarea)::placeholder {
  color: var(--portal-text-muted);
  opacity: 1;
}

body.dashboardMode .appContent :where(input:not([type="checkbox"]):not([type="radio"]), textarea):is(:hover, :focus),
body.dashboardMode :where(.portalSelectTrigger, .ap-select-v2-trigger):is(:hover, :focus-visible, .isOpen, .is-open) {
  border-color: var(--portal-border-strong);
  background: var(--portal-surface-elevated);
  color: var(--portal-text-primary);
  outline: none;
  box-shadow: var(--portal-focus-ring), var(--portal-shadow-sm);
}

body.dashboardMode :where(.portalSelect, .ap-select-v2) {
  display: inline-block;
  width: 100%;
  min-width: 0;
}

body.dashboardMode :where(.portalSelectMenu, .ap-select-v2-menu) {
  z-index: var(--ap-z-popover);
  overflow: auto;
  border: 1px solid var(--portal-border-strong);
  border-radius: var(--portal-radius-control);
  background: var(--portal-surface-elevated);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-lg);
}

body.dashboardMode :where(.portalSelectOption, .ap-select-v2-option) {
  min-height: 44px;
  border-radius: 10px;
  color: var(--portal-text-secondary);
}

body.dashboardMode :where(.portalSelectOption, .ap-select-v2-option):is(:hover, .isActive, .is-active, .isSelected, .is-selected, [aria-selected="true"]) {
  background: var(--portal-accent-soft);
  color: var(--portal-text-primary);
}

.tableWrap,
.portalTable,
.ap-list-v2 {
  overflow: hidden;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-panel);
  background: var(--portal-surface);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-md);
}

body.dashboardMode .appContent :where(.tableWrap:not(.reonicKanbanWrap), .portalTable, .ap-list-v2) {
  border-color: var(--portal-border);
  border-radius: var(--portal-radius-panel);
  background: var(--portal-surface);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-md);
}

body.dashboardMode .appContent :where(.tableWrap, .portalTable) table {
  width: 100%;
  border-collapse: collapse;
  background: transparent;
  color: var(--portal-text-primary);
}

body.dashboardMode .appContent :where(.tableWrap, .portalTable) thead,
body.dashboardMode .appContent :where(.tableWrap, .portalTable) th {
  background: var(--portal-surface-dark);
  color: var(--portal-text-inverse);
}

body.dashboardMode .appContent :where(.tableWrap, .portalTable) th {
  border-color: rgba(255, 255, 255, .1);
  font-weight: 600;
}

body.dashboardMode .appContent :where(.tableWrap, .portalTable) .tableSortButton {
  min-width: 44px;
  min-height: 44px;
  border-radius: var(--portal-radius-control);
  background: transparent;
  color: var(--portal-text-inverse);
}

body.dashboardMode .appContent :where(.tableWrap, .portalTable) .tableSortButton:is(:hover, :focus-visible, .active) {
  background: rgba(72, 159, 223, .24);
  color: var(--portal-text-inverse);
  outline: none;
  box-shadow: 0 0 0 3px rgba(72, 159, 223, .24);
}

body.dashboardMode .appContent :where(.tableWrap, .portalTable) tbody tr {
  border-bottom: 1px solid var(--portal-border);
  background: var(--portal-surface);
  color: var(--portal-text-primary);
  transition: background-color 140ms ease, box-shadow 140ms ease;
}

body.dashboardMode .appContent :where(.tableWrap, .portalTable) tbody tr:nth-child(even) {
  background: var(--portal-surface-subtle);
}

body.dashboardMode .appContent :where(.tableWrap, .portalTable) tbody tr:is(:hover, :focus-within) {
  background: var(--portal-accent-soft);
  color: var(--portal-text-primary);
  box-shadow: inset 4px 0 0 var(--portal-accent);
}

body.dashboardMode .appContent :where(.tableWrap, .portalTable) tbody td,
body.dashboardMode .appContent :where(.tableWrap, .portalTable) tbody tr:hover td {
  border-color: var(--portal-border);
  background: transparent;
  color: var(--portal-text-primary);
}

body.dashboardMode .portalListHeader,
body.dashboardMode .partnerAdminOverviewHead,
body.dashboardMode .partnerAdminSortBar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode .partnerProjectSortButton,
body.dashboardMode .partnerAdminSortButton {
  width: 44px;
  min-width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-control);
  background: var(--portal-surface);
  color: var(--portal-text-primary);
}

body.dashboardMode .partnerProjectSortButton:is(:hover, :focus-visible, .active),
body.dashboardMode .partnerAdminSortButton:is(:hover, :focus-visible, .active) {
  border-color: var(--portal-border-strong);
  background: var(--portal-accent-soft);
  color: var(--portal-text-primary);
  outline: none;
  box-shadow: var(--portal-focus-ring);
}

body.dashboardMode #partnerAdminOverviewPanel {
  display: grid;
  gap: clamp(22px, 3vw, 34px);
  padding: clamp(22px, 3vw, 36px);
  border-radius: var(--portal-radius-panel);
}

body.dashboardMode .partnerAdminOverviewCard {
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-panel);
  background: var(--portal-surface);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-sm);
}

body.dashboardMode .partnerAdminOverviewCard :where(h2, h3, h4, p, span, strong, small, a) {
  color: inherit;
}

body.dashboardMode .partnerAdminOverviewPrimary[role="link"] {
  border-radius: var(--portal-radius-card);
  cursor: pointer;
}

body.dashboardMode .partnerAdminOverviewPrimary[role="link"]:focus-visible {
  outline: none;
  box-shadow: var(--portal-focus-ring);
}

body.dashboardMode .partnerAdminOverviewCard:is(:hover, :focus-visible, :focus-within) {
  border-color: rgba(84, 173, 234, .62);
  background: var(--portal-surface-dark);
  color: var(--portal-text-inverse);
  outline: none;
  box-shadow: var(--portal-shadow-lg), var(--portal-focus-ring);
}

body.dashboardMode .partnerAdminOverviewCard:is(:hover, :focus-visible, :focus-within) :where(h2, h3, h4, p, span, strong, small, a) {
  color: var(--portal-text-inverse);
}

body.dashboardMode .portalCarousel,
body.dashboardMode .partnerAdminOrdersList {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(min(82vw, 250px), 1fr);
  gap: 12px;
  overflow-x: auto;
  padding: 12px;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: var(--portal-surface-subtle);
  scroll-snap-type: x mandatory;
  scrollbar-color: var(--portal-accent) transparent;
}

body.dashboardMode .portalCarousel > *,
body.dashboardMode .partnerAdminOrdersList > * {
  scroll-snap-align: start;
}

body.dashboardMode .partnerAdminOverviewCard:is(:hover, :focus-visible, :focus-within) :where(.portalCarousel, .partnerAdminOrdersList) {
  border-color: rgba(131, 203, 250, .34);
  background: rgba(255, 255, 255, .08);
}

body.dashboardMode .partnerAdminOrderButton.portalCard {
  min-height: 116px;
  border-color: var(--portal-border);
  background: var(--portal-surface);
  color: var(--portal-text-primary);
}

body.dashboardMode .partnerAdminOrderButton.portalCard:is(:hover, :focus-visible) {
  border-color: var(--portal-accent);
  background: var(--portal-accent-soft);
  color: var(--portal-text-primary);
  outline: none;
  box-shadow: var(--portal-focus-ring);
}

body.dashboardMode :where(.ap-badge, .status, .reviewStatus, .notificationItemState) {
  min-height: 28px;
  border-radius: 999px;
  font-weight: 600;
}

body.dashboardMode .mobileSidebarButton {
  min-width: 44px;
  min-height: 44px;
  border-radius: var(--portal-radius-control);
}

@media (max-width: 1080px) {
  body.dashboardMode #partnerInquiryView .partnerInquiryRecordLayout {
    grid-template-columns: 1fr;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavigation {
    position: static;
    display: flex;
    overflow-x: auto;
    gap: 8px;
    scroll-snap-type: x proximity;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavItem {
    flex: 0 0 auto;
    scroll-snap-align: start;
  }
}

@media (max-width: 760px) {
  body.dashboardMode .shell {
    width: min(100%, calc(100% - 16px));
    margin: 8px auto;
  }

  body.dashboardMode .appContent {
    min-height: calc(100dvh - 16px);
  }

  body.dashboardMode .dashboardHeadModern.portalHero {
    padding: 22px 18px;
    border-radius: var(--portal-radius-panel);
  }

  .portalHero--media {
    min-height: 220px;
  }

  body.dashboardMode .partnerInquiryListToolbar {
    justify-content: stretch;
  }

  body.dashboardMode .partnerInquiryListToolbar .ap-button-primary {
    width: 100%;
  }

  body.dashboardMode .partnerInquiryGroupHeader,
  body.dashboardMode .portalListHeader,
  body.dashboardMode .partnerAdminOverviewHead,
  body.dashboardMode .partnerAdminSortBar {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryRecordHero,
  body.dashboardMode #partnerInquiryView .partnerInquiryRecordPanel:not(.hidden),
  body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavigation,
  body.dashboardMode #partnerAdminOverviewPanel {
    border-radius: var(--portal-radius-card);
  }

  body.dashboardMode .appContent :where(.tableWrap, .portalTable) {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
  }

  body.dashboardMode :where(.ap-button-primary, .ap-button-secondary, .secondaryButton, .linkButton, .dangerButton) {
    min-height: 48px;
  }
}

@media (max-width: 430px) {
  body.dashboardMode .partnerInquiryList {
    grid-template-columns: minmax(0, 1fr);
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryRecordNavigation {
    margin-inline: -4px;
    padding-inline: 10px;
  }

  body.dashboardMode .portalCarousel,
  body.dashboardMode .partnerAdminOrdersList {
    grid-auto-columns: minmax(82vw, 1fr);
  }
}

@media (prefers-reduced-motion: reduce) {
  body.dashboardMode *,
  body.dashboardMode *::before,
  body.dashboardMode *::after {
    scroll-behavior: auto;
    transition-duration: .01ms;
    animation-duration: .01ms;
    animation-iteration-count: 1;
  }
}
/* Portal visual-system closure 02
   One page canvas, explicit component surfaces and one progress contract. */
html:has(> body.dashboardMode) {
  min-height: 100%;
  background-color: var(--portal-background);
  background-image:
    radial-gradient(circle at 10% 8%, color-mix(in srgb, var(--portal-background-accent) 88%, transparent) 0, transparent 31%),
    radial-gradient(circle at 91% 21%, rgba(72, 159, 223, .18) 0, transparent 32%),
    linear-gradient(145deg, var(--portal-background) 0%, #f9fcfe 47%, var(--portal-background-accent) 100%);
  background-repeat: no-repeat;
  background-attachment: fixed;
}

body.dashboardMode {
  min-height: 100dvh;
  background: transparent;
}

body.dashboardMode::before,
body.dashboardMode::after {
  content: none;
  display: none;
  background: none;
}

body.dashboardMode :where(.shell, .appLayout, .appContent, #dashboardView, #partnerInquiryView, #partnerOrderView) {
  background-color: transparent;
  background-image: none;
}

body.dashboardMode .appLayout > .sidebarRail,
body.dashboardMode .appLayout > .sidebarRail::before,
body.dashboardMode .appLayout > .sidebarRail::after,
body.dashboardMode .sidebarShell,
body.dashboardMode .sidebarShell::before,
body.dashboardMode .sidebarShell::after {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

body.dashboardMode .appSidebar {
  border-radius: var(--portal-radius-sidebar);
  background: var(--portal-sidebar);
}

/* One primary form surface plus optional interactive cards inside it. */
body.dashboardMode #partnerInquiryView .partnerInquiryWizard {
  border: 1px solid var(--portal-border);
  background: var(--portal-surface);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-md);
}

body.dashboardMode #partnerInquiryView .partnerInquiryWizard :where(
  .partnerInquiryStepper,
  .partnerInquiryWizardStep,
  .partnerInquiryStepIntro,
  .partnerInquiryWizardActions,
  .formGrid,
  fieldset
) {
  background: transparent;
  box-shadow: none;
}

body.dashboardMode.partnerOrderEntryMode .appContent #partnerOrderView.portalSurface {
  padding-inline: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm.recommendationForm {
  border: 1px solid var(--portal-border);
  background: var(--portal-surface);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-md);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm :where(
  .partnerOrderWizardProgress,
  .partnerOrderWizardStep,
  .partnerOrderWizardSectionIntro,
  .partnerOrderWizardActions,
  .formGrid,
  fieldset
) {
  border-color: transparent;
  background: transparent;
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

/* Form copy stays readable regardless of older inherited card colours. */
body.dashboardMode .appContent :where(#partnerInquiryView, #partnerOrderView)
  :where(label, legend, .partnerInquiryStepIntro h3, .partnerOrderWizardSectionIntro h3) {
  color: var(--portal-text-primary);
  font-weight: 600;
  text-shadow: none;
}

body.dashboardMode .appContent :where(#partnerInquiryView, #partnerOrderView)
  :where(.formHint, .mutedText, small, .partnerInquiryStepIntro p, .partnerOrderWizardSectionIntro p) {
  color: var(--portal-text-secondary);
  text-shadow: none;
}

body.dashboardMode .appContent :where(#partnerInquiryView, #partnerOrderView)
  :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  border-color: var(--portal-border-strong);
  background-color: var(--portal-surface-elevated);
  color: var(--portal-text-primary);
  caret-color: var(--portal-accent);
}

body.dashboardMode .appContent :where(#partnerInquiryView, #partnerOrderView)
  :where(input, textarea)::placeholder {
  color: var(--portal-text-muted);
  opacity: 1;
}

/* Shared inquiry/order progress states. */
body.dashboardMode #partnerInquiryView .partnerInquiryStepper,
body.dashboardMode #partnerOrderForm .partnerPortalStepper {
  position: relative;
  overflow: visible;
  border: 0;
  border-bottom: 1px solid var(--portal-border);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardProgress.partnerPortalStepper {
  border: 0;
  border-bottom: 1px solid var(--portal-border);
  border-radius: 0;
  background: transparent;
  background-color: transparent;
  background-image: none;
  box-shadow: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepper {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0;
  padding: 8px 4px 20px;
  list-style: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepper > li {
  position: relative;
  min-width: 0;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepper > li::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: 15px;
  left: calc(50% + 18px);
  width: calc(100% - 36px);
  height: 2px;
  border-radius: 999px;
  background: var(--portal-border-strong);
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepper > li:last-child::after {
  content: none;
}

body.dashboardMode #partnerOrderForm .partnerPortalStepperStep::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: 15px;
  left: calc(50% + 18px);
  width: calc(100% - 36px);
  height: 2px;
  border-radius: 999px;
  background: var(--portal-border-strong);
}

body.dashboardMode #partnerOrderForm .partnerPortalStepperStep:last-child::after {
  content: none;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton.partnerPortalStepperStep::after {
  content: "";
  top: 15px;
  left: calc(50% + 18px);
  width: calc(100% - 36px);
  height: 2px;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton.partnerPortalStepperStep:is(:last-child, .isLastVisible)::after {
  content: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepper > li:has(.isComplete)::after,
body.dashboardMode #partnerOrderForm .partnerPortalStepperStep.isComplete::after {
  background: var(--portal-success);
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepButton,
body.dashboardMode #partnerOrderForm .partnerPortalStepperStep {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  align-content: start;
  width: 100%;
  min-width: 0;
  min-height: 72px;
  gap: 8px;
  padding: 42px 6px 0;
  border: 0;
  background: transparent;
  grid-template-columns: minmax(0, 1fr);
  color: var(--portal-text-secondary);
  box-shadow: none;
  font-size: clamp(.72rem, .8vw, .86rem);
  font-weight: 500;
  line-height: 1.3;
  text-align: center;
  white-space: normal;
  overflow-wrap: normal;
  word-break: keep-all;
  hyphens: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepButton::before {
  content: none;
}

body.dashboardMode #partnerOrderForm .partnerPortalStepper {
  counter-reset: partner-portal-step;
  border: 0;
  border-bottom: 1px solid var(--portal-border);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode #partnerOrderForm .partnerPortalStepperStep {
  counter-increment: partner-portal-step;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton.partnerPortalStepperStep {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  align-content: start;
  min-height: 72px;
  gap: 8px;
  padding: 42px 6px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--portal-text-secondary);
  box-shadow: none;
  font-size: clamp(.72rem, .8vw, .86rem);
  font-weight: 500;
  line-height: 1.3;
  text-align: center;
}

body.dashboardMode #partnerOrderForm .partnerPortalStepperStep::before,
body.dashboardMode #partnerInquiryView .partnerInquiryStepButton > span {
  display: grid;
  place-items: center;
  position: absolute;
  z-index: 2;
  top: 16px;
  left: 50%;
  width: 30px;
  height: 30px;
  border: 2px solid var(--portal-border-strong);
  border-radius: 50%;
  background: var(--portal-surface-elevated);
  color: var(--portal-text-secondary);
  box-shadow: 0 0 0 3px var(--portal-surface), 0 0 0 4px var(--portal-border-strong);
  font-size: .78rem;
  font-weight: 700;
  line-height: 1;
  transform: translate(-50%, -50%);
}

body.dashboardMode #partnerOrderForm .partnerPortalStepperStep::before {
  content: attr(data-partner-order-step-number);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardStepButton.partnerPortalStepperStep::before {
  content: attr(data-partner-order-step-number);
  display: grid;
  place-items: center;
  position: absolute;
  top: 16px;
  left: 50%;
  width: 30px;
  height: 30px;
  font-size: .78rem;
  transform: translate(-50%, -50%);
}

body.dashboardMode :where(
  #partnerInquiryView .partnerInquiryStepButton.active,
  #partnerInquiryView .partnerInquiryStepButton.ap-step-active,
  #partnerInquiryView .partnerInquiryStepButton[aria-current="step"],
  #partnerOrderForm .partnerPortalStepperStep.active,
  #partnerOrderForm .partnerPortalStepperStep.ap-step-active,
  #partnerOrderForm .partnerPortalStepperStep[aria-current="step"]
) {
  color: var(--portal-text-primary);
  font-weight: 650;
}

body.dashboardMode :where(
  #partnerOrderForm .partnerPortalStepperStep.active,
  #partnerOrderForm .partnerPortalStepperStep.ap-step-active,
  #partnerOrderForm .partnerPortalStepperStep[aria-current="step"]
)::before,
body.dashboardMode :where(
  #partnerInquiryView .partnerInquiryStepButton.active,
  #partnerInquiryView .partnerInquiryStepButton.ap-step-active,
  #partnerInquiryView .partnerInquiryStepButton[aria-current="step"]
) > span {
  border-color: var(--portal-accent);
  background: var(--portal-accent);
  color: var(--portal-text-inverse);
  box-shadow: 0 0 0 3px var(--portal-surface), 0 0 0 6px color-mix(in srgb, var(--portal-accent) 72%, transparent);
}

body.dashboardMode :where(
  #partnerInquiryView .partnerInquiryStepButton.isComplete,
  #partnerInquiryView .partnerInquiryStepButton.ap-step-complete,
  #partnerOrderForm .partnerPortalStepperStep.isComplete,
  #partnerOrderForm .partnerPortalStepperStep.ap-step-complete
) {
  color: var(--portal-success);
  font-weight: 600;
}

body.dashboardMode :where(
  #partnerOrderForm .partnerPortalStepperStep.isComplete,
  #partnerOrderForm .partnerPortalStepperStep.ap-step-complete
)::before,
body.dashboardMode :where(
  #partnerInquiryView .partnerInquiryStepButton.isComplete,
  #partnerInquiryView .partnerInquiryStepButton.ap-step-complete
) > span {
  border-color: var(--portal-success);
  background: var(--portal-success);
  color: var(--portal-text-inverse);
  box-shadow: 0 0 0 3px var(--portal-surface), 0 0 0 5px color-mix(in srgb, var(--portal-success) 42%, transparent);
  font-size: .78rem;
}

body.dashboardMode :where(
  #partnerInquiryView .partnerInquiryStepButton.ap-step-error,
  #partnerInquiryView .partnerInquiryStepButton.hasError,
  #partnerInquiryView .partnerInquiryStepButton[aria-invalid="true"],
  #partnerOrderForm .partnerPortalStepperStep.ap-step-error,
  #partnerOrderForm .partnerPortalStepperStep.hasError,
  #partnerOrderForm .partnerPortalStepperStep[aria-invalid="true"]
) {
  color: var(--portal-error);
  font-weight: 650;
}

body.dashboardMode :where(
  #partnerOrderForm .partnerPortalStepperStep.ap-step-error,
  #partnerOrderForm .partnerPortalStepperStep.hasError,
  #partnerOrderForm .partnerPortalStepperStep[aria-invalid="true"]
)::before,
body.dashboardMode :where(
  #partnerInquiryView .partnerInquiryStepButton.ap-step-error,
  #partnerInquiryView .partnerInquiryStepButton.hasError,
  #partnerInquiryView .partnerInquiryStepButton[aria-invalid="true"]
) > span {
  border-color: var(--portal-error);
  background: color-mix(in srgb, var(--portal-error) 10%, var(--portal-surface));
  color: var(--portal-error);
  box-shadow: 0 0 0 3px var(--portal-surface), 0 0 0 6px color-mix(in srgb, var(--portal-error) 34%, transparent);
  font-size: .9rem;
}

body.dashboardMode :where(
  #partnerOrderForm .partnerPortalStepperStep.ap-step-error,
  #partnerOrderForm .partnerPortalStepperStep.hasError,
  #partnerOrderForm .partnerPortalStepperStep[aria-invalid="true"]
)::before {
  content: "!";
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepButton[aria-disabled="true"]:not(.active) {
  color: var(--portal-text-secondary);
  opacity: 1;
}

body.dashboardMode :where(#partnerInquiryView .partnerInquiryStepButton, #partnerOrderForm .partnerPortalStepperStep):focus-visible {
  outline: 2px solid transparent;
  border-radius: var(--portal-radius-control);
  box-shadow: var(--portal-focus-ring);
}

body.dashboardMode .partnerProjectLoadMore {
  display: flex;
  grid-column: 1 / -1;
  justify-content: center;
  padding-block: 18px 4px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode .partnerProjectLoadMore > button {
  min-width: min(100%, 260px);
}

@media (max-width: 900px) {
  body.dashboardMode #partnerInquiryView .partnerInquiryStepper,
  body.dashboardMode #partnerOrderForm .partnerPortalStepper {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(132px, 38vw);
    grid-template-columns: none;
    gap: 0;
    overflow-x: auto;
    overflow-y: hidden;
    padding-inline: 8px;
    overscroll-behavior-inline: contain;
    scroll-padding-inline: 8px;
    scroll-snap-type: inline proximity;
    scrollbar-color: var(--portal-accent) transparent;
  }

  body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardProgress.partnerPortalStepper {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(132px, 38vw);
    grid-template-columns: none;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryStepper > li,
  body.dashboardMode #partnerOrderForm .partnerPortalStepperStep {
    scroll-snap-align: center;
  }
}

@media (max-width: 520px) {
  body.dashboardMode #partnerInquiryView .partnerInquiryStepper,
  body.dashboardMode #partnerOrderForm .partnerPortalStepper {
    grid-auto-columns: minmax(118px, 46vw);
  }

  body.dashboardMode .partnerProjectLoadMore > button {
    width: 100%;
  }
}

/* Component-specific ownership wins over legacy feature selectors without
   raising every semantic section or form to a card. */
body.dashboardMode .appContent .partnerInquiryWizard {
  border: 1px solid var(--portal-border);
  background: var(--portal-surface);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-md);
}

body.dashboardMode.partnerOrderEntryMode .appContent #partnerOrderView #partnerOrderForm .partnerOrderWizardStep {
  border-color: transparent;
  background: transparent;
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryWizard label:not(.adminPermissionCheck):not(.adminPermissionToggle),
body.dashboardMode.partnerOrderEntryMode .appContent #partnerOrderView #partnerOrderForm label,
body.dashboardMode #partnerInquiryView .partnerInquiryWizard legend,
body.dashboardMode.partnerOrderEntryMode .appContent #partnerOrderView #partnerOrderForm legend {
  color: var(--portal-text-primary);
  font-weight: 600;
  text-shadow: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepButton.active > span,
body.dashboardMode #partnerInquiryView .partnerInquiryStepButton.ap-step-active > span,
body.dashboardMode #partnerInquiryView .partnerInquiryStepButton[aria-current="step"] > span,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerPortalStepperStep.active::before,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerPortalStepperStep.ap-step-active::before,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerPortalStepperStep[aria-current="step"]::before {
  border-color: var(--portal-accent);
  background: var(--portal-accent);
  color: var(--portal-text-inverse);
  box-shadow: 0 0 0 3px var(--portal-surface), 0 0 0 6px color-mix(in srgb, var(--portal-accent) 72%, transparent);
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepButton.isComplete > span,
body.dashboardMode #partnerInquiryView .partnerInquiryStepButton.ap-step-complete > span,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerPortalStepperStep.isComplete::before,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerPortalStepperStep.ap-step-complete::before {
  border-color: var(--portal-success);
  background: var(--portal-success);
  color: var(--portal-text-inverse);
  box-shadow: 0 0 0 3px var(--portal-surface), 0 0 0 5px color-mix(in srgb, var(--portal-success) 42%, transparent);
}

body.dashboardMode #partnerInquiryView .partnerInquiryStepButton.ap-step-error > span,
body.dashboardMode #partnerInquiryView .partnerInquiryStepButton.hasError > span,
body.dashboardMode #partnerInquiryView .partnerInquiryStepButton[aria-invalid="true"] > span,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerPortalStepperStep.ap-step-error::before,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerPortalStepperStep.hasError::before,
body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerPortalStepperStep[aria-invalid="true"]::before {
  border-color: var(--portal-error);
  background: color-mix(in srgb, var(--portal-error) 10%, var(--portal-surface));
  color: var(--portal-error);
  box-shadow: 0 0 0 3px var(--portal-surface), 0 0 0 6px color-mix(in srgb, var(--portal-error) 34%, transparent);
}

/* The existing complaint markup also uses the shared stepper classes, but it
   has no nested number span. Own its pseudo marker explicitly so legacy
   complete-state rules can never remove the only visible ring. */
body.dashboardMode #partnerComplaintForm .complaintWizardProgress.partnerPortalStepper {
  counter-reset: partner-complaint-step;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
  overflow: visible;
  padding: 8px 4px 20px;
  border: 0;
  border-bottom: 1px solid var(--portal-border);
  border-radius: 0;
  background: transparent;
  background-color: transparent;
  background-image: none;
  box-shadow: none;
}

body.dashboardMode #partnerComplaintForm .complaintWizardStepButton.partnerPortalStepperStep {
  counter-increment: partner-complaint-step;
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  align-content: start;
  width: 100%;
  min-width: 0;
  min-height: 72px;
  gap: 8px;
  padding: 42px 6px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--portal-text-secondary);
  box-shadow: none;
  font-size: clamp(.72rem, .8vw, .86rem);
  font-weight: 500;
  line-height: 1.3;
  text-align: center;
  white-space: normal;
  overflow-wrap: normal;
  word-break: keep-all;
  hyphens: none;
}

body.dashboardMode #partnerComplaintForm .complaintWizardStepButton.partnerPortalStepperStep::before {
  content: counter(partner-complaint-step);
  display: grid;
  place-items: center;
  position: absolute;
  z-index: 2;
  top: 16px;
  left: 50%;
  width: 30px;
  height: 30px;
  border: 2px solid var(--portal-border-strong);
  border-radius: 50%;
  background: var(--portal-surface-elevated);
  color: var(--portal-text-secondary);
  box-shadow: 0 0 0 3px var(--portal-surface), 0 0 0 4px var(--portal-border-strong);
  font-size: .78rem;
  font-weight: 700;
  line-height: 1;
  transform: translate(-50%, -50%);
}

body.dashboardMode #partnerComplaintForm .complaintWizardStepButton.partnerPortalStepperStep::after {
  content: "";
  position: absolute;
  z-index: 0;
  top: 15px;
  left: calc(50% + 18px);
  width: calc(100% - 36px);
  height: 2px;
  border-radius: 999px;
  background: var(--portal-border-strong);
}

body.dashboardMode #partnerComplaintForm .complaintWizardStepButton.partnerPortalStepperStep:last-child::after {
  content: none;
  display: none;
}

body.dashboardMode #partnerComplaintForm .complaintWizardStepButton.partnerPortalStepperStep:is(.active, .ap-step-active, [aria-current="step"]) {
  color: var(--portal-text-primary);
  font-weight: 650;
}

body.dashboardMode #partnerComplaintForm .complaintWizardStepButton.partnerPortalStepperStep:is(.active, .ap-step-active, [aria-current="step"])::before {
  border-color: var(--portal-accent);
  background: var(--portal-accent);
  color: var(--portal-text-inverse);
  box-shadow: 0 0 0 3px var(--portal-surface), 0 0 0 6px color-mix(in srgb, var(--portal-accent) 72%, transparent);
}

body.dashboardMode #partnerComplaintForm .complaintWizardStepButton.partnerPortalStepperStep:is(.isComplete, .ap-step-complete) {
  color: var(--portal-success);
  font-weight: 600;
}

body.dashboardMode #partnerComplaintForm .complaintWizardStepButton.partnerPortalStepperStep:is(.isComplete, .ap-step-complete)::after {
  background: var(--portal-success);
}

body.dashboardMode #partnerComplaintForm .complaintWizardStepButton.partnerPortalStepperStep:is(.isComplete, .ap-step-complete)::before {
  content: counter(partner-complaint-step);
  display: grid;
  border-color: var(--portal-success);
  background: var(--portal-success);
  color: var(--portal-text-inverse);
  box-shadow: 0 0 0 3px var(--portal-surface), 0 0 0 5px color-mix(in srgb, var(--portal-success) 42%, transparent);
  font-size: .82rem;
}

body.dashboardMode #partnerComplaintForm .complaintWizardStepButton.partnerPortalStepperStep:is(.ap-step-error, .hasError, [aria-invalid="true"]) {
  color: var(--portal-error);
  font-weight: 650;
}

body.dashboardMode #partnerComplaintForm .complaintWizardStepButton.partnerPortalStepperStep:is(.ap-step-error, .hasError, [aria-invalid="true"])::before {
  content: "!";
  display: grid;
  border-color: var(--portal-error);
  background: color-mix(in srgb, var(--portal-error) 10%, var(--portal-surface));
  color: var(--portal-error);
  box-shadow: 0 0 0 3px var(--portal-surface), 0 0 0 6px color-mix(in srgb, var(--portal-error) 34%, transparent);
  font-size: .9rem;
}

body.dashboardMode #partnerComplaintForm .complaintWizardStepButton.partnerPortalStepperStep:focus-visible {
  outline: 2px solid transparent;
  border-radius: var(--portal-radius-control);
  box-shadow: var(--portal-focus-ring);
}

@media (max-width: 900px) {
  body.dashboardMode #partnerComplaintForm .complaintWizardProgress.partnerPortalStepper {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(132px, 38vw);
    grid-template-columns: none;
    overflow-x: auto;
    overflow-y: hidden;
    padding-inline: 8px;
    overscroll-behavior-inline: contain;
    scroll-padding-inline: 8px;
    scroll-snap-type: inline proximity;
    scrollbar-color: var(--portal-accent) transparent;
  }

  body.dashboardMode #partnerComplaintForm .complaintWizardStepButton.partnerPortalStepperStep {
    scroll-snap-align: center;
  }
}

@media (max-width: 520px) {
  body.dashboardMode #partnerComplaintForm .complaintWizardProgress.partnerPortalStepper {
    grid-auto-columns: minmax(118px, 46vw);
  }
}

/* R1: authenticated partner pages use one compact page-header contract.
   The shell and sidebar remain mounted; only the page content changes. */
body.dashboardMode.partnerInquiryMode .dashboardHeadModern:not(.hidden) {
  display: none !important;
}

body.dashboardMode .portalPageHeader {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--portal-space-lg);
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode .portalPageHeaderCopy {
  display: grid;
  min-width: 0;
  gap: 6px;
}

body.dashboardMode .portalPageHeaderEyebrow {
  color: var(--portal-accent);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

body.dashboardMode .portalPageHeader :is(h2, h3) {
  margin: 0;
  color: var(--portal-text-primary);
  font-size: clamp(1.65rem, 3vw, 2.35rem);
  line-height: 1.12;
}

body.dashboardMode .portalPageHeader p {
  max-width: 760px;
  margin: 0;
  color: var(--portal-text-secondary);
  line-height: 1.55;
}

body.dashboardMode .portalPageHeaderAction {
  display: flex;
  flex: 0 0 auto;
  justify-content: flex-end;
}

/* P21: the global page-header back action is one route-neutral visual
   contract.  It uses the long-standing dark secondary button reference;
   wizard navigation retains its separate action-row styling. */
body.dashboardMode .globalPageBackAction {
  border-color: color-mix(in srgb, var(--portal-accent) 36%, var(--portal-surface-dark));
  background: var(--portal-surface-dark);
  color: var(--portal-text-inverse);
  text-shadow: none;
}

body.dashboardMode .globalPageBackAction:not(:disabled):is(:hover, :focus-visible, :active) {
  border-color: var(--portal-accent);
  background: color-mix(in srgb, var(--portal-accent) 25%, var(--portal-surface-dark));
  color: var(--portal-text-inverse);
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView.portalSurface > .portalPageHeader {
  max-width: none !important;
  margin: 0 !important;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView.portalSurface > .portalPageHeader h2 {
  color: var(--portal-text-primary);
  font-size: clamp(1.65rem, 3vw, 2.35rem) !important;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderView.portalSurface > .portalPageHeader .portalButton {
  min-height: 42px;
}

body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardActions {
  gap: var(--portal-space-md) !important;
  padding: var(--portal-space-md) var(--portal-space-lg) var(--portal-space-lg);
}

@media (max-width: 760px) {
  body.dashboardMode .portalPageHeader {
    align-items: stretch;
    flex-direction: column;
    gap: var(--portal-space-md);
  }

  body.dashboardMode .portalPageHeaderAction,
  body.dashboardMode .portalPageHeaderAction .portalButton {
    width: 100%;
  }

  body.dashboardMode.partnerOrderEntryMode #partnerOrderForm .partnerOrderWizardActions {
    justify-content: stretch;
    padding-inline: var(--portal-space-md);
  }
}

/* Partner UX Flow Closure 02
   Shared partner controls and navigation states. This boundary intentionally
   uses only portal tokens and never changes domain-specific layout contracts. */
.portalButton {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 10px 18px;
  border: 1px solid transparent;
  border-radius: var(--portal-radius-control);
  font: 600 .94rem/1.25 var(--ap-font);
  text-decoration: none;
  cursor: pointer;
  transition: border-color 150ms ease, background-color 150ms ease,
    color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.portalButtonIcon {
  flex: 0 0 auto;
  width: 19px;
  height: 19px;
}

.portalButton--primary {
  border-color: var(--action-primary-border);
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
  box-shadow: var(--action-primary-shadow);
}

.portalButton--secondary-dark {
  border-color: color-mix(in srgb, var(--portal-accent) 36%, var(--portal-surface-dark));
  background: var(--portal-surface-dark);
  color: var(--portal-text-inverse);
  box-shadow: var(--portal-shadow-sm);
}

.portalButton--ghost {
  border-color: var(--portal-border);
  background: transparent;
  color: var(--portal-text-primary);
}

.portalButton--danger {
  border-color: color-mix(in srgb, var(--portal-error) 54%, var(--portal-border));
  background: color-mix(in srgb, var(--portal-error) 9%, var(--portal-surface));
  color: var(--portal-error);
  box-shadow: none;
}

.portalButton--icon {
  width: 46px;
  padding: 0;
}

.portalButton:not(:disabled):is(:hover, :focus-visible) {
  outline: none;
  transform: translateY(-1px);
  box-shadow: var(--portal-focus-ring), var(--portal-shadow-md);
}

.portalButton--primary:not(:disabled):hover {
  border-color: var(--action-primary-hover-border);
  background: var(--action-primary-hover-bg);
  color: var(--action-primary-text);
}

.portalButton--secondary-dark:not(:disabled):hover {
  border-color: var(--portal-accent);
  background: color-mix(in srgb, var(--portal-accent) 25%, var(--portal-surface-dark));
  color: var(--portal-text-inverse);
}

.portalButton--ghost:not(:disabled):hover {
  border-color: var(--portal-border-strong);
  background: var(--portal-accent-soft);
  color: var(--portal-text-primary);
}

.portalButton--danger:not(:disabled):hover {
  border-color: var(--portal-error);
  background: var(--portal-error);
  color: var(--portal-text-inverse);
}

.portalButton:disabled {
  cursor: not-allowed;
  opacity: .56;
}

body.dashboardMode #partnerInquiryView .portalButton--secondary-dark,
body.dashboardMode #partnerInquiryView .partnerInquiryRecordBack.portalButton--secondary-dark,
body.dashboardMode #partnerInquiryView .partnerInquiryBackButton.portalButton--secondary-dark,
body.dashboardMode #partnerOrderDetailBox > .portalButton--secondary-dark,
body.dashboardMode #partnerProjectsPanel > .portalButton--secondary-dark {
  border-color: color-mix(in srgb, var(--portal-accent) 36%, var(--portal-surface-dark));
  background: var(--portal-surface-dark);
  color: var(--portal-text-inverse);
  text-shadow: none;
}

body.dashboardMode #partnerInquiryView .portalButton--danger {
  border-color: color-mix(in srgb, var(--portal-error) 54%, var(--portal-border));
  background: color-mix(in srgb, var(--portal-error) 9%, var(--portal-surface));
  color: var(--portal-error);
}

body.dashboardMode #partnerInquiryView .portalButton--danger:not(:disabled):hover {
  border-color: var(--portal-error);
  background: var(--portal-error);
  color: var(--portal-text-inverse);
}

body.dashboardMode .partnerHomeIntro {
  color: var(--portal-text-primary);
}

body.dashboardMode .partnerHomeIntro :where(h2, h3) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode .partnerHomeIntro > p:not(.partnerHomeIntroEyebrow) {
  color: var(--portal-text-secondary);
  text-shadow: none;
}

body.dashboardMode .partnerHomeIntro .partnerHomeIntroEyebrow {
  color: var(--portal-accent);
  text-shadow: none;
}

/* The historical partner-panel contrast rule owns an ID selector and would
   otherwise turn this light-workspace intro white. Keep the shared home intro
   explicit through the component boundary. */
body.dashboardMode.portalPartner.partnerDashboardHome #partnerProjectsPanel .partnerHomeIntro > h3 {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode.portalPartner.partnerDashboardHome #partnerProjectsPanel .partnerHomeIntro > p:not(.partnerHomeIntroEyebrow) {
  color: var(--portal-text-secondary);
  text-shadow: none;
}

body.dashboardMode #partnerOrderDetailBox.portalProjectRecord {
  display: grid;
  width: 100%;
  min-width: 0;
  gap: clamp(18px, 2.5vw, 30px);
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode #partnerOrderDetailBox .portalProjectHero {
  display: grid;
  width: 100%;
  min-height: clamp(300px, 36vw, 420px);
  align-content: end;
  padding: clamp(26px, 4vw, 52px);
  border: 1px solid color-mix(in srgb, var(--portal-accent) 38%, transparent);
  border-radius: var(--portal-radius-hero);
  background-color: var(--portal-surface-dark);
  background-image: var(--portal-project-hero-image, url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg"));
  background-position: center;
  background-size: cover;
  color: var(--portal-text-inverse);
  box-shadow: var(--portal-shadow-lg);
}

/* This selector deliberately includes the legacy head classes so the shared
   project hero owns the complete component without a local override cascade. */
body.dashboardMode #partnerOrderDetailBox .partnerOrderDetailHead.portalHero--media.portalProjectHero {
  min-height: clamp(300px, 36vw, 420px);
  max-width: none;
  margin: 0;
  padding: clamp(26px, 4vw, 52px);
  background-color: var(--portal-surface-dark);
  background-image: var(--portal-project-hero-image, url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg"));
  background-position: center;
  background-size: cover;
}

body.dashboardMode #partnerOrderDetailBox .portalProjectHero::before {
  background: linear-gradient(92deg,
    color-mix(in srgb, var(--portal-surface-dark) 96%, transparent),
    color-mix(in srgb, var(--portal-surface-dark) 74%, transparent) 56%,
    color-mix(in srgb, var(--portal-surface-dark) 30%, transparent));
}

body.dashboardMode #partnerOrderDetailBox .portalProjectHeroContent {
  position: relative;
  z-index: 1;
  display: grid;
  width: min(100%, 1080px);
  gap: 12px;
}

body.dashboardMode #partnerOrderDetailBox .portalProjectHeroContent > :where(h2, h3, p, span, strong, small, a, svg) {
  color: var(--portal-text-inverse);
  text-shadow: none;
}

/* The generic light-record contract styles every project-detail heading dark.
   The extra shared hero class raises only this media component above that
   broad rule so its complete text layer remains readable on the photograph. */
body.dashboardMode #partnerOrderDetailBox .portalProjectHero .portalProjectHeroContent > :is(h2, h3, p, span, strong, small, a, svg) {
  color: var(--portal-text-inverse);
  text-shadow: none;
}

body.dashboardMode #partnerOrderDetailBox .portalProjectHeroContent > h3 {
  max-width: 22ch;
  margin: 0;
  font-size: clamp(2rem, 4.4vw, 4.25rem);
  line-height: 1.02;
  overflow-wrap: anywhere;
}

body.dashboardMode #partnerOrderDetailBox .partnerOrderDetailMeta {
  margin: 4px 0 0;
  color: var(--portal-text-inverse);
}

body.dashboardMode #partnerOrderDetailBox .partnerOrderHeroMeta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  max-width: 920px;
}

body.dashboardMode #partnerOrderDetailBox .partnerOrderHeroMetaItem {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  min-width: 0;
  gap: 8px;
  margin: 0;
  padding: 9px 12px;
  border: 1px solid color-mix(in srgb, var(--portal-text-inverse) 24%, transparent);
  border-radius: var(--portal-radius-control);
  background: color-mix(in srgb, var(--portal-surface-dark) 62%, transparent);
  color: var(--portal-text-inverse);
  backdrop-filter: blur(8px);
}

body.dashboardMode #partnerOrderDetailBox .partnerOrderHeroMetaItem :where(strong, a, small) {
  min-width: 0;
  color: var(--portal-text-inverse);
  overflow-wrap: anywhere;
}

body.dashboardMode #partnerOrderDetailBox .partnerOrderHeroStatus {
  grid-column: 1 / -1;
  grid-template-columns: 12px minmax(0, auto) minmax(0, 1fr);
}

body.dashboardMode #partnerOrderDetailBox > .detailBackButton,
body.dashboardMode #partnerProjectsPanel > .detailBackButton {
  justify-self: start;
  width: auto;
  margin: 0;
}

.portalSelectionCardGroup {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 0;
  padding: 0;
  border: 0;
}

.portalSelectionCard {
  position: relative;
  display: grid;
  min-height: 148px;
  align-content: center;
  gap: 8px;
  padding: 22px;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-card);
  background: var(--portal-surface-elevated);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-sm);
  cursor: pointer;
  transition: border-color 150ms ease, background-color 150ms ease,
    color 150ms ease, box-shadow 150ms ease;
}

.portalSelectionCard > input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.portalSelectionCard > :where(strong, small) {
  color: inherit;
}

.portalSelectionCard > small {
  color: var(--portal-text-secondary);
}

.portalSelectionCardCheck {
  position: absolute;
  top: 14px;
  right: 14px;
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 1px solid var(--portal-border);
  border-radius: 50%;
  background: var(--portal-surface);
  color: transparent;
  opacity: 0;
}

.portalSelectionCardCheck .portalIcon {
  width: 16px;
  height: 16px;
}

.portalSelectionCard:is(:hover, :has(input:checked)) {
  border-color: var(--portal-accent);
  background: color-mix(in srgb, var(--portal-accent-soft) 56%, var(--portal-surface-elevated));
}

.portalSelectionCard:has(input:checked) .portalSelectionCardCheck {
  border-color: var(--portal-accent);
  background: var(--portal-accent);
  color: var(--portal-text-inverse);
  opacity: 1;
}

.portalSelectionCard:has(input:focus-visible) {
  outline: none;
  box-shadow: var(--portal-focus-ring);
}

.portalNumberInput {
  display: grid;
  min-width: 0;
  gap: 7px;
  color: var(--portal-text-primary);
}

body.dashboardMode .appContent .portalNumberInputControl {
  border-color: var(--portal-border-strong);
  background: var(--portal-surface-elevated);
  color: var(--portal-text-primary);
  caret-color: var(--portal-accent);
}

body.dashboardMode .appContent .portalNumberInputControl:is(:hover, :focus) {
  border-color: var(--portal-accent);
  background: var(--portal-surface-elevated);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-focus-ring);
}

body.dashboardMode .appContent .portalNumberInputControl[aria-invalid="true"] {
  border-color: var(--portal-error);
  background: color-mix(in srgb, var(--portal-error) 4%, var(--portal-surface-elevated));
  color: var(--portal-text-primary);
}

body.dashboardMode .appContent .portalNumberInputControl:disabled {
  border-color: var(--portal-border);
  background: var(--portal-surface-subtle);
  color: var(--portal-text-muted);
}

.portalFieldError {
  color: var(--portal-error);
  font-size: .78rem;
  font-weight: 600;
  line-height: 1.35;
}

body.dashboardMode .appSidebar {
  overflow-x: hidden;
  overflow-y: auto;
}

.portalSidebarSearch {
  position: relative;
  display: grid;
  gap: 8px;
}

.portalSidebarSearchControl {
  position: relative;
}

.portalSidebarSearch .portalSidebarSearchInput {
  width: 100%;
  padding-right: 46px;
  border-color: var(--portal-sidebar-border);
  background: color-mix(in srgb, var(--portal-surface-dark) 78%, transparent);
  color: var(--portal-text-inverse);
  caret-color: var(--portal-accent);
}

.portalSidebarSearch .portalSidebarSearchInput::placeholder {
  color: color-mix(in srgb, var(--portal-text-inverse) 62%, transparent);
}

.portalSidebarSearch .portalSidebarSearchInput:focus {
  border-color: var(--portal-accent);
  background: var(--portal-surface-dark);
  color: var(--portal-text-inverse);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--portal-accent) 28%, transparent);
}

.portalSidebarSearch .portalSidebarSearchInput::-webkit-search-cancel-button {
  display: none;
}

.portalSidebarSearchClear {
  position: absolute;
  top: 50%;
  right: 6px;
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
  color: var(--portal-text-inverse);
  transform: translateY(-50%);
}

.portalSidebarSearchClear:is(:hover, :focus-visible) {
  border-color: color-mix(in srgb, var(--portal-accent) 46%, transparent);
  background: color-mix(in srgb, var(--portal-accent) 20%, transparent);
  outline: none;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--portal-accent) 22%, transparent);
}

.portalSidebarSearchClearIcon {
  width: 17px;
  height: 17px;
}

.portalSidebarSearchResults {
  position: absolute;
  z-index: var(--ap-z-popover);
  top: calc(100% + 8px);
  left: 0;
  display: grid;
  width: 100%;
  max-height: min(360px, 52vh);
  gap: 4px;
  overflow-y: auto;
  padding: 6px;
  border: 1px solid var(--portal-sidebar-border);
  border-radius: var(--portal-radius-card);
  background: var(--portal-surface-dark);
  color: var(--portal-text-inverse);
  box-shadow: var(--portal-shadow-lg);
  overscroll-behavior: contain;
}

.portalSidebarSearchOption {
  display: grid;
  width: 100%;
  min-width: 0;
  gap: 5px;
  padding: 11px 12px;
  border: 1px solid transparent;
  border-radius: var(--portal-radius-control);
  background: transparent;
  color: var(--portal-text-inverse);
  text-align: left;
}

.portalSidebarSearchOption:is(:hover, :focus-visible, .isActive) {
  border-color: color-mix(in srgb, var(--portal-accent) 44%, transparent);
  background: color-mix(in srgb, var(--portal-accent) 18%, transparent);
  color: var(--portal-text-inverse);
  outline: none;
  box-shadow: none;
}

.portalSidebarSearchTopline {
  display: flex;
  min-width: 0;
  align-items: start;
  justify-content: space-between;
  gap: 8px;
}

.portalSidebarSearchTopline :where(strong, small),
.portalSidebarSearchMeta {
  color: inherit;
}

.portalSidebarSearchTopline strong,
.portalSidebarSearchMeta {
  min-width: 0;
  overflow-wrap: anywhere;
}

.portalSidebarSearchTopline small,
.portalSidebarSearchMeta {
  color: color-mix(in srgb, var(--portal-text-inverse) 68%, transparent);
  font-size: .76rem;
}

.portalSidebarSearchMessage {
  display: grid;
  gap: 4px;
  padding: 13px 12px;
  color: var(--portal-text-inverse);
}

.portalSidebarSearchMessage :where(strong, small) {
  color: inherit;
}

.portalSidebarSearchMessage small {
  color: color-mix(in srgb, var(--portal-text-inverse) 65%, transparent);
}

.portalUploadField {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  min-width: 0;
  gap: 14px;
  padding: clamp(18px, 3vw, 28px);
  border: 1px dashed var(--portal-border-strong);
  border-radius: var(--portal-radius-card);
  background: var(--portal-surface-subtle);
  color: var(--portal-text-primary);
  transition: border-color 150ms ease, background-color 150ms ease, box-shadow 150ms ease;
}

.portalUploadField:is(:focus-within, .isDragOver) {
  border-color: var(--portal-accent);
  background: var(--portal-accent-soft);
  box-shadow: var(--portal-focus-ring);
}

.portalUploadNative {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.portalUploadIcon {
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border-radius: 50%;
  background: var(--portal-accent-soft);
  color: var(--portal-accent);
}

.portalUploadIcon .portalIcon {
  width: 22px;
  height: 22px;
}

.portalUploadCopy {
  display: grid;
  min-width: 0;
  gap: 4px;
}

.portalUploadCopy strong {
  color: var(--portal-text-primary);
}

.portalUploadCopy small,
.portalUploadStatus {
  color: var(--portal-text-secondary);
  overflow-wrap: anywhere;
}

.portalUploadStatus {
  grid-column: 2 / -1;
  font-size: .82rem;
}

.portalReviewCardHead {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
}

.portalReviewCardIcon {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 50%;
  background: var(--portal-accent-soft);
  color: var(--portal-accent);
}

.portalReviewCardIcon .portalIcon {
  width: 19px;
  height: 19px;
}

.portalReviewCardHead h4 {
  min-width: 0;
  margin: 0;
  color: var(--portal-text-primary);
}

.portalReviewEdit {
  min-height: 40px;
  padding: 7px 12px;
}

body.dashboardMode #partnerInquiryView .partnerInquiryListCard .formActions {
  align-items: stretch;
}

body.dashboardMode #partnerInquiryView .partnerInquiryListCard .partnerInquiryWithdrawButton {
  margin-inline-start: auto;
}

body.dashboardMode #partnerInquiryView .partnerInquiryProgress--terminal {
  grid-template-columns: minmax(0, 1fr);
}

body.dashboardMode #partnerInquiryView .partnerInquiryProgress--terminal li.isTerminal {
  border-color: color-mix(in srgb, var(--portal-error) 42%, var(--portal-border));
  background: color-mix(in srgb, var(--portal-error) 8%, var(--portal-surface));
  color: var(--portal-text-primary);
}

body.dashboardMode #partnerInquiryView .partnerInquiryProgress--terminal li.isTerminal > span {
  background: color-mix(in srgb, var(--portal-error) 18%, var(--portal-surface));
  color: var(--portal-error);
}

/* The complaint wizard keeps a historical ID selector. Reassert the shared
   Secondary Dark component with greater specificity so its computed style is
   the same as every other portal back action. */
body.dashboardMode .appContent #partnerComplaintForm #complaintWizardBackButton.portalButton--secondary-dark {
  border-color: color-mix(in srgb, var(--portal-accent) 36%, var(--portal-surface-dark));
  background: var(--portal-surface-dark);
  color: var(--portal-text-inverse);
  box-shadow: var(--portal-shadow-sm);
}

body.dashboardMode .appContent #partnerComplaintForm #complaintWizardBackButton.portalButton--secondary-dark:not(:disabled):is(:hover, :focus-visible) {
  border-color: var(--portal-accent);
  background: color-mix(in srgb, var(--portal-accent) 25%, var(--portal-surface-dark));
  color: var(--portal-text-inverse);
  box-shadow: var(--portal-focus-ring), var(--portal-shadow-md);
}

body.dashboardMode .portalSelectMenu {
  z-index: var(--ap-z-popover);
}

/* P2: Partner project and complaint surfaces stay in the authenticated light
   workspace. This intentionally does not address the frozen page header,
   navigation, portal back action, or wizard action row. */
body.dashboardMode.rolePartner #partnerProjectsCards.partnerProjectsCards {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode.rolePartner #partnerProjectsCards .partnerProjectsHeader,
body.dashboardMode.rolePartner #partnerProjectsCards .partnerProjectCard,
body.dashboardMode.rolePartner #partnerProjectsCards .partnerProjectField {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode.rolePartner #partnerProjectsCards .partnerProjectCard:is(:hover, :focus-visible) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

body.dashboardMode.rolePartner #partnerProjectsCards :is(.partnerProjectField strong, .partnerProjectField > span:not(.partnerProjectLabel):not(.partnerProjectSortableLabel):not(.partnerProjectLabelInline)) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode.rolePartner #partnerProjectsCards :is(.partnerProjectLabel, .partnerProjectSortableLabel, .partnerProjectLabelInline, .partnerProjectStatusTag) {
  color: var(--portal-text-secondary);
  text-shadow: none;
}

body.dashboardMode.rolePartner #partnerProjectsCards .partnerProjectEmptyState {
  display: grid;
  gap: 6px;
  min-height: 0;
  padding: 20px;
  border: 1px solid var(--portal-surface-border);
  border-radius: var(--portal-radius-card);
  background: var(--portal-surface-muted);
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode.rolePartner #partnerProjectsCards .partnerProjectEmptyState :is(strong, p) {
  margin: 0;
  color: var(--portal-text-primary);
}

body.dashboardMode.rolePartner #partnerProjectsCards .partnerProjectEmptyState p {
  color: var(--portal-text-secondary);
}

body.dashboardMode.rolePartner.partnerComplaintWorkflowMode #partnerComplaintForm.partnerComplaintForm {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-soft);
}

body.dashboardMode.rolePartner #partnerComplaintForm :is(.portalSurfaceHead h3, .complaintWizardStepHead h4, label, .complaintWizardSummaryRows strong) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode.rolePartner #partnerComplaintForm :is(.portalSurfaceHead .mutedText, .complaintWizardStepHead p, .complaintWizardSummaryRows span) {
  color: var(--portal-text-secondary);
  text-shadow: none;
}

body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardStep,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardSummaryRows article,
body.dashboardMode.rolePartner #partnerComplaintForm .complaintSelectedProjectSummary {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-muted);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode.rolePartner #partnerComplaintForm #complaintProjectSearch {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-active);
  background-image: none;
  color: var(--portal-text-primary);
  -webkit-text-fill-color: var(--portal-text-primary);
  box-shadow: inset 0 1px 0 #ffffff;
}

body.dashboardMode.rolePartner #partnerComplaintForm #complaintProjectSearch::placeholder {
  color: var(--portal-text-muted);
  opacity: 1;
}

body.dashboardMode.rolePartner #partnerComplaintForm .complaintProjectOption.partnerCardInteractive {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-active);
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode.rolePartner #partnerComplaintForm .complaintProjectOption.partnerCardInteractive :is(strong, span) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode.rolePartner #partnerComplaintForm .complaintProjectOption.partnerCardInteractive span {
  color: var(--portal-text-secondary);
}

body.dashboardMode.rolePartner #partnerComplaintForm .complaintProjectOption.partnerCardInteractive:is(:hover, :focus, :focus-visible, :active, .is-selected, .ap-card-selected) {
  border-color: var(--portal-surface-border-active);
  background: color-mix(in srgb, var(--portal-accent-soft) 62%, var(--portal-surface-active));
  background-image: none;
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-active);
}

@media (max-width: 760px) {
  body.dashboardMode.rolePartner #partnerProjectsCards,
  body.dashboardMode.rolePartner #partnerComplaintForm,
  body.dashboardMode.rolePartner #partnerComplaintForm .complaintWizardStep {
    min-width: 0;
    overflow-x: clip;
  }
}

@media (max-width: 760px) {
  body.dashboardMode #partnerOrderDetailBox .portalProjectHero {
    min-height: clamp(220px, 72vw, 300px);
    padding: 22px 18px;
    background-position: 58% center;
  }

  body.dashboardMode #partnerOrderDetailBox .partnerOrderDetailHead.portalHero--media.portalProjectHero {
    min-height: clamp(220px, 72vw, 300px);
    max-width: none;
    margin: 0;
    padding: 22px 18px;
    background-image: var(--portal-project-hero-image, url("/assets/pv-montage-ziegeldach-montageschienen-bayern.jpg"));
    background-position: 58% center;
    background-size: cover;
  }

  body.dashboardMode #partnerOrderDetailBox .portalProjectHeroContent > h3 {
    max-width: 16ch;
    font-size: clamp(1.9rem, 9vw, 3rem);
  }

  body.dashboardMode #partnerOrderDetailBox .partnerOrderHeroMeta {
    grid-template-columns: minmax(0, 1fr);
  }

  body.dashboardMode #partnerOrderDetailBox .partnerOrderHeroStatus {
    grid-column: auto;
    grid-template-columns: 12px minmax(0, 1fr);
  }

  body.dashboardMode #partnerOrderDetailBox .partnerOrderHeroStatus small {
    grid-column: 2;
  }

  .portalSelectionCardGroup {
    grid-template-columns: minmax(0, 1fr);
  }

  .portalSelectionCard {
    min-height: 112px;
  }

  .portalUploadField {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .portalUploadChoose {
    grid-column: 1 / -1;
    width: 100%;
  }

  .portalUploadStatus {
    grid-column: 1 / -1;
  }

  .portalReviewCardHead {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .portalReviewEdit {
    grid-column: 1 / -1;
    justify-self: start;
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryListCard .formActions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  body.dashboardMode #partnerInquiryView .partnerInquiryListCard .partnerInquiryWithdrawButton {
    width: 100%;
    margin-inline-start: 0;
  }
}

/* P3: shared wizard actions for the authenticated partner portal. Header
   navigation and content surfaces deliberately remain outside this boundary. */
body.dashboardMode .appContent .partnerWizardActionRow {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: var(--portal-space-md) !important;
  margin: var(--portal-space-lg) 0 0 !important;
  padding: var(--portal-space-lg) var(--portal-space-lg) var(--portal-space-md) !important;
  border-top: 1px solid var(--portal-surface-border);
}

body.dashboardMode .appContent .partnerWizardActionRow > button {
  display: inline-flex;
  min-height: 48px !important;
  align-items: center;
  justify-content: center;
  gap: 9px;
  margin: 0 !important;
  padding: 10px 18px !important;
  border-radius: var(--portal-radius-control) !important;
  font: 600 .94rem/1.25 var(--ap-font);
  text-align: center;
}

body.dashboardMode .appContent .partnerWizardActionRow :is(
  [data-inquiry-step-back],
  #partnerOrderWizardBackButton,
  #complaintWizardBackButton
) {
  border-color: #5f6b76;
  background: #6d7884;
  color: #ffffff;
  box-shadow: none;
}

body.dashboardMode .appContent .partnerWizardActionRow :is(
  [data-inquiry-step-back],
  #partnerOrderWizardBackButton,
  #complaintWizardBackButton
):not(:disabled):is(:hover, :focus-visible) {
  border-color: #4d5965;
  background: #596571;
  color: #ffffff;
  box-shadow: var(--portal-focus-ring), var(--portal-shadow-sm);
}

body.dashboardMode .appContent .partnerWizardActionRow [data-complaint-action="list"] {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
  box-shadow: none;
}

body.dashboardMode .appContent .partnerWizardActionRow [data-complaint-action="list"]:not(:disabled):is(:hover, :focus-visible) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-muted);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-focus-ring);
}

body.dashboardMode .appContent .partnerWizardActionRow > button:disabled {
  border-color: #b7c1ca;
  background: #d8e0e6;
  color: #53616d;
  opacity: 1;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}

@media (max-width: 760px) {
  body.dashboardMode .appContent .partnerWizardActionRow {
    align-items: stretch;
    padding: var(--portal-space-md) 0 0 !important;
  }

  body.dashboardMode .appContent .partnerWizardActionRow > button {
    flex: 1 1 100%;
    width: 100%;
  }
}

/* P4: the partner home keeps the dashboard greeting as its only introduction.
   The action sections sit directly on the existing page surface; individual
   action cards deliberately retain their established visual treatment. */
body.dashboardMode.rolePartner.partnerDashboardHome #partnerProjectsCards.partnerProjectsCards {
  gap: clamp(24px, 2.2vw, 32px) !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0;
  border-radius: 0;
  background: transparent;
  background-image: none;
  box-shadow: none;
}

body.dashboardMode.rolePartner.partnerDashboardHome #partnerProjectsCards .partnerHomeWorkspace {
  gap: clamp(24px, 2.2vw, 32px);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  background-image: none;
  box-shadow: none;
}

body.dashboardMode.rolePartner.partnerDashboardHome #partnerProjectsCards .partnerHomeActionSection {
  gap: var(--portal-space-lg);
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  background-image: none;
  box-shadow: none;
}

/* P5: open inquiries reuse the partner home action-tile surface without
   changing the frozen home page, inquiry actions, or group structure. */
body.dashboardMode #partnerInquiryView {
  --partner-inquiry-card-standard:
    radial-gradient(circle at 18% 0%, rgba(72, 159, 223, .2), transparent 32%),
    linear-gradient(145deg, rgba(255, 255, 255, .04), rgba(255, 255, 255, .012)),
    var(--portal-surface);
}

body.dashboardMode #partnerInquiryView .partnerInquiryListActionCard .partnerHomeActionCard,
body.dashboardMode #partnerInquiryView .partnerInquiryListCard {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--portal-border);
  border-radius: var(--portal-radius-surface);
  background: var(--partner-inquiry-card-standard);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow);
  transform: translateY(0);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

body.dashboardMode #partnerInquiryView .partnerInquiryListActionCard .partnerHomeActionCard {
  min-height: 210px;
  padding: var(--portal-space-xl);
}

body.dashboardMode #partnerInquiryView :is(
  .partnerInquiryListActionCard .partnerHomeActionCard,
  .partnerInquiryListCard
) :where(h3, p, small, strong, span, em, svg, .mutedText, .partnerInquiryReference, .partnerInquiryLegacyHint) {
  color: inherit;
  text-shadow: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryListActionCard .partnerHomeActionIcon {
  border-color: var(--portal-border-strong);
  background: rgba(72, 159, 223, .16);
  color: var(--portal-text-primary);
}

body.dashboardMode #partnerInquiryView :is(
  .partnerInquiryListActionCard .partnerHomeActionCard,
  .partnerInquiryListCard
):is(:hover, :focus-visible, :focus-within) {
  border-color: rgba(84, 173, 234, .62);
  background: var(--portal-surface-dark);
  color: var(--portal-text-inverse);
  box-shadow: var(--portal-shadow-lg), var(--portal-focus-ring);
  transform: translateY(-3px);
  outline: none;
}

body.dashboardMode #partnerInquiryView .partnerInquiryListCard:is(:hover, :focus-within) .ap-badge {
  border-color: rgba(255, 255, 255, .36);
  background: rgba(255, 255, 255, .14);
  color: var(--portal-text-inverse);
}

body.dashboardMode #partnerInquiryView .partnerInquiryListActionCard .partnerHomeActionCard:is(:hover, :focus-visible) .partnerHomeActionIcon {
  border-color: rgba(255, 255, 255, .36);
  background: rgba(255, 255, 255, .14);
  color: var(--portal-text-inverse);
}

@media (max-width: 760px) {
body.dashboardMode #partnerInquiryView .partnerInquiryListActionCard {
    width: 100%;
    max-width: none;
  }
}

/* P6: every authenticated partner subpage keeps the established inquiry
   back-action component. Its visual treatment comes from the shared primary
   action component; this boundary remains layout- and route-neutral. */
body.dashboardMode.rolePartner .partnerPortalBackAction {
  text-shadow: none;
}

/* P7: project lists sit directly on the partner workspace. Keep the actual
   project rows intact, but remove the two legacy wrapper surfaces behind them. */
body.dashboardMode.rolePartner:not(.partnerDashboardHome):not(.partnerComplaintWorkflowMode):not(.partnerOrderEntryMode) #partnerProjectsPanel.reviewBox {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode.rolePartner:not(.partnerDashboardHome):not(.partnerComplaintWorkflowMode):not(.partnerOrderEntryMode) #partnerProjectsIntro :is(h3, #partnerProjectsTitle) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode.rolePartner:not(.partnerDashboardHome):not(.partnerComplaintWorkflowMode):not(.partnerOrderEntryMode) #partnerProjectsText {
  color: var(--portal-text-secondary);
  text-shadow: none;
}

body.dashboardMode.rolePartner:not(.partnerDashboardHome):not(.partnerComplaintWorkflowMode):not(.partnerOrderEntryMode) #partnerProjectsCards.partnerProjectsCards {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode.rolePartner:not(.partnerDashboardHome):not(.partnerComplaintWorkflowMode):not(.partnerOrderEntryMode) #partnerProjectsCards .partnerProjectsHeader {
  padding: 0 var(--portal-space-lg) var(--portal-space-sm);
  border: 0;
  border-bottom: 1px solid var(--portal-surface-border);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

/* P7 table overview: complaints and project lists deliberately share the
   existing premium-list grid. The dark header is the single table anchor;
   rows stay compact, bright and directly on the authenticated workspace. */
body.dashboardMode.rolePartner #partnerProjectsCards .ap-list-v2.portalList {
  border-color: var(--portal-surface-border);
  background: var(--portal-surface-default);
  box-shadow: var(--portal-shadow-sm);
}

body.dashboardMode.rolePartner #partnerProjectsCards .ap-list-v2-header {
  border-bottom-color: rgba(255, 255, 255, .16);
  background: var(--portal-surface-dark);
}

body.dashboardMode.rolePartner #partnerProjectsCards .ap-list-v2-header-cell,
body.dashboardMode.rolePartner #partnerProjectsCards .ap-list-v2-header-cell > span {
  color: var(--portal-text-inverse);
}

body.dashboardMode.rolePartner #partnerProjectsCards .ap-list-v2 .ap-list-v2-sort-button {
  color: rgba(255, 255, 255, .9);
}

body.dashboardMode.rolePartner #partnerProjectsCards .ap-list-v2 .ap-list-v2-sort-button:is(:hover, .active) {
  background: rgba(255, 255, 255, .16);
  color: var(--portal-text-inverse);
}

body.dashboardMode.rolePartner #partnerProjectsCards .ap-list-v2 .ap-list-v2-row {
  border-bottom-color: var(--portal-surface-border);
  background: var(--portal-surface-active);
  color: var(--portal-text-primary);
}

body.dashboardMode.rolePartner #partnerProjectsCards .ap-list-v2 .ap-list-v2-row.is-interactive:is(:hover, :active),
body.dashboardMode.rolePartner #partnerProjectsCards .ap-list-v2 .ap-list-v2-row.is-interactive:focus-visible {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-muted);
  color: var(--portal-text-primary);
}

body.dashboardMode.rolePartner #partnerProjectsCards .ap-list-v2 :is(
  .ap-list-v2-value,
  .ap-list-v2-cell-primary .ap-list-v2-value,
  .ap-list-v2-cell-primary .ap-list-v2-value strong,
  .ap-list-v2-cell-secondary .ap-list-v2-value,
  .ap-list-v2-cell-secondary .ap-list-v2-value strong
) {
  color: var(--portal-text-primary);
}

body.dashboardMode.rolePartner #partnerProjectsCards .ap-list-v2 .ap-list-v2-stack small {
  color: var(--portal-text-secondary);
}

@media (max-width: 760px) {
  body.dashboardMode.rolePartner #partnerProjectsCards .ap-list-v2.portalList {
    box-shadow: none;
  }
}

/* P8: one semantic primary-action source for all authenticated portals.
   The values intentionally mirror the established “Entwurf fortsetzen”
   action. Page-back actions use the same component; wizard-back stays neutral
   through the P3 selector above.
   FINAL_EFFECTIVE_STYLE_SOURCE: CANONICAL_ACTION_STYLE */
body.dashboardMode :is(.primaryButton, .ap-button-primary, .portalButton--primary) {
  border-color: var(--action-primary-border);
  background: var(--action-primary-bg);
  color: var(--action-primary-text);
  box-shadow: var(--action-primary-shadow);
}

body.dashboardMode :is(.primaryButton, .ap-button-primary, .portalButton--primary):not(:disabled):is(:hover, :focus-visible, :active) {
  border-color: var(--action-primary-hover-border);
  background: var(--action-primary-hover-bg);
  color: var(--action-primary-text);
  box-shadow: var(--action-primary-focus), var(--action-primary-hover-shadow);
}

body.dashboardMode :is(.primaryButton, .ap-button-primary, .portalButton--primary):disabled {
  border-color: #b7c1ca;
  background: #d8e0e6;
  color: #53616d;
  opacity: 1;
  cursor: not-allowed;
  box-shadow: none;
  transform: none;
}

/* P9.1: complaint overviews use the existing P7 premium-list table surface.
   The shared shell intro is hidden for the complaint list. The visible title
   and count are rendered by complaintOverviewSection itself, so style that
   concrete component rather than the hidden shell header. */
body.dashboardMode.rolePartner #partnerProjectsPanel.reviewBox:has(.complaintOverviewSection) #partnerProjectsIntro :is(h3, #partnerProjectsTitle) {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode.rolePartner #partnerProjectsPanel.reviewBox:has(.complaintOverviewSection) #partnerProjectsText {
  color: var(--portal-text-secondary);
  text-shadow: none;
}

body.dashboardMode.rolePartner #partnerProjectsPanel.reviewBox:has(.complaintOverviewSection) #partnerProjectsCards.partnerProjectsCards {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.dashboardMode.rolePartner .complaintOverviewSection > .ap-section-body {
  gap: 0;
}

body.dashboardMode.rolePartner .complaintOverviewSection .ap-section-title {
  color: var(--portal-text-primary);
  text-shadow: none;
}

body.dashboardMode.rolePartner .complaintOverviewSection .ap-section-description {
  color: var(--portal-text-secondary);
  text-shadow: none;
}

body.dashboardMode.rolePartner .complaintPremiumList.ap-list-v2.portalList {
  border-color: var(--portal-surface-border);
  border-radius: var(--portal-radius-panel);
  background: var(--portal-surface-default);
  color: var(--portal-text-primary);
  box-shadow: var(--portal-shadow-sm);
  overflow: hidden;
}

body.dashboardMode.rolePartner .complaintPremiumList .ap-list-v2-header {
  min-height: 48px;
  padding: var(--ap-space-2) var(--ap-space-4);
  border-bottom-color: rgba(255, 255, 255, .16);
  background: var(--portal-surface-dark);
}

body.dashboardMode.rolePartner .complaintPremiumList .ap-list-v2-header-cell,
body.dashboardMode.rolePartner .complaintPremiumList .ap-list-v2-header-cell > span {
  color: var(--portal-text-inverse);
}

body.dashboardMode.rolePartner .complaintPremiumList .ap-list-v2-sort-button {
  color: rgba(255, 255, 255, .9);
}

body.dashboardMode.rolePartner .complaintPremiumList .ap-list-v2-sort-button:is(:hover, .active) {
  background: rgba(255, 255, 255, .16);
  color: var(--portal-text-inverse);
}

body.dashboardMode.rolePartner .complaintPremiumList .ap-list-v2-body,
body.dashboardMode.rolePartner .complaintPremiumList .ap-list-v2-empty {
  background: var(--portal-surface-active);
}

body.dashboardMode.rolePartner .complaintPremiumList .ap-list-v2-empty {
  min-height: calc(var(--ap-space-8) + var(--ap-space-8));
  color: var(--portal-text-primary);
}

body.dashboardMode.rolePartner .complaintPremiumList .ap-list-v2-empty .mutedText {
  color: var(--portal-text-primary);
  text-shadow: none;
}

/* P18: authoritative typography and state coverage for the shared
   authenticated form-control contract. */
body.dashboardMode .appContent :where(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea),
body.dashboardMode :where(.portalSelectTrigger, .ap-select-v2-trigger) {
  color-scheme: light;
  border-color: var(--portal-surface-border);
  background: rgba(255, 255, 255, .94);
  background-color: rgba(255, 255, 255, .94);
  background-image: none;
  color: var(--portal-text-primary);
  -webkit-text-fill-color: var(--portal-text-primary);
  font-weight: 400 !important;
  box-shadow: inset 0 1px 0 #ffffff, 0 8px 20px rgba(29, 76, 111, .05);
}

body.dashboardMode .appContent :where(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea):is(:hover, :focus),
body.dashboardMode :where(.portalSelectTrigger, .ap-select-v2-trigger):is(:hover, :focus-visible, .isOpen, .is-open) {
  border-color: var(--portal-surface-border-active);
  background: var(--portal-surface-active);
  background-color: var(--portal-surface-active);
  color: var(--portal-text-primary);
  -webkit-text-fill-color: var(--portal-text-primary);
  outline: none;
  box-shadow: var(--portal-focus-ring), var(--portal-shadow-sm);
}

body.dashboardMode .appContent :where(input:not([type="checkbox"]):not([type="radio"]), textarea)::placeholder {
  color: var(--portal-text-muted);
  font-weight: 400;
  opacity: 1;
}

body.dashboardMode .appContent :where(select option, .portalSelectOption, .ap-select-v2-option),
body.dashboardMode .appContent :where(label, small, .formHint, .mutedText) {
  font-weight: 400 !important;
}

body.dashboardMode .appContent :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea):is(:disabled, [readonly]) {
  background: var(--portal-surface-muted);
  background-color: var(--portal-surface-muted);
  color: var(--portal-text-secondary);
  -webkit-text-fill-color: var(--portal-text-secondary);
  opacity: 1;
}

body.dashboardMode .appContent :where(input:not([type="checkbox"]):not([type="radio"])):-webkit-autofill,
body.dashboardMode .appContent textarea:-webkit-autofill {
  -webkit-text-fill-color: var(--portal-text-primary);
  box-shadow: 0 0 0 1000px rgba(255, 255, 255, .94) inset;
}

/* P20: one light select contract for native fallbacks and both shared
   listbox implementations.  This intentionally follows the P18 boundary
   so historical order-, admin-, work- and referral-specific dark rules
   cannot win the cascade for normal form selection controls. */
body.dashboardMode .appContent :is(select:not([multiple]), .portalSelectTrigger, .ap-select-v2-trigger) {
  color-scheme: light;
  border-color: var(--portal-surface-border) !important;
  background: var(--portal-surface-muted) !important;
  background-color: var(--portal-surface-muted) !important;
  background-image: none !important;
  color: var(--portal-text-primary) !important;
  -webkit-text-fill-color: var(--portal-text-primary) !important;
  font-weight: 400 !important;
}

body.dashboardMode .appContent :is(select:not([multiple]), .portalSelectTrigger, .ap-select-v2-trigger):is(:hover, :focus, :focus-visible, .isOpen, .is-open) {
  border-color: var(--portal-surface-border-active) !important;
  background: var(--portal-surface-active) !important;
  background-color: var(--portal-surface-active) !important;
  color: var(--portal-text-primary) !important;
  -webkit-text-fill-color: var(--portal-text-primary) !important;
  box-shadow: var(--portal-focus-ring), var(--portal-shadow-sm) !important;
}

body.dashboardMode :is(.portalSelectMenu, .ap-select-v2-menu) {
  border-color: var(--portal-surface-border-active) !important;
  background: var(--portal-surface-active) !important;
  color: var(--portal-text-primary) !important;
}

body.dashboardMode :is(select option, .portalSelectOption, .ap-select-v2-option) {
  background: var(--portal-surface-active) !important;
  color: var(--portal-text-primary) !important;
  font-weight: 400 !important;
}

body.dashboardMode :is(.portalSelectOption, .ap-select-v2-option):is(:hover, .isActive, .is-active, .isSelected, .is-selected, [aria-selected="true"]) {
  background: var(--portal-accent-soft) !important;
  color: var(--portal-text-primary) !important;
}

body.dashboardMode .appContent :is(select:not([multiple]), .portalSelectTrigger, .ap-select-v2-trigger):is(:disabled, [aria-disabled="true"]) {
  background: var(--portal-surface-muted) !important;
  color: var(--portal-text-secondary) !important;
  -webkit-text-fill-color: var(--portal-text-secondary) !important;
  opacity: 1;
}

@media (max-width: 760px) {
  body.dashboardMode.rolePartner .complaintPremiumList.ap-list-v2.portalList {
    box-shadow: none;
  }
}

/* Order Review Pilot V2 — final contrast and guided workflow layer. */
body.dashboardMode #reonicOrderDetailPanel.is-project-record .projectRecordHero {
  background:
    linear-gradient(90deg, rgba(2, 10, 30, .96), rgba(3, 16, 42, .82) 55%, rgba(3, 16, 42, .42)),
    url("/assets/premium-customer-hero.jpg") center / cover no-repeat !important;
  color: #fff !important;
}
body.dashboardMode #reonicOrderDetailPanel.is-project-record .projectRecordHero :is(h2,h3,h4,p,span,strong,label) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.24) !important;
}
body.dashboardMode #reonicOrderDetailPanel.is-project-record .projectRecordHero :is(.projectRecordEyebrow,.projectRecordFocusLabel) {
  color: #bfe7ff !important;
  -webkit-text-fill-color: #bfe7ff !important;
}
body.dashboardMode #reonicOrderDetailPanel .projectRecordNavigation {
  min-width: 230px;
  padding: 8px;
  gap: 7px;
  background: #fff !important;
}
body.dashboardMode #reonicOrderDetailPanel .projectRecordNavigation .projectRecordNavItem {
  min-width: 0;
  min-height: 48px;
  padding: 11px 12px;
  border: 1px solid #d5e5f1 !important;
  border-radius: 12px;
  background: #fff !important;
  color: #17324d !important;
  font-weight: 650;
  line-height: 1.2;
  white-space: normal;
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
}
body.dashboardMode #reonicOrderDetailPanel .projectRecordNavigation .projectRecordNavItem span {
  min-width: 0;
  white-space: normal;
  word-break: keep-all;
  overflow-wrap: normal;
  hyphens: none;
}
body.dashboardMode #reonicOrderDetailPanel .projectRecordNavigation .projectRecordNavItem:is(:hover,.is-active,[aria-current="page"]) {
  border-color: #74bced !important;
  background: #eaf6fd !important;
  color: #0a4f7c !important;
  box-shadow: 0 8px 22px rgba(38,126,184,.12) !important;
}
body.dashboardMode #reonicOrderDetailPanel .projectRecordNavigation .projectRecordNavItem:disabled {
  border-color: #dce5eb !important;
  background: #eef2f5 !important;
  color: #71808c !important;
  opacity: 1;
}
.orderReviewWorkspace { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,340px); gap:24px; align-items:start; }
.orderReviewMain { min-width:0; }
.orderReviewHeader { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; margin-bottom:18px; }
.orderReviewKicker { display:block; margin-bottom:6px; color:#227dbb; font-size:.75rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.orderReviewHeader h2,.orderReviewStartCard h3,.orderReviewPanel h3,.orderReviewComponents h3 { margin:0; color:#102a46; }
.orderReviewTiming,.orderReviewTimingPreview { display:flex; flex-wrap:wrap; gap:10px; }
.orderReviewTiming > div,.orderReviewTimingPreview > div { min-width:130px; padding:10px 13px; border:1px solid #cfe1ee; border-radius:12px; background:#f7fbfe; }
.orderReviewTiming span,.orderReviewTimingPreview span { display:block; color:#61788c; font-size:.72rem; }
.orderReviewTiming b,.orderReviewTimingPreview strong { display:block; margin-top:3px; color:#17324d; font-size:.9rem; }
.orderReviewStartCard { max-width:760px; margin:12px auto; padding:34px; border:1px solid #c9dfed; border-radius:20px; background:#fff; box-shadow:0 18px 48px rgba(36,93,130,.1); }
.orderReviewStartCard > p { color:#49657b; font-size:1.02rem; line-height:1.6; }
.orderReviewSteps { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; margin-bottom:20px; }
.orderReviewStep { display:flex; min-width:0; min-height:64px; align-items:center; gap:9px; padding:10px; border:1px solid #d3e3ee; border-radius:13px; background:#fff; color:#405b70; text-align:left; }
.orderReviewStep span { display:grid; flex:0 0 28px; width:28px; height:28px; place-items:center; border-radius:50%; background:#e8f2f8; color:#356d93; font-weight:800; }
.orderReviewStep b { min-width:0; white-space:normal; word-break:normal; overflow-wrap:normal; hyphens:none; }
.orderReviewStep.is-active { border-color:#58a9df; background:#eef8fe; color:#0c537f; box-shadow:0 8px 20px rgba(50,139,198,.13); }
.orderReviewStep.is-active span,.orderReviewStep.is-complete span { background:#2788c8; color:#fff; }
.orderReviewStep:disabled { background:#f1f4f6; color:#7b8994; opacity:1; }
.orderReviewPanel { padding:28px; border:1px solid #cbdfea; border-radius:18px; background:#fff; box-shadow:0 14px 38px rgba(31,82,116,.08); }
.orderReviewPanelHead { margin-bottom:22px; }
.orderReviewPanelHead > span { color:#2685c4; font-weight:800; }
.orderReviewPanelHead > p { margin:8px 0 0; color:#506b80; line-height:1.55; }
.orderReviewDocumentGrid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.orderReviewDocumentCard { padding:18px; border:1px solid #cfe0eb; border-radius:15px; background:#f8fbfd; }
.orderReviewDocumentCard > span { color:#1b6a48; font-size:.75rem; font-weight:800; text-transform:uppercase; }
.orderReviewDocumentCard.is-missing { border-color:#e7b6bd; background:#fff6f7; }
.orderReviewDocumentCard.is-missing > span { color:#a52c3e; }
.orderReviewDocumentCard h4 { margin:8px 0; color:#15314b; }
.orderReviewDocumentCard p { color:#587083; overflow-wrap:anywhere; }
.orderReviewDocumentCard a { color:#1676b5; font-weight:750; }
.orderReviewChecklist { display:grid; gap:10px; margin-top:20px; }
.orderReviewChecklist label,.orderReviewFinalCheck { display:flex; gap:10px; align-items:flex-start; padding:13px 15px; border:1px solid #d5e4ed; border-radius:12px; background:#fff; color:#1c384f !important; -webkit-text-fill-color:#1c384f !important; }
.orderReviewException { border-color:#e4b65e !important; background:#fff9eb !important; }
.orderReviewPrimaryAction,.orderReviewStepActions button { min-height:46px; padding:10px 18px; border:1px solid #227fbd; border-radius:12px; background:#247fbd; color:#fff !important; -webkit-text-fill-color:#fff !important; font-weight:800; white-space:normal; word-break:normal; cursor:pointer; }
.orderReviewStepActions { display:flex; justify-content:flex-end; gap:12px; margin-top:20px; }
.orderReviewStepActions [data-review-back],.orderReviewStepActions [data-review-back-to-object] { margin-right:auto; }
.orderReviewFeedback { margin-top:32px; padding:20px; border:1px solid #cbdfea; border-radius:16px; background:#f8fbfd; box-shadow:0 10px 28px rgba(31,82,116,.06); }
.orderReviewFeedbackForm { display:grid; gap:14px; margin-top:18px; }
.orderReviewFeedbackForm select,.orderReviewFeedbackForm textarea { width:100%; margin:0; }
.orderReviewFeedbackForm textarea { min-height:140px; }
.orderReviewFeedbackActions { display:flex; justify-content:flex-end; margin-top:2px; }
.orderReviewFeedbackList { display:grid; gap:10px; max-height:270px; margin-top:20px; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; padding-right:6px; }
.orderReviewFeedbackItem { display:flex; width:100%; min-width:0; box-sizing:border-box; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:14px; padding:12px 14px; border:1px solid #d5e4ed; border-radius:12px; background:#fff; }
.orderReviewFeedbackItem > div { display:grid; flex:1 1 180px; gap:5px; min-width:0; }
.orderReviewFeedbackItem > button { margin-left:auto; }
.orderReviewFeedbackItem time,.orderReviewFeedbackItem small { color:#60778a; font-size:.78rem; }
.orderReviewFeedbackStatus { width:max-content; max-width:100%; padding:3px 8px; border-radius:999px; background:#eaf5fc; color:#145d8d; font-size:.75rem; font-weight:750; overflow-wrap:anywhere; }
.orderReviewStepActions button:not(.orderReviewPrimaryAction) { border-color:#c6d9e6; background:#fff; color:#294c66 !important; -webkit-text-fill-color:#294c66 !important; }
.orderReviewComponentsSticky { position:sticky; top:18px; padding:22px; border:1px solid #cbdfea; border-radius:18px; background:#f8fbfd; box-shadow:0 14px 38px rgba(31,82,116,.08); }
.orderReviewComponentGroup { margin-top:18px; }
.orderReviewComponentGroup h4 { margin:0 0 8px; color:#376078; font-size:.78rem; text-transform:uppercase; letter-spacing:.06em; }
.orderReviewComponentItem { display:flex; justify-content:space-between; gap:12px; padding:10px 0; border-top:1px solid #dce8ef; }
.orderReviewComponentItem strong,.orderReviewComponentItem span { display:block; color:#17324d; overflow-wrap:anywhere; }
.orderReviewComponentItem span { margin-top:2px; color:#6a7e8e; font-size:.75rem; }
.orderReviewComponentItem b { flex:0 0 auto; color:#1679b8; }
.orderReviewRequirementGrid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-bottom:18px; }
.orderReviewRequirementGrid > div { display:grid; grid-template-columns:auto 1fr; gap:2px 9px; padding:12px; border:1px solid #d3e4ee; border-radius:12px; background:#f8fbfd; }
.orderReviewRequirementGrid > div > span { grid-row:1 / span 2; display:grid; width:26px; height:26px; place-items:center; border-radius:50%; background:#dff3e8; color:#146b45; font-weight:900; }
.orderReviewRequirementGrid .is-missing > span { background:#ffe7ea; color:#a52c3e; }
.orderReviewRequirementGrid b { color:#17324d; }
.orderReviewRequirementGrid small { color:#6d8190; }
.orderReviewImageGrid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.orderReviewImageCard { display:block; overflow:hidden; border:1px solid #cedfea; border-radius:14px; background:#fff; color:#17324d !important; -webkit-text-fill-color:#17324d !important; }
.orderReviewImageCard img { display:block; width:100%; aspect-ratio:4 / 3; object-fit:cover; background:#eaf1f5; }
.orderReviewImageCard > span,.orderReviewImageCard > small { display:block; padding:10px 12px 0; }
.orderReviewImageCard > span { font-weight:750; }
.orderReviewImageCard > small { padding-bottom:12px; color:#657b8b; line-height:1.35; }
.orderReviewFinalCheck { margin-top:18px; }
.orderReviewError { padding:12px 14px; border:1px solid #e6b6be; border-radius:12px; background:#fff3f5; color:#9f2434; }
@media (max-width:1100px) { .orderReviewWorkspace { grid-template-columns:1fr; } .orderReviewComponentsSticky { position:static; } }
@media (max-width:760px) { .projectRecordSection[data-project-record-active-section="order-review"] { padding:12px; } .orderReviewFeedback { padding:14px; } .orderReviewFeedbackForm textarea { padding-inline:8px; } .orderReviewFeedbackForm .portalSelectTrigger { height:auto !important; min-height:50px !important; padding-inline:8px !important; } .orderReviewFeedbackForm .portalSelectValue { white-space:normal; overflow:visible; text-overflow:clip; font-size:14px; line-height:1.2; } .orderReviewFeedbackItem { flex-direction:column; padding:10px; } .orderReviewFeedbackItem > div { width:100%; flex-basis:auto; } .orderReviewFeedbackStatus { width:100%; } .orderReviewFeedbackItem > button { margin-left:0; align-self:flex-end; max-width:100%; } .orderReviewSteps { grid-template-columns:repeat(2,minmax(0,1fr)); } .orderReviewHeader { flex-direction:column; } .orderReviewDocumentGrid,.orderReviewRequirementGrid { grid-template-columns:1fr; } .orderReviewImageGrid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
body.dashboardMode .portalHero--media :is(h1,h2,h3,h4,p,span,strong,small,label,a) {
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  text-shadow:0 1px 2px rgba(0,0,0,.28) !important;
}
/* Portal typography normalization — mirrors the calm primary sidebar hierarchy. */
body.dashboardMode .appContent :is(p,span,label,small,li,dt,dd,input,select,textarea) { font-weight:400; }
body.dashboardMode .appContent :is(button,a) { font-weight:500; }
body.dashboardMode .appContent h1 { font-weight:700; }
body.dashboardMode .appContent h2 { font-weight:650; }
body.dashboardMode .appContent :is(h3,h4,h5,h6,strong,b,legend) { font-weight:600; }
body.dashboardMode #reonicOrderDetailPanel .projectRecordNavigation .projectRecordNavItem { font-weight:500 !important; }
body.dashboardMode #reonicOrderDetailPanel .projectRecordHero .formHead { margin:0; padding:0; }
body.dashboardMode #reonicOrderDetailPanel .projectRecordHero .formHead h3,
body.dashboardMode #reonicOrderDetailPanel .projectRecordHero .projectRecordEyebrow { margin-left:0 !important; font-size:.86rem !important; font-weight:600 !important; letter-spacing:.1em; }
body.dashboardMode #reonicOrderDetailPanel .projectRecordFocusLabel { font-size:.78rem !important; font-weight:600 !important; }
body.dashboardMode #reonicOrderDetailPanel .projectRecordFocusPrimary strong { font-size:1.02rem !important; font-weight:550 !important; }
body.dashboardMode #reonicOrderDetailPanel .projectRecordFocusPrimary span,
body.dashboardMode #reonicOrderDetailPanel .projectRecordFocusMeta span { font-size:.94rem !important; font-weight:400 !important; line-height:1.45; }
body.dashboardMode #reonicOrderDetailPanel .projectRecordStatusToggle { font-size:.9rem !important; font-weight:550 !important; }
.orderReviewHeader h2 { font-weight:650 !important; }
.orderReviewPanel h3,.orderReviewComponents h3 { font-weight:600 !important; }
.orderReviewStep b { font-size:.9rem; font-weight:500 !important; line-height:1.25; }
.orderReviewComponentItem strong { font-weight:550 !important; }
.orderReviewComponentGroup h4,.orderReviewKicker { font-weight:600 !important; }
.orderReviewChecklist label,.orderReviewFinalCheck {
  display:flex !important;
  grid-template-columns:none !important;
  width:auto !important;
  min-height:0 !important;
  height:auto !important;
  align-items:center !important;
  justify-content:flex-start !important;
  padding:12px 14px !important;
  font-size:.96rem !important;
  font-weight:400 !important;
  line-height:1.4 !important;
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
}
.orderReviewChecklist label > input,.orderReviewFinalCheck > input { flex:0 0 auto; width:18px !important; height:18px !important; margin:0 !important; }
.orderReviewChecklist label > span,.orderReviewFinalCheck > span { flex:1 1 auto; min-width:0; width:auto !important; white-space:normal !important; word-break:normal !important; overflow-wrap:normal !important; }
.orderReviewPrimaryAction,.orderReviewStepActions button { font-weight:550 !important; }

[data-lars-dashboard] .larsDashboardIntro {
  margin-bottom: 24px;
  padding: 24px;
  border-left: 4px solid #2e95d6;
  background: #f6faff;
}
[data-lars-dashboard] .larsDashboardIntro > span,
[data-lars-dashboard] .larsDashboardWorkBasket span { color:#2e95d6; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
[data-lars-dashboard] .larsDashboardIntro h2 { margin:8px 0; color:#0a1b36; }
[data-lars-dashboard] .larsDashboardIntro p,
[data-lars-dashboard] .larsDashboardWorkBasket p { margin:0; color:#53647d !important; }
[data-lars-dashboard] .larsDashboardWorkBasket {
  display:grid;
  gap:10px;
  margin-top:24px;
  padding:20px 24px;
  border:1px solid #b9d8f2;
  border-radius:18px;
  background:#fff;
}
[data-lars-dashboard] .larsDashboardWorkBasket strong { display:block; margin-top:5px; color:#0a1b36; font-size:1.1rem; }

/* Auftragsprüfung: exakte, lokale Übertragung des hellen Partner-Projektlisten-Archetyps. */
body.roleAdmin.orderReviewOverviewMode .dashboardHeadModern:not(.hidden) {
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  padding:18px 0 16px !important;
  margin-bottom:12px !important;
  border:0 !important;
  border-radius:0 !important;
  outline:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
  align-items:start !important;
}
body.roleAdmin.orderReviewOverviewMode .dashboardHeadModern:not(.hidden) .dashboardIdentity {
  display:block !important;
  max-width:none !important;
  align-self:start !important;
}
body.orderReviewOverviewMode .dashboardHead #dashboardRole {
  margin:0 0 8px !important;
  color:#526b82 !important;
  font-size:.86rem !important;
  letter-spacing:.1em !important;
  text-transform:uppercase !important;
}
body.roleAdmin.orderReviewOverviewMode .dashboardHeadModern:not(.hidden) #welcomeTitle {
  margin:0 !important;
  color:#0a1b36 !important;
  font-size:clamp(1.65rem,2.4vw,2.1rem) !important;
  line-height:1.08 !important;
}
body.orderReviewOverviewMode .dashboardIdentity::after {
  content:"Prüfe eingereichte Aufträge und öffne den nächsten erforderlichen Schritt.";
  display:block;
  margin-top:8px;
  color:#304c68;
  font-size:.9rem;
}
body.orderReviewOverviewMode #dashboardHeroMeta {
  display:flex !important;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}
body.orderReviewOverviewMode #dashboardHeroMeta.portalHeroMeta.hidden { display:none !important; }
body.orderReviewOverviewMode #dashboardHeroMeta .portalHeroMetaItem {
  display:flex;
  min-height:36px;
  align-items:center;
  gap:8px;
  padding:7px 11px;
  border:1px solid #cbdfea;
  border-radius:999px;
  background:#fff;
  box-shadow:none;
}
body.orderReviewOverviewMode #dashboardHeroMeta .portalHeroMetaItem small { color:#526b82 !important; font-size:.72rem; }
body.orderReviewOverviewMode #dashboardHeroMeta .portalHeroMetaItem strong { color:#0a1b36 !important; font-size:.86rem; }
body.orderReviewOverviewMode #customerListBackButton {
  display:inline-flex !important;
  min-height:50px !important;
  padding:0 22px !important;
  border:1px solid #2e95d6 !important;
  border-radius:12px !important;
  background:#2e95d6 !important;
  color:#0a1b36 !important;
  box-shadow:0 12px 28px rgba(46,149,214,.2) !important;
}
body.orderReviewOverviewMode #customerListBackButton:is(:hover,:focus-visible) { background:#63b4ea !important; }
body.orderReviewOverviewMode .appContent {
  align-content:start !important;
  grid-auto-rows:max-content !important;
}
body.orderReviewOverviewMode #reonicOrdersPanel { display:none !important; margin:0 !important; }
body.orderReviewOverviewMode #reonicOrdersPanel .ap-filter-toolbar-head,
body.orderReviewOverviewMode #reonicOrdersPanel .ap-filter-toolbar { display:none !important; }
body.orderReviewOverviewMode .tableWrap {
  margin-top:10px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
body.orderReviewOverviewMode .ap-list-v2.portalList {
  border:1px solid #cbdfea !important;
  border-radius:18px !important;
  background:#fff !important;
  color:#0a1b36 !important;
  box-shadow:0 18px 42px rgba(27,66,99,.08) !important;
  overflow:hidden !important;
}
body.orderReviewOverviewMode .ap-list-v2-header {
  min-height:54px !important;
  padding:10px 18px !important;
  background:#0a1b36 !important;
  border-bottom:0 !important;
}
body.orderReviewOverviewMode .ap-list-v2-header-cell,
body.orderReviewOverviewMode .ap-list-v2-header-cell > span { color:#fff !important; }
body.orderReviewOverviewMode .ap-list-v2 .ap-list-v2-sort-button { background:#2e95d6 !important; color:#fff !important; }
body.orderReviewOverviewMode .ap-list-v2-row {
  min-height:78px !important;
  padding:14px 18px !important;
  border-bottom:1px solid #cbdfea !important;
  background:#fff !important;
  color:#0a1b36 !important;
}
body.orderReviewOverviewMode .ap-list-v2-row:nth-child(even) { background:#eef7ff !important; }
body.orderReviewOverviewMode .ap-list-v2-row :is(.ap-list-v2-value,.ap-list-v2-customer strong,.ap-list-v2-number) { color:#0a1b36 !important; }
body.orderReviewOverviewMode .ap-list-v2-row :is(.ap-list-v2-customer small,time) { color:#304c68 !important; }
body.orderReviewOverviewMode .ap-list-v2-row .status {
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  color:#304c68 !important;
  font-weight:400 !important;
}
body.orderReviewOverviewMode .orderReviewStatusTag {
  display:inline-flex;
  min-height:28px;
  align-items:center;
  padding:5px 10px;
  border:1px solid transparent;
  border-radius:999px;
  font-size:.78rem;
  font-weight:650;
  line-height:1;
  white-space:nowrap;
}
body.orderReviewOverviewMode .orderReviewStatusTag--new { border-color:#9cccf0 !important; background:#e8f5ff !important; color:#145d8d !important; }
body.orderReviewOverviewMode .orderReviewStatusTag--documents { border-color:#96d6dd !important; background:#e5f8fa !important; color:#12606a !important; }
body.orderReviewOverviewMode .orderReviewStatusTag--object { border-color:#efc86f !important; background:#fff5d9 !important; color:#775000 !important; }
body.orderReviewOverviewMode .orderReviewStatusTag--decision { border-color:#c2b5ef !important; background:#e9e4ff !important; color:#4a368d !important; }
body.orderReviewOverviewMode .orderReviewStatusTag--active { border-color:#a8c9ef !important; background:#edf5ff !important; color:#284f7c !important; }
body.orderReviewOverviewMode .orderReviewStatusTag--complete { border-color:#9dd3b8 !important; background:#e8f7ef !important; color:#176a43 !important; }
body.orderReviewOverviewMode .ap-list-v2-row.is-interactive:is(:hover,:focus-visible) {
  background:#dff1fd !important;
  color:#0a1b36 !important;
  outline:2px solid #2e95d6 !important;
  outline-offset:-2px !important;
}

/* Projektakten-Grundregel: Seitentitel und EB-Identität beginnen auf derselben Achse. */
body.dashboardMode #reonicOrderDetailPanel.is-project-record .projectRecordHero > .formHead {
  width:100% !important;
  margin-inline:0 !important;
  padding-inline:0 !important;
}
body.dashboardMode #reonicOrderDetailPanel.is-project-record .projectRecordHero #reonicDetailTitle {
  margin-inline:0 !important;
  padding-inline:0 !important;
  text-indent:0 !important;
  transform:none !important;
}
body.dashboardMode #reonicOrderDetailPanel.is-project-record .projectRecordHero .projectRecordHeroContent {
  width:100% !important;
  margin-inline:0 !important;
  padding-inline:0 !important;
}

/* Portalweite Kontrastregel: helle Formularflächen tragen immer dunkle Schrift. */
body.dashboardMode .portalHero--media :is(select, .portalSelectTrigger, .ap-select-v2-trigger) {
  color-scheme:light !important;
  background:#fff !important;
  color:#0a1b36 !important;
  -webkit-text-fill-color:#0a1b36 !important;
  text-shadow:none !important;
}
body.dashboardMode :is(.portalSelectMenu, .ap-select-v2-menu) :is(button, [role="option"], .portalSelectOption, .ap-select-v2-option) {
  background:#fff !important;
  color:#0a1b36 !important;
  -webkit-text-fill-color:#0a1b36 !important;
  text-shadow:none !important;
}

.projectRecordHistoryMessage {
  padding:0;
  border:0;
  background:transparent;
  color:#176fae;
  font:inherit;
  font-weight:700;
  text-align:left;
  text-decoration:underline;
  text-underline-offset:3px;
  cursor:pointer;
}
.projectRecordHistoryMessage:is(:hover,:focus-visible) { color:#0a4f7c; }
.projectMessageViewer { display:grid; gap:16px; min-height:640px; }
.projectMessageViewerHead {
  display:flex;
  align-items:flex-start;
  gap:18px;
  padding:18px;
  border:1px solid #cbdfea;
  border-radius:16px;
  background:#fff;
}
.projectMessageViewerHead h3 { margin:4px 0; color:#0a1b36; }
.projectMessageViewerHead span { color:#2e95d6; font-size:.75rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.projectMessageViewerHead p { margin:0; color:#526b82; }
.projectMessageViewerFrame {
  width:100%;
  min-height:620px;
  border:1px solid #cbdfea;
  border-radius:16px;
  background:#fff;
}

.projectBillingReadOnly {
  display: grid;
  gap: 22px;
}
.projectBillingReadOnly > section,
.projectBillingUnavailable {
  padding: 20px;
  border: 1px solid #cbdfea;
  border-radius: 16px;
  background: #fff;
  color: #17324d;
}
.projectBillingValue { display: grid; gap: 5px; }
.projectBillingValue > span { color: #526b82; font-size: .78rem; }
.projectBillingValue > strong { color: #0a1b36; font-size: clamp(1.8rem, 4vw, 2.7rem); }
.projectBillingValue > small { color: #304c68; }
.projectBillingReadOnly h4 { margin: 0 0 12px; color: #17324d; }
.projectBillingPreview {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.projectBillingPreview > div { padding: 14px; border-radius: 12px; background: #eef7fd; }
.projectBillingPreview span,
.projectBillingPreview strong { display: block; color: #17324d; }
.projectBillingInvoiceList { display: grid; gap: 10px; }
.projectBillingInvoice {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 14px;
  border: 1px solid #d7e6ef;
  border-radius: 12px;
  background: #f8fbfd;
}
.projectBillingInvoice strong,
.projectBillingInvoice span { display: block; color: #17324d; }
.projectBillingInvoice span { margin-top: 4px; color: #526b82; font-size: .82rem; }
.projectBillingInvoice b { flex: 0 0 auto; color: #0a1b36; }
.projectBillingUnavailable { display: grid; gap: 5px; }
.projectBillingUnavailable span { color: #526b82; }
.orderReviewOrderValue {
  display: grid;
  gap: 4px;
  margin: 16px 0;
  padding: 16px;
  border: 1px solid #9cccf0;
  border-radius: 14px;
  background: #e8f5ff;
}
.orderReviewOrderValue span,
.orderReviewOrderValue small { color: #526b82; }
.orderReviewOrderValue strong { color: #0a1b36; font-size: 1.45rem; }
.orderReviewOrderValue.is-unavailable { border-color: #d5e4ed; background: #f1f4f6; }
@media (max-width: 760px) {
  .projectBillingPreview { grid-template-columns: 1fr; }
  .projectBillingInvoice { display: grid; }
}

.projectInternalCommunication {
  display: grid;
  gap: 20px;
}

.projectInternalMessageList {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.projectInternalMessage {
  padding: 16px;
  border: 1px solid #cbdfea;
  border-radius: 14px;
  background: #f8fbfd;
}

.projectInternalMessage header,
.projectInternalMessage footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 14px;
}

.projectInternalMessage header span,
.projectInternalMessage footer {
  color: #526b82;
  font-size: .78rem;
}

.projectInternalMessage p {
  margin: 12px 0;
  color: #17324d;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.projectInternalMessageForm {
  display: grid;
  gap: 12px;
  padding: 18px;
  border: 1px solid #cbdfea;
  border-radius: 16px;
  background: #fff;
}

body.dashboardMode #reonicOrderDetailPanel .projectInternalMessageForm label {
  display: grid;
  gap: 6px;
  color: #304c68 !important;
  -webkit-text-fill-color: #304c68 !important;
  text-shadow: none !important;
}

.projectInternalMessageForm select,
.projectInternalMessageForm textarea {
  width: 100%;
  margin: 0;
}

.projectInternalMessageForm textarea {
  min-height: 132px;
  resize: vertical;
}

.projectInternalMessageForm button {
  justify-self: end;
}

@media (max-width: 760px) {
  .projectInternalMessageForm .portalSelectTrigger {
    height: auto !important;
    min-height: 50px !important;
    padding-inline: 8px !important;
  }

  .projectInternalMessageForm .portalSelectValue {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    overflow-wrap: anywhere;
    line-height: 1.2;
  }
}
.projectBillingCreate form,
.projectBillingCancelForm { display: grid; gap: 14px; }
.projectBillingAtoms {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.projectBillingAtoms label {
  display: grid;
  place-items: center;
  min-height: 58px;
  border: 1px solid #9fc8df;
  border-radius: 12px;
  background: #eef7fd;
  color: #17324d;
  cursor: pointer;
}
.projectBillingAtoms label:has(input:checked) { border-color: #0876b9; background: #d9edf9; }
.projectBillingAtoms label.is-disabled { opacity: .45; cursor: not-allowed; }
.projectBillingAtoms input { position: absolute; opacity: 0; pointer-events: none; }
.projectBillingSelectionSummary {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 14px;
  border-radius: 12px;
  background: #f4f8fb;
  color: #0a1b36;
}
.projectBillingConfirm { display: flex; align-items: flex-start; gap: 9px; color: #304c68; }
.projectBillingConfirm input { margin-top: 3px; }
.projectBillingCreate button,
.projectBillingCancelForm button { min-height: 44px; }
.projectBillingCancelForm {
  grid-column: 1 / -1;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #d7e6ef;
}
.projectBillingCancelForm label:first-child { display: grid; gap: 6px; color: #304c68; }
.projectBillingCancelForm textarea { min-height: 82px; resize: vertical; }
.projectBillingDestructive { border-color: #9e2d2d; background: #9e2d2d; color: #fff; }
.projectBillingMessage { margin: 0; color: #304c68; }
.projectBillingMessage.is-error, .projectBillingInvoice.is-failed span { color: #8f2222; }
.projectBillingMessage.is-warning, .projectBillingInvoice.is-unknown span { color: #795400; }
.projectBillingInvoice .linkButton { margin-top: 8px; }
@media (max-width: 760px) {
  .projectBillingAtoms { grid-template-columns: 1fr; }
  .projectBillingSelectionSummary { align-items: flex-start; flex-direction: column; }
}

/* Admin calendar light contrast correction: stay inside the requested panel. */
body[data-design-system="partner-portal-v1"] #montageCalendarPanel .montageCalendarEventMeta {
  color: var(--portal-text-muted);
}

body[data-design-system="partner-portal-v1"] #montageCalendarPanel .montageCalendarEventMeta .montageCalendarTypeBadge {
  background: var(--portal-accent-soft);
  color: var(--portal-text-primary);
}