/*
 * El acceso de Wowtels (Jan, 13-11-2026): tiene que verse distinto al de Hostelum, no solo llevar
 * otro logo. Hostelum es una pantalla partida, con un panel oscuro en degradado y ondas. Wowtels es
 * una sola columna centrada sobre el papel cálido de su web, con el resplandor azul arriba, el
 * saludo en serif y un formulario blanco y redondeado.
 *
 * Solo se carga en el dominio de Wowtels y todo cuelga de html[data-marca="wowtels"]: el acceso
 * de Hostelum no cambia. No cambia el HTML: las mismas piezas, recolocadas.
 */
html[data-marca="wowtels"] { --w-papel: #f8f5f2; --w-tinta: #0d1526; --w-tinta2: #5c667a; --w-linea: #e6e1db; --w-azul: #018bff; --w-azul2: #0073d6; --w-menta: #19debd; }
html[data-marca="wowtels"] body { font-family: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif; color: var(--w-tinta);
  background: radial-gradient(ellipse 85% 55% at 50% 0%, #cfe3ff 0%, #dcebff 42%, rgba(248, 245, 242, 0) 76%), var(--w-papel); background-attachment: fixed; }

/* Una columna: logo, saludo, formulario y, al final, el pie legal. */
html[data-marca="wowtels"] .login { display: flex; flex-direction: column; align-items: center; min-height: 100dvh; padding: 48px 20px 28px; gap: 0; }
html[data-marca="wowtels"] .login__brand,
html[data-marca="wowtels"] .brand__inner { display: contents; }
html[data-marca="wowtels"] .login__brand::before,
html[data-marca="wowtels"] .login__brand::after { content: none; animation: none; }
html[data-marca="wowtels"] .brand__asterisk,
html[data-marca="wowtels"] .brand__valores { display: none; }
html[data-marca="wowtels"] .logo-login { order: 1; width: 190px; max-width: 60%; height: auto; margin: 0 0 22px; }
html[data-marca="wowtels"] .brand__title { order: 2; font-family: "DM Serif Display", Georgia, serif; font-weight: 400; font-size: 44px; line-height: 1.05; letter-spacing: 0; color: var(--w-tinta); margin: 0; text-align: center; text-shadow: none; }
html[data-marca="wowtels"] .brand__title br { display: none; }
html[data-marca="wowtels"] .brand__lead { order: 3; color: var(--w-tinta2); font-size: 17px; margin: 10px 0 0; max-width: 34ch; text-align: center; text-shadow: none; }
html[data-marca="wowtels"] .login__form { order: 4; width: 100%; padding: 0; margin-top: 28px; background: none; box-shadow: none; display: block; }
html[data-marca="wowtels"] .brand__copy { order: 5; margin: 28px 0 0; color: #8a8580; font-size: 12px; text-align: center; text-shadow: none; }

/* La pantalla de entrar, al mínimo (Jan, 13-11-2026: «fuera» el saludo, la frase, el título y la explicación):
   solo el logo y el formulario. Se reconoce por el campo del código de alojamiento; las demás pantallas
   (recuperar contraseña, elegir alojamiento) conservan su título, que allí sí dice qué hay que hacer. */
html[data-marca="wowtels"] .login:has(#propertyField) :is(.brand__title, .brand__lead, .form__head) { display: none; }
html[data-marca="wowtels"] .login:has(#propertyField) .logo-login { margin-bottom: 6px; }
html[data-marca="wowtels"] .login:has(#propertyField) .form { margin-top: 0; }

/* El formulario: una tarjeta blanca, redondeada, sin sombras duras. */
html[data-marca="wowtels"] .form__box { width: min(440px, 100%); margin: 0 auto; background: #fff; border: 1px solid var(--w-linea); border-radius: 22px; box-shadow: 0 1px 2px rgba(13, 21, 38, .04), 0 18px 40px -24px rgba(13, 21, 38, .25); padding: 30px 28px; }
html[data-marca="wowtels"] .form__brand { display: none; }
html[data-marca="wowtels"] .form__title { font-size: 20px; font-weight: 600; letter-spacing: -0.01em; margin: 0 0 6px; }
html[data-marca="wowtels"] .form__subtitle { color: var(--w-tinta2); font-size: 15px; }
html[data-marca="wowtels"] .field__label { color: var(--w-tinta2); font-weight: 500; }
html[data-marca="wowtels"] .field__input--underline,
html[data-marca="wowtels"] select.field__input { border: 1px solid #cfc8c0; border-radius: 12px; padding: 12px 14px; background: #fff; font-size: 16px; }
html[data-marca="wowtels"] .field__input--underline:focus,
html[data-marca="wowtels"] .field__input--code:focus { outline: 3px solid rgba(1, 139, 255, .3); outline-offset: 1px; border-color: var(--w-azul); }
html[data-marca="wowtels"] .property-input .field__input--code { padding-left: 40px; }
html[data-marca="wowtels"] .property-input__icon { left: 14px; }
html[data-marca="wowtels"] .property-chip { border-radius: 14px; border-color: var(--w-linea); }
html[data-marca="wowtels"] .property-chip:hover { box-shadow: 0 0 0 3px rgba(1, 139, 255, .15); }
html[data-marca="wowtels"] .btn { background: var(--w-azul); border-color: transparent; border-radius: 12px; font-weight: 600; }
html[data-marca="wowtels"] .btn:hover { background: var(--w-azul2); filter: none; }
html[data-marca="wowtels"] .btn--google { background: #fff; color: var(--w-tinta); border-color: #cfc8c0; }
html[data-marca="wowtels"] .link { color: var(--w-azul2); font-weight: 500; }

/* El segundo factor y su alta: la misma tarjeta sobre el mismo papel. */
html[data-marca="wowtels"] body.login-page { padding: 0 20px; }
html[data-marca="wowtels"] .mfa-card { border: 1px solid var(--w-linea); border-radius: 22px; box-shadow: 0 1px 2px rgba(13, 21, 38, .04), 0 18px 40px -24px rgba(13, 21, 38, .25); }
html[data-marca="wowtels"] .mfa-title { font-family: "DM Serif Display", Georgia, serif; font-weight: 400; font-size: 26px; }
html[data-marca="wowtels"] .mfa-input:focus { border-color: var(--w-azul); box-shadow: 0 0 0 3px rgba(1, 139, 255, .2); }
html[data-marca="wowtels"] .mfa-btn { background: var(--w-azul); border-radius: 12px; }
html[data-marca="wowtels"] .mfa-btn:hover { background: var(--w-azul2); }

@media (max-width: 1024px) { html[data-marca="wowtels"] .login__brand { min-height: 0; } }
@media (max-width: 520px) {
  html[data-marca="wowtels"] .login { padding-top: 34px; }
  html[data-marca="wowtels"] .brand__title { font-size: 36px; }
  html[data-marca="wowtels"] .form__box { padding: 24px 20px; }
}