/**
*** TIM SelfDC vCloud customization css for login page ***
**/

/*============ TIM custom fonts ============*/
@font-face {
  font-family: 'TIMSansWeb';
  src: url('fonts/TIMSansWeb/Regular/TIMSansWeb-Regular.woff2') format('woff2'), /* Modern Browsers */
       url('fonts/TIMSansWeb/Regular/TIMSansWeb-Regular.woff') format('woff'),   /* Modern Browsers */
       url('fonts/TIMSansWeb/Regular/TIMSansWeb-Regular.svg') format('svg');     /* Legacy iOS */
  font-weight: normal;
}

@font-face {
  font-family: 'TIMSansWeb-Bold';
  src: url('fonts/TIMSansWeb/Bold/TIMSansWeb-Bold.woff2') format('woff2'), /* Modern Browsers */
       url('fonts/TIMSansWeb/Bold/TIMSansWeb-Bold.woff') format('woff'),   /* Modern Browsers */
       url('fonts/TIMSansWeb/Bold/TIMSansWeb-Bold.svg') format('svg');     /* Legacy iOS */
  font-weight: bold;
}

/*============= TIM background =============*/
.login-wrapper {
  background: url("images/datacenter.jpg");
  background-image: url("images/datacenter.jpg");
  background-position: center;
  background-size: cover;
  /* color: white; */
}

/*===== TIM font color for login error =====*/
.login-wrapper .login .login-group .error {
  color: white;
}

/*=== class for bold text using TIM font ===*/
.sdc-bold-text {
  font-family: TIMSansWeb-Bold, Metropolis, Avenir Next, Helvetica Neue, Arial, sans-serif;
  font-weight: bold; /* needed for other fonts, if TIMSansWeb-Bold is missing */
}

/*========== TIM colors and fonts ==========*/
/*
#0033a1 is TIM blue
*/
:root {
  --clr-global-app-background: #0033a1;
  --clr-font: TIMSansWeb, Metropolis, Avenir Next, Helvetica Neue, Arial, sans-serif;
  --clr-global-content-header-font-color: white; /* font color for login page */
  --clr-global-font-color: white;                /* font color for maintenance message */
  --clr-forms-text-color: white;                 /* form font color for not empty fields */
  --clr-color-neutral-0: #0033a1;                /* login btn active font color */
  --clr-color-neutral-50: #1a49ad;
  --clr-color-neutral-100: #3360b9;
  --clr-color-neutral-200: #4d76c5;
  --clr-color-neutral-300: #668dd1;
  --clr-color-neutral-400: #80a3dd;
  --clr-color-neutral-500: #99b9e9;
  --clr-color-neutral-600: #b3cff5;
  --clr-color-neutral-700: #ccdfff;              /* alert info font color */
  --clr-color-neutral-800: #e6efff;
  --clr-color-neutral-900: #f2f8ff;              /* font color for "Organization" label */
  --clr-color-neutral-1000: white;
  --clr-color-action-50: #1a49ad;                /* login btn active hover font and info bg color */
  --clr-color-action-100: #3360b9;
  --clr-color-action-200: #4d76c5;
  --clr-color-action-300: #668dd1;
  --clr-color-action-400: #80a3dd;               /* alert info border color */
  --clr-color-action-500: #99b9e9;
  --clr-color-action-600: #b3cff5;               /* login btn active color */
  --clr-color-action-700: #ccdfff;               /* alert info font color */
  --clr-color-action-800: #e6efff;               /* login btn active hover color */
  --clr-color-action-900: #f2f8ff;
  --clr-color-action-1000: white;
}

/*
old values
--clr-color-action-50: #0033a1
--clr-color-action-600: white;
--clr-color-action-800: lightgrey;

## theme-default
# color-neutral
--clr-color-neutral-0: white;
--clr-color-neutral-50: #fafafa;
--clr-color-neutral-100: #f2f2f2;
--clr-color-neutral-200: #e8e8e8;
--clr-color-neutral-300: #dedede;
--clr-color-neutral-400: #cccccc;
--clr-color-neutral-500: #b3b3b3;
--clr-color-neutral-600: #8c8c8c;
--clr-color-neutral-700: #666666;
--clr-color-neutral-800: #454545;
--clr-color-neutral-900: #333333;
--clr-color-neutral-1000: black;
# color-action
--clr-color-action-50: #e3f5fc;
--clr-color-action-100: #c8eaf9;
--clr-color-action-200: #9bd8f3;
--clr-color-action-300: #79c6e6;
--clr-color-action-400: #49aeda;
--clr-color-action-500: #179bd3;
--clr-color-action-600: #0072a3;
--clr-color-action-700: #00648f;
--clr-color-action-800: #00567a;
--clr-color-action-900: #004b6b;
--clr-color-action-1000: #00364d;
*/