/* =========================================
   CloudLink Custom Theme for SOGo
   ========================================= */

/* --- Body / background --- */
html, body { height: 100%; margin: 0; background: #1e6be0 !important; }
main.view  { min-height: 100vh !important; background: #1e6be0 !important; }

/* --- Card: ocupa todo el viewport, sin bordes ni sombra rara --- */
md-content#loginContent {
  min-height: 100vh !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* ========= PANEL IZQUIERDO (branding) ========= */
.sg-logo {
  background: linear-gradient(160deg, #0d4bbf 0%, #1e6be0 100%) !important;
  min-height: 100vh !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 1 1 auto;
}
.cl-brand {
  text-align: center;
  color: #fff;
  padding: 48px 40px !important;
  user-select: none;
}
.cl-brand-icon {
  width: 80px;
  height: 80px;
  margin: 0 auto 24px;
  border: 2px solid rgba(255,255,255,0.55);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 36px;
  background: rgba(255,255,255,0.1);
}
.cl-brand-name {
  font-size: 40px;
  font-weight: 200;
  letter-spacing: 5px;
  color: #fff;
  margin-bottom: 12px;
}
.cl-brand-tagline {
  font-size: 11px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.65);
}

/* ========= PANEL DERECHO (formulario) ========= */
.sg-login.md-accent,
.sg-login.md-bg.md-accent,
md-content .sg-login {
  background: linear-gradient(160deg, #2979e8 0%, #3d8ef0 100%) !important;
  min-height: 100vh !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: stretch !important;
}
#login.sg-login-content {
  padding: 48px 40px !important;
  width: 100%;
  box-sizing: border-box;
}

/* --- Etiquetas flotantes: BLANCAS --- */
.sg-login md-input-container label,
.sg-login md-input-container .md-placeholder,
.sg-login md-input-container:not(.md-input-invalid) label {
  color: rgba(255,255,255,0.75) !important;
}
/* --- Texto escrito en inputs: BLANCO --- */
.sg-login md-input-container .md-input,
.sg-login md-input-container input {
  color: #ffffff !important;
  border-color: rgba(255,255,255,0.45) !important;
  caret-color: #fff;
}
/* --- Línea al hacer foco: blanca sólida --- */
.sg-login md-input-container.md-input-focused .md-input {
  border-color: rgba(255,255,255,0.9) !important;
}
/* --- Asterisco rojo (*) → blanco --- */
.sg-login md-input-container label .md-required {
  color: rgba(255,255,255,0.7) !important;
}
/* --- Íconos (person, lock, language): blancos --- */
.sg-login md-input-container > md-icon,
.sg-login [layout="row"] > md-icon,
.sg-login md-icon {
  color: rgba(255,255,255,0.85) !important;
}
/* --- Selector de idioma: texto blanco --- */
.sg-login md-select .md-select-value,
.sg-login .md-select-value,
.sg-login md-select-value * {
  color: rgba(255,255,255,0.85) !important;
}
.sg-login md-select .md-select-icon {
  color: rgba(255,255,255,0.7) !important;
}
/* --- "Recordar usuario": texto blanco --- */
.sg-login md-switch .md-label,
.sg-login .md-label,
.sg-login [layout="row"] span {
  color: rgba(255,255,255,0.85) !important;
}
/* --- Switch toggle: blanco/celeste --- */
md-switch.md-accent .md-thumb { background-color: #fff !important; }
md-switch.md-accent .md-bar   { background-color: rgba(255,255,255,0.4) !important; }

/* --- Botón FAB (→): blanco con ícono azul --- */
.md-button.md-default-theme.md-fab.md-accent,
.md-button.md-fab.md-accent,
.md-button.md-fab.md-accent.md-hue-2 {
  background-color: #ffffff !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.25) !important;
}
.md-button.md-fab.md-accent md-icon,
.md-button.md-fab.md-accent.md-hue-2 md-icon {
  color: #1e6be0 !important;
}
/* --- Botón info (ℹ): blanco semi-transparente --- */
.sg-login .md-icon-button md-icon { color: rgba(255,255,255,0.6) !important; }

/* --- Ripple de submit --- */
sg-ripple.md-accent.md-bg { background-color: #1e6be0 !important; }

/* --- Toolbar tras el login --- */
md-toolbar.md-default-theme:not(.md-menu-toolbar),
md-toolbar:not(.md-menu-toolbar) { background-color: #1e6be0 !important; }

/* --- Sidebar accent --- */
.md-default-theme .md-bg.md-accent { background-color: #1e6be0 !important; }

/* ========= SELECCIÓN DE EMAILS: azul en vez de verde ========= */
/* Item seleccionado en la lista de correos */
.md-default-theme .md-bg.md-primary,
.md-bg.md-primary,
.md-list-item-text.md-bg.md-primary,
md-list-item.sg-mail-list-selected,
.sg-mail-list-item.sg-mail-list-selected,
[class*="selected"].md-bg {
  background-color: #2979e8 !important;
}

/* Fuerza cualquier fondo verde/teal en listas a azul */
.md-default-theme md-list .md-active,
.md-list .md-active {
  background-color: #2979e8 !important;
}

/* Texto blanco sobre item seleccionado */
.md-bg.md-primary *,
.md-bg.md-primary {
  color: #ffffff !important;
}

/* Primary color buttons/elements → azul */
.md-button.md-default-theme.md-primary,
.md-button.md-primary {
  color: #2979e8 !important;
}
.md-button.md-default-theme.md-primary.md-raised,
.md-button.md-primary.md-raised {
  background-color: #2979e8 !important;
}

/* Override del teal/verde del tema por defecto → azul */
.md-default-theme .md-bg.md-accent,
.md-bg.md-accent {
  background-color: #2979e8 !important;
}

/* ========= CORREO SELECCIONADO: azul exacto ========= */
/* Email seleccionado en la lista (clase exacta del template) */
.md-default-theme.md-accent.md-bg.md-hue-2,
.md-accent.md-bg.md-hue-2,
[class*="md-accent"][class*="md-bg"][class*="md-hue-2"] {
  background-color: #2979e8 !important;
  color: #ffffff !important;
}
.md-default-theme.md-accent.md-bg.md-hue-2 *,
.md-accent.md-bg.md-hue-2 * {
  color: #ffffff !important;
}

/* Carpeta seleccionada en sidebar */
.md-bg.sg-selected,
.sg-selected.md-bg {
  background-color: rgba(41,121,232,0.18) !important;
}

/* ========= TABS: subrayado azul en vez de verde ========= */
md-ink-bar,
.md-default-theme md-ink-bar {
  background-color: #2979e8 !important;
  color: #2979e8 !important;
}
/* Texto del tab activo */
md-tabs md-tab.md-active,
.md-default-theme md-tabs md-tab.md-active,
md-tabs.md-default-theme md-tab.md-active {
  color: #2979e8 !important;
}
md-tabs md-tab.md-active md-icon,
.md-default-theme md-tabs md-tab.md-active md-icon {
  color: #2979e8 !important;
}

/* ========= CALENDARIO: colores verdes → azul ========= */
/* Número del día de hoy (en vista semana/mes) */
[ui-view=calendars] .dayOfToday,
[ui-view=calendars] .dayOfToday .sg-calendar-tile-header > span,
[ui-view=calendars] .today,
[ui-view=calendars] [class*="today"] {
  color: #2979e8 !important;
}
/* Fondo del día de hoy en vista mes */
[ui-view=calendars] .monthView md-grid-tile.dayOfToday .sg-calendar-tile-header > span {
  background-color: #2979e8 !important;
  color: #fff !important;
}
/* Línea de hora actual (línea roja/coloreada) */
[ui-view=calendars] .currentTime,
[ui-view=calendars] [class*="current-time"],
[ui-view=calendars] .sg-timeline-now {
  background-color: #2979e8 !important;
  border-color: #2979e8 !important;
}

/* ========= PRIMARY COLOR global → azul ========= */
/* Cubre textos/links/bordes que quedan en verde/teal */
.md-default-theme .md-fg.md-primary,
.md-fg.md-primary,
.md-default-theme .md-color-primary,
.md-color-primary {
  color: #2979e8 !important;
}
.md-default-theme .md-bg.md-primary,
.md-bg.md-primary {
  background-color: #2979e8 !important;
}

/* Checkbox/radio activos */
md-checkbox.md-default-theme.md-checked .md-icon,
md-checkbox.md-checked .md-icon {
  background-color: #2979e8 !important;
}
md-radio-button.md-default-theme.md-checked .md-on,
md-radio-button.md-checked .md-on {
  background-color: #2979e8 !important;
}

/* Progress circular */
md-progress-circular.md-default-theme.md-accent path,
md-progress-circular.md-accent path {
  stroke: #2979e8 !important;
}