/* Proxima Nova font faces */
@font-face {
  font-family: 'Proxima Nova';
  font-display: swap;
  src: url('../fonts/ProximaNova-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Proxima Nova';
  font-display: swap;
  src: url('../fonts/ProximaNova-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'Proxima Nova';
  font-display: swap;
  src: url('../fonts/ProximaNova-Semibold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'Proxima Nova';
  font-display: swap;
  src: url('../fonts/ProximaNova-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'Proxima Nova';
  font-display: swap;
  src: url('../fonts/ProximaNova-Black.woff2') format('woff2');
  font-weight: 900;
  font-style: normal;
}

:root {
  /* Primary */
  --tt-primary-light: #676088;
  --tt-primary: #342b60;
  --tt-primary-dark: #272048;
  /* Secondary */
  --tt-secondary-light: #fce6f2;
  --tt-secondary: #e4067e;
  --tt-secondary-dark: #ab055f;
  /* Accent */
  --tt-accent: #4dbed2;
  --tt-accent-dark: #43a6b8;
  --tt-accent-light: #edf9fb;
  /* Second accent */
  --tt-accent-second-light: #f7e7ee;
  --tt-accent-second: #aa1352;
  --tt-accent-second-dark: #800e3e;
  /* Third accent */
  --tt-accent-third-light: #eff8ed;
  --tt-accent-third: #62bb46;
  --tt-accent-third-dark: #315e23;
  /* Warning */
  --tt-warning-light: #fff1d6;
  --tt-warning: #ffc75a;
  --tt-warning-dark: #80642d;
  /* Danger */
  --tt-danger-light: #fad6dd;
  --tt-danger: #e95d77;
  --tt-danger-dark: #752e3b;
  /* Info */
  --tt-info-light: #c8d9eb;
  --tt-info: #92b4d8;
  --tt-info-dark: #1b4e84;
  /* Success */
  --tt-success-light: #d0efe3;
  --tt-success: #41bd90;
  --tt-success-dark: #277257;
  /* Grays */
  --tt-gray-100: #fbfbfc;
  --tt-gray-200: #f6f6f8;
  --tt-gray-300: #ededf2;
  --tt-gray-400: #dadae4;
  --tt-gray-500: #c9cbd8;
  --tt-gray-600: #9396b0;
  --tt-gray-700: #6e7184;
  --tt-gray-800: #4a4b58;
  --tt-gray-900: #25262c;
  --tt-light: #dadae4;
  --tt-dark: #4a4b58;
}

/* Typography */
html {
  font-size: 18px;
  position: relative;
  min-height: 100%;
}

body {
  font-family: 'Proxima Nova', Verdana, sans-serif;
  line-height: 1.5;
  margin-bottom: 0;
  color: var(--tt-gray-900);
  background-color: var(--tt-gray-200);
}

h1 { font-size: 1.75rem; line-height: 2.25rem; font-weight: 900; }
h2 { font-size: 1.625rem; line-height: 2rem; font-weight: 800; }
h3 { font-size: 1.5rem; line-height: 1.75rem; font-weight: 700; }
h4 { font-size: 1.25rem; line-height: 1.5rem; font-weight: 800; }
h5 { font-size: 1.125rem; line-height: 1.5rem; font-weight: 700; }
h6 { font-size: 1rem; line-height: 1.25rem; font-weight: 900; }

.table th {
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 700;
}

.table td {
  font-size: 0.875rem;
  line-height: 1.25rem;
}

a {
  color: var(--tt-secondary);
}

a:hover {
  color: var(--tt-secondary-dark);
}

a.navbar-brand {
  white-space: normal;
  text-align: center;
  word-break: break-all;
}

.btn-primary {
  color: #fff;
  background-color: var(--tt-primary);
  border-color: var(--tt-primary-dark);
}

.btn-primary:hover {
  color: #fff;
  background-color: var(--tt-primary-dark);
}

.btn-primary:active, .btn-primary:focus {
  color: #fff;
  background-color: var(--tt-primary-dark);
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  color: #fff;
  background-color: var(--tt-primary);
  border-color: var(--tt-primary-dark);
}

.border-top {
  border-top: 1px solid var(--tt-gray-300);
}

.border-bottom {
  border-bottom: 1px solid var(--tt-gray-300);
}

.box-shadow {
  box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
  font-size: 1rem;
  line-height: inherit;
}

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  white-space: nowrap;
  line-height: 60px;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem var(--tt-primary-light);
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--tt-gray-600);
  text-align: end;
}

.text-muted {
  color: var(--tt-gray-600) !important;
}

.form-label {
  color: var(--tt-dark);
}

.form-control {
  border-color: var(--tt-gray-300);
}

.card {
  border-color: var(--tt-gray-300);
}

.table {
  --bs-table-border-color: var(--tt-gray-300);
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

/* Sidebar active link */
.nav.flex-column .nav-link.active {
  background-color: transparent !important;
  color: var(--tt-secondary) !important;
  border-bottom: 3px solid var(--tt-secondary);
  border-radius: 0 !important;
  padding-bottom: calc(0.5rem - 3px);
}

/* Content tabs */
.nav-tabs {
  border-bottom-color: var(--tt-secondary);
}

.nav-tabs .nav-link.active {
  color: var(--tt-secondary) !important;
  border-bottom: 3px solid var(--tt-secondary) !important;
}

.nav-link:hover {
  opacity: 0.85;
}

/* Bootstrap semantic color overrides */
.btn-info {
  color: #fff;
  background-color: var(--tt-info);
  border-color: var(--tt-info-dark);
}
.btn-info:hover {
  color: #fff;
  background-color: var(--tt-info-dark);
}

.btn-success {
  color: #fff;
  background-color: var(--tt-success);
  border-color: var(--tt-success-dark);
}
.btn-success:hover {
  color: #fff;
  background-color: var(--tt-success-dark);
}

.btn-warning {
  color: var(--tt-gray-900);
  background-color: var(--tt-warning);
  border-color: var(--tt-warning-dark);
}
.btn-warning:hover {
  color: var(--tt-gray-900);
  background-color: var(--tt-warning-dark);
}

.btn-danger {
  color: #fff;
  background-color: var(--tt-danger);
  border-color: var(--tt-danger-dark);
}
.btn-danger:hover {
  color: #fff;
  background-color: var(--tt-danger-dark);
}

.alert-info {
  color: var(--tt-info-dark);
  background-color: var(--tt-info-light);
  border-color: var(--tt-info);
}

.alert-success {
  color: var(--tt-success-dark);
  background-color: var(--tt-success-light);
  border-color: var(--tt-success);
}

.alert-warning {
  color: var(--tt-warning-dark);
  background-color: var(--tt-warning-light);
  border-color: var(--tt-warning);
}

.alert-danger {
  color: var(--tt-danger-dark);
  background-color: var(--tt-danger-light);
  border-color: var(--tt-danger);
}

.badge {
  font-size: 0.875rem;
}

.badge.bg-info {
  background-color: var(--tt-info) !important;
}
.badge.bg-success {
  background-color: var(--tt-success) !important;
}
.badge.bg-warning {
  background-color: var(--tt-warning) !important;
  color: var(--tt-gray-900) !important;
}
.badge.bg-danger {
  background-color: var(--tt-danger) !important;
}