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

@include mat.core();

$foreground: map-get($theme, foreground);
$background: map-get($theme, background);
$warn: map-get($theme, warn);
$accent: map-get($theme, accent);
$primary: map-get($theme, primary);
$typography: map-get($theme, typography);

body,
html {
    margin: 0;
    height: 100%;
    overflow: hidden;
    font-size: mat.font-size($typography, body-1);
    font-family: mat.font-family($typography);
    line-height: mat.line-height($typography, body-1);
}

body {
    overflow: auto;
}

.adf-full-width {
    width: 100%;
}

// text
$hy-text-black: $hy-coolGray-900;
$hy-text-white: $hy-white;
$hy-text-secondary: $hy-coolGray-600;
$hy-text-disabled: $hy-coolGray-500;

// feedback
$hy-informational: map-get($hy-primary, 700);
$hy-error: $hy-red-600;
$hy-success: map-get($hy-green, 600);
$hy-warning: map-get($hy-yellow, 400);

// activeState
$hy-active-focused: map-get($hy-primary, 100);
$hy-inactive-focused: map-get($hy-primary, 100);
$hy-active-unfocused: map-get($hy-neutral, 100);
$hy-inactive-hover: map-get($hy-neutral, 100);
$hy-keyboard-focus: $hy-black;
$hy-active-hover: map-get($hy-primary, 100);
$hy-active-pressed: map-get($hy-primary, 200);
$hy-inactive-pressed: map-get($hy-primary, 300);

// functional
$hy-functional-purple-bg: map-get($hy-purple, 700);
$hy-functional-blue-bg: $hy-blue-700;
$hy-functional-teal-bg: map-get($hy-teal, 600);
$hy-functional-green-bg: map-get($hy-green, 600);
$hy-functional-yellow-bg: map-get($hy-yellow, 600);
$hy-functional-orange-bg: map-get($hy-orange, 600);
$hy-functional-red-bg: $hy-red-500;
$hy-functional-pink-bg: map-get($hy-pink, 600);

// functionalText
$hy-functional-text-purple-bg: map-get($hy-purple, 300);
$hy-functional-text-blue-bg: #3abff8;
$hy-functional-text-teal-bg: map-get($hy-teal, 300);
$hy-functional-text-lime-bg: map-get($hy-lime, 400);
$hy-functional-text-yellow-bg: map-get($hy-yellow, 300);
$hy-functional-text-orange-bg: map-get($hy-orange, 400);
$hy-functional-text-red-bg: $hy-red-400;
$hy-functional-text-orange-bg: map-get($hy-orange, 400);
$hy-functional-text-pink-bg: map-get($hy-pink, 300);

// buttonState
$hy-btn-basic-hover: #0000000a;
$hy-btn-basic-pressed: #00000021;
$hy-btn-primary-hover: #0e73d80a;
$hy-btn-primary-pressed: #0e73d824;
$hy-btn-warn-hover: #da15000a;
$hy-btn-warn-pressed: #da15001a;
$hy-flat-btn-blk-hover: #0000000a;
$hy-flat-btn-blk-pressed: #0000001a;
$hy-flat-btn-white-hover: #ffffff14;
$hy-flat-btn-white-pressed: #ffffff1a;

$hy-flat-btn-bg: map-get($hy-primary, 700);
$hy-flat-btn-hover: #1e6dd2;
$hy-flat-btn-pressed: #1466d08a;
$hy-flat-btn-disabled-bg: map-get($hy-neutral, 200);

$hy-stroke-text-btn-hover: #f6fafe;
$hy-stroke-text-btn-pressed: #eef5fc92;

$hy-stroked-btn-bg: $hy-white;
$hy-stroked-btn-stroke: map-get($hy-neutral, 500);
$hy-stroked-btn-color: map-get($hy-primary, 700);
$hy-stroked-btn-hover: $hy-stroke-text-btn-hover;
$hy-stroked-btn-pressed: $hy-stroke-text-btn-pressed;
$hy-stroked-btn-disabled-bg: $hy-white;
$hy-stroked-btn-disabled-stroke: map-get($hy-neutral, 300);

$hy-text-btn-color: map-get($hy-primary, 700);
$hy-text-btn-hover: $hy-stroke-text-btn-hover;
$hy-text-btn-pressed: $hy-stroke-text-btn-pressed;
$hy-text-btn-disabled-color: $hy-text-disabled;

