body.sirah-auth { background:linear-gradient(125deg,#0044dd,#00285d) !important; color:#00285d; min-height:100vh; }
.sirah-auth .background-overlay { background:linear-gradient(125deg,rgba(0,68,221,.88),rgba(0,40,93,.94)) !important; }
.sirah-auth .login-container { background:#fff; border-top:6px solid #0044dd; border-radius:8px; box-shadow:0 12px 40px rgba(0,25,70,.25); }
.sirah-auth #login-form, .sirah-auth .content-box { border-color:#d5e2ff; background:#fff !important; }
.sirah-auth .meta-box { background:#0044dd !important; color:#fff; padding:20px; }
.sirah-auth .meta-heading, .sirah-auth .meta-subheading { color:#fff !important; }
.sirah-auth .meta-box .meta-image { max-width:190px; height:auto; background:#fff; }
.sirah-auth .form-control, .sirah-auth input[type=text], .sirah-auth input[type=password], .sirah-auth input[type=email] { border:1px solid #bfd2ff; background:#f6f9ff; color:#00285d; }
.sirah-auth .form-control:focus, .sirah-auth input:focus { border-color:#0044dd; outline-color:#0044dd; box-shadow:0 0 0 3px rgba(0,68,221,.15); }
.sirah-auth .btn-primary, .sirah-auth #validateBtn { background:#0044dd !important; border-color:#0044dd !important; color:#fff !important; }
.sirah-auth #retryBtn { background:#00285d !important; border-color:#00285d !important; color:#fff !important; }
.sirah-auth .btn-primary:hover, .sirah-auth #validateBtn:hover { background:#00285d !important; }
.sirah-auth a { color:#0044dd; }
.sirah-auth #accessTokenForm { width:100%; max-width:460px; float:none; margin:0 auto; }
.sirah-auth #accessTokenForm input[type=text] { font-size:22px; letter-spacing:3px; text-align:center; width:100%; }
.sirah-auth #accessTokenForm .input-group { width:100%; }
.sirah-auth .sirah-auth-brand { color:#0044dd; font:bold 34px Arial,sans-serif; text-align:center; padding:16px 0; }
.sirah-auth .sirah-auth-help { display:flex; gap:14px; flex-wrap:wrap; justify-content:center; padding:16px; font-size:12px; }

/* Shared login and second-factor layout for administrators, teachers and students. */
html { min-height:100%; }
body.sirah-auth {
    display:block !important; margin:0 !important; padding:0 !important;
    min-height:100vh; overflow-x:hidden; overflow-y:auto;
    background:linear-gradient(180deg,rgba(3,55,135,.42) 0%,rgba(3,40,104,.58) 48%,rgba(3,23,64,.96) 100%) center / cover no-repeat fixed, #07326d url('../images/sirah-academic-20261030.webp') center / cover no-repeat fixed !important;
}
.sirah-auth .login-container {
    display:flex !important; flex-direction:column !important; align-items:center !important;
    justify-content:center !important; box-sizing:border-box;
    width:100% !important; max-width:none !important; min-height:100vh !important; height:auto !important;
    margin:0 auto !important; padding:32px 16px !important;
    position:relative !important; top:auto !important; left:auto !important; transform:none !important;
    background:transparent !important; border:0 !important; box-shadow:none !important;
}
.sirah-auth .login-card, .sirah-auth #accessTokenForm {
    box-sizing:border-box; width:100% !important; max-width:440px !important;
    min-height:0 !important; margin:0 auto !important; padding:0 !important; float:none !important;
    background:#fff; border:0 !important; border-radius:12px;
    box-shadow:0 12px 40px rgba(0,25,70,.35); overflow:hidden;
}
.sirah-auth #useraccount-loginform {
    box-sizing:border-box; width:100% !important; max-width:440px !important;
    float:none !important; margin:0 auto !important; padding:0 !important;
}
.sirah-auth #login-form, .sirah-auth .panel-layout {
    width:100%; margin:0 !important; border:0 !important; border-radius:0;
}
.sirah-auth .meta-box {
    position:static !important; margin:0 !important; padding:24px !important; text-align:center;
}
.sirah-auth .meta-box .meta-image {
    display:block !important; position:static !important; transform:none !important;
    box-sizing:content-box; width:210px !important; max-width:100% !important; height:auto !important;
    margin:0 auto 18px !important; padding:0 !important; border:0 !important; border-radius:0 !important;
    background:transparent !important; box-shadow:none !important;
}
.sirah-auth .meta-heading { margin:0 0 6px !important; line-height:1.4; }
.sirah-auth .meta-subheading { margin:0 !important; line-height:1.4; }
.sirah-auth .content-box-wrapper { padding:24px !important; }
.sirah-auth .sirah-auth-help {
    box-sizing:border-box; width:100%; max-width:440px; margin:14px auto 0;
    background:rgba(255,255,255,.96); border-radius:8px; text-align:center;
}
.sirah-auth .g-recaptcha { display:flex; justify-content:center; padding-left:0; padding-right:0; }
.sirah-auth #accessTokenForm input::placeholder { font-size:14px; letter-spacing:normal; }
.sirah-auth #retryBtn, .sirah-auth #retryBtn:hover, .sirah-auth #retryBtn:focus, .sirah-auth #retryBtn:active {
    background:#00285d !important; border-color:#00285d !important; color:#fff !important;
}
.sirah-auth .content-box-wrapper, .sirah-auth .form-control, .sirah-auth .content-box-wrapper label { color:#111 !important; }
@media(max-width:480px) {
    .sirah-auth .login-container { padding:20px 12px !important; }
    .sirah-auth .content-box-wrapper { padding:20px 16px !important; }
}
@media(max-width:360px) {
    .sirah-auth .g-recaptcha { transform:scale(.88); transform-origin:center top; height:68px; }
}

body.sirah-auth { filter:none; }
.sirah-auth .sirah-academic-brand {
    position:fixed; z-index:2; left:6vw; bottom:10vh;
    width:calc(100% - 560px - 18vw); max-width:650px;
    color:#fff; pointer-events:none;
}
.sirah-auth .sirah-academic-brand h1 {
    margin:0; color:#fff; font-size:clamp(36px,4.2vw,64px); font-weight:600;
    line-height:1.15; letter-spacing:-1.5px; text-shadow:0 2px 24px rgba(0,20,60,.2);
}
.sirah-auth .sirah-academic-brand h1 span {
    display:block; margin-bottom:12px; color:#d5e8ff;
    font-size:clamp(17px,1.6vw,24px); font-weight:400; letter-spacing:3px;
}
@media(min-width:1100px) {
    .sirah-auth .login-container {
        width:calc(440px + 12vw) !important;
        margin:0 0 0 auto !important; padding:32px 6vw !important;
    }
}
@media(max-width:1099px) {
    .sirah-auth .sirah-academic-brand {
        position:relative; left:auto; bottom:auto; width:100%; max-width:none;
        padding:36px 16px 28px; text-align:center;
    }
    .sirah-auth .sirah-academic-brand h1 { font-size:clamp(28px,6vw,42px); letter-spacing:-.5px; }
    .sirah-auth .sirah-academic-brand h1 span { font-size:16px; margin-bottom:8px; letter-spacing:2px; }
    .sirah-auth .login-container { min-height:0 !important; padding:0 16px 32px !important; }
}
@media(max-width:360px) {
    .sirah-auth .sirah-academic-brand { padding:28px 12px 24px; }
    .sirah-auth .login-container { padding:0 10px 24px !important; }
}

/* UI2M identity, scoped to this independent instance. */
body.sirah-auth {background:#45191d !important; isolation:isolate;}
.ui2m-background {position:fixed;inset:0;z-index:-1;overflow:hidden;background:radial-gradient(ellipse at 90% 25%,#853c41 0,#531e24 48%,#301014 100%);}
.ui2m-background:after {content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 25%,rgba(52,15,20,.12) 48%,#531e24 71%);}
.ui2m-campus {position:absolute;inset:0 46% 0 0;background:url('../images/ui2m-campus.jpg') 58% top/auto 100% no-repeat;}
.ui2m-students,.ui2m-training {position:absolute;bottom:0;height:33%;width:27%;background-size:cover;background-position:center;border-top:5px solid #fff;}
.ui2m-students {left:0;background-image:url('../images/ui2m-etudiants.jpg');}
.ui2m-training {left:27%;background-image:url('../images/ui2m-formation.jpg');border-left:5px solid #fff;}
.sirah-auth .login-container {width:100% !important;margin:0 auto !important;padding:32px 16px !important;min-height:100vh !important;}
.sirah-auth .ui2m-brand {position:fixed;left:calc(50% + 270px);right:4vw;bottom:auto;top:50%;transform:translateY(-50%);width:auto;max-width:420px;text-align:center;padding:0;color:#fff;}
.ui2m-logo {width:230px;max-width:90%;height:auto;display:block;margin:0 auto 20px;box-shadow:0 12px 35px #250b1433;}
.sirah-auth .ui2m-name {font-size:20px;line-height:1.5;color:#f2dfe0;margin:0;}
.ui2m-rule {width:100px;height:3px;background:#d6b575;margin:30px auto;}
.sirah-auth .ui2m-brand h1 {font-size:clamp(25px,2.45vw,40px);line-height:1.3;letter-spacing:-.5px;font-weight:600;margin:0 0 22px;}
.sirah-auth .ui2m-description {font-size:17px;line-height:1.8;color:#f2dfe0;margin:0 auto;max-width:340px;}
.sirah-auth .ui2m-location {font-size:10px;letter-spacing:2px;color:#d6b575;margin:36px 0 0;}
@media(max-width:1150px) and (min-width:901px){.sirah-auth .login-container {padding-right:28% !important;} .sirah-auth .ui2m-brand {left:74%;right:2%;} .ui2m-logo{width:180px;} .sirah-auth .ui2m-description{font-size:14px;} .sirah-auth .ui2m-name{font-size:16px;}}
@media(max-width:900px){.ui2m-campus{right:0;background-size:cover;background-position:50% 20%;} .ui2m-students,.ui2m-training{display:none;} .ui2m-background:after{background:linear-gradient(180deg,rgba(55,15,22,.55),rgba(45,12,20,.88));} .sirah-auth .ui2m-brand{position:relative;left:auto;right:auto;top:auto;bottom:auto;transform:none;width:100%;max-width:none;padding:24px 16px 18px;} .ui2m-logo{width:130px;margin-bottom:10px;} .sirah-auth .ui2m-name{font-size:14px;} .ui2m-rule,.sirah-auth .ui2m-description,.sirah-auth .ui2m-location{display:none;} .sirah-auth .ui2m-brand h1{font-size:20px;margin:12px 0 0;} .sirah-auth .ui2m-brand h1 br{display:none;} .sirah-auth .login-container{min-height:0 !important;padding:0 12px 24px !important;} }
