:root {
  --pw-font-weight-regular: 400;
  --pw-font-weight-emphasis: 500;
  --pw-light-canvas: #f5f6f8;
  --pw-light-surface: #ffffff;
  --pw-light-surface-subtle: #f8f9fa;
  --pw-light-surface-muted: #eef0f2;
  --pw-light-border: #d8dde3;
  --pw-light-border-strong: #c4cbd4;
  --pw-light-text: #172033;
  --pw-light-text-strong: #101828;
  --pw-light-muted: #667085;
  --pw-light-muted-strong: #475467;
  --pw-action: #1f6faa;
  --pw-action-hover: #174f7a;
  --pw-action-rgb: 31, 111, 170;
  --pw-action-contrast: #ffffff;
  --pw-shadow-soft: 0 4px 14px rgba(16, 24, 40, 0.08);
  --pw-shadow-raised: 0 10px 28px rgba(16, 24, 40, 0.12);
  --pw-canvas: var(--pw-light-canvas);
  --pw-surface: var(--pw-light-surface);
  --pw-surface-subtle: var(--pw-light-surface-subtle);
  --pw-surface-muted: var(--pw-light-surface-muted);
  --pw-border: var(--pw-light-border);
  --pw-border-strong: var(--pw-light-border-strong);
  --pw-text: var(--pw-light-text);
  --pw-text-strong: var(--pw-light-text-strong);
  --pw-muted: var(--pw-light-muted);
  --pw-muted-strong: var(--pw-light-muted-strong);
  --pw-primary: var(--pw-action);
  --pw-primary-hover: var(--pw-action-hover);
  --pw-primary-rgb: var(--pw-action-rgb);
  --pw-primary-contrast: var(--pw-action-contrast);
  --pw-accent-text: var(--pw-primary);
  --pw-accent-text-strong: var(--pw-primary-hover);
  --pw-accent-soft-bg: rgba(var(--pw-primary-rgb), 0.10);
  --pw-accent-soft-border: rgba(var(--pw-primary-rgb), 0.32);
  --pw-control-disabled-bg: var(--pw-surface-muted);
  --pw-control-disabled-fg: var(--pw-muted-strong);
  --pw-control-disabled-border: var(--pw-border-strong);
  --pw-tone-info-bg: rgba(59, 130, 246, 0.12);
  --pw-tone-info-text: #1d4ed8;
  --pw-tone-info-border: rgba(59, 130, 246, 0.28);
  --pw-tone-success-bg: rgba(16, 185, 129, 0.12);
  --pw-tone-success-text: #047857;
  --pw-tone-success-border: rgba(16, 185, 129, 0.32);
  --pw-tone-warning-bg: rgba(245, 158, 11, 0.13);
  --pw-tone-warning-text: #92400e;
  --pw-tone-warning-border: rgba(245, 158, 11, 0.34);
  --pw-tone-danger-bg: rgba(239, 68, 68, 0.12);
  --pw-tone-danger-text: #b91c1c;
  --pw-tone-danger-border: rgba(239, 68, 68, 0.32);
  --pw-shadow-1: var(--pw-shadow-soft);
  --pw-shadow-2: var(--pw-shadow-raised);
}

:root[data-theme="dark"] {
  --pw-canvas: #0f172a;
  --pw-surface: #111827;
  --pw-surface-subtle: #0b1224;
  --pw-surface-muted: #182235;
  --pw-border: #1f2937;
  --pw-border-strong: #334155;
  --pw-text: #e5e7eb;
  --pw-text-strong: #f1f5f9;
  --pw-muted: #94a3b8;
  --pw-muted-strong: #cbd5e1;
  --pw-primary: #22d3ee;
  --pw-primary-hover: #06b6d4;
  --pw-primary-rgb: 34, 211, 238;
  --pw-primary-contrast: #001018;
  --pw-tone-info-bg: rgba(59, 130, 246, 0.14);
  --pw-tone-info-text: #93c5fd;
  --pw-tone-info-border: rgba(96, 165, 250, 0.38);
  --pw-tone-success-bg: rgba(16, 185, 129, 0.14);
  --pw-tone-success-text: #a7f3d0;
  --pw-tone-success-border: rgba(52, 211, 153, 0.42);
  --pw-tone-warning-bg: rgba(245, 158, 11, 0.16);
  --pw-tone-warning-text: #fde68a;
  --pw-tone-warning-border: rgba(251, 191, 36, 0.46);
  --pw-tone-danger-bg: rgba(239, 68, 68, 0.14);
  --pw-tone-danger-text: #fecaca;
  --pw-tone-danger-border: rgba(248, 113, 113, 0.42);
  --pw-shadow-1: 0 10px 30px rgba(0, 0, 0, 0.25);
  --pw-shadow-2: 0 14px 36px rgba(0, 0, 0, 0.32);
}

