/* Helvetia brand utility classes for application views
   (components, dashboard, inicio, modulos, usuario).
   Replaces color-only inline styles so colors live in CSS, not markup. */

/* --- Modal / alert headers --- */
.hv-modal-header-info {
  background-color: #000d6e;
  color: #fff;
}
.hv-modal-header-danger {
  background-color: #ea1800;
  color: #fff;
}
.hv-modal-header-success {
  background-color: #158841;
  color: #fff;
}
.hv-modal-close {
  color: #fff;
}

/* --- Modal / alert body text --- */
.hv-modal-body-text {
  font-weight: 300;
  color: #000000;
  text-align: justify;
  font-size: 115%;
}
.hv-modal-body-muted {
  font-weight: 400;
  color: #000d6e;
  text-align: justify;
}
.hv-alert-strong {
  background-color: #ea1800;
  color: #fff;
}
.hv-alert-danger-inline {
  background-color: #ea1800;
  border: 1px solid #99172d;
  color: #fff;
}

/* --- Login / alta / otp / recordar input-group icon addons --- */
.hv-input-icon {
  background-color: #000d6e;
  color: #fff;
  padding-right: 10px;
}
.hv-input-icon-bordered {
  background-color: #000d6e;
  color: #fff;
  padding-right: 10px;
  border: 1px solid #000d6e;
}
.hv-input-border {
  border: 1px solid #000d6e;
}

/* --- Neutral text/colors moved out of inline styles --- */
.hv-text-black {
  color: #000000;
}
.hv-text-white {
  color: #ffffff;
}
.hv-text-muted-link {
  text-decoration: none;
  font-weight: 300;
}
.hv-input-readonly-bg {
  background-color: #ededed;
}

/* --- Dashboard service cards --- */
.hv-icon-brand {
  color: #000d6e;
}
.hv-btn-accent {
  background-color: #00b28f;
  color: #fff !important;
}

.hv-btn-accent:hover {
  background-color: #1b5951 !important;
  color: #fff !important;
}

.hv-btn-grey {
  background-color: #adadad;
  color: #fff !important;
}

.hv-btn-grey:hover {
  background-color: #797777 !important;
  color: #fff !important;
}

/* --- Generic icon cards (pastel background + brand SVG icon) --- */
.generic-icon-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0px;
  width: 100%;
  height: 100%;
  min-height: 120px;
  padding: 20px 12px;
  border: none;
  border-radius: 16px;
  text-align: center;
}
.generic-icon-card img {
  width: 48px;
  height: 48px;
}
.generic-icon-card .generic-icon-label {
  font-weight: 700;
  font-size: 105%;
}
.generic-icon-card-green {
  background-color: #e5f9f2;
}
.generic-icon-card-green .generic-icon-label {
  color: #1b5951;
}
.generic-icon-card-purple {
  background-color: #f1eefe;
}
.generic-icon-card-purple .generic-icon-label {
  color: #6c2273;
}
.generic-icon-card-yellow {
  background-color: #fff6e0;
}
.generic-icon-card-yellow .generic-icon-label {
  color: #b24a00;
}

/* --- App chrome surfaces --- */
.hv-sidenav-bg {
  background: #000d6e !important;
}
.hv-sidenav-box-bg {
  min-height: 82vh;
}
.hv-avatar-border {
  border: 2px solid #000d6e !important;
}
.hv-card-title-banner {
  background-color: #000d6e;
  color: #fff;
  font-size: 120%;
  padding-top: 15px;
  padding-bottom: 15px;
}

/* --- Bootstrap semantic classes aligned to the Helvetia palette ---
   Every value below is one of the exact swatches from the brand guide
   (Blue, White, the four primary families and their Tints, and the
   Success/Warning/Danger alert colors). Hover/active states reuse an
   official Tint of the same color instead of an invented shade. */
.btn {
  transition:
    background-color 0.3s,
    color 0.3s,
    border-color 0.3s;
  transition-delay: 0.05s;
}
.btn-sm {
  padding: 5px 8px;
}
.btn-primary {
  background-color: #000d6e !important;
  font-weight: 600;
  border: 1px solid #000d6e !important;
  color: #ffffff !important;
}
.btn-primary:hover,
.btn-primary:active {
  background-color: #0014aa !important;
  border: 1px solid #0014aa !important;
  color: #ffffff !important;
  box-shadow: none;
}
.btn-secondary {
  background-color: white !important;
  font-weight: 600;
  border: 1px solid #000d6e !important;
  color: #000d6e !important;
}
.btn-secondary:hover,
.btn-secondary:active {
  background-color: #e5f1fe !important;
  border: 1px solid #0014aa !important;
  color: #0014aa !important;
  box-shadow: none;
}
.btn-success {
  background-color: #00b28f;
  border-color: #00b28f;
  color: #fff;
}
.btn-success:hover,
.btn-success:focus,
.btn-success:active {
  background-color: #1b5951 !important;
  border-color: #1b5951 !important;
  color: #fff !important;
}
.btn-warning {
  background-color: #fae052;
  border-color: #fae052;
  color: #000d6e;
}
.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active {
  background-color: #fa9319 !important;
  border-color: #fa9319 !important;
  color: #fff !important;
}
.btn-danger {
  background-color: #ea1800;
  border-color: #ea1800;
  color: #fff;
}
.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active {
  background-color: #99172d !important;
  border-color: #99172d !important;
  color: #fff !important;
}
.btn-dark {
  background-color: #1b5951;
  border-color: #1b5951;
  color: #fff;
}
.btn-dark:hover,
.btn-dark:focus,
.btn-dark:active {
  background-color: #94e3d4 !important;
  border-color: #94e3d4 !important;
  color: #000d6e !important;
}

.text-primary {
  color: #000d6e !important;
}
.text-success {
  color: #158841 !important;
}
.text-warning {
  color: #b24a00 !important;
}
.text-danger {
  color: #ea1800 !important;
}

.alert-warning {
  background-color: #ffecbc;
  border-color: #ffbe1a;
  color: #000d6e;
}
.alert-secondary {
  background-color: #cbf2ec;
  border-color: #1b5951;
  color: #000d6e;
}
.badge-primary {
  background-color: #000d6e;
  color: #fff;
}
.badge-success {
  background-color: #158841;
  color: #fff;
}
.badge-warning {
  background-color: #ffbe1a;
  color: #000d6e;
}
.badge-danger {
  background-color: #ea1800;
  color: #fff;
}