@use '@angular/material' as mat;
@import '@alfresco/adf-core/theming';
@import '~@angular/material/theming';
@import './studio-typography.scss';

$studio-background: rgba(33, 33, 33, 0.12);
$studio-light-gray: rgba(33, 33, 33, 0.05);

$studio-orange: (
    50: #fff8e0,
    100: #ffeeb3,
    200: #ffe380,
    300: #ffd74d,
    400: #ffcf26,
    500: #ffc600,
    600: #ffc000,
    700: #ffb900,
    800: #ffb100,
    900: #ffa400,
    A100: #ffffff,
    A200: #fffaf2,
    A400: #ffe5bf,
    A700: #ffdba6,
    contrast: (
        50:  $studio-background,
        100: $studio-light-gray,
        200: $black-87-opacity,
        300: white,
        400: white,
        500: $white-87-opacity,
        600: $white-87-opacity,
        700: $white-87-opacity,
        800: $white-87-opacity,
        900: $white-87-opacity,
        A100: $black-87-opacity,
        A200: white,
        A400: white,
        A700: $white-87-opacity,
    )
);

$studio-light-warn: (
    50 : #ffede0,
    100 : #ffd3b3,
    200 : #ffb580,
    300 : #ff974d,
    400 : #ff8126,
    500 : #ff6b00,
    600 : #ff6300,
    700 : #ff5800,
    800 : #ff4e00,
    900 : #ff3c00,
    A100 : #ffffff,
    A200 : #fff4f2,
    A400 : #ffcabf,
    A700 : #ffb5a6,
    contrast: (
        50 : #000000,
        100 : #000000,
        200 : #000000,
        300 : #000000,
        400 : #000000,
        500 : #000000,
        600 : #000000,
        700 : #ffffff,
        800 : #ffffff,
        900 : #ffffff,
        A100 : #000000,
        A200 : #000000,
        A400 : #000000,
        A700 : #000000,
    )
);

/* For use in src/lib/core/theming/_palette.scss */
$studio-dark-warn: (
    50 : #fff6f2,
    100 : #ffe9de,
    200 : #ffdac8,
    300 : #ffcbb2,
    400 : #ffc0a2,
    500 : #ffb591,
    600 : #ffae89,
    700 : #ffa57e,
    800 : #ff9d74,
    900 : #ff8d62,
    A100 : #ffffff,
    A200 : #ffffff,
    A400 : #ffffff,
    A700 : #fff1eb,
    contrast: (
        50 : #000000,
        100 : #000000,
        200 : #000000,
        300 : #000000,
        400 : #000000,
        500 : #000000,
        600 : #000000,
        700 : #000000,
        800 : #000000,
        900 : #000000,
        A100 : #000000,
        A200 : #000000,
        A400 : #000000,
        A700 : #000000,
    )
);

$primary: mat-palette($studio-orange);
$accent: mat-palette($mat-grey);
$warn: mat-palette($studio-light-warn);
$theme: mat.define-light-theme(
    (
        color: (
            primary: $primary,
            accent: $accent,
            warn: $warn,
        ),
        typography: $studio-typography
    )
);

$dark-primary: mat-palette($studio-orange);
$dark-accent: mat-palette($mat-grey);
$dark-warn: mat-palette($studio-dark-warn);
$dark-theme: mat.define-dark-theme(
    (
        color: (
            primary: $dark-primary,
            accent: $dark-accent,
            warn: $dark-warn,
        ),
        typography: $studio-typography
    )
);
