/* Semantic roles over the existing executive palette. Keep legacy CSS intact. */
:root {
  --sc-color-page: var(--background, #faf8f4);
  --sc-color-surface: var(--card, #fff);
  --sc-color-surface-muted: var(--muted, #f4f6f3);
  --sc-color-text: var(--foreground, #1a2e28);
  --sc-color-text-muted: var(--muted-foreground, #5a6f68);
  --sc-color-border: var(--border, #dde5e1);
  --sc-color-accent: var(--primary, #0d6b4f);
  --sc-color-on-accent: var(--primary-foreground, #fff);
  --sc-color-accent-soft: var(--primary-soft, #e8f5ef);
  --sc-color-success: var(--success-soft-fg, #0d6b4f);
  --sc-color-success-bg: var(--success-soft, #e6f4ee);
  --sc-color-warning: var(--warning-soft-fg, #92400e);
  --sc-color-warning-bg: var(--warning-soft, #fef6e6);
  --sc-color-danger: var(--destructive-soft-fg, #b91c1c);
  --sc-color-danger-bg: var(--destructive-soft, #fdecea);
  --sc-color-info: #1d4ed8;
  --sc-color-info-bg: #eef4fc;
  --sc-color-overlay: rgb(15 18 22 / 42%);
  --sc-focus-ring: var(--ring, #0d6b4f);
  --sc-space-1: 4px;
  --sc-space-2: 8px;
  --sc-space-3: 12px;
  --sc-space-4: 16px;
  --sc-space-6: 24px;
  --sc-radius-control: 8px;
  --sc-radius-surface: 12px;
  --sc-touch-target: 44px;
  --sc-touch-target-large: 48px;
  --sc-shadow-surface: var(--shadow-card, 0 1px 3px rgb(26 46 40 / 6%));
  color-scheme: light;
}

html[data-theme="dark"] {
  --sc-color-info: #a9c9ff;
  --sc-color-info-bg: #1c304b;
  --sc-color-overlay: rgb(0 0 0 / 58%);
  color-scheme: dark;
}

.sc-app-shell :is(a, button, input, select, textarea, [tabindex]):focus-visible,
.sc-auth-shell :is(a, button, input, select, textarea, [tabindex]):focus-visible,
.sc-skip-link:focus-visible {
  outline: 2px solid var(--sc-focus-ring);
  outline-offset: 3px;
}

.sc-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.sc-skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 1300;
  padding: 12px 16px;
  border-radius: var(--sc-radius-control);
  background: var(--sc-color-surface);
  color: var(--sc-color-text);
  box-shadow: var(--sc-shadow-surface);
  transform: translateY(-160%);
}
.sc-skip-link:focus { transform: translateY(0); }
.sc-content:focus { outline: none; }
.sc-content { scroll-margin-top: 16px; }
.sc-messages:empty { display: none; }
.sc-message { overflow-wrap: anywhere; }
.sc-sidebar-drawer[aria-hidden="true"] { visibility: hidden; }
.sc-topbar-main { min-width: 0; }

@media (max-width: 768px) {
  :root { --sc-topbar-h: 60px; }
  .sc-shell.sc-shell-mobile { grid-template-rows: auto 1fr; }
  .sc-mobile-topbar { padding-block: 8px; padding-top: calc(8px + env(safe-area-inset-top, 0px)); }
  .sc-mobile-topbar .sc-topbar-user { min-width: 0; }
  .sc-app-shell :is(.sc-sidebar-toggle, .sc-sidebar-drawer-close, .sc-search-btn, .sc-tour-btn, .sc-theme-toggle, .sc-account-chip__settings) {
    min-width: var(--sc-touch-target);
    min-height: var(--sc-touch-target);
    flex-shrink: 0;
  }
  .sc-app-shell :is(.sc-btn, .sc-logout, .sc-select2__trigger),
  .sc-auth-shell :is(.sc-btn, button[type="submit"]) { min-height: var(--sc-touch-target); }
  :is(.sc-app-shell, .sc-auth-shell) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) {
    min-height: var(--sc-touch-target);
    font-size: 16px;
  }
  .sc-app-shell .sc-sidebar.sc-sidebar--v2 .sc-sidebar-link {
    min-height: var(--sc-touch-target-large);
    box-sizing: border-box;
  }
  .sc-app-shell .sc-sidebar.sc-sidebar--v2 .sc-sidebar-link-text {
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.35;
  }
  .sc-app-shell .sc-sidebar.sc-sidebar--v2.sc-sidebar-drawer { overscroll-behavior: contain; }
  body:not(.sc-sidebar-open) .sc-app-shell .sc-sidebar.sc-sidebar--v2.sc-sidebar-drawer { visibility: hidden; }
  .sc-app-shell .sc-sidebar-backdrop { background: var(--sc-color-overlay); }
}

@media (max-width: 540px) {
  .sc-mobile-topbar { flex-wrap: wrap; gap: 4px; }
  .sc-mobile-topbar .sc-topbar-main { flex-basis: 100%; }
  .sc-mobile-topbar .sc-topbar-user { width: 100%; gap: 4px; justify-content: flex-end; }
  .sc-mobile-topbar .sc-company-pill { flex: 1 1 auto; min-width: 0; max-width: none; }
  .sc-mobile-topbar .sc-demo-badge,
  .sc-mobile-topbar .sc-demo-showcase-badge { flex: 0 1 auto; min-width: 0; }
  .sc-mobile-topbar .sc-demo-badge__text,
  .sc-mobile-topbar .sc-demo-showcase-badge__text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}