// background
$hy-bg-nav: #e5e7eb;
$hy-bg-page: #ffffff;
$hy-background: map-get($hy-trueGray, 800);
$hy-light-gray: map-get($hy-trueGray, 900);

// loader
$hy-loader-spinner: map-get($hy-primary, 700);
$hy-loader-text: map-get($hy-neutral, 900);

// map SCSS variables to expose as CSS variables
$defaults: (
    --theme-primary-color: mat.get-color-from-palette($primary),
    --theme-studio-background: $hy-background,
    --theme-studio-gray-color: $hy-light-gray,
    --theme-primary-color-default-contrast:
        mat.get-color-from-palette($primary, default-contrast),
    --theme-warn-color: mat.get-color-from-palette($warn),
    --theme-warn-color-default-contrast:
        mat.get-color-from-palette($warn, default-contrast),
    --theme-accent-color: mat.get-color-from-palette($accent),
    --theme-background-color:
        mat.get-color-from-palette($background, background),
    --theme-text-fg-color: mat.get-color-from-palette($foreground, text),
    --theme-text-color: mat.get-color-from-palette($foreground, text, 0.54),
    --theme-text-bold-color: mat.get-color-from-palette($foreground, text, 0.87),
    --theme-title-color: mat.get-color-from-palette($foreground, text, 0.87),
    --theme-text-disabled-color: $hy-text-disabled,
    --theme-text-selection-color: $hy-active-focused,
    --theme-border-color: mat.get-color-from-palette($foreground, text, 0.07),
    --theme-border-color-light:
        mat.get-color-from-palette($foreground, text, 0.2),
    --theme-card-background-color: mat.get-color-from-palette($background, card),
    --theme-foreground-text-color:
        mat.get-color-from-palette($foreground, text, 0.72),
    --theme-foreground-text-bold-color:
        mat.get-color-from-palette($foreground, text, 0.87),
    --theme-secondary-text-color:
        mat.get-color-from-palette($foreground, secondary-text),
    --theme-divider-color:
        mat.get-color-from-palette($foreground, divider, 0.07),
    --theme-divider-color-light:
        lighten(mat.get-color-from-palette($foreground, divider, 0.07), 30),
    --theme-dialog-bg-color: mat.get-color-from-palette($background, dialog),
    --theme-app-bar-bg-color: mat.get-color-from-palette($background, app-bar),
    --theme-status-bar-bg-color:
        mat.get-color-from-palette($background, status-bar, 0.7),
    --theme-unselected-chip-bg-color:
        mat.get-color-from-palette($background, unselected-chip),
    --theme-disabled-text-color: $hy-text-disabled,
    --theme-selected-button-bg-color: $hy-btn-basic-hover,
    --theme-raised-button-bg-color:
        mat.get-color-from-palette($background, raised-button),
    --theme-icons-fg-color: mat.get-color-from-palette($foreground, icons),
    --theme-slider-off-fg-color:
        mat.get-color-from-palette($foreground, slider-off),
    --theme-ama-palette-header-bg-color:
        mat.get-color-from-palette($foreground, text, 0.08),
    --theme-ama-palette-bg-color:
        mat.get-color-from-palette($foreground, text, 0.03),
    --theme-ama-palette-separator-color:
        mat.get-color-from-palette($foreground, text, 0.05),
    --theme-ama-var-selector-bg-color:
        mat.get-color-from-palette($foreground, text, 0.05),
    --theme-ama-studio-bg-color: var(--adf-snackbar-info-action-color),
    --theme-ama-var-selector-selected-text-bg-color:
        mat.get-color-from-palette($foreground, text, 0.1),
    --theme-ama-form-editor-btn-color:
        mat.get-color-from-palette($foreground, text, 0.25),
    --theme-ama-form-editor-btn-hover-color:
        mat.get-color-from-palette($foreground, text, 1),
    --theme-ama-form-editor-text-drag-color:
        mat.get-color-from-palette($foreground, text, 0.4),
    --theme-ama-condition-builder-primary-text-color:
        mat.get-color-from-palette($primary, text, 0.75),
    --theme-ama-condition-builder-accent-text-color:
        mat.get-color-from-palette($accent, text, 0.75),
    --theme-disabled-bg-color:
        mat.get-color-from-palette($foreground, text, 0.05),
    --theme-hint-bg-color: mat.get-color-from-palette($foreground, text, 0.5),
    --theme-font-family: mat.font-family($typography),
    --theme-body-1-font-size: mat.font-size($typography, body-1),
    --theme-body-1-line-height: mat.line-height($typography, body-1),
    --theme-caption-font-size: mat.font-size($typography, caption),
    --theme-title-font-size: mat.font-size($typography, title),
    --theme-subheading-2-font-size:
        mat.font-size($typography, subheading-2),
    --theme-headline-line-height:
        mat.line-height($typography, headline),
    --theme-card-bg-color: mat.get-color-from-palette($background, card),
    --theme-colors-mat-grey-dark:
        mat.get-color-from-palette(mat.$grey-palette, A400),
    --adf-card-view-datetime-border-color:
        mat.get-color-from-palette($foreground, text, 0.42),
    --theme-document-color: #00953b,
    --theme-ama-log-panel-bg-color:
        mat.get-color-from-palette($foreground, text, 0.01),
    --theme-light-monoco-editor-color: #fffffe,
    --theme-ama-border-color: #dce0e6,
    --theme-ama-loader-spinner: $hy-loader-spinner,
    --theme-ama-loader-text: $hy-loader-text,

    --theme-logo-circle-bg: map-get($hy-primary, 400),
    --theme-logo-square-bg: map-get($hy-primary, 700),
    --theme-main-navigation-bg: map-get($hy-neutral, 100),
    --theme-main-navigation-main-title: $hy-text-secondary,
    --theme-main-navigation-menu-element: $hy-text-black,
    --theme-main-navigation-menu-element-active: map-get($hy-primary, 700),
    --theme-main-navigation-header-title-text: $hy-text-black,
    --theme-main-navigation-header-controls-icon: $hy-text-black,
    --theme-main-navigation-header-controls-icon-hover: $hy-btn-basic-hover,
    --theme-main-navigation-header-controls-icon-pressed: $hy-btn-basic-pressed,
    --theme-main-navigation-header-controls-badge: map-get($hy-primary, 700),
    --theme-user-initials-bg: map-get($hy-neutral, 200),
    --theme-user-initials-bg-hover: $hy-btn-basic-hover,
    --theme-user-initials-bg-pressed: $hy-btn-basic-pressed,
    --theme-user-initials-text: $hy-text-black,

    // ADF components and services
    --adf-header-text-color: mat.get-color-from-palette($primary, default-contrast),
    --adf-user-info-color: mat.get-color-from-palette($primary, 300),

    // hy-theme
    --theme-inactive-focused: $hy-inactive-focused,
    --theme-text-white: $hy-text-white,
    --theme-tab-unfocused: mat.get-color-from-palette($accent, 300),
    --theme-schema-tree-border-color: mat.get-color-from-palette($accent, 300)
);

// propagates SCSS variables into the CSS variables scope
:root {
    @each $name, $value in $defaults {
        #{$name}: #{$value};
    }
}

body {
    @include mat.all-component-themes($theme);
    @include adf-core-theme($theme);
    background-color:$hy-text-white;
    .mat-drawer-content {
      background-color: $hy-text-white;
    }

    .monaco-editor {
        background-color: var(--theme-light-monoco-editor-color);
    }

    .ama-model-header .mat-toolbar-single-row {
        background-color: var(--theme-card-bg-color);
    }

    .ama-collaborators-dialog-container {
        .mat-dialog-container {
            border-radius: 12px;
            padding: 20px 0 24px;
        }
    }
}

.mat-icon {
    overflow: unset !important;
}

@import 'hy-styles/checkboxes.scss';
@import 'hy-styles/data-models.scss';
@import 'hy-styles/document-types.scss';
@import 'hy-styles/inputs.scss';
@import 'hy-styles/mixins.scss';
@import 'hy-styles/switch-toggle.scss';
@import 'hy-styles/toasts.scss';
@import 'hy-styles/radio-buttons.scss';
@import 'hy-styles/icons.scss';
@import 'hy-styles/texts.scss';
@import 'hy-styles/buttons.scss';
