/* FachadaPro · Portal premium de acceso y activación · octubre 2026 */
:root{--auth-ink:#203832;--auth-deep:#0b302e;--auth-forest:#15544a;--auth-mint:#dbf4e8;--auth-line:#e3eae6;--auth-muted:#71837b}
.auth-app{min-height:100vh;background:#f4f7f5;color:var(--auth-ink);font-family:'DM Sans',system-ui,-apple-system,sans-serif;font-size:14px;-webkit-font-smoothing:antialiased}
.auth-app *{box-sizing:border-box}
.auth-layout{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(500px,.94fr);min-height:100vh}
.auth-visual{position:relative;display:flex;flex-direction:column;min-height:100vh;overflow:hidden;background:radial-gradient(ellipse at 80% 58%,#267c6a88 0%,transparent 55%),linear-gradient(135deg,#123e37 0%,#0b2c2e 58%,#09282e 100%);color:#fff;padding:43px clamp(30px,5vw,78px) 30px}
.auth-visual:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(#b2dec710 1px,transparent 1px),linear-gradient(90deg,#b2dec710 1px,transparent 1px);background-size:62px 62px;mask-image:linear-gradient(160deg,transparent,#000 50%);opacity:.65}
.auth-visual:after{content:"";position:absolute;bottom:-200px;left:-180px;width:550px;height:550px;border:1px solid #a6f5cd18;border-radius:50%;box-shadow:0 0 0 75px #a6f5cd09,0 0 0 155px #a6f5cd06;pointer-events:none}
.auth-visual-noise{position:absolute;inset:0;background:radial-gradient(ellipse at 0 0,#7be6b411,transparent 58%);pointer-events:none}
.auth-visual-top,.auth-mobile-logo{display:flex;align-items:center;gap:13px;position:relative;z-index:1}
.auth-symbol{width:48px;height:48px;display:grid;place-items:center;flex-shrink:0;border-radius:14px;background:#e7f7e9;color:#124d42;font-family:'Manrope',sans-serif;font-weight:900;font-size:29px;line-height:1;letter-spacing:-.1em;position:relative;padding-right:4px}
.auth-symbol span{position:absolute;font-size:20px;right:10px;top:9px;color:#39b58f}
.auth-visual-top strong{display:block;font-size:22px;font-family:'Manrope',sans-serif;letter-spacing:-.06em;line-height:1.1}
.auth-visual-top strong span,.auth-mobile-logo strong span{color:#88d7b7}
.auth-visual-top small{display:block;font-size:9px;font-weight:800;letter-spacing:.23em;color:#95bcb2;margin-top:8px}
.auth-v-center{position:relative;z-index:1;max-width:650px;margin:auto 0;padding:75px 0 35px}
.auth-overline{display:flex;align-items:center;gap:10px;font-weight:800;font-size:10px;letter-spacing:.17em;color:#92dec0;margin-bottom:27px}
.auth-live-dot{width:8px;height:8px;border-radius:50%;background:#6decaa;box-shadow:0 0 0 5px #6decaa20}
.auth-v-center h2{font-size:clamp(34px,3.45vw,59px);line-height:1.17;letter-spacing:-.052em;font-weight:800;margin:0 0 26px;color:#f3fbf5}
.auth-v-center h2 em{font-style:normal;color:#aee2c4}
.auth-v-center p{max-width:540px;color:#b8d2c9;line-height:1.82;font-size:15px;margin:0}
.architecture-visual{max-width:640px;margin:4px auto -12px;filter:drop-shadow(0 30px 37px #02181744)}
.architecture-visual svg{width:100%;display:block;max-height:330px}
.auth-visual-bottom{position:relative;z-index:1;display:flex;justify-content:space-between;gap:15px;align-items:center;color:#83a99d;font-weight:700;font-size:10px;letter-spacing:.09em;border-top:1px solid #f0fff020;padding-top:22px}
.auth-workspace{background:linear-gradient(180deg,#fdfefd,#f5f8f5);display:flex;flex-direction:column;min-width:0;min-height:100vh;padding:35px clamp(27px,4.6vw,88px) 22px}
.auth-inner{width:100%;max-width:490px;margin:auto;position:relative;padding:36px 0}
.auth-kicker{display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:.15em;font-weight:900;color:#197b60;margin-bottom:26px}
.auth-pill-dot{width:9px;height:9px;border-radius:50%;background:#20b38a;box-shadow:0 0 0 5px #def5ea}
.auth-inner h1{font-family:'Manrope',system-ui,sans-serif;line-height:1.17;letter-spacing:-.06em;font-size:clamp(32px,3vw,46px);font-weight:800;margin:0 0 19px;color:#17392f}
.auth-inner h1 span{color:#188764}
.auth-lead{color:#71847b;font-size:14px;line-height:1.85;max-width:460px;margin:0 0 30px}
.auth-fields{display:flex;flex-direction:column;gap:18px}
.auth-label{font-size:12px!important;font-weight:800!important;color:#38534a!important;display:flex;flex-direction:column;gap:9px}
.auth-input,.auth-label input,.auth-label select{height:51px!important;width:100%;background:#fff;border:1px solid #dce7e1;border-radius:11px;padding:13px 16px;font-family:inherit;font-weight:600;font-size:13px;color:#223c33;outline:none;transition:border-color .15s,box-shadow .15s,background .15s}
.auth-input::placeholder{color:#a4b3ac;font-weight:500}
.auth-input:focus,.auth-label input:focus,.auth-label select:focus{border-color:#29a67e;box-shadow:0 0 0 4px #64c9a01a;background:#fff}
.auth-input-wrap{position:relative}
.auth-input-wrap input{padding-left:46px!important}
.auth-field-icon{position:absolute;top:50%;transform:translateY(-50%);left:17px;font-size:20px;color:#9aaeaa;line-height:1;pointer-events:none}
.auth-password-toggle{position:absolute;right:12px;top:50%;transform:translateY(-50%);border:0;background:#eff6f1;color:#4d7b68;border-radius:7px;font-size:11px;font-weight:800;padding:7px 12px}
.auth-submit{height:53px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-radius:11px;color:#fff;background:linear-gradient(110deg,#176f57,#11825f);font-weight:800;font-size:13px;border:1px solid #0e7e5e;padding:0 20px;box-shadow:0 12px 25px #167c571f;transition:transform .18s,box-shadow .18s;margin-top:7px}
.auth-submit:hover{background:linear-gradient(120deg,#115a47,#09734f);box-shadow:0 13px 30px #0c77572b;transform:translateY(-1px)}
.auth-submit span{width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:#ffffff24;font-size:20px;font-weight:600}
.auth-security{display:flex;justify-content:center;align-items:center;gap:9px;color:#8c9f95;font-size:11px;font-weight:600;margin-top:31px}
.auth-right-foot{display:flex;justify-content:space-between;gap:20px;font-size:10px;color:#a1b0a6;letter-spacing:.02em;font-weight:600}
.auth-mobile-logo{display:none}
.auth-alert{border-radius:10px;padding:12px 14px;margin-bottom:22px;font-size:12px;line-height:1.6;font-weight:650}
.auth-error{background:#fff1f0;border:1px solid #f5cfc9;color:#ac4740}
.auth-success{background:#e7f8f1;border:1px solid #bde8d4;color:#227454}
.auth-ready{display:flex;gap:13px;align-items:flex-start;border:1px solid #d5e9de;background:#edf9f0;border-radius:12px;padding:16px;margin-bottom:28px}
.auth-ready-icon{display:grid;place-items:center;flex-shrink:0;width:32px;height:32px;background:#d4efde;color:#17835d;border-radius:9px;font-weight:900;font-size:17px}
.auth-ready b{display:block;font-size:12px;color:#176e4d;margin:0 0 3px}
.auth-ready span{display:block;color:#537965;font-size:11px;line-height:1.65}
.auth-ready strong{color:#185b43;font-family:monospace;font-size:12px}
.auth-section-title{display:flex;align-items:center;gap:10px;margin:3px 0 0;color:#1c906d;font-weight:800;font-size:12px}
.auth-section-title span{color:#35584b}
.auth-pair{display:grid;grid-template-columns:1.4fr .6fr;gap:12px;margin-bottom:18px}
#mysqlFields{display:flex;flex-direction:column;gap:18px}
#mysqlFields[hidden]{display:none!important}
.auth-tip{margin-top:24px;display:flex;gap:10px;align-items:flex-start;color:#718b7d;background:#f0f5ef;border:1px solid #e1ebe4;padding:13px 14px;border-radius:9px;font-size:11px;line-height:1.6}
.auth-tip>span{font-size:16px;color:#2d9670}
.auth-caption{text-align:center;font-size:10px;color:#91a39a;margin:18px 0 0}
@media (max-width:1100px){.auth-layout{grid-template-columns:minmax(0,.9fr) minmax(460px,1fr)}.auth-visual{padding:34px 35px}.auth-v-center h2{font-size:39px}}
@media (max-width:850px){.auth-layout{grid-template-columns:1fr}.auth-visual{display:none}.auth-workspace{min-height:100vh;padding:25px 26px 20px}.auth-mobile-logo{display:flex;margin-bottom:24px}.auth-mobile-logo strong{font-size:21px;font-weight:900;color:#165343;letter-spacing:-.06em}.auth-mobile-logo strong span{color:#229876}.auth-mobile-logo .auth-symbol{width:38px;height:38px;font-size:23px;border-radius:11px;background:#164f42;color:#e5f7e7}.auth-mobile-logo .auth-symbol span{font-size:14px;right:8px;top:7px;color:#72e2b6}.auth-inner{max-width:520px;padding:14px 0 48px}.auth-right-foot{justify-content:center}.auth-right-foot span:last-child{display:none}}
@media (max-width:480px){.auth-workspace{padding:22px 19px 16px}.auth-inner{padding:10px 0 30px}.auth-inner h1{font-size:33px}.auth-lead{font-size:13px;margin-bottom:24px}.auth-fields{gap:16px}.auth-input,.auth-label input,.auth-label select{height:49px!important}.auth-pair{grid-template-columns:1fr}.auth-kicker{font-size:9px;letter-spacing:.11em}.auth-ready{padding:13px}}
