/* Login */
@media (min-width: 900px) {
  html.bp-login-page .css-5f90nq { display: none !important; }
}
@media (min-width: 1200px) {
  html.bp-login-page .css-ndq2on { max-width: 500px !important; }
}
@media (min-width: 1200px) {
  html.bp-login-page .css-f3ykgk {
    flex-basis: 100% !important;
    -webkit-box-flex: 0 !important;
    flex-grow: 0 !important;
    max-width: 100% !important;
  }
}

html.bp-login-page #button_undefined {
  background-color: #3339af !important;
  font-size: 16px !important;
  line-height: 2.75rem !important;
  width: 100% !important;
  border-radius: 7px !important;
  transform: none !important;
}

html.bp-login-page p.css-oagvcs { display: none !important; }
html.bp-login-page p.css-97j3yy { display: none !important; }

html.bp-login-page .css-mlgn6s {
  position: relative;
  padding-top: 60px;
  font-size: 0 !important;
}
html.bp-login-page .css-mlgn6s::before {
  content: "";
  display: block;
  width: 120px;
  height: 60px;
  background-image: url("https://chat.bizplin.com/bizplin/img/logo.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

html.bp-login-page .css-1dvqprr { line-height: 2.6rem !important; }


/*login*/
html.bp-login-page [data-bp-login-form="1"] {
  max-width: 520px;
  margin-inline: auto;
}

html.bp-login-page [data-bp-login-submit="1"] {
  background-color: #3339af !important;
  border-radius: 8px !important;
  width: 100% !important;
  min-height: 44px !important;
  text-transform: none !important;
}


/*aqui empeiza lo nuevo Bizplin*/
/* Switch idioma en login */
#bp-lang-switcher {
  position: fixed;
  top: 16px;
  right: 16px;
  z-index: 99999;
  font-family: Roboto, sans-serif;
}

#bp-lang-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #d0d5dd;
  background: #fff;
  color: #111827;
  border-radius: 10px;
  padding: 8px 10px;
  cursor: pointer;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
}

#bp-lang-btn img {
  width: 18px;
  height: 18px;
  object-fit: contain;
}

#bp-lang-menu {
  margin-top: 8px;
  border: 1px solid #e5e7eb;
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
}

#bp-lang-menu button {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: #fff;
  padding: 10px 12px;
  cursor: pointer;
}

#bp-lang-menu button:hover {
  background: #f3f4f6;
}


/*login*/

/* ===== LOGIN RESPONSIVE CORRECTO ===== */

/* Desktop */
@media (min-width: 1200px){
  html.bp-login-page .bp-left-content{
    padding: 36px 28px 48px clamp(120px, 10vw, 200px) !important;
    max-width: none !important;
  }

  /* Panel derecho */
  html.bp-login form{
    width: min(520px, 100%) !important;
    max-width: 520px !important;
    margin: 0 auto !important;
  }

  html.bp-login .MuiFormControl-root,
  html.bp-login button[type="submit"],
  html.bp-login #button_undefined,
  html.bp-login .MuiButton-contained{
    width: 100% !important;
  }
}

/* Laptop */
@media (min-width: 992px) and (max-width: 1199px){
  html.bp-login-page .bp-left-content{
    padding: 30px 22px 40px 90px !important;
    max-width: none !important;
  }
}

/* Tablet */
@media (min-width: 768px) and (max-width: 991px){
  html.bp-login-page .bp-left-content{
    padding: 24px 18px 28px 40px !important;
  }
}

/* Móvil */
@media (max-width: 767px){
  html.bp-login-page .bp-left-content{
    padding: 18px 14px 22px 14px !important;
  }
}


/*-----*/

/*Img para el login*/
#bp-left-brand-img{
  display:block;
  width:500px;
  max-width:90%;
  height:auto;
  margin:0 0 22px 0;
}

/* ===== LOGIN: quitar altura extra / sin scroll del navegador en desktop ===== */
@media (min-width: 900px){
  html.bp-login-page,
  html.bp-login-page body,
  html.bp-login-page #root{
    height: 100vh !important;
    overflow: hidden !important;
  }

  /* Columna izquierda */
  
  
  /*html.bp-login-page .bp-left-content{*/
  /*  box-sizing: border-box !important;*/
  /*  height: 100vh !important;*/
  /*  max-height: 100vh !important;*/
  /*  padding: 14px 24px 14px clamp(48px, 6vw, 130px) !important;*/
  /*  overflow: hidden !important;*/
  /*}*/

  /* Columna derecha */
  html.bp-login-page .bp-login-right{
    box-sizing: border-box !important;
    height: 100vh !important;
    max-height: 100vh !important;
    padding: 14px 24px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow-y: auto !important;
  }

  /* formulario más compacto */
  html.bp-login-page .bp-login-right form{
    margin: 0 !important;
  }

  html.bp-login-page .bp-login-right .MuiFormControl-root{
    margin-bottom: 12px !important;
  }
}

