@charset "UTF-8";
:root {
  /* 60% - BASE / FONDO (Gris Muy Claro y Variaciones Minimalistas) */
  --bg-principal: #f8f9fa; /* Gris nieve muy claro para el fondo general */
  --bg-superficie: #ffffff; /* Blanco puro para tarjetas, contenedores y bloques */
  --bg-borde: #e9ecef; /* Gris suave para líneas divisorias y bordes de inputs */
  /* 30% - SECUNDARIO / TEXTO (Negro Carbón y Escala de Grises Corporativa) */
  --texto-principal: #1a1d20; /* Negro carbón de alta legibilidad para títulos y menús */
  --texto-secundario: #495057; /* Gris oscuro para textos de cuerpo y párrafos */
  --texto-mutado: #6c757d; /* Gris medio para marcas de tiempo, placeholders o notas */
  /* 10% - ACENTO / CONVERSIÓN (Turquesa y Violeta Tecnológicos) */
  --acento-turquesa: #00cec9; /* Turquesa brillante para enlaces, estados activos e iconos */
  --acento-violeta: #6c5ce7; /* Violeta profundo para botones principales de conversión (CTA) */
  /* ESTADOS DE INTERACCIÓN (Hover / Enfoque) */
  --acento-violeta-hover: #5b4bc3; /* Variación más oscura para el efecto hover en los botones */
  --acento-turquesa-hover: #00b3af; /* Variación para hover en enlaces o elementos interactivos */
}

body {
  max-width: var(--content-width);
  margin: 0 auto;
  background-color: var(--bg-principal);
  color: var(--texto-secundario);
}

a {
  color: var(--acento-turquesa);
  text-decoration: none;
}

#content {
  margin: 0 auto;
}

/* Cambiar el logotipo */
#login {
  color: var(--texto-secundario);
  padding: 5%;
  width: unset;
  max-width: 320px;
}
#login .wp-login-logo a {
  width: 100px;
  height: 100px;
  background-size: contain;
  background-repeat: no-repeat;
  border-radius: 50%;
}
#login #nav,
#login #backtoblog {
  text-align: center;
}
#login #nav a,
#login #backtoblog a {
  color: var(--acento-turquesa);
}

.wp-login-logo {
  border-radius: 8px;
}

/* Cambiar el fondo de la página y la caja del formulario */
body.login #login #loginform {
  background: var(--bg-superficie);
  border: 1px solid var(--bg-borde);
  border-radius: 8px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
  max-width: 300px;
}
body.login input[type=text],
body.login input[type=password] {
  border: 0.0625rem solid var(--bg-borde);
  background-color: var(--bg-superficie);
  color: var(--texto-principal);
}

/* Cambiar el botón principal */
#wp-submit {
  background: var(--acento-violeta);
  border-color: var(--bg-borde);
  text-shadow: none !important;
  box-shadow: none !important;
}
