/* Social4Us Workplace Mail | dedicated host-scoped Roundcube skin, UMOSTEK Social */
:root{
  --s4-ink:#24254b;--s4-sub:#6f7392;--s4-purple:#775bed;
  --s4-rose:#f777a7;--s4-sky:#51b9ed;--s4-line:#e8eaf4;
  --s4-ivory:#f8f9ff;--s4-lavender:#eee9ff;--s4-white:#fff;
}
html,body{color:var(--s4-ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif!important;}
body{background:linear-gradient(135deg,#f9f5ff,#f7fbff 55%,#fff9f5)!important;}
a{color:#6450ce}a:hover{color:#513bb4}
.btn-primary,.button.mainaction,button.mainaction{
  background:linear-gradient(115deg,#775bed,#a15bde 55%,#e879a9)!important;
  border-color:transparent!important;color:#fff!important;border-radius:12px!important;
  box-shadow:0 5px 18px rgba(105,83,200,.16)!important;
}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:3px solid rgba(81,185,237,.55)!important;outline-offset:2px!important;
}
#layout-menu{background:#fff!important;border-right:1px solid var(--s4-line)!important;}
#layout-menu a,#layout-menu button{color:#53577d!important;}
#layout-menu a:hover,#layout-menu a.selected,#layout-menu a.active,
#layout-menu button:hover{background:linear-gradient(90deg,#eee9ff,#fce8f4)!important;color:#624fc3!important;}
#layout-sidebar{background:#f9f8ff!important;border-right:1px solid var(--s4-line)!important;}
#layout-sidebar .treelist li.selected>a,#layout-sidebar .treelist li.active>a{
  background:#eee9ff!important;color:#5d4abe!important;border-radius:9px;
}
#layout-list,#layout-content{background:#fff!important;}
#layout-list .header,#layout-content .header,.toolbar{border-color:var(--s4-line)!important;}
.listing li.selected,.messagelist tr.selected,.messagelist tr.selected td{
  background:#f1edff!important;color:var(--s4-ink)!important;
}
input.form-control:focus,textarea.form-control:focus,select.form-control:focus{
  border-color:#846ee3!important;box-shadow:0 0 0 3px rgba(119,91,237,.12)!important;
}
body:not(.task-login) #layout{border-top:5px solid #8363e6;}
body:not(.task-login) #layout-menu:before{
  content:"SOCIAL4US  ·  MAIL";display:block;min-width:0;
  padding:13px 9px 12px;color:#6f59ce;font-size:10px;
  font-weight:900;letter-spacing:.07em;line-height:1.3;text-align:center;
}
body.task-login{min-height:100vh;overflow-x:hidden!important;background:#f8f9ff!important;}
body.task-login #layout{
  height:auto!important;max-width:none!important;min-height:100vh!important;
  background:radial-gradient(circle at 5% 12%,rgba(135,106,234,.12),transparent 37%),
             radial-gradient(circle at 95% 82%,rgba(81,185,237,.11),transparent 34%),
             linear-gradient(135deg,#f9f5ff,#f7fbff 55%,#fff9f5)!important;
}
body.task-login #layout-content{
  width:100%!important;max-width:none!important;min-height:100vh!important;
  height:auto!important;padding:clamp(16px,3.7vw,58px)!important;margin:0!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  background:transparent!important;text-align:left!important;overflow:visible!important;
  box-sizing:border-box!important;
}
body.task-login #layout-content::before,body.task-login #layout-content::after{display:none!important;}
.s4-mail-experience{
  width:min(1210px,100%);max-width:100%;min-height:650px;
  display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);
  background:#fff;border:1px solid #e9e4f5;border-radius:28px;
  box-shadow:0 28px 85px rgba(55,62,108,.14);overflow:hidden;
}
.s4-showcase{
  min-width:0;position:relative;isolation:isolate;
  display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;
  padding:clamp(28px,4.4vw,64px);
  background:linear-gradient(136deg,#516fda 0%,#775bed 42%,#b16cde 72%,#f081b0 100%);
  color:#fff;
}
.s4-showcase:before{
  position:absolute;z-index:-1;pointer-events:none;content:"";
  width:475px;height:475px;top:-235px;right:-170px;border-radius:50%;
  border:1px solid rgba(255,255,255,.23);
  box-shadow:0 0 0 55px rgba(255,255,255,.07),0 0 0 118px rgba(255,255,255,.045);
}
.s4-showcase:after{
  content:"";position:absolute;z-index:-1;pointer-events:none;
  width:380px;height:380px;left:-230px;bottom:-245px;border-radius:50%;
  background:rgba(81,185,237,.42);box-shadow:0 0 0 62px rgba(255,255,255,.045);
}
.s4-identity{display:flex;gap:13px;align-items:center;position:relative;z-index:1;min-width:0;}
.s4-icon{flex:none;border-radius:17px;background:#fff;padding:8px;box-shadow:0 8px 25px rgba(46,38,100,.16);}
.s4-identity-text{display:flex;flex-direction:column;min-width:0;}
.s4-identity-text strong{font-size:26px;letter-spacing:-.047em;color:#fff;font-weight:850;line-height:1.1;}
.s4-identity-text small{font-size:10px;letter-spacing:.23em;font-weight:800;margin-top:6px;color:rgba(255,255,255,.9);}
.s4-showcase-center{position:relative;z-index:1;max-width:570px;margin:78px 0 50px;}
.s4-eyebrow{font-size:11px;letter-spacing:.17em;font-weight:850;color:#fff;}
.s4-showcase h2{margin:19px 0 23px;font-size:clamp(42px,4.2vw,63px);font-weight:850;line-height:1.07;letter-spacing:-.055em;color:#fff!important;}
.s4-showcase h2 em{font-style:normal;color:#fff1bf;}
.s4-showcase-center p{font-size:17px;line-height:1.65;max-width:450px;color:rgba(255,255,255,.95);margin:0;}
.s4-feature-pills{display:flex;flex-wrap:wrap;gap:9px;margin-top:29px;}
.s4-feature-pills span{
  border:1px solid rgba(255,255,255,.4);border-radius:999px;
  padding:9px 14px;font-size:12px;font-weight:700;
  background:rgba(255,255,255,.15);color:white;
}
.s4-showcase-footer{font-size:10px;letter-spacing:.12em;line-height:1.55;font-weight:750;color:rgba(255,255,255,.88);}
.s4-login-panel{
  display:flex;min-width:0;flex-direction:column;justify-content:center;
  padding:clamp(30px,4.7vw,68px);background:#fff;box-sizing:border-box;
}
.s4-login-top{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:40px;}
.s4-mail-label{font-size:13px;font-weight:900;letter-spacing:.04em;color:#5546b4;}
.s4-mail-label span{color:#ec759f;}
.s4-secure-pill{display:inline-flex;align-items:center;gap:8px;border-radius:999px;
  background:#f0edff;color:#6552b7;padding:8px 12px;font-size:11px;font-weight:700;}
.s4-secure-pill span{color:#36bba7;font-size:13px;}
.s4-login-panel h2{font-size:clamp(33px,3.2vw,44px);font-weight:850;letter-spacing:-.045em;line-height:1.12;margin:0 0 16px;color:var(--s4-ink)!important;}
.s4-login-description{font-size:16px;line-height:1.58;color:var(--s4-sub);margin:0 0 20px;}
.s4-email-hint{font-size:13px;line-height:1.65;background:#f7f5ff;border-left:4px solid #9279e8;
  padding:12px 15px;border-radius:8px;color:#585376;margin-bottom:26px;overflow-wrap:anywhere;}
.s4-login-panel #login-form{display:block;width:100%;max-width:none!important;margin:0!important;padding:0!important;border:0!important;box-shadow:none!important;background:transparent!important;}
.s4-login-panel #login-form .form-group{margin-bottom:16px!important;}
.s4-login-panel #login-form label{font-size:13px;font-weight:750;color:#474668;}
.s4-login-panel #login-form input{width:100%;max-width:100%;min-width:0;border-radius:12px!important;
  border:1px solid #deddf0!important;padding:13px 14px!important;background:#fff!important;color:#27264a!important;
  font-size:15px!important;box-sizing:border-box;}
.s4-login-panel #login-form input:focus{border-color:#775bed!important;box-shadow:0 0 0 3px rgba(119,91,237,.12)!important;}
.s4-login-panel #login-form button[type=submit],.s4-login-panel #login-form input[type=submit],.s4-login-panel #login-form .button.mainaction{
  background:linear-gradient(104deg,#775bed,#a35fda 60%,#ef79aa)!important;border:0!important;
  border-radius:12px!important;color:#fff!important;font-size:15px!important;
  font-weight:800!important;padding:13px 20px!important;min-height:47px!important;width:100%!important;
}
.s4-help{margin-top:30px;padding-top:19px;border-top:1px solid #e9eaf4;color:#73728a;font-size:12px;line-height:1.8;}
.s4-help strong{color:#575073;}
.s4-return{margin-top:16px;}
.s4-return a{font-weight:800;color:#6752cc;text-decoration:none;}
.s4-return a:hover{text-decoration:underline;}
.s4-login-panel #login-footer{margin-top:12px;color:#9697a9;font-size:10px;}
@media (max-width:900px){
  .s4-mail-experience{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);}
  .s4-showcase{padding:35px 27px;}
  .s4-login-panel{padding:38px 32px;}
  .s4-showcase h2{font-size:43px;}
  .s4-showcase-center{margin:55px 0 35px;}
}
@media (max-width:720px){
  .s4-mail-experience{display:flex;flex-direction:column;border-radius:22px;}
  .s4-showcase{padding:28px;min-height:220px;}
  .s4-showcase-center{margin:26px 0 19px;}
  .s4-showcase h2{font-size:clamp(32px,6vw,43px);margin:9px 0 13px;}
  .s4-showcase-center p{font-size:14px;line-height:1.55;}
  .s4-feature-pills{margin-top:16px;}
  .s4-showcase-footer{display:none;}
  .s4-login-panel{padding:32px 27px;}
  .s4-login-top{margin-bottom:24px;}
  body.task-login #layout-content{align-items:flex-start!important;padding:16px!important;}
}
@media (max-width:440px){
  .s4-mail-experience{border-radius:17px;}
  .s4-showcase{padding:22px;}
  .s4-showcase h2{font-size:33px;}
  .s4-identity-text strong{font-size:22px;}
  .s4-feature-pills span{font-size:11px;padding:7px 10px;}
  .s4-login-panel{padding:28px 21px;}
  .s4-secure-pill{font-size:10px;}
  .s4-email-hint{font-size:12px;}
}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;}}