:root {
    /* Brand */
    --cm-app-color: #0daa7e;
    --cm-app-color-hover: #0b9870;   /* ~10% darker, for hover states */
    --cm-app-color-active: #0a8764;  /* ~20% darker, for active/pressed states */
    --cm-app-color-accessible: #0a8060; /* 4.5:1 on white, for links and primary UI */

    /* Grey palette (from Figma) */
    --cm-color-grey-100: #f8f9fb;
    --cm-color-grey-200: #e2e5ed;
    --cm-color-grey-300: #d7dce9;
    --cm-color-grey-400: #b3b7ce;
    --cm-color-grey-600: #7289aa;
    --cm-color-grey-700: #465066;
    --cm-color-grey-800: #353e52;
    --cm-color-grey-900: #283452;

    /* Spacing scale (from Figma section-padding tokens) */
    --cm-spacing-2:  0.125rem;
    --cm-spacing-4:  0.25rem;
    --cm-spacing-6:  0.375rem;
    --cm-spacing-8:  0.5rem;
    --cm-spacing-10: 0.625rem;
    --cm-spacing-12: 0.75rem;
    --cm-spacing-14: 0.875rem;
    --cm-spacing-16: 1rem;
    --cm-spacing-32: 2rem;

    /* Border radius (from Figma) */
    --cm-border-radius-small: 4px;
    --cm-border-radius-medium: 6px;

    /* Sidebar */
    --cm-sidebar-item-color: var(--cm-color-grey-300);
    --cm-sidebar-item-color-active: var(--bs-white);
    --cm-sidebar-item-color-hover: var(--bs-white);
    --cm-sidebar-item-background-color-active: var(--cm-color-grey-700);
    --cm-sidebar-background-color: #243244;
    --cm-sidebar-icon-width: 24px;
    --cm-sidebar-max-width: 250px;
    --cm-sidebar-left-border-width: 2px;
    --cm-sidebar-sub-lavel-settings-item-color: var(--cm-color-grey-600);
    --cm-sidebar-sub-lavel-settings-item-color-hover: var(--bs-white);
    --cm-sidebar-sub-lavel-settings-item-background-color-hover: var(--cm-color-grey-600);
    --cm-sidebar-sub-lavel-settings-item-color-active: var(--bs-white);
    --cm-sidebar-sub-lavel-settings-background-color: var(--bs-white);

    --cm-login-logo-width: 250px;
    --cm-login-layout-max-width: 600px;

    --cm-page-title-background-color: var(--bs-white);

    --cm-page-padding: 2.5rem;

    --cm-max-page-width: 1600px;
    --cm-settings-view-max-width: var(--cm-max-page-width);

    --cm-table-header-height: 2.25rem;

    --cm-table-icon-size: 20px;
}