@media (prefers-color-scheme: dark) {
  :root[data-theme="auto"] {
    --pw-canvas: #0f172a;
    --pw-surface: #111827;
    --pw-surface-subtle: #0b1224;
    --pw-surface-muted: #182235;
    --pw-border: #1f2937;
    --pw-border-strong: #334155;
    --pw-text: #e5e7eb;
    --pw-text-strong: #f1f5f9;
    --pw-muted: #94a3b8;
    --pw-muted-strong: #cbd5e1;
    --pw-primary: #22d3ee;
    --pw-primary-hover: #06b6d4;
    --pw-primary-rgb: 34, 211, 238;
    --pw-primary-contrast: #001018;
    --pw-tone-info-bg: rgba(59, 130, 246, 0.14);
    --pw-tone-info-text: #93c5fd;
    --pw-tone-info-border: rgba(96, 165, 250, 0.38);
    --pw-tone-success-bg: rgba(16, 185, 129, 0.14);
    --pw-tone-success-text: #a7f3d0;
    --pw-tone-success-border: rgba(52, 211, 153, 0.42);
    --pw-tone-warning-bg: rgba(245, 158, 11, 0.16);
    --pw-tone-warning-text: #fde68a;
    --pw-tone-warning-border: rgba(251, 191, 36, 0.46);
    --pw-tone-danger-bg: rgba(239, 68, 68, 0.14);
    --pw-tone-danger-text: #fecaca;
    --pw-tone-danger-border: rgba(248, 113, 113, 0.42);
    --pw-shadow-1: 0 10px 30px rgba(0, 0, 0, 0.25);
    --pw-shadow-2: 0 14px 36px rgba(0, 0, 0, 0.32);
  }
}

:root body :is(button, input, select, textarea, .button, [role="button"]):is(:disabled, [aria-disabled="true"], .is-disabled) {
  opacity: 1 !important;
  border-color: var(--pw-control-disabled-border) !important;
  background: var(--pw-control-disabled-bg) !important;
  background-image: none !important;
  color: var(--pw-control-disabled-fg) !important;
  box-shadow: none !important;
  filter: none !important;
  cursor: not-allowed !important;
}

.planwork-theme-switcher {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  max-width: 100%;
  padding: 4px;
  border: 1px solid var(--border, var(--pw-border));
  border-radius: 999px;
  background: var(--panel-2, var(--pw-surface-subtle));
  color: var(--text, var(--pw-text));
}

.planwork-theme-switcher .theme-option {
  min-height: 30px;
  padding: 6px 10px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: 11px;
  cursor: pointer;
}

.planwork-theme-switcher .theme-option.active {
  background: var(--btn-bg, var(--pw-primary));
  color: var(--btn-fg, var(--pw-primary-contrast));
  box-shadow: var(--pw-shadow-1);
}

.planwork-theme-switcher .theme-option:focus-visible {
  outline: 2px solid rgba(var(--pw-primary-rgb), 0.32);
  outline-offset: 2px;
}

