/* Executive vacation KPIs. Scoped to consultation cards; business controls keep their theme. */
#vacaciones #caeVacationDashboard .vac-cards {
  gap: 14px;
  margin: 18px 0;
}
#vacaciones #caeVacationDashboard .vac-card {
  --vac-accent: #304a68;
  appearance: none;
  background: #ffffff !important;
  background-image: none !important;
  color: #344054 !important;
  border: 1px solid #dce3eb !important;
  border-top: 3px solid var(--vac-accent) !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 8px rgba(24, 39, 58, .045) !important;
  outline: none !important;
  text-shadow: none !important;
  padding: 18px 20px 17px !important;
  min-height: 120px;
  text-align: left;
  transition: border-color .15s ease, background-color .15s ease;
}
#vacaciones #caeVacationDashboard .vac-card[data-vac-filter="SCHEDULE"] { --vac-accent: #397b79; }
#vacaciones #caeVacationDashboard .vac-card[data-vac-filter="DUE"] { --vac-accent: #a57a2c; }
#vacaciones #caeVacationDashboard .vac-card[data-vac-filter="OVERDUE"] { --vac-accent: #a65353; }
#vacaciones #caeVacationDashboard .vac-card > * {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
}
#vacaciones #caeVacationDashboard .vac-card > span {
  display: block;
  color: #475569 !important;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .045em;
  text-transform: uppercase;
}
#vacaciones #caeVacationDashboard .vac-card > strong {
  display: block;
  color: #152b45 !important;
  font-size: clamp(25px, 1.8vw, 32px);
  font-weight: 750;
  letter-spacing: -.035em;
  line-height: 1.18;
  margin: 10px 0 8px;
}
#vacaciones #caeVacationDashboard .vac-card > small {
  display: block;
  color: #526174 !important;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.45;
}
#vacaciones #caeVacationDashboard .vac-card[aria-pressed="true"] {
  background: #f5f8fc !important;
  border-color: #91a4bb !important;
  border-top-color: var(--vac-accent) !important;
}
#vacaciones #caeVacationDashboard .vac-card:hover { background: #f8fafc !important; }
#vacaciones #caeVacationDashboard .vac-card:focus-visible {
  outline: 2px solid #304a68 !important;
  outline-offset: 3px;
}
@media (max-width: 600px) {
  #vacaciones #caeVacationDashboard .vac-card { padding: 15px !important; min-height: 112px; }
}