:root {
    /* Brand colours - override the base variables from app.css */
    --primary: #535252;
    --primary-foreground: #FFFFFF;
    --secondary: #E1E1E1;
    --secondary-foreground: #1A1A1A;
    --accent: #ECECEC;
    --accent-foreground: #1A1A1A;

    /* Interactive highlight - focus rings and active states. Kept off red so a
       focus ring is never mistaken for a validation error. */
    --brand-highlight: #2B5698;
    --brand-highlight-rgb: 43, 86, 152;
    --brand-highlight-foreground: #FFFFFF;
    --ring: #2B5698;
    --sidebar-ring: #2B5698;
}