/* SCALERA_ENTERPRISE_FOUNDATION_V3
   Shared interaction, typography and surface rules. Page-specific themes keep
   their own palette; this layer makes the product feel like one system. */
:root {
  --scalera-canvas: #0b0d10;
  --scalera-surface: #111419;
  --scalera-surface-muted: #171b21;
  --scalera-foreground: #f4f6f8;
  --scalera-foreground-muted: #9aa3af;
  --scalera-primary: #6d4aff;
  --scalera-primary-hover: #8064ff;
  --scalera-accent: #b69cff;
  --scalera-border: #2b313a;
  --scalera-focus: #6d4aff;
  --scalera-focus-ring: 0 0 0 3px rgba(109, 74, 255, .2);
  --scalera-line: rgba(154, 163, 175, .24);
  --scalera-radius-xs: 6px;
  --scalera-radius-sm: 8px;
  --scalera-radius: 10px;
  --scalera-radius-lg: 14px;
  --scalera-control-height: 40px;
  --scalera-ease: cubic-bezier(.2, .7, .2, 1);
}

/* Strategy Hub is the operational product workspace. Keep this scope dark and
   deterministic while authentication and onboarding intentionally stay light. */
body.scalera-strategy-shell {
  color-scheme: dark;
  --background-main: var(--scalera-canvas);
  --background-secondary: var(--scalera-surface);
  --surface-card: var(--scalera-surface);
  --surface-elevated: var(--scalera-surface-muted);
  --text-primary: var(--scalera-foreground);
  --text-secondary: var(--scalera-foreground-muted);
  --text-disabled: #69727f;
  --brand-blue: var(--scalera-primary);
  --brand-purple: var(--scalera-accent);
  --border-soft: var(--scalera-border);
  --divider: var(--scalera-border);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .28);
  --shadow-md: 0 10px 30px rgba(0, 0, 0, .24);
  --shadow-lg: 0 24px 64px rgba(0, 0, 0, .34);
  background: var(--scalera-canvas);
}

body.scalera-strategy-shell .header {
  background: rgba(11, 13, 16, .94);
  border-bottom-color: var(--scalera-border);
  box-shadow: none;
}

body.scalera-strategy-shell .campaign-workspace-v6,
body.scalera-strategy-shell .management-card,
body.scalera-strategy-shell .campaign-item,
body.scalera-strategy-shell #company_management_area,
body.scalera-strategy-shell .card,
body.scalera-strategy-shell .modal-content,
body.scalera-strategy-shell .workspace-modal-card-v1 {
  border-color: var(--scalera-border);
  background-color: var(--scalera-surface);
}

body.scalera-strategy-shell input,
body.scalera-strategy-shell select,
body.scalera-strategy-shell textarea {
  border-color: var(--scalera-border);
  background-color: var(--scalera-surface-muted);
  color: var(--scalera-foreground);
}

body.scalera-strategy-shell .btn-primary,
body.scalera-strategy-shell button[type="submit"] {
  border-color: var(--scalera-primary);
  background: var(--scalera-primary);
  color: #fff;
  box-shadow: none;
}

body.scalera-strategy-shell .btn-primary:hover:not(:disabled),
body.scalera-strategy-shell button[type="submit"]:hover:not(:disabled) {
  border-color: var(--scalera-primary-hover);
  background: var(--scalera-primary-hover);
  box-shadow: none;
}