/* móvil/tablet: comportamiento normal */
@media (max-width: 899px){
  html.bp-login-page,
  html.bp-login-page body,
  html.bp-login-page #root{
    height: auto !important;
    overflow: auto !important;
  }
}



/*-----*/


/* Ajuste de separación: Correo electrónico / Contraseña */
html.bp-login .MuiFormControl-root{
  margin-bottom: 18px !important;
}

html.bp-login .MuiFormControl-root .MuiInputLabel-root,
html.bp-login .MuiFormControl-root .MuiInputLabel-root.MuiInputLabel-shrink{
  position: static !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  display: block !important;
  margin: 0 0 10px 14px !important;
  line-height: 1.2 !important;
  pointer-events: none !important;
  z-index: 2 !important;
}

html.bp-login .MuiFormControl-root > label + .MuiInputBase-root{
  margin-top: 0 !important;
}

/*-----*/

/* ===== RESCATE LOGIN (sin romper layout) ===== */

/* 0) solo en login */
html.bp-login-page,
html.bp-login-page body {
  margin: 0 !important;
  padding: 0 !important;
}

/* 1) neutraliza reglas viejas que encogieron el layout */
html.bp-login-page #root > div:first-child,
html.bp-login-page #root > div:nth-child(2),
html.bp-login-page #root > .MuiBox-root {
  width: auto !important;
  max-width: none !important;
  min-height: auto !important;
  flex: 0 1 auto !important;
}

/* 2) ESTE es el blanco de arriba/izquierda */
html.bp-login-page #root.bp-left-content {
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

/* 3) fondo izquierdo exacto que pediste */
html.bp-login-page #root.bp-left-content .css-1oj0swc,
html.bp-login-page #root.bp-left-content #bp-left-panel {
  background: linear-gradient(135deg, #f8fbff 0%, #e3f2fd 40%, #e0f7f4 100%) !important;
  background-color: transparent !important;
}

/* 4) mantiene tu separación interna izquierda */
html.bp-login-page #root.bp-left-content #bp-left-content {
  padding: 14px 24px 14px clamp(70px, 7vw, 150px) !important;
  box-sizing: border-box !important;
}

/*-----*/

/* Despegar contenido izquierdo del borde (claro + oscuro) */
html.bp-login-page #root.bp-left-content > .MuiBox-root > .MuiBox-root:first-child,
html.bp-login-page #root.bp-left-content > .MuiBox-root:first-child,
html.bp-login-page #bp-left-panel {
  padding: 36px 0 48px 200px !important;
  box-sizing: border-box !important;
}

/* Responsive */
@media (max-width: 1600px) {
  html.bp-login-page #root.bp-left-content > .MuiBox-root > .MuiBox-root:first-child,
  html.bp-login-page #root.bp-left-content > .MuiBox-root:first-child,
  html.bp-login-page #bp-left-panel { padding-left: 170px !important; }
}
@media (max-width: 1366px) {
  html.bp-login-page #root.bp-left-content > .MuiBox-root > .MuiBox-root:first-child,
  html.bp-login-page #root.bp-left-content > .MuiBox-root:first-child,
  html.bp-login-page #bp-left-panel { padding-left: 140px !important; }
}
@media (max-width: 1200px) {
  html.bp-login-page #root.bp-left-content > .MuiBox-root > .MuiBox-root:first-child,
  html.bp-login-page #root.bp-left-content > .MuiBox-root:first-child,
  html.bp-login-page #bp-left-panel { padding-left: 110px !important; }
}
@media (max-width: 899px) {
  html.bp-login-page #root.bp-left-content > .MuiBox-root > .MuiBox-root:first-child,
  html.bp-login-page #root.bp-left-content > .MuiBox-root:first-child,
  html.bp-login-page #bp-left-panel { padding: 14px 16px !important; }
}

/*-----*/

/* Margen responsive del bloque izquierdo (imagen + bienvenida) */
html.bp-login-page .bp-hero-box {
  position: relative;
  z-index: 1;
  margin: 36px 0 30px 200px !important;
}

@media (max-width: 1600px) {
  html.bp-login-page .bp-hero-box { margin-left: 170px !important; }
}
@media (max-width: 1366px) {
  html.bp-login-page .bp-hero-box { margin-left: 140px !important; }
}
@media (max-width: 1200px) {
  html.bp-login-page .bp-hero-box { margin-left: 110px !important; }
}
@media (max-width: 899px) {
  html.bp-login-page .bp-hero-box { margin: 14px 0 20px 16px !important; }
}