/* XakniEGE login. Scoped to the login layout; authentication remains Moodle's. */
body.pagelayout-login {
    color: #24233f;
    background: #f4f5ff;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.pagelayout-login #page {
    background: radial-gradient(ellipse at 5% 12%, #e1eaff 0, transparent 45%), radial-gradient(ellipse at 95% 80%, #e9deff 0, transparent 44%), #f7f8ff;
    min-height: 100vh;
}
.pagelayout-login #page-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 440px;
    align-items: center;
    gap: 68px;
    width: 100%;
    max-width: 1200px;
    min-height: 100svh !important;
    margin: 0 auto;
    padding: 48px 32px;
}
.pagelayout-login .login-layout-left {
    display: flex !important;
    position: relative;
    top: auto;
    align-self: center;
    width: auto;
    height: auto;
    padding: 0;
    background: none !important;
    color: #24233f;
}
.pagelayout-login .login-layout-left::after,
.pagelayout-login .login-layout-left::before { display: none !important; }
.xe-welcome { width: 100%; max-width: 550px; }
.xe-eyebrow { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; letter-spacing: 2px; color: #6252a8; margin-bottom: 24px; }
.xe-eyebrow svg { width: 24px; height: 24px; }
.xe-title { color: #282443; font-size: clamp(38px, 4.2vw, 58px); line-height: 1.13; font-weight: 750; letter-spacing: -2.3px; margin: 0 0 22px; }
.xe-title span { color: #6c54d6; }
.xe-lead { max-width: 435px; color: #61617b; font-size: 17px; line-height: 1.7; margin-bottom: 28px; }
.xe-tags { display: flex; flex-wrap: wrap; gap: 9px; }
.xe-tags span { background: #ffffff9c; border: 1px solid #fff; border-radius: 100px; padding: 8px 14px; color: #55566f; font-size: 12px; }
.xe-illustration { height: 270px; position: relative; margin: 35px 0 16px; isolation: isolate; }
.xe-orbit { position: absolute; width: 245px; height: 245px; border: 1px solid #bcb4ed80; border-radius: 50%; top: 0; left: 25%; transform: rotate(-20deg); background: radial-gradient(circle at 25% 25%, #dbe8ff, #e7deff80 70%); z-index: -1; }
.xe-orbit::before { content: ''; position: absolute; inset: 25px -28px; border: 1px solid #bcb4ed70; border-radius: 50%; transform: rotate(-35deg); }
.xe-code { position: absolute; width: 310px; max-width: 86%; top: 28px; left: 8%; background: #fffffff0; border: 1px solid white; border-radius: 20px; box-shadow: 0 20px 55px #7973b424; transform: rotate(-5deg); overflow: hidden; }
.xe-code-bar { display: flex; align-items: center; gap: 6px; padding: 16px 19px; border-bottom: 1px solid #eeeeF8; }
.xe-code-bar i { width: 7px; height: 7px; border-radius: 50%; background: #d5ccf0; }
.xe-code-bar i:nth-child(2) { background: #c5d9f6; }
.xe-code-bar i:nth-child(3) { background: #c7e8dd; }
.xe-code-bar span { margin-left: auto; color: #86829b; font: 11px monospace; }
.xe-code pre { margin: 0; padding: 18px 24px 23px; color: #55526f; font: 13px/1.9 Consolas, monospace; background: transparent; white-space: pre-wrap; }
.xe-code em { color: #8554cd; font-style: normal; }
.xe-code b { color: #338e86; font-weight: 500; }
.xe-note { position: absolute; right: 1%; bottom: 17px; display: flex; gap: 11px; align-items: center; padding: 15px 19px; background: #fff; border: 1px solid #eeeaff; border-radius: 16px; box-shadow: 0 13px 35px #69619519; transform: rotate(4deg); }
.xe-check { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 11px; color: #467c72; background: #e5f5ef; font-size: 19px; }
.xe-note strong { display: block; font-size: 13px; color: #3f3a58; }
.xe-note small { display: block; margin-top: 3px; color: #78748e; font-size: 11px; }
.xe-caption { color: #73718a; font-size: 13px; line-height: 1.6; margin: 0; }
.pagelayout-login .login-layout-right { display: block; min-height: 0; width: auto; padding: 0; }
.pagelayout-login .login-layout-right-content { margin: 0; max-width: none; }
.pagelayout-login .login-container { padding: 36px 36px 25px; border: 1px solid #fff; background: #ffffffed; border-radius: 28px; box-shadow: 0 24px 80px #655da514, 0 3px 12px #655da507; }
.xe-brand { display: flex; align-items: center; gap: 13px; margin: 0 0 30px; }
.pagelayout-login #loginlogo { margin: 0 !important; flex-shrink: 0; }
.pagelayout-login #logoimage { width: 54px; height: 54px; object-fit: contain; border-radius: 12px; }
.xe-brand strong { display: block; color: #36314d; font-size: 17px; letter-spacing: 1px; }
.xe-brand small { display: block; margin-top: 3px; color: #817b95; font-size: 12px; }
.pagelayout-login .loginform > h1 { color: #282443; font-size: 29px; line-height: 1.25; font-weight: 700; letter-spacing: -.7px; margin-bottom: 9px; }
.pagelayout-login .loginform > p.text-muted { color: #787389 !important; font-size: 14px; line-height: 1.6; margin-bottom: 28px !important; }
.pagelayout-login .login-form .form-label { color: #514b67; font-weight: 600; font-size: 13px; margin-bottom: 8px; }
.pagelayout-login .login-form .form-control { height: 49px; border: 1px solid #e3dfef; border-radius: 11px; background: #f8f8fc; color: #302b46; padding: 12px 15px; font-size: 14px; }
.pagelayout-login .login-form .form-control::placeholder { color: #9690a7; opacity: 1; }
.pagelayout-login .login-form .form-control:hover { background: #f5f4fb; }
.pagelayout-login .login-form .form-control:focus { background: white; border-color: #9481e8; box-shadow: 0 0 0 3px #8266dd20; }
.pagelayout-login .login-form .toggle-sensitive-wrapper .form-control { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.pagelayout-login .login-form .toggle-sensitive-btn { border-color: #e3dfef; background: #f8f8fc; border-radius: 0 11px 11px 0; }
.pagelayout-login .login-container a { color: #7056bd; font-size: 13px; }
.pagelayout-login .login-container a:hover { color: #4f3c93; }
.pagelayout-login #loginbtn { min-height: 49px; border: 0; border-radius: 11px; background: linear-gradient(105deg, #7560d8, #6488e6); color: white; font-size: 14px; font-weight: 600; box-shadow: 0 7px 17px #7763d22b; transition: box-shadow .15s, filter .15s; }
.pagelayout-login #loginbtn:hover { filter: brightness(.95); box-shadow: 0 9px 22px #7763d240; }
.pagelayout-login .login-identityprovider-btn { min-height: 44px; border: 1px solid #e5e1ef; border-radius: 11px; color: #6b657f; font-size: 13px; background: #fff; }
.pagelayout-login .login-separator { font-size: 10px; color: #9790a7; margin: 23px 0 !important; }
.pagelayout-login .login-separator::before,.pagelayout-login .login-separator::after { border-color: #eeeaf5; }
.pagelayout-login .login-languagemenu { margin: 20px 0 15px !important; }
.pagelayout-login .login-cookiesnotice .btn-link { font-size: 11px; color: #81798f; }
.pagelayout-login .alert { font-size: 13px; line-height: 1.55; border-radius: 11px; }
.pagelayout-login .login-maintenance { background: #fff6e8; border-color: #efdfbd; color: #765d32; }
.pagelayout-login a:focus-visible,.pagelayout-login button:focus-visible { outline: 3px solid #9782e9; outline-offset: 4px; }
@media (min-width: 1600px) { .pagelayout-login #page-content { max-width: 1300px; grid-template-columns: minmax(0, 1fr) 460px; gap: 120px; } }
@media (max-width: 991px) {
    .pagelayout-login #page-content { grid-template-columns: minmax(0, 1fr); max-width: 520px; padding: 28px 20px 40px; gap: 26px; }
    .xe-welcome { max-width: none; }
    .xe-eyebrow { font-size: 10px; letter-spacing: 1.5px; margin-bottom: 13px; }
    .xe-title { font-size: 33px; letter-spacing: -1px; margin-bottom: 0; }
    .xe-lead,.xe-tags,.xe-illustration,.xe-caption { display: none; }
    .pagelayout-login .login-container { padding: 29px 27px 23px; border-radius: 23px; }
    .xe-brand { margin-bottom: 24px; }
}
@media (max-width: 380px) { .pagelayout-login #page-content { padding: 22px 14px 32px; } .pagelayout-login .login-container { padding: 25px 20px; } .pagelayout-login .loginform > h1 { font-size: 26px; } }
@media (prefers-reduced-motion: reduce) { .pagelayout-login #loginbtn { transition: none; } }