.planwork-auth-tools {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

:root[data-theme="light"] body.planwork-auth-page {
  --bg: var(--pw-light-canvas);
  --card: var(--pw-light-surface);
  --panel: var(--pw-light-surface);
  --panel-soft: var(--pw-light-surface-subtle);
  --line: var(--pw-light-border);
  --text: var(--pw-light-text);
  --muted: var(--pw-light-muted);
  --accent: var(--pw-action);
  --accent-strong: var(--pw-action-hover);
  --login-bg: var(--pw-light-canvas);
  --login-surface: var(--pw-light-surface);
  --login-border: var(--pw-light-border);
  --login-text: var(--pw-light-text);
  --login-muted: var(--pw-light-muted);
  --login-accent: var(--pw-action);
  --login-accent-strong: var(--pw-action-hover);
  --login-shadow: var(--pw-shadow-raised);
  --warn: #b42318;
  background: var(--pw-light-canvas) !important;
  color: var(--pw-light-text) !important;
}

:root[data-theme="light"] body.planwork-auth-page :is(.card, .auth-card, .login-card, .showcase-card) {
  border-color: var(--pw-light-border) !important;
  background: var(--pw-light-surface) !important;
  color: var(--pw-light-text) !important;
  box-shadow: var(--pw-shadow-raised) !important;
}

:root[data-theme="light"] body.planwork-auth-page :is(.section, .meta, .login-meta, .login-trust, .password-wrap) {
  border-color: var(--pw-light-border) !important;
  background: var(--pw-light-surface-subtle) !important;
  color: var(--pw-light-text) !important;
}

:root[data-theme="light"] body.planwork-auth-page :is(input, select, textarea, .btn, .button, .auth-menu a) {
  border-color: var(--pw-light-border) !important;
  background: var(--pw-light-surface) !important;
  color: var(--pw-light-text) !important;
  box-shadow: none;
}

:root[data-theme="light"] body.planwork-auth-page :is(.btn.primary, button[type="submit"], input[type="submit"], .button.primary) {
  border-color: var(--pw-action) !important;
  background: var(--pw-action) !important;
  color: var(--pw-action-contrast) !important;
}

:root[data-theme="light"] body.planwork-auth-page :is(input, select, textarea):focus {
  border-color: var(--pw-action) !important;
  box-shadow: 0 0 0 3px rgba(var(--pw-action-rgb), 0.18) !important;
}

:root[data-theme="light"] body.planwork-auth-page :is(.login-bg, .orb, .grid) {
  opacity: 0 !important;
}

:root[data-theme="light"] body.planwork-auth-page :is(.brand-title, .login-title, .headline, h1, h2, h3) {
  color: var(--pw-light-text-strong) !important;
}

:root[data-theme="light"] body.planwork-auth-page :is(.brand-subtitle, .login-lead, .login-divider, .login-links, .eyebrow, .desc, p, label) {
  color: var(--pw-light-muted) !important;
}

:root[data-theme="light"] body.planwork-auth-page :is(a:not(.button), .login-links a) {
  color: var(--pw-action) !important;
}

:root[data-theme="light"] body.planwork-auth-page :is(.input-wrap, .login-secondary, .quick-tag, .tip-nav) {
  border-color: var(--pw-light-border) !important;
  background: var(--pw-light-surface-subtle) !important;
  color: var(--pw-light-text) !important;
  box-shadow: none !important;
}

:root[data-theme="light"] body.planwork-auth-page .input-wrap:focus-within {
  border-color: var(--pw-action) !important;
  box-shadow: 0 0 0 3px rgba(var(--pw-action-rgb), 0.18) !important;
}

@media (prefers-color-scheme: light) {
  :root[data-theme="auto"] body.planwork-auth-page {
    --bg: var(--pw-light-canvas);
    --card: var(--pw-light-surface);
    --panel: var(--pw-light-surface);
    --panel-soft: var(--pw-light-surface-subtle);
    --line: var(--pw-light-border);
    --text: var(--pw-light-text);
    --muted: var(--pw-light-muted);
    --accent: var(--pw-action);
    --accent-strong: var(--pw-action-hover);
    --login-bg: var(--pw-light-canvas);
    --login-surface: var(--pw-light-surface);
    --login-border: var(--pw-light-border);
    --login-text: var(--pw-light-text);
    --login-muted: var(--pw-light-muted);
    --login-accent: var(--pw-action);
    --login-accent-strong: var(--pw-action-hover);
    --login-shadow: var(--pw-shadow-raised);
    --warn: #b42318;
    background: var(--pw-light-canvas) !important;
    color: var(--pw-light-text) !important;
  }

  :root[data-theme="auto"] body.planwork-auth-page :is(.card, .auth-card, .login-card, .showcase-card) {
    border-color: var(--pw-light-border) !important;
    background: var(--pw-light-surface) !important;
    color: var(--pw-light-text) !important;
    box-shadow: var(--pw-shadow-raised) !important;
  }

  :root[data-theme="auto"] body.planwork-auth-page :is(.section, .meta, .login-meta, .login-trust, .password-wrap) {
    border-color: var(--pw-light-border) !important;
    background: var(--pw-light-surface-subtle) !important;
    color: var(--pw-light-text) !important;
  }

  :root[data-theme="auto"] body.planwork-auth-page :is(input, select, textarea, .btn, .button, .auth-menu a) {
    border-color: var(--pw-light-border) !important;
    background: var(--pw-light-surface) !important;
    color: var(--pw-light-text) !important;
    box-shadow: none;
  }

  :root[data-theme="auto"] body.planwork-auth-page :is(.btn.primary, button[type="submit"], input[type="submit"], .button.primary) {
    border-color: var(--pw-action) !important;
    background: var(--pw-action) !important;
    color: var(--pw-action-contrast) !important;
  }

  :root[data-theme="auto"] body.planwork-auth-page :is(input, select, textarea):focus {
    border-color: var(--pw-action) !important;
    box-shadow: 0 0 0 3px rgba(var(--pw-action-rgb), 0.18) !important;
  }

  :root[data-theme="auto"] body.planwork-auth-page :is(.login-bg, .orb, .grid) {
    opacity: 0 !important;
  }

  :root[data-theme="auto"] body.planwork-auth-page :is(.brand-title, .login-title, .headline, h1, h2, h3) {
    color: var(--pw-light-text-strong) !important;
  }

  :root[data-theme="auto"] body.planwork-auth-page :is(.brand-subtitle, .login-lead, .login-divider, .login-links, .eyebrow, .desc, p, label) {
    color: var(--pw-light-muted) !important;
  }

  :root[data-theme="auto"] body.planwork-auth-page :is(a:not(.button), .login-links a) {
    color: var(--pw-action) !important;
  }

  :root[data-theme="auto"] body.planwork-auth-page :is(.input-wrap, .login-secondary, .quick-tag, .tip-nav) {
    border-color: var(--pw-light-border) !important;
    background: var(--pw-light-surface-subtle) !important;
    color: var(--pw-light-text) !important;
    box-shadow: none !important;
  }

  :root[data-theme="auto"] body.planwork-auth-page .input-wrap:focus-within {
    border-color: var(--pw-action) !important;
    box-shadow: 0 0 0 3px rgba(var(--pw-action-rgb), 0.18) !important;
  }
}

:root[data-theme="light"] body {
  background-color: var(--pw-light-canvas) !important;
}

:root[data-theme="light"] body.app-planung :is(
  .pa-hero,
  .pa-tip,
  .set-hero,
  .rpv-hero,
  .inv-head,
  .az-header,
  .aze-form-head,
  .obj-hero,
  .obj-context,
  .obj-stat,
  .mitf-hero,
  .mitf-rfid-card,
  .mit-stat,
  .kund-stat,
  .int-hero,
  .dr-hero,
  .pg-hero
  ,.dept-guide
  ,.aze-titlebar
  ,.cp-stat
  ,.cp-filter
  ,.ft-head
  ,.id-list-head
  ,.mita-hero
  ,.rfid-rollout-hero
  ,.rfid-station-hero
  ,.calendar-display-hero
) {
  border-color: var(--pw-light-border) !important;
  background: var(--pw-light-surface) !important;
  box-shadow: var(--pw-shadow-soft) !important;
}

:root[data-theme="light"] body.app-planung :is(
  .submit-row input.default,
  input[type="submit"].default,
  .button.default,
  button.default,
  .id-action.is-primary,
  .inv-btn.primary,
  .rpv-btn.primary,
  .rech-toolbar .chip.is-active
) {
  border-color: var(--pw-action) !important;
  background: var(--pw-action) !important;
  color: var(--pw-action-contrast) !important;
  box-shadow: 0 3px 8px rgba(var(--pw-action-rgb), 0.16) !important;
}

@media (prefers-color-scheme: light) {
  :root[data-theme="auto"] body {
    background-color: var(--pw-light-canvas) !important;
  }

  :root[data-theme="auto"] body.app-planung :is(
    .pa-hero,
    .pa-tip,
    .set-hero,
    .rpv-hero,
    .inv-head,
    .az-header,
    .aze-form-head,
    .obj-hero,
    .obj-context,
    .obj-stat,
    .mitf-hero,
    .mitf-rfid-card,
    .mit-stat,
    .kund-stat,
    .int-hero,
    .dr-hero,
    .pg-hero
    ,.dept-guide
    ,.aze-titlebar
    ,.cp-stat
    ,.cp-filter
    ,.ft-head
    ,.id-list-head
    ,.mita-hero
    ,.rfid-rollout-hero
    ,.rfid-station-hero
    ,.calendar-display-hero
  ) {
    border-color: var(--pw-light-border) !important;
    background: var(--pw-light-surface) !important;
    box-shadow: var(--pw-shadow-soft) !important;
  }

  :root[data-theme="auto"] body.app-planung :is(
    .submit-row input.default,
    input[type="submit"].default,
    .button.default,
    button.default,
    .id-action.is-primary,
    .inv-btn.primary,
    .rpv-btn.primary,
    .rech-toolbar .chip.is-active
  ) {
    border-color: var(--pw-action) !important;
    background: var(--pw-action) !important;
    color: var(--pw-action-contrast) !important;
    box-shadow: 0 3px 8px rgba(var(--pw-action-rgb), 0.16) !important;
  }
}

.planwork-logo,
.planwork-mark-image {
  display: block;
  max-width: 100%;
  height: auto;
}

.planwork-logo {
  width: auto;
}

.planwork-logo--hero {
  height: 56px;
}

.planwork-logo--header {
  height: 38px;
}

.planwork-logo--compact {
  height: 30px;
}

.planwork-logo-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.14);
}

