styles.scss

/* You can add global styles to this file, and also import other style files */

@use '@angular/material' as mat;

// Use this import in a real project instead
//@use '@mat-datetimepicker/core/datetimepicker/datetimepicker-theme.scss';
@use 'dist/core/datetimepicker/datetimepicker-theme.scss';

@include mat.core();

$app-primary: mat.m2-define-palette(mat.$m2-indigo-palette);
$app-accent: mat.m2-define-palette(mat.$m2-pink-palette);
$app-warn: mat.m2-define-palette(mat.$m2-red-palette);

$theme: mat.m2-define-light-theme(
  (
    color: (
      primary: $app-primary,
      accent: $app-accent,
      warn: $app-warn,
    ),
    typography: mat.m2-define-typography-config(),
    density: 0,
  )
);

@include mat.all-component-themes($theme);

// Using the $theme variable from the pre-built theme you can call the theming function
@include datetimepicker-theme.mat-datetimepicker-theme($theme);

html,
body {
  height: 100%;
}
body {
  margin: 0;
  font-family: Roboto, 'Helvetica Neue', sans-serif;
}