/* ALFAROUQ - v6 minimal, compact login. Works with rectangular white-backed logo. */
:root{--deep:#073e33;--green:#12634f;--gold:#d7ad63;--muted:#71827b;--line:#e4eae6;color:#213931;font-family:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:#f2f6f3}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid #c4a367;outline-offset:2px}img{display:block;max-width:100%}
.alf-login-shell{min-height:100svh;display:flex;justify-content:center;align-items:center;flex-direction:column;padding:36px 24px 22px;background:radial-gradient(circle at 8% 1%,rgba(209,177,114,.11),transparent 37%),#f4f7f5}
.alf-login-card{width:min(100%,900px);min-height:516px;display:grid;grid-template-columns:.95fr 1.05fr;background:#fff;border-radius:25px;box-shadow:0 24px 85px rgba(6,48,36,.09);overflow:hidden;border:1px solid #edf0ed}
.alf-login-brand{background:linear-gradient(155deg,#0b503f,#053a30);padding:42px 34px;display:flex;flex-direction:column;justify-content:space-between;position:relative;isolation:isolate;overflow:hidden;color:#fff}
.alf-login-brand::before{content:"";position:absolute;width:300px;height:300px;border:1px solid rgba(236,210,158,.13);border-radius:50%;right:-180px;top:-160px;box-shadow:0 0 0 70px rgba(255,255,255,.015);z-index:-1}
.alf-login-brand__logo{background:#fff;border-radius:16px;padding:13px 15px;max-width:268px;min-height:100px;display:grid;align-items:center;box-shadow:0 12px 26px rgba(0,0,0,.09)}
.alf-login-brand__logo img{width:100%;max-height:105px;object-fit:contain}
.alf-login-brand__logo img,.alf-login-mobile-logo img,.alf-intro__logo-card img{mix-blend-mode:multiply}
.alf-login-brand__text p{font-size:10px;letter-spacing:.22em;font-weight:700;color:#dabb80;margin:0 0 18px}
.alf-login-brand__text h1{font-family:Manrope,"DM Sans",sans-serif;font-size:clamp(30px,3vw,42px);line-height:1.26;font-weight:700;letter-spacing:-.055em;margin:0 0 14px}
.alf-login-brand__text h1 em{font-style:normal;color:#e0be7d}
.alf-login-brand__text span{font-size:13px;color:#c6d8d0}
.alf-login-brand__footer{display:flex;align-items:center;gap:10px;letter-spacing:.2em;font-size:9px;font-weight:700;color:#c1cec8}.alf-login-brand__footer span{width:24px;height:1px;background:#dab874}
.alf-login-form-panel{display:flex;align-items:center;justify-content:center;padding:45px clamp(30px,5vw,68px)}
.alf-login-form-content{width:100%;max-width:338px}
.alf-login-mobile-logo{display:none}
.alf-login-eyebrow{font-size:10px;letter-spacing:.17em;color:var(--green);font-weight:800;margin:0 0 12px}
.alf-login-form-content h2{font-family:Manrope,"DM Sans",sans-serif;font-size:30px;font-weight:760;letter-spacing:-.055em;line-height:1.2;margin:0 0 9px}
.alf-login-description{font-size:13px;color:var(--muted);margin:0 0 30px;line-height:1.6}
.alf-login-form{display:flex;flex-direction:column;gap:9px}
.alf-login-form label{font-size:12px;font-weight:700;color:#354b43;margin-top:5px}
.alf-input{position:relative;display:flex;align-items:center;margin-bottom:11px}
.alf-input>svg{position:absolute;left:15px;width:18px;height:18px;color:#91a19a;pointer-events:none}
.alf-input input{width:100%;height:51px;border-radius:11px;background:#fbfcfb;border:1px solid #dce4df;padding:0 48px 0 43px;color:#253e34;outline:0;font-size:14px;transition:border-color .2s,box-shadow .2s}
.alf-input input:focus{border-color:#478e76;box-shadow:0 0 0 3px #e1f0e9}
.alf-input input::placeholder{color:#a4afa9}
.alf-pass-toggle{position:absolute;right:8px;display:grid;place-items:center;border:0;background:transparent;border-radius:8px;width:36px;height:36px;color:#8c9d94}.alf-pass-toggle svg{width:19px;height:19px}.alf-pass-toggle:hover{background:#eff5f1;color:var(--green)}
.alf-login-submit{margin-top:4px;width:100%;display:flex;align-items:center;justify-content:center;gap:12px;min-height:52px;border:0;border-radius:11px;background:var(--green);font-size:14px;font-weight:700;color:white;box-shadow:0 8px 19px rgba(11,91,70,.14)}.alf-login-submit:hover{background:#0c503e}.alf-login-submit:disabled{opacity:.65}.alf-login-submit svg{width:18px;height:18px}
.alf-login-assist{text-align:center;margin:25px 0 0;color:#9aa7a1;font-size:11px}.alf-login-footer{font-size:11px;color:#9aaba2;margin-top:20px}
.alf-intro{position:fixed;inset:0;z-index:100;display:grid;place-items:center;background:#f7faf8;animation:introAutoClose .45s ease 4.55s forwards}
.alf-intro__inner{width:min(90vw,450px);display:flex;flex-direction:column;align-items:center;gap:18px;animation:introEnter .9s ease both}
.alf-intro__logo-card{background:#fff;padding:18px 21px;max-width:100%;width:340px;border:1px solid #eff2ef;border-radius:18px;box-shadow:0 19px 40px rgba(12,64,50,.075)}.alf-intro__logo-card img{width:100%;max-height:150px;object-fit:contain}
.alf-intro__inner>p{font-size:10px;letter-spacing:.22em;font-weight:800;color:var(--green);margin:0}
.alf-intro__track{height:3px;width:165px;border-radius:10px;background:#e1e9e4;overflow:hidden}.alf-intro__track span{width:100%;height:100%;display:block;background:linear-gradient(90deg,#0f6750,#ddb772);transform-origin:left;animation:introLoad 4.55s linear both}
.alf-intro__skip{position:absolute;bottom:max(28px,env(safe-area-inset-bottom));right:30px;border:1px solid #d9e6de;background:#fff;color:#29594a;border-radius:100px;padding:10px 17px;font-size:12px}
.alf-intro.is-dismissed{animation:none;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s,visibility .3s}
@keyframes introAutoClose{to{opacity:0;visibility:hidden;pointer-events:none}}@keyframes introEnter{from{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes introLoad{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.alf-login-notice[hidden]{display:none}.alf-login-notice{position:fixed;inset:0;z-index:101;background:rgba(5,31,24,.50);display:grid;place-items:center;padding:18px}.alf-login-notice__box{width:min(100%,390px);text-align:center;background:#fff;border-radius:18px;padding:30px 26px;box-shadow:0 25px 70px #0002}.alf-login-notice__icon{display:grid;place-items:center;width:48px;height:48px;margin:0 auto 13px;border-radius:14px;background:#fff4ed;color:#a65133}.alf-login-notice__icon svg{width:25px;height:25px}.alf-login-notice h3{font-family:Manrope,sans-serif;margin:0 0 12px;font-size:20px}.alf-login-notice #alf-login-notice-text{font-size:13px;color:#63776a;line-height:1.7}.alf-login-notice button{margin-top:20px;border:0;border-radius:9px;min-height:43px;width:100%;background:var(--green);color:white;font-weight:700}
@media(max-width:700px){
.alf-login-shell{padding:20px 19px 16px;justify-content:center;background:linear-gradient(180deg,#0c4a3b 0px,#0c4a3b 155px,#f4f7f5 155px,#f4f7f5 100%)}
.alf-login-card{max-width:420px;min-height:auto;display:block;overflow:visible;background:transparent;border:0;box-shadow:none}
.alf-login-brand{display:none}
.alf-login-form-panel{background:white;border-radius:19px;padding:29px 25px 28px;box-shadow:0 18px 50px rgba(0,54,35,.12);border:1px solid #e8ede9}
.alf-login-form-content{max-width:none}
.alf-login-mobile-logo{display:grid;place-items:center;background:#fff;padding:6px 10px;margin:0 auto 22px;max-width:220px;min-height:80px}
.alf-login-mobile-logo img{width:100%;max-height:90px;object-fit:contain}
.alf-login-form-content h2{font-size:27px}
.alf-login-description{margin-bottom:22px}
.alf-login-eyebrow{font-size:9px}
.alf-login-footer{color:#7f998b}
}
@media(max-width:370px){.alf-login-shell{padding:14px 13px}.alf-login-form-panel{padding:24px 20px}.alf-login-mobile-logo{max-width:200px;margin-bottom:15px}.alf-login-form-content h2{font-size:25px}.alf-login-description{margin-bottom:16px}.alf-input input{height:48px}.alf-login-submit{min-height:49px}}
@media(prefers-reduced-motion:reduce){.alf-intro{display:none!important}*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}}
