:root {
  --primary-100: #e6e6ff;
  --primary-200: #b3b3ff;
  --primary-500: #0134d4;
  --primary-600: #0000e6;
  --primary-700: #0000cc;
  --primary-950: #000066;
  --secondary-500: #6c757d;
  --secondary-700: #495057;
  --success-500: #198754;
  --success-700: #146c43;
  --danger-500: #dc3545;
  --danger-700: #b02a37;
  --warning-500: #ffc107;
  --warning-700: #cc9a06;
  --info-500: #0dcaf0;
  --info-700: #0aa2c0;
  --text: #6c757d;
  --dark: #212529;
  --white: #ffffff;
}

.alert {
  padding: 0.625rem 0.75rem;
  font-size: 14px;
  border-radius: 0.4rem;
}

.alert-dismissible .btn-close {
  font-size: 10px;
}

.custom-alert-one {
  display: flex;
  align-items: center;
  padding: 0.5rem 1rem;
  padding-left: 27px;
  font-size: 14px;
  border-color: var(--primary-100);
  position: relative;
}

.custom-alert-one::after {
  content: "";
  position: absolute;
  width: 4px;
  height: calc(100% - 30px);
  top: 15px;
  left: 12px;
  z-index: 1;
  border-radius: 1rem;
}

.custom-alert-one i {
  font-size: 1.25rem;
  margin-right: 0.5rem;
}

.custom-alert-one.alert-primary {
  color: var(--primary-500);
  background-color: transparent;
}

.custom-alert-one.alert-primary::after {
  background-color: var(--primary-700);
}

.custom-alert-one.alert-danger {
  color: var(--danger-500);
  background-color: transparent;
}

.custom-alert-one.alert-danger::after {
  background-color: var(--danger-700);
}

.custom-alert-one.alert-warning {
  color: var(--warning-500);
  background-color: transparent;
}

.custom-alert-one.alert-warning::after {
  background-color: var(--warning-700);
}

.custom-alert-one.alert-success {
  color: var(--success-500);
  background-color: transparent;
}

.custom-alert-one.alert-success::after {
  background-color: var(--success-700);
}

.custom-alert-one.alert-info {
  color: var(--info-500);
  background-color: transparent;
}

.custom-alert-one.alert-info::after {
  background-color: var(--info-700);
}