/* OnlineServer WHMCS alerts — readability + attention (2026-08-10)
   Loaded via includes/hooks/os_alert_readability.php so it applies on all
   client-area / cart pages and cache-busts on file change. */

.alert,
.alert.alert-lagom {
  font-size: 16px !important;
  line-height: 1.75 !important;
  font-weight: 600 !important;
  padding: 14px 16px !important;
  border-radius: 10px !important;
  border-width: 1px !important;
  border-style: solid !important;
}

.alert-sm,
.alert-xs,
.alert.alert-sm,
.alert.alert-xs {
  font-size: 15px !important;
  line-height: 1.7 !important;
  padding: 12px 14px !important;
  font-weight: 600 !important;
}

.alert .alert-body,
.alert .alert-body p,
.alert .alert-title,
.alert.alert-primary .alert-body,
.alert.alert-primary .alert-body p {
  font-size: inherit !important;
  line-height: inherit !important;
  font-weight: 600 !important;
  color: inherit !important;
}

.alert .alert-icon {
  font-size: 1.35em !important;
}

/* Lagom alert-primary uses a white card + thin accent — too easy to miss.
   Give typed primary alerts a tinted fill, stronger text, and a thick
   direction-aware accent bar (works for RTL Farsi checkout). */
.alert.alert-primary {
  box-shadow: none !important;
}

.alert.alert-primary:before {
  width: 6px !important;
}

.alert.alert-primary.alert-info,
.alert-info:not(.alert-primary) {
  background-color: #E0EBFF !important;
  border-color: #0158FE !important;
  color: #003CB2 !important;
  border-inline-start: 6px solid #0158FE !important;
}

.alert.alert-primary.alert-info:before {
  background: #0158FE !important;
}

.alert.alert-primary.alert-warning,
.alert-warning:not(.alert-primary) {
  background-color: #FFECD6 !important;
  border-color: #B84B00 !important;
  color: #8A3800 !important;
  border-inline-start: 6px solid #B84B00 !important;
}

.alert.alert-primary.alert-warning:before {
  background: #B84B00 !important;
}

.alert.alert-primary.alert-danger,
.alert-danger:not(.alert-primary) {
  background-color: #FAE1E2 !important;
  border-color: #CA202C !important;
  color: #8F151E !important;
  border-inline-start: 6px solid #CA202C !important;
}

.alert.alert-primary.alert-danger:before {
  background: #CA202C !important;
}

.alert.alert-primary.alert-success,
.alert-success:not(.alert-primary) {
  background-color: #D7F4DE !important;
  border-color: #1E7B32 !important;
  color: #145523 !important;
  border-inline-start: 6px solid #1E7B32 !important;
}

.alert.alert-primary.alert-success:before {
  background: #1E7B32 !important;
}

@media (max-width: 767.98px) {
  .alert,
  .alert.alert-lagom {
    font-size: 16px !important;
    line-height: 1.8 !important;
    padding: 16px !important;
  }
}
