/* Reset so the SmLayout shell (height: 100vh) actually meets the viewport edges.
   Default UA body margin leaves an ~8px white border that, combined with the body's
   default white background, shows as a visible band below the shell when the page bg
   (--sm-color-bg) is a light gray. */
html, body {
    margin: 0;
    padding: 0;
}

:root {
    /* Layout */
    --sm-sidebar-width: 260px;
    --sm-sidebar-width-collapsed: 60px;
    --sm-navbar-height: 56px;
    --sm-content-padding: 24px;

    /* Spacing scale */
    --sm-space-1: 4px;
    --sm-space-2: 8px;
    --sm-space-3: 12px;
    --sm-space-4: 16px;
    --sm-space-5: 24px;
    --sm-space-6: 32px;
    --sm-space-nav-block: 20px;

    /* Radius */
    --sm-radius-sm: 4px;
    --sm-radius-md: 8px;
    --sm-radius-lg: 12px;
    --sm-radius-xl: 16px;
    --sm-radius-xxl: 24px;
    --sm-radius-modal: 16px;

    /* Typography */
    --sm-font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --sm-font-size-sm: 12px;
    --sm-font-size-base: 14px;
    --sm-font-size-md: 15px;
    --sm-font-size-lg: 16px;
    --sm-font-size-lg-17: 17px;
    --sm-font-size-xl: 20px;
    --sm-font-size-2xl: 28px;
    --sm-font-size-3xl: 32px;
    
    /* Font weight */
    --sm-font-weight-400: 400;
    --sm-font-weight-500: 500;
    --sm-font-weight-600: 600;
    --sm-font-weight-700: 700;

    /* Animation */
    --sm-transition-fast: 120ms ease;
    --sm-transition-base: 200ms ease;

    /* Light theme palette (default) */
    --sm-color-bg: #f7f8fa;
    --sm-color-surface: #ffffff;
    --sm-color-surface-alt: #f1f3f5;
    --sm-color-border: #e1e4e8;
    --sm-color-text: #1f2328;
    --sm-color-text-muted: #6b7280;
    --sm-color-primary: #2f6feb;
    --sm-color-primary-hover: #1f5ed6;
    --sm-color-primary-text: #ffffff;
    --sm-color-tertiary-text: #BDBDC6;
    --sm-color-success: #1f883d;
    --sm-color-success-text: #ffffff;
    --sm-color-warning: #bf8700;
    --sm-color-error: #cf222e;
    --sm-color-shadow: rgba(15, 23, 42, 0.06);
    --sm-background-color-primary: #FFFFFF;
    --sm-background-color-secondary: #F7F7FA;
    --sm-color-background-invert: #000000;
    --sm-color-background-accent: #1A5AFF;
    --sm-color-content-secondary:  #999;
    --sm-color-border-primary: #D9D9D9;
    --sm-color-background-tint: #ECF2FF;
    --sm-color-positive: #02ce6c;
    --sm-color-positive-hover: #02b85f;
    
    /* Checkmate */
    --cm-color-severity-veryHigh: #e91e6;

    /* Bonus campaign status badges — fixed brand colors, identical in both themes
       (defined only here so the dark block inherits the same values). */
    --sm-badge-draft-bg: #f7f7fa;
    --sm-badge-draft-text: #999999;
    --sm-badge-scheduled-bg: #ecf2ff;
    --sm-badge-scheduled-text: #1a5aff;
    --sm-badge-active-bg: #baffe2;
    --sm-badge-active-text: #0e8903;
    --sm-badge-stopped-bg: #ffe8e6;
    --sm-badge-stopped-text: #ff3a30;
    --sm-badge-expired-bg: #ffffff;
    --sm-badge-expired-border: #d9d9d9;
    --sm-badge-expired-text: #bdbdc6;

    /* Bonus campaign table header */
    --sm-table-header-bg: #f7f7fa;
    --sm-table-header-text: #000000;

    /* Form placeholder / muted search icon */
    --sm-color-placeholder: #bdbdc6;

    /* Campaign trigger icon — solid black, no chip background */
    --sm-color-trigger-icon: #000000;

    /* Campaign secondary line (segment / description) */
    --sm-color-description: #999999;

    /* Stronger border for data-table row separators (audit log rows) */
    --sm-color-border-strong: #d9d9d9;
}

[data-theme="dark"] {
    --sm-color-bg: #0f1115;
    --sm-color-surface: #171a21;
    --sm-color-surface-alt: #1f232c;
    --sm-color-border: #2a2f3a;
    --sm-color-text: #e6e8eb;
    --sm-color-text-muted: #9aa3ad;
    --sm-color-primary: #4d8df7;
    --sm-color-primary-hover: #6aa1ff;
    --sm-color-primary-text: #0f1115;
    --sm-color-tertiary-text: #BDBDC6;
    --sm-color-success: #2ea043;
    --sm-color-warning: #d29922;
    --sm-color-error: #f85149;
    --sm-color-shadow: rgba(0, 0, 0, 0.45);
    --sm-background-color-primary: #101010;
    --sm-background-color-secondary: #323232;
    --sm-color-background-invert: #FFFFFF;
    --sm-color-background-accent: #1A5AFF;
    --sm-color-content-secondary:  #999;
    --sm-color-border-primary: #5C5C5C;
    --sm-color-background-tint: #181818;
    --sm-color-positive: #02ce6c;
    --sm-color-positive-hover: #04b762;
}