/* ==========================================================
   KONECTA CRYPTOS
   LOGIN INLINE EN HEADER
   ========================================================== */

.head-actions{
  display:flex;
  align-items:center;
  gap:7px;
}


.kc-header-login-form{
  display:flex;
  align-items:center;
  gap:6px;
  margin:0;
}


.kc-header-login-form input{
  height:34px;

  padding:0 11px;

  border:
    1px solid rgba(110,170,220,.18);

  border-radius:9px;

  outline:none;

  background:
    rgba(5,16,27,.88);

  color:#f4f9fd;

  font-family:inherit;
  font-size:11px;

  transition:
    border-color .2s ease,
    background .2s ease,
    box-shadow .2s ease;
}


.kc-header-login-form input::placeholder{
  color:#73899d;
}


.kc-header-login-form input:focus{
  border-color:
    rgba(47,161,255,.55);

  background:
    rgba(8,23,38,.98);

  box-shadow:
    0 0 0 2px rgba(30,139,255,.07);
}


#kcHeaderLoginUser{
  width:150px;
}


#kcHeaderLoginPass{
  width:112px;
}


#kcHeaderLoginButton{
  height:34px;

  padding:0 15px;

  border:0;
  border-radius:9px;

  background:
    linear-gradient(
      135deg,
      #157ddf,
      #18b7ff
    );

  color:#fff;

  font-family:inherit;
  font-size:11px;
  font-weight:800;

  cursor:pointer;

  white-space:nowrap;
}


#kcHeaderLoginButton:hover{
  filter:brightness(1.08);
}


#kcHeaderLoginButton:disabled{
  opacity:.6;
  cursor:wait;
}


.kc-header-register{
  height:34px !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  padding:0 13px !important;

  white-space:nowrap;
}


#kcHeaderLoginStatus{
  display:none;

  position:absolute;

  top:calc(100% + 6px);
  right:0;

  max-width:280px;

  padding:7px 10px;

  border-radius:8px;

  border:
    1px solid rgba(255,92,111,.25);

  background:
    rgba(43,11,18,.96);

  color:#ffabb6;

  font-size:10px;

  box-shadow:
    0 12px 30px rgba(0,0,0,.35);

  z-index:5000;
}


.head-actions{
  position:relative;
}


#kcHeaderAccount{
  display:none;
  align-items:center;
  gap:7px;
}


#kcHeaderAccount .btn{
  height:34px !important;

  display:inline-flex !important;
  align-items:center !important;
}


/* ----------------------------------------------------------
   PANTALLAS MEDIANAS
   ---------------------------------------------------------- */

@media(max-width:1250px){

  #kcHeaderLoginUser{
    width:125px;
  }

  #kcHeaderLoginPass{
    width:100px;
  }

}


/* ----------------------------------------------------------
   TABLET / MOVIL
   No romper header actual
   ---------------------------------------------------------- */

@media(max-width:1000px){

  .kc-header-login-form{
    display:none !important;
  }

  .kc-header-register{
    display:inline-flex !important;
  }

}