@font-face{font-family:MarkWeb;src:url(Geist.ttf) format('truetype');font-display:swap}
:root{--mw-accent:#3177e8;--mw-ink:#172332;--mw-line:#e0e6ee}
body,input,button,select,textarea{font-family:MarkWeb,system-ui,-apple-system,sans-serif}
a{color:#2669cc}
.btn-primary{background:#246ada;border-color:#246ada}
.btn-primary:hover,.btn-primary:focus{background:#185bc4;border-color:#185bc4}
.btn:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #85b4ff;outline-offset:3px}
body.task-login{background:#0e1724;background-image:radial-gradient(ellipse at 15% 5%,#203e60 0,transparent 52%),radial-gradient(ellipse at 95% 90%,#163b44 0,transparent 48%);color:var(--mw-ink)}
body.task-login #layout{justify-content:center;align-items:center;padding:32px 20px;min-height:100vh}
body.task-login #layout-content{flex:none!important;width:440px!important;max-width:100%;height:auto!important;min-height:0!important;margin:auto!important;background:#fff;border:1px solid #ffffff24;border-radius:22px;padding:38px 36px 26px!important;box-shadow:0 28px 90px #0005;overflow:visible}
body.task-login #logo{display:block!important;width:238px!important;height:56px!important;max-height:none!important;margin:0 auto 27px!important;object-fit:contain}
.mw-welcome{text-align:center;margin-bottom:28px}
.mw-welcome h2{font-size:23px;font-weight:650;letter-spacing:-.65px;line-height:1.3;color:#172332;margin:0 0 10px}
.mw-welcome p{font-size:14px;line-height:1.5;color:#637286;margin:0}
body.task-login #login-form{width:100%;max-width:none;margin:0}
body.task-login .input-group{margin-bottom:17px}
body.task-login .input-group-text{background:#f5f7fa;border-color:#dce3ed;color:#6a7b90;border-radius:10px 0 0 10px}
body.task-login .form-control{height:48px;background:#f8fafc;color:#172332;border-color:#dce3ed;border-radius:0 10px 10px 0;font-size:15px}
body.task-login .form-control:focus{background:#fff;border-color:#3177e8;box-shadow:0 0 0 3px #3177e81a}
body.task-login .form-control::placeholder{color:#78869a}
body.task-login .btn-primary{min-height:48px;border-radius:10px;font-size:15px;font-weight:600;box-shadow:0 4px 12px #246ada22}
body.task-login #login-footer{margin-top:27px;padding-top:20px;border-top:1px solid #e7ecf2;color:#718095;font-size:12px;line-height:1.7}
body.task-login #login-footer a{color:#326ab6}
body.task-login #login-form .row.form-group{color:#637286}
body.task-login .darkmode{color:#637286}
#layout-menu{background:#142234}
#taskmenu a.selected,#taskmenu a:hover{background:#263e58}
#taskmenu a{color:#c3d1e3}
#taskmenu a.selected{color:#fff;box-shadow:inset 3px 0 #65a1ff}
#layout-menu #logo{max-width:155px;height:48px;object-fit:contain;margin:12px auto}
#layout-sidebar .header,#layout-list .header,#layout-content .header{background:#f6f8fb;border-color:#e1e7ef}
.messagelist tr.selected td{background:#e7f0ff;color:#183d71}
.listing li.selected>a{background:#e7f0ff;color:#183d71}
html.dark-mode #layout-menu{background:#101b2a}
html.dark-mode #layout-sidebar .header,html.dark-mode #layout-list .header,html.dark-mode #layout-content .header{background:#222d3c;border-color:#354253}
html.dark-mode .messagelist tr.selected td,html.dark-mode .listing li.selected>a{background:#234368;color:#eef5ff}
html.dark-mode body.task-login #layout-content{background:#182331;border-color:#354253}
html.dark-mode body.task-login .mw-welcome h2{color:#edf3fc}
html.dark-mode body.task-login .mw-welcome p,html.dark-mode body.task-login #login-footer{color:#a4b2c5}
html.dark-mode body.task-login #login-footer{border-color:#354253}
html.dark-mode body.task-login .input-group-text{background:#263445;border-color:#43536a;color:#bac9dc}
html.dark-mode body.task-login .form-control{background:#202e40;border-color:#43536a;color:#f1f5fc}
html.dark-mode body.task-login .form-control::placeholder{color:#9baec7}
html.dark-mode body.task-login #login-footer a{color:#8ebcff}
@media(max-width:480px){body.task-login #layout{padding:16px}body.task-login #layout-content{padding:30px 23px 23px!important;border-radius:17px}.mw-welcome h2{font-size:21px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
/* Elastic offsets its login elements by viewport height; use normal card flow. */
body.task-login #logo,body.task-login #login-form{position:static!important;top:auto!important;left:auto!important;transform:none!important}
body.task-login #layout-content{box-sizing:border-box}
/* HAVARIO AUTH LOGIN */
body.task-login{font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:#2fafee;background-image:linear-gradient(180deg,#1a9be6,#4cbaf0);color:#172332}
body.task-login::before,body.task-login::after{content:"";position:fixed;pointer-events:none}
body.task-login.mw-day::before{top:10%;right:6%;width:180px;height:180px;border-radius:50%;filter:blur(15px);background:radial-gradient(circle,#fffdf5 0%,#fff7cc 10%,#ffe89999 30%,#ffbb332f 50%,transparent 70%)}
body.task-login.mw-day::after{inset:-100%;background:radial-gradient(circle at 20% 40%,#fff6,transparent 20%),radial-gradient(circle at 70% 30%,#fff5,transparent 25%),radial-gradient(circle at 40% 70%,#fff5,transparent 20%);opacity:.5;filter:blur(15px)}
body.task-login.mw-morning{background:linear-gradient(135deg,#ffb399,#f9b975,#ffe080)}
body.task-login.mw-night{background:linear-gradient(135deg,hsl(240 30% 15%),hsl(220 40% 8%))}
body.task-login.mw-night::before{inset:0;background-image:radial-gradient(2px 2px at 20px 30px,#eee,transparent),radial-gradient(1px 1px at 90px 40px,#fff,transparent),radial-gradient(1px 1px at 130px 80px,#ffffff99,transparent);background-size:200px 100px;opacity:.7}
body.task-login #layout{position:relative;z-index:1;min-height:100dvh;height:auto!important;padding:32px 16px;display:flex;align-items:center;justify-content:center;overflow:visible}
body.task-login #layout-content,html.dark-mode body.task-login #layout-content{position:static!important;display:block!important;flex:none!important;width:448px!important;max-width:100%;height:auto!important;min-height:0!important;margin:auto!important;padding:0!important;background:transparent!important;border:0!important;border-radius:0;box-shadow:none!important;overflow:visible}
.mw-auth-hero{text-align:center;margin:0 0 32px;color:white}
.mw-logo-badge{display:flex;align-items:center;justify-content:center;width:112px;height:112px;padding:16px;margin:0 auto;background:#fffffff2;color:#172332;border-radius:24px;box-shadow:0 0 40px #ffffff22;backdrop-filter:blur(12px)}
.mw-logo-badge svg{width:100%;height:100%}.mw-brand-name{font-size:14px;font-weight:600;letter-spacing:.04em;margin-top:12px}
.mw-auth-card{--login-bg:#fffffff2;--login-text:#172332;--login-muted:#637286;--login-input:#f8fafc;--login-border:#dce3ed;background:var(--login-bg);color:var(--login-text);border:1px solid #ffffff33;border-radius:12px;padding:24px;backdrop-filter:blur(12px);box-shadow:0 1px 3px #0000001a}
html.dark-mode .mw-auth-card,body.mw-night .mw-auth-card{--login-bg:#030712f2;--login-text:#e8eaee;--login-muted:#a4adbb;--login-input:#14191f;--login-border:#1d2530}
body.task-login .mw-welcome{margin:0 0 24px;text-align:center}
body.task-login .mw-welcome h1{font-family:inherit;font-size:24px;line-height:32px;font-weight:700;letter-spacing:-.6px;color:var(--login-text);margin:0 0 4px}
body.task-login .mw-welcome p,html.dark-mode body.task-login .mw-welcome p{font-size:14px;line-height:20px;color:var(--login-muted);margin:0}
body.task-login #login-form{position:static!important;top:auto!important;left:auto!important;transform:none!important;width:100%;max-width:none;margin:0;font-family:inherit}
body.task-login #login-form table,body.task-login #login-form tbody{display:block;width:100%}
body.task-login #login-form tr{display:block;margin:0 0 16px}
body.task-login #login-form td.title{display:block!important;padding:0;margin:0 0 8px;color:var(--login-text);font-size:14px;line-height:20px;font-weight:500}
body.task-login #login-form label{margin:0}
body.task-login #login-form td.input{display:block;position:relative;padding:0;margin:0;width:100%}
body.task-login #login-form .input-group-prepend{display:none!important}
body.task-login #login-form .form-control,html.dark-mode body.task-login #login-form .form-control{display:block;width:100%;height:48px;border:1px solid var(--login-border);border-radius:10px!important;background:var(--login-input);color:var(--login-text);font-family:inherit;font-size:14px;line-height:20px;padding:12px;box-shadow:none}
body.task-login #login-form .form-control:focus{border-color:#3486ee;outline:2px solid #3486ee55;outline-offset:2px}
body.task-login #login-form .form-control::placeholder{color:var(--login-muted)}
body.task-login #rcmloginpwd{padding-right:44px!important}
.mw-password-toggle{position:absolute;right:4px;top:6px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:0;background:transparent;color:#3486ee;border-radius:6px;cursor:pointer}
.mw-password-toggle:hover{background:#3486ee12}.mw-password-toggle:focus-visible{outline:2px solid #3486ee;outline-offset:2px}
body.task-login .formbuttons{margin:24px 0 0}
body.task-login #rcmloginsubmit{font-family:inherit;min-height:40px;height:40px;font-size:14px;line-height:20px;font-weight:600;border-radius:10px;text-transform:none!important;background:#2777dc;border:1px solid #2777dc;color:white;box-shadow:none;padding:8px 16px}
body.task-login #rcmloginsubmit:hover{background:#2168c1;border-color:#2168c1}
body.task-login #login-footer,html.dark-mode body.task-login #login-footer{position:static;margin:16px 0 0;padding:0;border:0;color:#ffffffde;text-align:center;font-family:inherit;font-size:12px;line-height:20px}
body.task-login #login-footer a,html.dark-mode body.task-login #login-footer a{color:inherit;text-decoration:none}body.task-login #login-footer a:hover{text-decoration:underline}
@media(max-width:480px){body.task-login #layout{padding:24px 16px}.mw-auth-card{padding:24px}.mw-auth-hero{margin-bottom:24px}.mw-logo-badge{width:96px;height:96px;border-radius:22px}}
body.task-login #login-form td.title{text-align:left!important}

/* COMPACT MARKWEB LOGIN */
body.task-login.mw-day{background-color:#193d52;background-image:linear-gradient(#10202b66,#10202b66),linear-gradient(180deg,#1a9be6,#4cbaf0)}
body.task-login.mw-day::before{opacity:.28}
body.task-login.mw-day::after{opacity:.12}
body.task-login .mw-auth-card{--login-bg:#030712f2;--login-text:#e8eaee;--login-muted:#a4adbb;--login-input:#14191f;--login-border:#1d2530}
body.task-login .mw-auth-hero{margin:0 0 20px}
body.task-login .mw-logo-badge{width:100px;height:52px;padding:0;border-radius:0;background:transparent;color:#fff;box-shadow:none;backdrop-filter:none}
body.task-login .mw-brand-name{display:none}

/* NEUTRAL INBOX */
#layout-menu{background:#f4f6f8;border-right:1px solid #e0e6ee}
#taskmenu a{color:#536173}#taskmenu a:hover,#taskmenu a.selected{background:#e5eaf0;color:#172332}
#taskmenu a.selected{box-shadow:inset 3px 0 #3181d9}
html.dark-mode #layout-menu{background:#21292c;border-color:#465156}
html.dark-mode #taskmenu a{color:#c5cdd0}
html.dark-mode #taskmenu a:hover,html.dark-mode #taskmenu a.selected{background:#303a3e;color:#f1f5f7}
#layout-menu #logo{display:block;width:48px!important;max-width:48px!important;height:40px!important;margin:8px auto!important;object-fit:contain}
html:not(.dark-mode) #layout-menu #logo{content:url(/roundcube/plugins/markweb_branding/logo.svg?v=monogram2)}
html.dark-mode #layout-menu #logo{content:url(/roundcube/plugins/markweb_branding/logo-dark.svg?v=monogram2)}

/* AIRY LOGIN SPACING */
body.task-login .mw-auth-card{padding-top:48px;padding-bottom:32px}
body.task-login .mw-auth-hero{margin-bottom:40px}
@media(max-width:480px){body.task-login .mw-auth-card{padding-top:36px;padding-bottom:28px}body.task-login .mw-auth-hero{margin-bottom:32px}}

/* MAIL CLIENT HELP */
.mw-client-help{margin-top:24px;border-top:1px solid var(--login-border);padding-top:18px;font-size:12px;line-height:1.6;color:var(--login-muted)}
.mw-client-help summary{font-size:13px;font-weight:600;color:var(--login-text);cursor:pointer;list-style-position:inside;padding:4px 0}
.mw-client-help summary:focus-visible{outline:2px solid #3486ee;outline-offset:4px;border-radius:4px}
.mw-client-help-content{padding-top:12px}.mw-client-help-content p{margin:0 0 14px}
.mw-client-help table{width:100%;border-collapse:collapse;margin:0 0 14px;font-size:11px;line-height:1.6}
.mw-client-help th,.mw-client-help td{text-align:left;padding:7px 4px;border-bottom:1px solid var(--login-border);white-space:nowrap}
.mw-client-help th{color:var(--login-text);font-weight:600}.mw-client-help td{color:var(--login-muted)}
.mw-client-help .mw-client-note{margin-bottom:0}
@media(max-width:380px){.mw-client-help table{font-size:10px}.mw-client-help th,.mw-client-help td{padding:7px 2px}}

/* SIMPLIFIED TASK MENU */
#taskmenu a.lightmode,#taskmenu a.darkmode,#taskmenu a.about{display:none!important}
#taskmenu a.theme{display:none!important}

/* WORKSPACE UX POLISH */
@media(min-width:1025px){
#layout-menu{width:184px!important;min-width:184px;flex:0 0 184px!important}
#layout-menu #logo{width:64px!important;max-width:64px!important;height:44px!important;margin:20px auto 24px!important}
#taskmenu a{display:flex;align-items:center;gap:12px;text-align:left;padding:12px 16px!important;min-height:48px;white-space:nowrap;overflow:visible;text-overflow:clip;font-size:13px;line-height:20px}
#taskmenu a::before{display:inline-block!important;float:none!important;flex:none;font-size:20px!important;width:24px!important;line-height:24px!important;margin:0!important}
#taskmenu a.compose{margin:0 10px 12px;padding:12px!important;background:#2777dc;color:white;border-radius:9px;font-weight:600}
#taskmenu a.compose:hover{background:#2168c1;color:white}
#taskmenu a.logout{margin:0 10px 12px;padding:12px!important;border-radius:9px}
}
body.action-compose #compose-headers{padding:20px 24px 12px}
body.action-compose #compose-headers .form-group{margin-bottom:14px}
body.action-compose #compose-headers input,body.action-compose #compose-headers select{min-height:40px;border-radius:8px}
body.action-compose #compose-subject{font-weight:500}
body.action-compose #composebody{padding:20px 24px;font-family:MarkWeb,system-ui,sans-serif;font-size:15px;line-height:1.7}
body.action-compose .footer{padding:12px 24px}
body.action-compose button.mainaction{border-radius:8px;min-height:40px;padding:8px 20px;font-weight:600}
@media(max-width:600px){body.action-compose #compose-headers{padding:12px}body.action-compose #composebody{padding:16px}body.action-compose .footer{padding:12px}}
@media(min-width:1025px){#taskmenu a{width:auto!important}html.dark-mode #taskmenu a.compose{background:#2777dc;color:#fff}html.dark-mode #taskmenu a.compose:hover{background:#2168c1}}
body.action-compose .btn.send{border-radius:8px;min-height:42px;padding:9px 22px;font-weight:600;background:#2777dc;border-color:#2777dc}
@media(min-width:1025px){#taskmenu a{max-width:none!important}#taskmenu .action-buttons{display:block;width:100%}#taskmenu a.compose{width:calc(100% - 20px)!important}#taskmenu a .inner{overflow:visible;text-overflow:clip;white-space:nowrap}}