.planwork-lockup {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}

.planwork-mark-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  min-width: 48px;
  padding: 8px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.14);
}

.planwork-mark-image {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.planwork-wordmark {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: inherit;
}

.planwork-language-switcher {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}

.planwork-language-switcher select {
  max-width: 100%;
  border: 1px solid rgba(148, 163, 184, 0.45);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.94);
  color: #0f172a;
  padding: 7px 28px 7px 11px;
  font: 700 12px/1.2 "Segoe UI", system-ui, sans-serif;
}

.planwork-legal-links {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  color: inherit;
  font-size: 12px;
  line-height: 1.4;
  opacity: 0.82;
}

.planwork-legal-links a {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: currentColor;
  text-underline-offset: 3px;
}

.google-maps-attribution {
  font-size: 12px !important;
  font-weight: 400 !important;
  white-space: nowrap;
}

@media (max-width: 640px) {
  .planwork-logo--hero {
    height: 46px;
  }

  .planwork-logo--header {
    height: 32px;
  }

  .planwork-mark-badge {
    width: 42px;
    height: 42px;
    min-width: 42px;
    padding: 7px;
  }

  .planwork-wordmark {
    font-size: 16px;
  }
}

/*
 * Screen typography policy
 *
 * Important declarations inside a cascade layer take precedence over the
 * legacy unlayered component rules, including their !important variants.
 * This keeps every interactive surface at a comfortable maximum weight
 * without rewriting the many page-specific styles. PDF documents do not load
 * this stylesheet and retain their document typography.
 */
