/* =========================================================
   TECNOGANGA ERP - Login V2 Tecnológico
   Fondo azul/morado corporativo + paneles blancos
   ========================================================= */
:root{
  --tg-purple:#4B00B5;
  --tg-purple-2:#6516E8;
  --tg-purple-3:#24046B;
  --tg-orange:#FF6A1A;
  --tg-orange-2:#FF8741;
  --tg-blue:#071C4D;
  --tg-blue-2:#0D2A6F;
  --tg-white:#FFFFFF;
  --tg-text:#162033;
  --tg-muted:#66748A;
  --tg-line:#E8ECF5;
}
*{box-sizing:border-box}
html,body{min-height:100%;margin:0;}
body{
  font-family:"Inter","Segoe UI",Arial,sans-serif!important;
  color:#E8ECFF!important;
  overflow-x:hidden;
  background:
    radial-gradient(circle at 14% 18%, rgba(255,106,26,.30) 0, transparent 22%),
    radial-gradient(circle at 83% 16%, rgba(109,34,232,.38) 0, transparent 25%),
    radial-gradient(circle at 76% 88%, rgba(255,106,26,.20) 0, transparent 30%),
    linear-gradient(135deg,#06163A 0%, #08245F 34%, #24046B 68%, #4B00B5 100%)!important;
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.075) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.075) 1px, transparent 1px);
  background-size:46px 46px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.95), rgba(0,0,0,.40));
}
body:after{
  content:"";
  position:fixed;
  inset:-20%;
  pointer-events:none;
  background:
    linear-gradient(115deg, transparent 0 35%, rgba(255,255,255,.10) 46%, transparent 58% 100%),
    radial-gradient(circle at center, transparent 0 40%, rgba(0,0,0,.22) 100%);
  transform:rotate(-8deg);
}
.ep-login-page{
  min-height:100vh;
  width:min(1400px,100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:52px;
  position:relative;
  z-index:1;
}
.ep-brand-panel,.ep-form-panel{display:flex;align-items:center;justify-content:center;padding:38px;}
.ep-form-panel{justify-content:flex-start;}
.ep-brand-card,.ep-login-card{
  background:rgba(12,18,40,.88)!important;
  border:1px solid rgba(139,92,255,.25)!important;
  box-shadow:0 32px 90px rgba(0,0,0,.28)!important;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  position:relative;
  overflow:hidden;
}
.ep-brand-card:before,.ep-login-card:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 0% 0%, rgba(75,0,181,.10), transparent 36%),
    radial-gradient(circle at 100% 100%, rgba(255,106,26,.14), transparent 38%);
}
.ep-brand-card{
  width:min(610px,100%);
  min-height:560px;
  border-radius:34px;
  padding:38px;
}
.ep-login-card{
  width:min(520px,100%);
  border-radius:34px;
  padding:42px;
}
.ep-status-pill,.ep-card-header span{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:9px 16px;
  border-radius:999px;
  background:#FFF1E8!important;
  color:var(--tg-orange)!important;
  border:1px solid rgba(255,106,26,.28)!important;
  font-weight:1000;
  letter-spacing:.7px;
  text-transform:uppercase;
  font-size:12px;
  position:relative;
  z-index:1;
}
.ep-status-pill span{width:8px;height:8px;border-radius:50%;background:var(--tg-orange);box-shadow:0 0 16px rgba(255,106,26,.75);}
.ep-main-logo,.ep-card-header img{
  display:block;
  object-fit:contain;
  background:rgba(255,255,255,.95);
  border-radius:26px!important;
  border:1px solid rgba(75,0,181,.10);
  box-shadow:0 22px 48px rgba(75,0,181,.14);
  filter:none!important;
  overflow:hidden;
  position:relative;
  z-index:1;
}
.ep-main-logo{width:min(500px,100%);max-height:230px;margin:42px auto 34px;padding:22px;}
.ep-card-header img{width:320px;max-width:100%;max-height:170px;margin:0 auto 18px;padding:16px;}
.ep-brand-card h1,.ep-card-header h2{
  color:#E8ECFF!important;
  text-shadow:none!important;
  font-weight:1000!important;
  letter-spacing:-.9px;
  position:relative;
  z-index:1;
}
.ep-brand-card h1{font-size:36px;line-height:1.08;margin:0 0 14px;}
.ep-card-header{text-align:center;margin-bottom:26px;position:relative;z-index:1;}
.ep-card-header h2{margin:18px 0 8px;font-size:34px;}
.ep-brand-card p,.ep-card-header p{color:var(--tg-muted)!important;line-height:1.7;position:relative;z-index:1;}
.ep-brand-card p{font-size:16px;max-width:600px;margin:0 0 28px;}
.ep-features{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;position:relative;z-index:1;}
.ep-features div{
  padding:15px;
  border:1px solid rgba(139,92,255,.28)!important;
  border-radius:18px;
  background:linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.045))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 14px 30px rgba(0,0,0,.22)!important;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.ep-features div:hover{
  border-color:rgba(255,106,26,.45)!important;
  background:linear-gradient(145deg, rgba(255,106,26,.16), rgba(139,92,255,.10))!important;
  transform:translateY(-1px);
}
.ep-features strong{
  display:block;
  color:#FFFFFF!important;
  font-size:14px;
  margin-bottom:4px;
  text-shadow:0 1px 10px rgba(0,0,0,.30);
}
.ep-features small{
  display:block;
  color:#B8C2E0!important;
  font-weight:750;
}
.alert{border-radius:16px!important;border:0!important;box-shadow:none!important;position:relative;z-index:1;}
.alert-success{background:#EAF8EF!important;color:#166534!important;}
.alert-danger{background:#FEF2F2!important;color:#991B1B!important;}
.form-signin{position:relative;z-index:1;}
.form-signin label{display:block;color:#C9D4F2!important;margin:0 0 8px;font-weight:900;}
.ep-input-wrap{position:relative;margin-bottom:17px;}
.ep-input-wrap .glyphicon{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--tg-orange)!important;z-index:2;}
.form-signin .form-control{
  height:56px;
  padding:12px 15px 12px 46px;
  border-radius:18px!important;
  border:1px solid #DCE3F1!important;
  background:#F7FAFF!important;
  color:#162033!important;
  box-shadow:none!important;
  transition:.2s ease;
}
.form-signin .form-control:focus{
  background:#fff!important;
  border-color:#E8ECFF!important;
  box-shadow:0 0 0 4px rgba(75,0,181,.14)!important;
}
.btn.btn-signin{
  height:58px;
  margin-top:8px;
  border:0!important;
  border-radius:18px!important;
  background:linear-gradient(135deg,var(--tg-orange),var(--tg-orange-2))!important;
  color:#fff!important;
  font-weight:1000!important;
  letter-spacing:.2px;
  box-shadow:0 18px 40px rgba(255,106,26,.34)!important;
}
.btn.btn-signin:hover{transform:translateY(-1px);filter:saturate(1.07);}
.ep-footer-note{margin-top:24px;text-align:center;color:#E8ECFF!important;font-weight:1000;letter-spacing:.7px;position:relative;z-index:1;}
@media(max-width:980px){
  .ep-login-page{grid-template-columns:1fr;gap:0}
  .ep-form-panel{justify-content:center;padding-top:18px}
  .ep-brand-panel{padding-bottom:0}
  .ep-brand-card{min-height:auto}
  .ep-features{grid-template-columns:1fr}
}

.ep-brand-card p,.ep-login-card p,.ep-login-card label{color:#B8C2E0!important;} .ep-brand-card .feature-card{background:#161F36!important;color:#E8ECFF!important;border:1px solid rgba(255,255,255,.06)!important;} .ep-login-card input{background:#F7FAFF!important;color:#162033!important;border:1px solid rgba(139,92,255,.35)!important;} .ep-login-card{box-shadow:0 32px 90px rgba(0,0,0,.45)!important;} .ep-brand-card{box-shadow:0 32px 90px rgba(0,0,0,.45)!important;}

/* Corrección final Tecnoganga: tarjetas inferiores legibles en modo glass dark */
.ep-features div strong{
  color:#FFFFFF!important;
}
.ep-features div small{
  color:#B8C2E0!important;
}
.form-signin .form-control::placeholder{
  color:#9AA8C7!important;
  opacity:1;
}

/* =========================================================
   FIX DEFINITIVO - TARJETAS INFERIORES LOGIN TECNOGANGA
   Más específico para evitar estilos heredados/cacheados.
   ========================================================= */
body .ep-login-page .ep-brand-panel .ep-brand-card .ep-features > div{
  background:linear-gradient(145deg, rgba(18,28,62,.92), rgba(34,12,74,.76))!important;
  border:1px solid rgba(139,92,255,.38)!important;
  border-radius:18px!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 14px 34px rgba(0,0,0,.34),
    0 0 0 1px rgba(255,106,26,.04)!important;
  color:#FFFFFF!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
}
body .ep-login-page .ep-brand-panel .ep-brand-card .ep-features > div:hover{
  background:linear-gradient(145deg, rgba(75,0,181,.52), rgba(255,106,26,.20))!important;
  border-color:rgba(255,106,26,.56)!important;
}
body .ep-login-page .ep-brand-panel .ep-brand-card .ep-features > div > strong{
  color:#FFFFFF!important;
  opacity:1!important;
  text-shadow:0 2px 12px rgba(0,0,0,.45)!important;
}
body .ep-login-page .ep-brand-panel .ep-brand-card .ep-features > div > small{
  color:#C7D2FE!important;
  opacity:1!important;
}


/* Ajuste logo Tecnoganga - contenedor ovalado */
.ep-main-logo{
    border-radius:36px !important;
    overflow:hidden !important;
}
.ep-card-header img{
    border-radius:30px !important;
    overflow:hidden !important;
}
/* Marco que contiene el logo principal */
.ep-main-logo,
.ep-card-header img{
    background:#ffffff !important;
    padding:26px !important;
}


/* =========================================================
   FIX DEFINITIVO - TEXTO VISIBLE EN INPUTS LOGIN
   Usuario y contraseña deben verse oscuros sobre fondo claro.
   ========================================================= */
html body .ep-login-page .ep-login-card form.form-signin .ep-input-wrap input.form-control,
html body .ep-login-page .ep-login-card form.form-signin .ep-input-wrap input.form-control[type="text"],
html body .ep-login-page .ep-login-card form.form-signin .ep-input-wrap input.form-control[type="password"],
html body .ep-login-page .ep-login-card input#user_name,
html body .ep-login-page .ep-login-card input#user_password{
    background:#F7FAFF !important;
    color:#162033 !important;
    -webkit-text-fill-color:#162033 !important;
    caret-color:#162033 !important;
}

html body .ep-login-page .ep-login-card form.form-signin .ep-input-wrap input.form-control:focus,
html body .ep-login-page .ep-login-card input#user_name:focus,
html body .ep-login-page .ep-login-card input#user_password:focus{
    background:#FFFFFF !important;
    color:#162033 !important;
    -webkit-text-fill-color:#162033 !important;
    border-color:#8B5CFF !important;
}

html body .ep-login-page .ep-login-card input.form-control::placeholder{
    color:#8A94A6 !important;
    -webkit-text-fill-color:#8A94A6 !important;
    opacity:1 !important;
}

html body .ep-login-page .ep-login-card input.form-control:-webkit-autofill,
html body .ep-login-page .ep-login-card input.form-control:-webkit-autofill:hover,
html body .ep-login-page .ep-login-card input.form-control:-webkit-autofill:focus{
    -webkit-text-fill-color:#162033 !important;
    box-shadow:0 0 0 1000px #F7FAFF inset !important;
    caret-color:#162033 !important;
}
