/* Root / Reset */
@import url("/css/cas.css?v=7.3");

:root {
  --mdc-theme-error: #b00020;
  --mdc-theme-primary: #63003C;
  --mdc-theme-surface: #EFF5FA;
  --mdc-theme-secondary: #C60B46;

  --cas-theme-primary: #63003C;
  --cas-theme-secondary: #2f5b25;
  --cas-theme-primary-bg: #fff;
  --cas-theme-primary-light: #8B1B59;
  --mdc-theme-text-primary-on-background: #646464;

  --mdc-typography-font-family: "Open Sans Light", Roboto;
}

/* Fonts */
@font-face {
  font-family: 'Open Sans Regular';
  src: url('../fonts/OpenSans-Regular.woff');
}

@font-face {
  font-family: 'Open Sans Light';
  src: url('../fonts/OpenSans-Light.woff2');
}

body {
  font-size: calc(0.3vw + 0.7rem);
  background-color: #fff;
  font-family: "Open Sans Light";
  font-smooth: always;
}

/* Typography */
.mdc-typography, .mdc-button {
  font-family: "Open Sans Light";
  font-smooth: always;
}

/* Login window */
.login-section {
  padding: 0px;
  border: 1px solid rgba(0, 0, 0, .2);
}

.form-wrapper, #sidebar {
  padding: 1vh 2vw 2vh 2vw;
}

/* Title */
.text-center {
  font-size: calc(1vw + 0.75rem);
  font-weight: lighter;
}

/* Layout */
#main-content,
.mdc-card,
.login-section,
.form-wrapper {
  width: 80% !important;
  max-width: none !important;
}

div#content, #main-content {
  margin: 3vh 0 !important;
}

div#content, .mdc-card {
  box-shadow: none !important;
}

/* FIX SCROLL CAS 7.3 */
.mdc-drawer-app-content {
  display: block;
  height: 100%;
  overflow-y: auto !important;
  overflow-x: hidden;
}

.mdc-top-app-bar--fixed-adjust {
  padding-top: 0;
}

/* Application header on login */
#serviceui {
  background-color: var(--cas-theme-primary);
  color: #fff;
  padding: 1rem;
}

#serviceui p, #serviceui h5 {
  margin: .3rem 0;
}

#serviceui h5 {
  font-size: calc(1vw + 0.75rem);
}

#serviceui img, #serviceui i {
  margin-right: 2rem;
  max-width: 128px;
}

/* Login button full width */
#loginForm.login-section.login-form .mdc-button[type=submit] {
  width: 100%;
}

/* Logo */
.cas-logo {
  min-width: 60px;
  margin: 5% 0;
}

/* Brand */
.cas-brand {
  display: table-cell;
  vertical-align: middle;
  margin-left: 10% !important;
  font-size: larger;
  font-weight: bold;
  text-align: center;
}

/* Top Bar */
.mdc-top-app-bar {
  display: inline-table;
  margin: auto 0;
  position: initial;
}

.mdc-top-app-bar__row {
  min-height: 90px !important;
  display: block;
}

/* Alerts */
.banner-danger {
  border-color: #f5c6cb;
  color: #b00020;
  background-color: #f8d7da;
}

.block-success, .alert-success {
  background-color: #eeffee !important;
  color: var(--cas-theme-secondary);
}

/* Buttons */
.mdc-button--raised {
  border-radius: 4px !important;
  height: auto;
  min-height: 36px;
}

.mdc-drawer__content .mdc-button--raised {
  margin-left: 15px;
  margin-right: 20px;
}

.mdc-button--raised:disabled {
  opacity: .8;
  color: darkgrey;
}

/* Text fields */
.mdc-text-field--focused {
  background-color: #D8FFD7 !important;
}

.mdc-floating-label:not(.mdc-floating-label--float-above) {
  color: black !important;
  background-color: #fff;
  left: 4px;
  padding: 0 5px;
}

#fm1,
.cas-field,
.form-group {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
}

.mdc-text-field,
.mdc-text.field--outlined,
.mdc-text-field__input,
.form-control,
input[type="text"],
input[type="password"],
input[name="token"] {
  display: flex !important;
  width: 100% !important;
  min-width: 100% !important;
  box-sizing: border-box !important;
  padding-left: max(2%, 5px) !important;
  padding-right: max(2%, 5px) !important;
  background-color: #fff;
}

#login-form-controls {
  width: 100% !important;
}

/* Table */
.mdc-data-table__cell {
  background-color: #fff;
  overflow-wrap: anywhere;
}

code, kbd, samp {
  font-family: "Open Sans Light";
}

/* WIA / x509 hidden */
#WIALogin, #WIALogout, #x509Login, #x509Logout {
  display: none;
}

/* Footer */
footer {
  background-color: var(--mdc-theme-text-primary-on-background) !important;
  height: 40px !important;
}

footer > .UPSfooter {
  width: 100%;
  padding: 0 30px;
  white-space: nowrap;
  color: #c7cace;
  font-size: 13px;
  line-height: 40px;
}

.UPSfooter a {
  padding: 0 1em;
  text-decoration: underline;
  color: #c7cace;
}

/* Mobile */
@media screen and (max-width: 800px),
       screen and (max-height: 700px) {

  div#content, #main-content {
    margin: 0 !important;
    padding: 0 !important;
  }

  .py-4 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  footer.cas-footer {
    display: none !important;
  }
}

/* Autofill fix */
*:-webkit-autofill,
*:-webkit-autofill:hover,
*:-webkit-autofill:focus,
*:-webkit-autofill:active,
*:autofill {
  -webkit-background-clip: text;
}