html { font-synthesis: none; text-rendering: optimizeLegibility; -webkit-text-size-adjust: 100%; }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
button, a, input, select, textarea, summary {
  transition: border-color .14s var(--scalera-ease), background-color .14s var(--scalera-ease),
    color .14s var(--scalera-ease), box-shadow .14s var(--scalera-ease), opacity .14s var(--scalera-ease);
}
button, input, select, textarea { font: inherit; }
button { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, summary:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--scalera-focus) !important; outline-offset: 2px !important;
}
html body input:focus, html body input:focus-visible,
html body textarea:focus, html body textarea:focus-visible,
html body select:focus, html body select:focus-visible {
  outline: 0 !important; border-color: rgba(109, 92, 231, .72) !important;
  box-shadow: var(--scalera-focus-ring) !important;
}
button:not(:disabled):active { transform: translateY(1px); }
button:disabled, select:disabled, input:disabled, textarea:disabled { cursor: not-allowed !important; opacity: .52; }
::placeholder { color: var(--text-disabled, var(--text-muted, #7d8592)); opacity: 1; }
::selection { background: rgba(109, 92, 231, .3); color: inherit; }

* { scrollbar-width: thin; scrollbar-color: rgba(125, 132, 146, .52) transparent; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb { border: 3px solid transparent; border-radius: 999px; background: rgba(125, 132, 146, .52); background-clip: padding-box; }
*::-webkit-scrollbar-thumb:hover { background-color: rgba(125, 132, 146, .72); }

h1, h2, h3, h4 { text-wrap: balance; letter-spacing: -.025em; }
p, .help-text, .subtitle { text-wrap: pretty; }
.num, [class*="metric"], [class*="count"], [class*="usage"] { font-variant-numeric: tabular-nums; }
input:not([type="checkbox"]):not([type="radio"]), select, textarea { border-radius: var(--scalera-radius-sm); }
.btn, [class*="btn-"], button[type="submit"] { border-radius: var(--scalera-radius-sm); font-weight: 650; }

.card, .management-card, .campaign-item, .email-card, .crm-card,
.workspace-modal-card-v1, .package-card, .user-card { box-shadow: none; }
.header, .top-nav { backdrop-filter: blur(18px) saturate(125%); -webkit-backdrop-filter: blur(18px) saturate(125%); }
table { font-variant-numeric: tabular-nums; }
th { letter-spacing: .045em; }
tbody tr { transition: background-color .12s ease, box-shadow .12s ease; }

.main-container { border-radius: 16px !important; box-shadow: 0 24px 70px rgba(15, 23, 42, .12) !important; }
.main-container .input-group { margin-bottom: 18px; }
.main-container .input-group label { letter-spacing: .005em; }
.main-container .btn-container { gap: 10px; }

.header-actions { align-items: center; }
.campaign-item, .management-card, .member-row-v5, .integration-health-card { border-radius: var(--scalera-radius) !important; }
.campaign-item:hover, .management-card:hover, .member-row-v5:hover, .integration-health-card:hover { transform: none !important; }
.campaign-item-clickable-v10:hover {
  background: var(--surface-card) !important; border-color: rgba(109, 74, 255, .54) !important;
  box-shadow: inset 3px 0 0 rgba(109, 74, 255, .86) !important;
}
.identity-trigger, .workspace-picker-v1, .locale-toggle-v1, .header-help-v8 { min-height: var(--scalera-control-height); }
.identity-trigger:hover, .workspace-picker-v1 select:hover, .workspace-picker-v1 button:hover,
.locale-toggle-v1:hover, .header-help-v8:hover { transform: none !important; }

.top-nav .btn-action, .top-nav .theme-btn, .top-nav .btn-menu { min-height: 36px; }
.dash-tabs { scrollbar-width: none; }
.dash-tabs::-webkit-scrollbar { display: none; }
.card-head { min-height: 52px; }
.card-body table tbody tr:hover { background: var(--row-hover, rgba(109, 92, 231, .07)); }

.scalera-assistant-panel { isolation: isolate; }
.scalera-assistant-head, .scalera-assistant-controls, .scalera-assistant-composer { flex: 0 0 auto; }
.scalera-assistant-message.bot { line-height: 1.65; }
.scalera-assistant-send svg { pointer-events: none; }

@media (max-width: 760px) {
  :root { --scalera-control-height: 42px; }
  .main-container { border-radius: 0 !important; box-shadow: none !important; }
  .header, .top-nav { backdrop-filter: none; -webkit-backdrop-filter: none; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}