/* ==========================================================
   TIKEA.PE UI V1 - LOGIN CLIENTE
   Replica el lenguaje visual del demo corporativo sin agregar
   lógica de demo ni alterar la autenticación del cliente.
   ========================================================== */
body:has(.container-login.tikea-client-login){
  min-height:100vh!important;
  margin:0!important;
  overflow-x:hidden!important;
  background:
    radial-gradient(circle at 8% 42%,rgba(100,79,235,.18) 0 17%,transparent 17.5%),
    radial-gradient(circle at 94% 12%,rgba(114,96,236,.20) 0 15%,transparent 15.5%),
    linear-gradient(135deg,#fbfaff 0%,#f5f3ff 54%,#eeebff 100%)!important;
}

.container-login.tikea-client-login{
  min-height:100vh!important;
  width:100%!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  grid-template-rows:auto!important;
  align-content:center!important;
  justify-content:center!important;
  gap:0!important;
  max-width:1180px!important;
  margin:0 auto!important;
  padding:48px 24px!important;
  background:transparent!important;
  color:#17203b!important;
  font-family:"Segoe UI",Inter,Arial,sans-serif!important;
  overflow:visible!important;
}
.container-login.tikea-client-login::before,
.container-login.tikea-client-login::after{display:none!important}

/* FORMULARIO: lado izquierdo */
.tikea-client-login .right-panel{
  grid-column:1!important;
  grid-row:1!important;
  min-height:650px!important;
  padding:55px 54px 46px!important;
  display:flex!important;
  align-items:center!important;
  background:#fff!important;
  border:1px solid rgba(84,68,183,.12)!important;
  border-right:0!important;
  border-radius:28px 0 0 28px!important;
  box-shadow:-22px 28px 70px rgba(55,45,117,.12)!important;
  position:relative!important;
  overflow:hidden!important;
}
.tikea-client-login .right-panel::before{
  content:"";
  position:absolute;
  width:250px;height:250px;
  left:-155px;bottom:-145px;
  border-radius:50%;
  background:rgba(103,87,217,.06);
}
.tikea-client-login .login-form{width:100%!important;max-width:500px!important;margin:auto!important;position:relative!important;z-index:2!important}

.tikea-platform-brand{
  display:flex;
  align-items:center;
  gap:14px;
  padding-bottom:23px;
  margin-bottom:27px;
  border-bottom:1px solid #eceaf4;
}
.tikea-platform-brand img{width:46px;height:46px;object-fit:contain}
.tikea-platform-brand-copy{display:flex;flex-direction:column;line-height:1.1}
.tikea-platform-brand-copy strong{font-size:25px;color:#17234a;font-weight:900;letter-spacing:.15px}
.tikea-platform-brand-copy small{margin-top:6px;color:#8b91aa;font-size:11px;font-weight:600}

.tikea-client-login .mobile-brand{display:none!important}
.tikea-client-login .login-header{margin-bottom:25px!important}
.tikea-client-login .login-header .form-kicker{
  display:inline-flex!important;
  align-items:center!important;
  margin:0 0 8px!important;
  color:#6757d9!important;
  font-size:11px!important;
  line-height:1!important;
  font-weight:900!important;
  text-transform:uppercase!important;
  letter-spacing:.55px!important;
}
.tikea-client-login .login-header h1{
  margin:0 0 8px!important;
  color:#17234a!important;
  font-size:29px!important;
  line-height:1.1!important;
  font-weight:900!important;
  letter-spacing:-.65px!important;
}
.tikea-client-login .login-header .subtitle{margin:0!important;color:#8088a3!important;font-size:14px!important}

.tikea-client-login .form-group{position:relative!important;margin-bottom:20px!important}
.tikea-client-login .form-group label{display:block!important;margin:0 0 7px!important;color:#263451!important;font-size:12px!important;font-weight:800!important}
.tikea-client-login .form-control-icon{
  position:absolute!important;
  left:17px!important;
  top:39px!important;
  z-index:4!important;
  color:#7783a5!important;
  font-size:14px!important;
}
.tikea-client-login .login-u input[type="text"],
.tikea-client-login .login-u input[type="password"]{
  width:100%!important;
  height:55px!important;
  padding:0 18px 0 48px!important;
  border:1px solid #d7dbeb!important;
  border-radius:12px!important;
  background:#fff!important;
  color:#182441!important;
  outline:none!important;
  box-shadow:0 2px 7px rgba(50,54,105,.025)!important;
  font-size:14px!important;
}
.tikea-client-login .login-u input::placeholder{color:#a0a7bd!important;opacity:1!important}
.tikea-client-login .login-u input:focus{border-color:#7764ed!important;box-shadow:0 0 0 4px rgba(98,73,238,.09)!important}
.tikea-client-login .login-button{
  width:100%!important;
  min-height:57px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:11px!important;
  margin-top:5px!important;
  border:0!important;
  border-radius:13px!important;
  background:linear-gradient(135deg,#5a43df 0%,#694ef2 55%,#5c43de 100%)!important;
  color:#fff!important;
  font-size:13px!important;
  font-weight:900!important;
  letter-spacing:.4px!important;
  text-transform:uppercase!important;
  box-shadow:0 15px 30px rgba(91,67,221,.25)!important;
  transition:.18s ease!important;
}
.tikea-client-login .login-button:hover{transform:translateY(-2px)!important;filter:brightness(1.035)!important;box-shadow:0 18px 34px rgba(91,67,221,.30)!important}
.tikea-client-login .verifica-sunat{margin-top:26px!important;padding-top:18px!important;border-top:1px solid #f0eef6!important;opacity:.7!important}
.tikea-client-login .access-security{margin:14px 0 0!important;text-align:center!important;color:#8a91a8!important;font-size:11px!important}
.tikea-client-login .access-security i{color:#6757d9!important}

/* CLIENTE: lado derecho */
.tikea-client-login .left-panel{
  grid-column:2!important;
  grid-row:1!important;
  min-height:650px!important;
  padding:54px 48px 44px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  color:#17203b!important;
  background:
    radial-gradient(circle at 96% 24%,rgba(116,99,238,.14) 0 19%,transparent 19.5%),
    radial-gradient(circle at 78% 84%,rgba(111,94,234,.10) 0 25%,transparent 25.5%),
    linear-gradient(145deg,#fbfaff 0%,#f2efff 54%,#faf9ff 100%)!important;
  border:1px solid rgba(88,73,201,.11)!important;
  border-left:1px solid #ebe9f7!important;
  border-radius:0 28px 28px 0!important;
  box-shadow:22px 28px 70px rgba(55,45,117,.13)!important;
  overflow:hidden!important;
  position:relative!important;
}
.tikea-client-login .login-decor{position:absolute!important;border-radius:50%!important;pointer-events:none!important}
.tikea-client-login .login-decor-one{width:260px!important;height:260px!important;right:-145px!important;top:145px!important;background:rgba(103,87,217,.07)!important}
.tikea-client-login .login-decor-two{width:190px!important;height:190px!important;left:-105px!important;bottom:-90px!important;background:rgba(103,87,217,.05)!important}
.tikea-client-login .brand-block{display:flex!important;align-items:center!important;gap:16px!important;margin-bottom:31px!important;position:relative!important;z-index:2!important}
.tikea-client-login .brand-logo-frame{
  width:74px!important;height:74px!important;flex:0 0 74px!important;
  display:grid!important;place-items:center!important;
  padding:9px!important;border:1px solid #dfdaf8!important;border-radius:20px!important;
  background:#fff!important;box-shadow:0 10px 24px rgba(86,70,186,.10)!important;
}
.tikea-client-login .brand-logo-frame img{max-width:100%!important;max-height:100%!important;object-fit:contain!important}
.tikea-client-login .brand-name{display:flex!important;flex-direction:column!important}
.tikea-client-login .brand-kicker{color:#6757d9!important;font-size:11px!important;font-weight:900!important;text-transform:uppercase!important;letter-spacing:.55px!important}
.tikea-client-login .brand-name h2{margin:7px 0 0!important;color:#17234a!important;font-size:24px!important;font-weight:900!important;letter-spacing:-.4px!important}
.tikea-client-login .hero-text{position:relative!important;z-index:2!important;text-align:left!important}
.tikea-client-login .hero-eyebrow{
  display:inline-flex!important;align-items:center!important;gap:8px!important;
  padding:7px 11px!important;margin-bottom:14px!important;border-radius:999px!important;
  background:#eeeaff!important;color:#5a47ce!important;font-size:10px!important;font-weight:900!important;text-transform:uppercase!important;letter-spacing:.45px!important
}
.tikea-client-login .descrih1tion{max-width:440px!important;margin:0 0 14px!important;color:#17234a!important;font-size:34px!important;line-height:1.06!important;font-weight:900!important;letter-spacing:-1px!important}
.tikea-client-login .description{max-width:455px!important;margin:0 0 23px!important;color:#6f7894!important;font-size:15px!important;line-height:1.55!important}
.tikea-client-login .login-benefits{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;margin:0 0 27px!important}
.tikea-client-login .login-benefits span{display:flex!important;align-items:center!important;gap:9px!important;color:#4b5573!important;font-size:13px!important;font-weight:650!important}
.tikea-client-login .login-benefits i{width:24px!important;height:24px!important;display:grid!important;place-items:center!important;border-radius:50%!important;background:#ece8ff!important;color:#6650de!important;font-size:10px!important}
.tikea-client-login .get-started{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:9px!important;
  min-height:48px!important;padding:11px 18px!important;border:1px solid #6757d9!important;border-radius:12px!important;
  background:#fff!important;color:#5a46cb!important;font-size:12px!important;font-weight:900!important;text-transform:uppercase!important;text-decoration:none!important;
  box-shadow:none!important;transition:.18s ease!important
}
.tikea-client-login .get-started:hover{background:#6757d9!important;color:#fff!important;transform:translateY(-1px)!important}
.tikea-client-login .get-started i{color:#20a66a!important}.tikea-client-login .get-started:hover i{color:#fff!important}

@media(max-width:900px){
  body:has(.container-login.tikea-client-login){overflow-y:auto!important}
  .container-login.tikea-client-login{display:block!important;max-width:650px!important;padding:24px 15px!important}
  .tikea-client-login .right-panel{min-height:auto!important;border:1px solid rgba(84,68,183,.12)!important;border-radius:24px!important;padding:38px 30px!important;box-shadow:0 22px 55px rgba(55,45,117,.13)!important}
  .tikea-client-login .left-panel{display:none!important}
  .tikea-client-login .mobile-brand{display:flex!important;justify-content:center!important;margin-bottom:18px!important}
  .tikea-client-login .mobile-brand img{max-width:90px!important;max-height:70px!important;object-fit:contain!important}
}
@media(max-width:480px){
  .container-login.tikea-client-login{padding:12px!important}
  .tikea-client-login .right-panel{padding:30px 20px!important;border-radius:20px!important}
  .tikea-platform-brand img{width:39px;height:39px}
  .tikea-platform-brand-copy strong{font-size:21px}
  .tikea-client-login .login-header h1{font-size:25px!important}
}

/* Lovely Chic: compatibilidad con controles conservados del login actual. */
.tikea-client-login .password-group{position:relative!important}
.tikea-client-login .password-group input{padding-right:52px!important}
.tikea-client-login .password-toggle{
  position:absolute!important;right:10px!important;top:47px!important;width:36px!important;height:36px!important;
  display:grid!important;place-items:center!important;border:0!important;border-radius:9px!important;background:transparent!important;
  color:#7d85a0!important;outline:none!important;z-index:5!important
}
.tikea-client-login .password-toggle:hover{background:#f2efff!important;color:#6757d9!important}
.tikea-client-login .brand-fallback{
  width:100%;height:100%;display:grid;place-items:center;border-radius:14px;background:#f1eeff;color:#6757d9;font-weight:900;font-size:28px
}
.tikea-client-login .mobile-brand .brand-fallback{width:58px;height:58px}


/* TIKEA UI V3 - iconos SVG robustos del login (sin dependencia de webfonts) */
.tikea-client-login .tikea-svg-icon,
.tikea-client-login .tikea-field-icon,
.tikea-client-login .tikea-password-eye,
.tikea-client-login .tikea-button-arrow,
.tikea-client-login .tikea-security-icon{
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.9!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  flex:0 0 auto!important;
}
.tikea-client-login .form-control-icon.tikea-field-icon{
  width:18px!important;
  height:18px!important;
  top:47px!important;
  left:17px!important;
  color:#7783a5!important;
}
.tikea-client-login .form-group:focus-within .tikea-field-icon{color:#6757d9!important}
.tikea-client-login .password-toggle .tikea-password-eye{width:19px!important;height:19px!important;color:#7d85a0!important}
.tikea-client-login .password-toggle.is-visible::after{
  content:"";
  position:absolute;
  width:22px;
  height:2px;
  border-radius:2px;
  background:currentColor;
  transform:rotate(-45deg);
  pointer-events:none;
}
.tikea-client-login .login-button .tikea-button-arrow{width:18px!important;height:18px!important;stroke-width:2.2!important}
.tikea-client-login .hero-eyebrow .tikea-svg-icon{width:14px!important;height:14px!important}
.tikea-client-login .login-benefits .tikea-benefit-icon{
  width:24px!important;height:24px!important;display:grid!important;place-items:center!important;
  border-radius:50%!important;background:#ece8ff!important;color:#6650de!important;flex:0 0 24px!important
}
.tikea-client-login .login-benefits .tikea-benefit-icon .tikea-svg-icon{width:13px!important;height:13px!important;stroke-width:2.4!important}
.tikea-client-login .get-started .tikea-svg-icon{width:18px!important;height:18px!important;color:#20a66a!important}
.tikea-client-login .get-started:hover .tikea-svg-icon{color:#fff!important}
.tikea-client-login .access-security{display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important}
.tikea-client-login .access-security .tikea-security-icon{width:14px!important;height:14px!important;color:#6757d9!important;stroke-width:2!important}
