@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&display=swap');

/* Moodle Boost puts the front-page summary inside a section-item, not a card. */
body#page-site-index.notloggedin #page-header{display:none!important}
/* The landing card supplies the guest login links on the front page. */
body#page-site-index.notloggedin .navbar #usernavigation .usermenu-container,
body#page-site-index.notloggedin .navbar #usernavigation .divider,
body#page-site-index.notloggedin #page-footer .logininfo{display:none!important}
body#page-site-index.notloggedin #region-main:has(.outbox-cloud),
body#page-site-index.notloggedin #region-main :is(.course-section,.section-item,.content,.summarytext,.no-overflow):has(.outbox-cloud),
body#page-site-index.notloggedin #region-main .outbox-cloud-host,
body#page-site-index.notloggedin #region-main .outbox-cloud-host :is(.content,.summarytext,.no-overflow){background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:0!important}
body#page-site-index.notloggedin #region-main .summarytext:has(.outbox-cloud)>.no-overflow{overflow:visible}
body#page-site-index:not(.notloggedin) .guest-only{display:none!important}
body#page-site-index:not(.notloggedin) #region-main .section-item:has(.guest-only){display:none!important}

/* Self-contained Moodle card styles. */
.outbox-cloud{--outbox-ink:#02314d;--outbox-accent:#ccdb38;--outbox-border:#ccdb38;box-sizing:border-box;width:100%;max-width:420px;margin-inline:auto;padding:36px clamp(24px,7vw,40px) 34px;border:1px solid var(--outbox-border);border-radius:18px;background:var(--outbox-ink);color:#fff;box-shadow:0 12px 30px rgba(2,49,77,.14);font-family:'DM Sans',Arial,sans-serif;text-align:left}
.outbox-cloud *{box-sizing:border-box}
.outbox-cloud [hidden]{display:none!important}
.outbox-cloud__brand{display:inline-flex;align-items:baseline;gap:8px;margin-bottom:32px;line-height:1}
.outbox-cloud__brand-name{font-size:27px;font-weight:800;letter-spacing:-.075em;color:#fff}
.outbox-cloud__brand-point{color:var(--outbox-accent)}
.outbox-cloud__brand-subtitle{font-size:9px;font-weight:800;letter-spacing:.18em;color:var(--outbox-accent)}
.outbox-cloud h1{margin:0 0 15px;color:#fff;font-family:'DM Sans',Arial,sans-serif;font-size:clamp(30px,8vw,40px);font-weight:800;line-height:1.12;letter-spacing:-.055em}
.outbox-cloud__copy{margin:0 0 27px;max-width:310px;color:#e3edf1;font-size:14px;line-height:1.6}
.outbox-cloud__button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:54px;padding:14px 18px;border:1px solid var(--outbox-accent);border-radius:8px;background:var(--outbox-accent);color:var(--outbox-ink)!important;font:800 14px 'DM Sans',Arial,sans-serif;text-decoration:none!important;text-align:left;cursor:pointer;transition:background .15s,border-color .15s,transform .15s}
.outbox-cloud__button:hover{background:#dce95a;border-color:#dce95a;transform:translateY(-1px)}
.outbox-cloud__button span{font-size:20px;font-weight:400;line-height:1}
.outbox-cloud__button:focus-visible,.outbox-cloud__secondary:focus-visible{outline:3px solid #fff;outline-offset:3px}
.outbox-cloud__note{margin:11px 0 0;color:#dce9ee;font-size:12px;line-height:1.45}
.outbox-cloud__note:empty{display:none}
.outbox-cloud__secondary{display:inline-block;margin-top:20px;color:#dce9ee!important;font-size:12px;font-weight:600;text-decoration:underline!important;text-underline-offset:3px}
.outbox-cloud__secondary:hover{color:#fff!important}
.outbox-cloud__login-form{display:grid;gap:8px;margin-top:2px}
.outbox-cloud__login-form label{color:#e8f1f5;font-size:12px;font-weight:700}
.outbox-cloud__login-form input:not([type=hidden]){width:100%;height:46px;margin-bottom:8px;padding:10px 13px;border:1px solid #9cb5bf;border-radius:7px;background:#fff;color:#02314d;font:500 14px 'DM Sans',Arial,sans-serif}
.outbox-cloud__login-form input:focus-visible{outline:3px solid #ccdb38;outline-offset:2px}
.outbox-cloud__forgot{justify-self:end;margin:-5px 0 6px;color:#dce9ee!important;font-size:12px;font-weight:600;text-decoration:underline!important;text-underline-offset:3px}
.outbox-cloud__forgot:hover{color:#fff!important}
.outbox-cloud__forgot:focus-visible{outline:3px solid #ccdb38;outline-offset:3px}
.outbox-cloud__login-form .outbox-cloud__button{margin-top:5px}
.outbox-cloud__login-form .outbox-cloud__button:disabled{opacity:.6;cursor:wait;transform:none}
.outbox-cloud__login-message{margin:3px 0 5px;color:#e3edf1;font-size:12px;line-height:1.5}
.outbox-cloud__login-message:empty{display:none}
.outbox-cloud__login-message[data-state=error]{padding:13px 15px;border:1px solid #ffb7b3;border-radius:11px;background:#a32027;color:#fff;font-size:13px;font-weight:700;box-shadow:0 5px 14px rgba(83,0,8,.25)}
.outbox-cloud__login-message a{color:#fff!important;font-weight:800;text-decoration:underline!important;text-underline-offset:2px}
.outbox-cloud__login-message a:focus-visible{outline:2px solid #fff;outline-offset:3px}
@media(max-width:480px){.outbox-cloud{padding:29px 25px 31px}.outbox-cloud__brand{margin-bottom:27px}}

/* Moodle's native login keeps its token, errors and post-login destination. */
body#page-login-index{background:#f4f7f8;font-family:'DM Sans',Arial,sans-serif}
body#page-login-index #page{background:transparent;padding:32px 16px!important}
body#page-login-index #region-main{padding:0;border:0;background:transparent}
body#page-login-index .login-wrapper{padding:0;min-height:calc(100vh - 64px);min-height:calc(100dvh - 64px)}
body#page-login-index .login-container{box-sizing:border-box;width:100%;max-width:420px;margin:auto;padding:36px clamp(24px,7vw,40px) 34px;border:1px solid #ccdb38;border-radius:18px;background:#02314d;color:#fff;box-shadow:0 12px 30px rgba(2,49,77,.14)}
body#page-login-index .loginform{display:flex;flex-direction:column;text-align:left}
body#page-login-index .loginform>*{order:5}
body#page-login-index .loginform>.login-logo{order:0}
body#page-login-index .loginform>:is(#loginerrormessage,#logininfomessage){order:3}
body#page-login-index .loginform>.login-form{order:4}
body#page-login-index .login-logo{display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:baseline;column-gap:8px;width:100%;text-align:left;margin:0 0 32px}
body#page-login-index .login-logo::before{content:'outbox.';display:inline-block;color:#fff;font-size:27px;font-weight:800;line-height:1;letter-spacing:-.075em}
body#page-login-index .login-logo::after{content:'CLOUD';display:inline-block;order:1;color:#ccdb38;font-size:9px;font-weight:800;letter-spacing:.18em}
body#page-login-index #logoimage{display:none}
/* Keep the native heading accessible; show the landing card's welcome visually. */
body#page-login-index .login-logo .login-heading{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Welcome and subtitle precede Moodle's sibling error/info messages. */
body#page-login-index .loginform::before{content:'Bienvenido\A a tu aula.';display:block;order:1;margin:0 0 15px;color:#fff;font-size:clamp(30px,8vw,40px);font-weight:800;line-height:1.12;letter-spacing:-.055em;white-space:pre-line}
body#page-login-index .loginform::after{content:'Accede con tu cuenta de Outbox Cloud.';display:block;order:2;margin:0 0 27px;max-width:310px;color:#e3edf1;font-size:14px;line-height:1.6}
body#page-login-index .login-form label{position:static;display:block;width:auto;height:auto;margin:0 0 8px;padding:0;overflow:visible;clip:auto;white-space:normal;color:#e8f1f5;font-size:12px;font-weight:700}
body#page-login-index .login-form .form-control{height:46px;padding:10px 13px;border:1px solid #9cb5bf;border-radius:7px;background:#fff;color:#02314d;font:500 16px 'DM Sans',Arial,sans-serif}
body#page-login-index .login-form .form-control:focus{border-color:#ccdb38;outline:3px solid #ccdb38;outline-offset:2px;box-shadow:none}
body#page-login-index .login-container .btn{min-height:44px;border-radius:8px;font-family:inherit;font-size:14px;font-weight:700;white-space:normal}
body#page-login-index #loginbtn{width:100%;min-height:54px;padding:14px 18px;border:1px solid #ccdb38;background:#ccdb38;color:#02314d;font-weight:800}
body#page-login-index #loginbtn:hover{border-color:#dce95a;background:#dce95a}
body#page-login-index .login-container .btn-secondary{border:1px solid #9cb5bf;background:transparent;color:#e3edf1}
body#page-login-index .login-container .btn-secondary:hover{background:#16445f;color:#fff}
body#page-login-index .login-container a{color:#dce9ee;text-decoration:underline;text-underline-offset:3px}
body#page-login-index .login-container a:hover{color:#fff}
body#page-login-index .login-form-forgotpassword{text-align:right;font-size:12px;font-weight:600}
body#page-login-index .login-divider{margin:24px 0;border-top:1px solid #527181}
body#page-login-index #guestlogin,
body#page-login-index .loginform>.login-heading:has(+ #guestlogin),
body#page-login-index .login-divider:has(+ .login-heading + #guestlogin){display:none}
body#page-login-index .loginform>.login-heading{margin-bottom:14px;color:#e3edf1;font-size:14px;font-weight:600;line-height:1.5}
body#page-login-index .loginform>.d-flex{flex-wrap:wrap;align-items:center;gap:12px;font-size:12px}
body#page-login-index .loginform>.d-flex>.divider{display:none}
body#page-login-index .login-container .dropdown-menu{border-radius:8px;background:#fff;color:#02314d}
body#page-login-index .login-container .dropdown-item{color:#02314d}
body#page-login-index .login-container .dropdown-item:hover,
body#page-login-index .login-container .dropdown-item:focus{background:#e8efb1;color:#02314d}
body#page-login-index #loginerrormessage{padding:13px 15px;border:1px solid #ffb7b3;border-radius:11px;background:#a32027;color:#fff;font-size:13px;font-weight:700}
body#page-login-index #logininfomessage{padding:13px 15px;border:1px solid #9cb5bf;border-radius:11px;background:#16445f;color:#fff;font-size:13px}
body#page-login-index .login-container :is(a,button):focus-visible{outline:3px solid #ccdb38;outline-offset:3px;box-shadow:none}
body#page-login-index #loginbtn:focus-visible{outline-color:#fff}
@media(max-width:480px){body#page-login-index #page{padding:24px 16px!important}body#page-login-index .login-container{padding:29px 25px 31px}body#page-login-index .login-wrapper{min-height:calc(100dvh - 48px)}}

/* Install help uses a native HTML dialog and stays inside the Moodle card markup. */
.outbox-cloud__dialog{width:min(430px,calc(100vw - 32px));max-width:none;max-height:min(90vh,700px);margin:auto;padding:30px;border:1px solid #dbe5e8;border-radius:20px;background:#fff;color:#02314d;box-shadow:0 26px 75px rgba(1,31,49,.3);font-family:'DM Sans',Arial,sans-serif;overflow:auto;text-align:left}
.outbox-cloud__dialog::backdrop{background:rgba(1,31,49,.66);backdrop-filter:blur(3px)}
.outbox-cloud__dialog-close{position:absolute;top:15px;right:16px;display:grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:#f1f5f6;color:#02314d;font-size:25px;line-height:1;cursor:pointer}
.outbox-cloud__dialog-kicker{margin:0 0 7px;color:#5a747f;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.outbox-cloud__dialog h2{margin:0 30px 9px 0;color:#02314d;font-size:clamp(25px,6vw,31px);font-weight:800;line-height:1.14;letter-spacing:-.045em}
.outbox-cloud__dialog-intro{margin:0 0 21px;color:#55707b;font-size:14px;line-height:1.55}
.outbox-cloud__install-icon{display:flex;align-items:center;gap:13px;margin:0 0 17px;padding:12px 14px;border:1px solid #d9e7eb;border-radius:10px;background:#eff5f6;color:#234959;font-size:12px;font-weight:600;line-height:1.45}
.outbox-cloud__install-icon[hidden]{display:none!important}
.outbox-cloud__dialog .outbox-cloud__install-icon img{flex:0 0 30px;width:30px;height:30px;border-radius:0!important}
.outbox-cloud__steps{counter-reset:install-step;display:grid;gap:10px;margin:0;padding:0;list-style:none}
.outbox-cloud__steps li{counter-increment:install-step;display:flex;align-items:flex-start;gap:12px;padding:13px 14px;border:1px solid #e5ecee;border-radius:11px;background:#f8faf9;color:#173e50;font-size:13px;line-height:1.5}
.outbox-cloud__steps li::before{content:counter(install-step);flex:0 0 25px;display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:#e8efb1;color:#02314d;font-size:12px;font-weight:800}
.outbox-cloud__dialog-tip{margin:15px 0 0;padding:11px 13px;border-left:3px solid #ccdb38;border-radius:4px;background:#f7f9e9;color:#365260;font-size:12px;line-height:1.5}
.outbox-cloud__dialog-done{display:block;width:100%;min-height:46px;margin-top:22px;padding:10px 16px;border:0;border-radius:8px;background:#02314d;color:#fff;font:700 14px 'DM Sans',Arial,sans-serif;cursor:pointer}
.outbox-cloud__dialog-done:hover{background:#075375}
.outbox-cloud__dialog-link{display:block;margin-top:15px;color:#426574!important;text-align:center;font-size:12px;font-weight:600;text-decoration:underline!important;text-underline-offset:3px}
.outbox-cloud__dialog :focus-visible{outline:3px solid #ccdb38;outline-offset:3px}
body.has-install-help::before{content:"";position:fixed;inset:0;z-index:1001;background:rgba(1,31,49,.66)}
body.has-install-help .outbox-cloud__dialog[open]{position:fixed;inset:0;z-index:1002}
@media(max-width:480px){.outbox-cloud__dialog{padding:25px 22px;max-height:calc(100dvh - 24px)}.outbox-cloud__steps li{padding:12px}}
