next-ucap-messenger/projects/ucap-webmessenger-app/src/assets/scss/global/_default.scss

@charset 'utf-8';

html {
  height: 100%;
  overflow: hidden;
}
body {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  color: #333;
  font-family: '나눔고딕', Malgun Gothic, '맑은고딕', Arial, Dotum, '돋움',
    Gulim, '굴림';
  font-size: 13px;
  line-height: 18px !important;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
div,
p,
ol,
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
form,
iframe,
dl,
dt,
dd {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
ul,
ol {
  list-style: none;
}
$lg-red: (
  50: #faf3f6,
  100: #f8bbd0,
  200: #f48fb1,
  300: #f06292,
  400: #ef4c73,
  /* 400: #ec407a,*/ 500: #ed097e,
  600: #d81b60,
  700: #c2185b,
  800: #ad1457,
  900: #880e4f,
  A100: #ff80ab,
  A200: #ff4081,
  A400: #ff3399,
  A700: #c51162,
  G100: #ef4c73,
  G900: #352a37,
  contrast: (
    50: $dark-primary-text,
    100: $dark-primary-text,
    200: $dark-primary-text,
    300: $dark-primary-text,
    400: $light-primary-text,
    500: $light-primary-text,
    600: $light-primary-text,
    700: $light-primary-text,
    800: $light-primary-text,
    900: $light-primary-text,
    A100: $dark-primary-text,
    A200: $light-primary-text,
    A400: $light-primary-text,
    A700: $light-primary-text,
    G100:$dark-primary-text,
    G900:$light-primary-text
  )
);

$daesang: (
  50: #e0f7fa,
  100: #b2ebf2,
  200: #80deea,
  300: #4dd0e1,
  400: #26c6da,
  500: #00bcd4,
  /*600: #00acc1,*/ 600: #00b6d5,
  700: #0097a7,
  800: #2c8493,
  900: #126a79,
  A100: #84ffff,
  A200: #18ffff,
  A400: #00e5ff,
  A700: #00b8d4,
  G100: #6dd5ed,
  /*G900: #192a2c,*/G900: #2193b0,
  contrast: (
    50: $dark-primary-text,
    100: $dark-primary-text,
    200: $dark-primary-text,
    300: $dark-primary-text,
    400: $dark-primary-text,
    500: $light-primary-text,
    600: $light-primary-text,
    700: $light-primary-text,
    800: $light-primary-text,
    900: $light-primary-text,
    A100: $dark-primary-text,
    A200: $dark-primary-text,
    A400: $dark-primary-text,
    A700: $dark-primary-text,
    G100: $dark-primary-text,
    G900: $light-primary-text
  )
);

@mixin ucap-material-theme($theme) {
  @include ucap-core-theme($theme);
}

@mixin ucap-core-theme($theme) {
  $accent: map-get($theme, accent);
  $warn: map-get($theme, warn);
  $primary: map-get($theme, primary);
  $background: map-get($theme, background);
  $foreground: map-get($theme, foreground);

  $gradient-darkest:mat-color($accent, G900);
  $gradient-light:mat-color($accent, G100);

  .bg-primary-dark{
    background: mat-color($primary, 900);
    color: mat-color($primary, default-contrast);
  }
  .bg-primary-light{
    background: mat-color($primary, 300);
    color: mat-color($primary, default-contrast);
  }
  .bg-primary-color {
    background: mat-color($primary);
    color: mat-color($primary, default-contrast);
  }
  .bg-accent-darkest {
    background: mat-color($accent, 900);
    color: mat-color($primary, default-contrast);
  }
  .bg-accent-dark {
    background: mat-color($accent, 600);
    color: mat-color($primary, default-contrast);
  }
  .bg-accent-brightest {
    background: mat-color($accent, 50);
    color: mat-color($primary, $dark-primary-text);
  }
  .bg-accent-light {
    background: mat-color($accent, 300) !important;
    color: mat-color($primary, default-contrast);
  }
  .bg-accent-color {
    background: mat-color($accent);
    color: mat-color($accent, default-contrast);
  }
  .text-primary-color {
    color: mat-color($primary);
  }
  .text-accent-color {
    color: mat-color($accent);
  }
  .text-warn-color {
    color: mat-color($warn);
  }
  .border-primary-color {
    border: 1px solid mat-color($primary);
  }
  .border-accent-color {
    border: 1px solid mat-color($accent);
  }
  .mat-tab-group.mat-primary .mat-ink-bar,
  body.theme-default .mat-tab-nav-bar.mat-primary .mat-ink-bar {
    background-color: mat-color($accent, 400);
  }
  .mat-chip.mat-standard-chip.mat-chip-selected.mat-primary {
    background-color: mat-color($accent, 200);
  }
  /*.mat-form-field-appearance-legacy .mat-hint{
     color: mat-color($accent, 800);
   }*/
  .global-menu {
    .mat-tab-label[aria-selected='true']{
     .mat-tab-label-content{
      .icon-item{
        background: mat-color($accent, 300);
         }
       }
     }
  }

  .mat-form-field-appearance-legacy {
    .mat-form-field-label {
      color: mat-color($primary);
    }

    .mat-hint {
      color: mat-color($primary);
    }

    .mat-form-field-underline {
      background-color: mat-color($primary);
    }
  }

  .app-dialog-full .mat-dialog-container {
    overflow: hidden;
    padding: 0px;
    background-color: rgba($color: #000000, $alpha: 0.7);
    box-shadow: none;
    border-radius: 0px;
  }
  .btn-main-float .bg-accent-dark{
    background: mat-color($accent, 600);
    color: mat-color($primary, default-contrast);
  }
  .current-head {
    display: flex;
    justify-content: center;
    padding: 0 10px;
    height: 70px;
    background-color: #eeeeee;
    background: $gradient-light;
    background: -webkit-linear-gradient(to right, $gradient-darkest, $gradient-light);
    background: linear-gradient(to right, $gradient-darkest, $gradient-light);
    color:#ffffff;
  }
}