@layer planwork-screen-typography {
  html body *,
  html body *::before,
  html body *::after {
    font-weight: var(--pw-font-weight-current, var(--pw-font-weight-regular)) !important;
  }

  html body :is(
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    strong,
    b,
    th,
    caption,
    dt,
    legend,
    summary,
    .planwork-wordmark,
    [class*="title" i],
    [class*="heading" i]
  ) {
    --pw-font-weight-current: var(--pw-font-weight-emphasis);
    font-weight: var(--pw-font-weight-emphasis) !important;
  }

  /* Material Icons use the regular font face; SVG and image logos are unaffected. */
  html body :is(
    .material-icons,
    .material-icons-outlined,
    .material-icons-round,
    .material-icons-sharp,
    .material-icons-two-tone,
    .material-symbols-outlined,
    .material-symbols-rounded,
    .material-symbols-sharp
  ),
  html body :is(
    .material-icons,
    .material-icons-outlined,
    .material-icons-round,
    .material-icons-sharp,
    .material-icons-two-tone,
    .material-symbols-outlined,
    .material-symbols-rounded,
    .material-symbols-sharp
  )::before,
  html body :is(
    .material-icons,
    .material-icons-outlined,
    .material-icons-round,
    .material-icons-sharp,
    .material-icons-two-tone,
    .material-symbols-outlined,
    .material-symbols-rounded,
    .material-symbols-sharp
  )::after {
    --pw-font-weight-current: var(--pw-font-weight-regular);
    font-weight: var(--pw-font-weight-regular) !important;
  }
}