/* ================================================ */
/* EPM - Custom ThingsBoard Login                   */
/* ================================================ */

/* --- Fondo general --- */
body.tb-default {
  background-color: #F5F5F5 !important;
  background-image: none !important;
}

/* --- Contenedor de login --- */
.tb-login-content {
  background: #F5F5F5 !important;
  align-items: center !important;
  justify-content: center !important;
}

/* --- Card principal --- */
mat-card.mat-mdc-card {
  background-color: #FFFFFF !important;
  border: 1px solid rgba(0,166,80,0.2) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 24px rgba(0,0,0,0.08) !important;
  min-width: 400px !important;
}

/* --- Logo centrado --- */
tb-logo {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin-bottom: 8px !important;
}

tb-logo a {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

img[aria-label='logo'],
img[alt='Logo'] {
  max-height: 80px !important;
  width: auto !important;
  display: block !important;
  margin: 0 auto !important;
}

/* --- Título --- */
.title {
  color: #1A1A1A !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  letter-spacing: 0.5px !important;
  text-align: center !important;
}

/* --- Inputs --- */
.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-notched-outline__leading,
.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-notched-outline__notch,
.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-notched-outline__trailing {
  border-color: rgba(0,166,80,0.4) !important;
}

.mdc-text-field--outlined:not(.mdc-text-field--disabled):hover .mdc-notched-outline__leading,
.mdc-text-field--outlined:not(.mdc-text-field--disabled):hover .mdc-notched-outline__notch,
.mdc-text-field--outlined:not(.mdc-text-field--disabled):hover .mdc-notched-outline__trailing {
  border-color: #00A650 !important;
}

.mat-mdc-input-element {
  color: #1A1A1A !important;
}

.mdc-floating-label {
  color: rgba(0,0,0,0.5) !important;
}

.mat-icon {
  color: rgba(0,166,80,0.8) !important;
}

/* --- Botón principal --- */
.mdc-button--unelevated.mat-accent,
.mat-mdc-unelevated-button.mat-accent {
  background-color: #00A650 !important;
  border-radius: 6px !important;
  letter-spacing: 1px !important;
  font-weight: 600 !important;
  height: 44px !important;
}

/* --- Link olvidaste contraseña --- */
.tb-reset-password .mdc-button__label {
  color: #00A650 !important;
  font-size: 12px !important;
}

/* --- Línea decorativa superior --- */
mat-card.mat-mdc-card::before {
  content: '' !important;
  display: block !important;
  height: 3px !important;
  background: linear-gradient(90deg, #8DC63F, #00A650) !important;
  border-radius: 12px 12px 0 0 !important;
  margin: -1px -1px 0 -1px !important;
}