/* Max Sense. Elastic extension; keep message HTML and semantic status colors intact. */
:root{--ms-navy:#092653;--ms-blue:#144c97;--ms-gold:#ffcc00;--ms-ink:#172b46;--ms-muted:#53647c;--ms-line:#dce4ef;--ms-surface:#fff;--ms-soft:#f4f7fb;--ms-hover:#eaf1fb;--ms-focus:#144c97}
html.dark-mode{--ms-ink:#edf3fc;--ms-muted:#b5c5db;--ms-line:#33455d;--ms-surface:#152235;--ms-soft:#111d2e;--ms-hover:#213a5b;--ms-blue:#97c3ff;--ms-focus:#97c3ff}
body,input,button,select,textarea{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body{color:var(--ms-ink);background:var(--ms-soft)}
a{color:var(--ms-blue)}
:where(a,button,input,textarea,select,[tabindex]):focus-visible{outline:2px solid var(--ms-focus)!important;outline-offset:3px}
.btn{border-radius:8px;font-weight:600;box-shadow:none}
.btn-primary,.btn-primary:not(:disabled):not(.disabled):active{background:#144c97;border-color:#144c97;color:#fff}
.btn-primary:hover,.btn-primary:focus{background:#103e7b;border-color:#103e7b;color:#fff}
html.dark-mode .btn-primary{background:#2663b5;border-color:#2663b5;color:#fff}
html.dark-mode .btn-primary:hover{background:#2d6fc3;border-color:#2d6fc3;color:#fff}
.form-control,.custom-select{color:var(--ms-ink);background-color:var(--ms-surface);border-color:#8799b0;border-radius:7px}
.form-control:focus,.custom-select:focus{color:var(--ms-ink);background-color:var(--ms-surface);border-color:var(--ms-focus);box-shadow:0 0 0 3px #2766b31f}
.form-control::placeholder{color:var(--ms-muted);opacity:1}
#layout-menu{background:#091e3c;border-right:1px solid #1d365a}
#layout-menu .popover-header{background:#091e3c;border-color:#1d365a}
#layout-menu #logo{max-height:40px;width:40px;margin:15px auto;filter:none}
#taskmenu a{color:#c7d5e8;border-radius:9px;margin:4px 6px;transition:background-color .15s,color .15s}
#taskmenu a:hover,#taskmenu a:focus{color:#fff;background:#17385f}
#taskmenu a.selected{color:#fff;background:#1d426f;box-shadow:inset 3px 0 var(--ms-gold)}
#taskmenu a.compose{color:#092653;background:#ffcc00;margin-top:12px;margin-bottom:16px;box-shadow:0 4px 12px #0002}
#taskmenu a.compose:hover,#taskmenu a.compose:focus{background:#ffdd55;color:#092653}
#taskmenu a.logout{color:#c7d5e8}
#layout-sidebar,#layout-list,#layout-content{background:var(--ms-surface);border-color:var(--ms-line)}
#layout-sidebar{background:var(--ms-soft)}
#layout-sidebar>.header,#layout-list>.header,#layout-content>.header{background:var(--ms-surface);color:var(--ms-ink);border-color:var(--ms-line)}
#layout-sidebar>.footer,#layout-list>.footer,#layout-content>.footer{background:var(--ms-soft);color:var(--ms-muted);border-color:var(--ms-line)}
.header .header-title{font-weight:650;letter-spacing:-.25px}
.toolbar a.button{color:var(--ms-muted);border-radius:7px}
.toolbar a.button:not(.disabled):hover{color:var(--ms-blue);background:var(--ms-hover)}
.toolbar a.button.disabled{opacity:.45}
.listing li{border-color:var(--ms-line)}
.listing li a{color:var(--ms-ink)}
.listing li.selected>a,.listing li.selected>div>a,.listing li.selected>div{color:var(--ms-blue);background:var(--ms-hover);font-weight:600}
.listing li:hover>a{background:var(--ms-hover)}
#mailboxlist li a{border-radius:7px;margin:2px 8px;padding-left:10px}
#mailboxlist li.selected>a{box-shadow:inset 3px 0 #144c97}
#mailboxlist .unreadcount{background:#144c97;color:#fff;border-radius:6px;font-weight:650}
.messagelist td{border-color:var(--ms-line)}
.messagelist tr td{padding-top:9px;padding-bottom:9px}
.messagelist tr:hover td{background:var(--ms-soft)}
.messagelist tr.selected td{background:var(--ms-hover);color:var(--ms-ink)}
.messagelist tr.unread td.subject span.subject{font-weight:700;color:var(--ms-ink)}
.messagelist td.subject span.fromto,.messagelist td.subject span.date{color:var(--ms-muted)}
.searchbar{background:var(--ms-soft);border-color:var(--ms-line)}
.searchbar input{color:var(--ms-ink)}
.ui-dialog,.popover,.popupmenu,.modal-content{border-color:var(--ms-line);border-radius:10px;box-shadow:0 14px 48px #09265325}
/* Only app chrome is themed: no selectors reach the email body or editor content. */
.task-login #layout{display:block;background:var(--ms-soft);overflow:auto}
.task-login #layout-content.ms-login{display:grid!important;grid-template-columns:1.08fr 1fr;width:100%;max-width:none;height:auto;min-height:100vh;margin:0;padding:0;border:0;overflow:visible}
.ms-story{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;min-height:100vh;padding:clamp(36px,5vw,78px);background:radial-gradient(ellipse at 5% 5%,#174579 0,transparent 52%),linear-gradient(145deg,#092653,#07182f);color:#fff}
.ms-story:after{content:"";position:absolute;width:620px;height:620px;right:-320px;bottom:-300px;border:1px solid #ffcc0055;border-radius:50%;box-shadow:0 0 0 65px #ffffff03,0 0 0 130px #ffffff03;pointer-events:none}
.ms-wordmark{width:270px;max-width:100%;height:auto;position:relative;z-index:1}
.ms-story-copy{position:relative;z-index:1;padding:72px 0 92px;max-width:480px}
.ms-eyebrow{font-size:10px;letter-spacing:2.2px;font-weight:700;display:block;line-height:1.6}
.ms-story .ms-eyebrow{color:#cad8eb}
.ms-story h1{color:#fff;font-size:clamp(38px,4vw,62px);font-weight:550;letter-spacing:-2px;line-height:1.12;margin:24px 0}
.ms-story p{max-width:350px;color:#c5d4e8;font-size:16px;line-height:1.8}
.ms-gold-line{display:block;width:48px;height:4px;background:#ffcc00;border-radius:2px;margin-top:32px}
.ms-signature{font-size:10px;letter-spacing:1.6px;color:#c5d4e8;position:relative;z-index:1}
.ms-signature span{color:#ffcc00;margin:0 12px}
.ms-access{display:flex;align-items:center;justify-content:center;padding:60px 40px;background:var(--ms-surface)}
.ms-access-inner{width:100%;max-width:380px}
.ms-access .ms-eyebrow{color:var(--ms-muted);margin-bottom:18px}
.ms-access h2{font-size:38px;letter-spacing:-1.2px;font-weight:600;color:var(--ms-ink);margin:0 0 12px}
.ms-access-description{font-size:16px;color:var(--ms-muted);margin:0 0 38px}
.task-login #login-form{width:100%;max-width:none;margin:0;text-align:left}
.task-login #login-form .input-group{margin-bottom:20px}
.task-login #login-form .form-control{height:50px;font-size:15px;border-radius:0 8px 8px 0;padding:12px}
.task-login #login-form .input-group-text{background:var(--ms-soft);border-color:#8799b0;color:var(--ms-muted);border-radius:8px 0 0 8px;min-width:46px;justify-content:center}
.task-login #login-form button{min-height:48px;border-radius:8px;font-size:15px;letter-spacing:.1px;margin-top:8px}
.task-login #login-footer{margin-top:24px;color:var(--ms-muted);font-size:12px;text-align:center;padding:0}
.ms-access-note{margin:54px 0 0;color:var(--ms-muted);font-size:11px;text-align:center;letter-spacing:.4px}
@media(min-width:1024px){#layout-sidebar>.header,#layout-list>.header,#layout-content>.header{box-shadow:0 1px 0 var(--ms-line)}.task-mail #layout-list{box-shadow:3px 0 15px #09265304}}
@media(max-width:900px){.task-login #layout-content.ms-login{grid-template-columns:1fr}.ms-story{min-height:0;padding:28px 32px}.ms-wordmark{width:225px}.ms-story-copy,.ms-signature{display:none}.ms-access{padding:44px 26px 55px}.ms-access h2{font-size:32px}.ms-access-note{margin-top:36px}}
@media(prefers-reduced-motion:reduce){#taskmenu a{transition:none}}
@media print{#layout-menu{display:none!important}body,#layout-content{background:#fff!important;color:#000!important}}
/* Explicit overrides for Elastic's dark-mode and responsive selectors. */
.task-login #layout-content.ms-login{text-align:left}
.task-login #login-form{top:auto;position:static}
#layout #layout-menu,#layout-menu .popover-header,#taskmenu .special-buttons{background:#091e3c!important}
#taskmenu .special-buttons{width:100%}
#taskmenu .action-buttons a.compose{color:#092653!important;background:#ffcc00!important}
#taskmenu .action-buttons a.compose:hover{background:#ffdd55!important}
html.dark-mode #taskmenu a{color:#c7d5e8}
html.dark-mode #taskmenu a.selected{color:#fff;background:#1d426f}
#layout>div>.header{background:var(--ms-surface)!important;color:var(--ms-ink)!important;border-color:var(--ms-line)!important}
html.dark-mode #layout-content,html.dark-mode #layout-list{background:var(--ms-surface);color:var(--ms-ink)}
html.dark-mode #layout-sidebar{background:var(--ms-soft);color:var(--ms-ink)}
html.dark-mode #layout>div>.footer{background:var(--ms-soft);color:var(--ms-muted)}
html.dark-mode .form-control,html.dark-mode .custom-select{background-color:var(--ms-surface);color:var(--ms-ink);border-color:#7f93af}
html.dark-mode .searchbar{background:var(--ms-soft)}
html.dark-mode .listing li>a,html.dark-mode .listing li>div>a{color:var(--ms-ink)}
#mailboxlist li.selected>div,#mailboxlist li.selected>a{color:var(--ms-ink)!important;background:var(--ms-hover)!important}
html.dark-mode .toolbar a.button:not(.disabled){color:var(--ms-muted)}
@media(min-width:1025px){#layout #layout-menu{width:100px;min-width:100px}#taskmenu a{width:auto;margin-left:7px;margin-right:7px}#taskmenu a span.inner{font-size:11px;letter-spacing:.05px}#layout-menu #logo{margin:8px auto}}
@media(max-width:900px){.task-login #layout-content.ms-login{grid-template-rows:auto 1fr}.ms-access{align-items:flex-start}}
html.dark-mode .messagelist tr.selected td{background:var(--ms-hover)!important;color:var(--ms-ink)!important}
.messagelist tr:not(.flagged):not(.deleted) td.subject span.fromto,.messagelist tr:not(.flagged):not(.deleted) td.subject span.date{color:var(--ms-muted)!important}
.messagelist tr:not(.flagged):not(.deleted) td.subject span.subject a{color:var(--ms-ink)!important}

/* Compose: contain the editor and keep actions outside the scrolling form. */
body.task-mail.action-compose #layout-content,
html.dark-mode body.task-mail.action-compose #layout-content,
body.task-mail.action-compose #compose-content{background:var(--ms-surface);min-width:0;min-height:0}
body.action-compose #compose-content>.formbuttons{background:var(--ms-surface);border-top:1px solid var(--ms-line);padding:12px 18px;flex-shrink:0}
body.action-compose #compose-headers .form-group{margin-bottom:10px}
body.action-compose #compose-headers .col-form-label{color:var(--ms-muted);font-size:13px;font-weight:600}
body.action-compose #composebodycontainer{border-radius:9px;overflow:hidden;border:1px solid #8799b0}
body.action-compose #composebody{border:0;border-radius:0;box-shadow:none;padding:16px;line-height:1.6}
body.action-compose #composebody:focus{outline-offset:-3px}
body.action-compose #compose-attachments{min-height:150px;border:1px dashed #8799b0;border-radius:10px;background:var(--ms-surface)}
body.action-compose #compose-attachments:after{font-size:42px;line-height:1.2;opacity:.5}
body.action-compose #compose-attachments .upload-form{padding:16px 12px;color:var(--ms-muted)}
body.action-compose #compose-options .form-group{margin-bottom:14px}
body.action-compose #compose-options label{font-size:13px;line-height:1.5;color:var(--ms-muted)}
@media(min-width:769px){
 body.action-compose #compose-content{display:flex;flex-direction:column;overflow:hidden!important}
 body.action-compose #compose-content>form{flex:1 1 0%;min-height:0;display:flex;flex-direction:column;overflow-y:auto;padding:18px}
 body.action-compose #compose-headers{flex:0 0 auto}
 body.action-compose #composebodycontainer{flex:1 0 260px;min-height:260px;display:flex;flex-direction:column}
 body.action-compose #composebody{flex:1 0 220px;min-height:220px;height:auto!important;resize:none}
 body.action-compose #composebodycontainer>.mce-tinymce,
 body.action-compose #composebodycontainer>.tox-tinymce{flex:1 0 260px;min-height:260px}
 body.action-compose #layout-sidebar.sidebar-right{flex:0 0 320px;max-width:320px;min-width:280px}
 body.action-compose #compose-headers .col-2{flex:0 0 90px;max-width:90px}
 body.action-compose #compose-headers .col-10{flex:1;max-width:none;min-width:0}
}
@media(max-width:768px){body.action-compose #composebody{min-height:260px}body.action-compose #compose-headers .col-form-label{font-size:12px}}
/* Anchor the absolutely positioned bottom navigation to its own column. */
@media(min-width:481px){body #layout-menu{position:relative}#taskmenu .special-buttons{width:100%;max-width:100%}}
