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

@use '@angular/material' as mat;

@import '~material-icons/iconfont/material-icons.css';

@import '@angular/material/prebuilt-themes/indigo-pink.css';

//@import './app-theme';
/* You can add global styles to this file, and also import other style files */
// @import "../node_modules/@angular/material/prebuilt-themes/purple-green.css";
@import "palette.scss";

html, body { height: 100%; }
body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; }
// Plus imports for other components in your app.

/*// Typography
$custom-typography: mat-typography-config(
  $font-family: Raleway,
  $headline: mat-typography-level(24px, 48px, 400),
  $body-1: mat-typography-level(16px, 24px, 400)
);
@include angular-material-typography($custom-typography);
*/
// Include the common styles for Angular Material once.
@include mat.elevation-classes();
@include mat.app-background();

// Default colors
$my-app-primary: mat.m2-define-palette(mat.$m2-light-blue-palette, 700, 100, 800);
$my-app-accent:  mat.m2-define-palette(mat.$m2-blue-palette, 700, 100, 800);
$my-app-warn: mat.m2-define-palette(mat.$m2-red-palette, 700, 100, 800);

$my-app-theme: mat.m2-define-light-theme((
  color: (
    primary: $my-app-primary,
    accent: $my-app-accent,
    warn: $my-app-warn,
  )
));
@include mat.all-component-themes($my-app-theme);

// Dark theme
$dark-primary: mat.m2-define-palette(mat.$m2-light-blue-palette, 700, 100, 800);
$dark-accent:  mat.m2-define-palette(mat.$m2-blue-palette);
$dark-warn:    mat.m2-define-palette(mat.$m2-deep-orange-palette);

$dark-theme: mat.m2-define-dark-theme((
  color: (
    primary: $dark-primary,
    accent: $dark-accent,
    warn: $dark-warn,
  )
));

.dark-theme {
  @include mat.all-component-colors($dark-theme);
}

.mat-mdc-outlined-button, .mat-mdc-raised-button, .mat-mdc-flat-button {
  border-radius: 24px !important
}

// Light theme
$light-primary: mat.m2-define-palette(mat.$m2-grey-palette, 200, 500, 300);
$light-accent: mat.m2-define-palette(mat.$m2-brown-palette, 200);
$light-warn: mat.m2-define-palette(mat.$m2-deep-orange-palette, 200);

$light-theme: mat.m2-define-light-theme((
  color: (
    primary: $light-primary,
    accent: $light-accent,
    warn: $light-warn,
  )
));

.light-theme {
  @include mat.all-component-colors($light-theme);
}

.no-outline {
  outline: none;
}


// @import '../node_modules/@angular/material/theming';

.centered {
    margin: 0 auto;
    left: 50%;
    top: 50%;
}

/* cyrillic-ext */
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./assets/fonts/KFOmCnqEu92Fr1Mu72xKOzY.woff2) format("woff2");
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F,
    U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./assets/fonts/KFOmCnqEu92Fr1Mu5mxKOzY.woff2) format("woff2");
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./assets/fonts/KFOmCnqEu92Fr1Mu7mxKOzY.woff2) format("woff2");
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./assets/fonts/KFOmCnqEu92Fr1Mu4WxKOzY.woff2) format("woff2");
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./assets/fonts/KFOmCnqEu92Fr1Mu7WxKOzY.woff2) format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1,
    U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./assets/fonts/KFOmCnqEu92Fr1Mu7GxKOzY.woff2) format("woff2");
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB,
    U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(./assets/fonts/KFOmCnqEu92Fr1Mu4mxK.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
    U+FEFF, U+FFFD;
}

.mat-mdc-icon {
  align-items: center;
  display: inline-flex;
}

.mdc-icon-button {
  align-items: center !important;
  display: inline-flex !important;
}
