:root {
  --brand-dark: #343434;
  --brand-dark-2: #292929;
  --brand-gold: #d5ae59;
  --brand-gold-soft: #f2dfad;
  --brand-line: #dedede;
  --brand-sidebar: #f6f6f6;
  --brand-text: #333;
}

/* V5 desktop correction: keep Roundcube folder and navigation containers visible. */
@media screen and (min-width: 769px) {
  body.task-mail #layout-sidebar { display:flex!important; flex-direction:column!important; overflow:hidden!important; }
  body.task-mail #layout-sidebar > .header,
  body.task-mail #layout-sidebar .header { position:relative!important; inset:auto!important; flex:0 0 54px!important; width:100%!important; }
  body.task-mail #layout-sidebar > .scroller,
  body.task-mail #layout-sidebar .scroller { position:relative!important; inset:auto!important; display:block!important; flex:1 1 auto!important; width:100%!important; height:auto!important; min-height:0!important; overflow:auto!important; visibility:visible!important; opacity:1!important; }
  body.task-mail #layout-sidebar .folderlist,
  body.task-mail #layout-sidebar ul { position:relative!important; inset:auto!important; display:block!important; width:100%!important; height:auto!important; visibility:visible!important; opacity:1!important; }
  body.task-mail #layout-sidebar .folderlist li { position:relative!important; display:block!important; width:100%!important; min-height:38px!important; visibility:visible!important; }
  body.task-mail #layout-sidebar .folderlist li a { display:flex!important; align-items:center!important; width:100%!important; min-height:38px!important; padding:7px 16px!important; overflow:hidden!important; white-space:nowrap!important; text-overflow:ellipsis!important; font-size:14px!important; }
  body.task-mail #layout-menu .button,
  body.task-mail #layout-menu a.button { display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; gap:2px!important; min-width:76px!important; height:58px!important; padding:5px 10px!important; line-height:16px!important; overflow:hidden!important; }
  body.task-mail #layout-menu .button:before,
  body.task-mail #layout-menu a.button:before { position:static!important; margin:0!important; line-height:22px!important; }
  body.task-mail #layout-menu .button .inner,
  body.task-mail #layout-menu a.button .inner,
  body.task-mail #layout-menu .button span { position:static!important; display:block!important; max-width:100%!important; line-height:16px!important; white-space:nowrap!important; }
}

/* V4 desktop structure: fixed mail-client layout, independent from Elastic flex widths. */
@media screen and (min-width: 1000px) {
  body.task-mail #layout {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: #fff !important;
  }

  body.task-mail #layout-menu {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    width: auto !important;
    height: 88px !important;
    min-height: 88px !important;
    padding: 0 18px 0 205px !important;
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: flex-end !important;
    background: linear-gradient(#343434, #292929) !important;
    overflow: visible !important;
  }

  body.task-mail #layout-menu:before {
    content: "企业邮箱" !important;
    left: 22px !important;
    top: 17px !important;
    font-size: 28px !important;
    line-height: 36px !important;
    color: #f1d582 !important;
    text-shadow: 0 1px rgba(0,0,0,.25);
  }

  body.task-mail #layout-menu .task-menu,
  body.task-mail #layout-menu .menu.toolbar,
  body.task-mail #layout-menu .special-buttons {
    position: static !important;
    display: flex !important;
    flex-flow: row nowrap !important;
    width: auto !important;
    height: 42px !important;
    min-height: 42px !important;
    overflow: visible !important;
  }

  body.task-mail #layout-menu a.button,
  body.task-mail #layout-menu .button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    width: auto !important;
    min-width: 105px !important;
    max-width: none !important;
    height: 42px !important;
    padding: 0 20px !important;
    margin: 0 !important;
    color: #ddd !important;
    border: 0 !important;
    border-left: 1px solid rgba(255,255,255,.06) !important;
    background: transparent !important;
  }

  body.task-mail #layout-menu a.button.selected,
  body.task-mail #layout-menu .button.selected {
    background: #ead18a !important;
    color: #3c321f !important;
  }

  body.task-mail #layout-sidebar {
    position: absolute !important;
    z-index: 10 !important;
    top: 88px !important;
    left: 0 !important;
    right: auto !important;
    bottom: 0 !important;
    width: 220px !important;
    min-width: 220px !important;
    max-width: 220px !important;
    height: auto !important;
    flex: none !important;
    transform: none !important;
    overflow: hidden !important;
    background: #f6f6f6 !important;
    border-right: 1px solid #ddd !important;
  }

  body.task-mail #layout-sidebar > *,
  body.task-mail #layout-sidebar .scroller,
  body.task-mail #layout-sidebar .listing,
  body.task-mail #layout-sidebar .folderlist {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  body.task-mail #layout-sidebar .scroller {
    position: absolute !important;
    top: 58px !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    overflow: auto !important;
  }

  body.task-mail #layout-sidebar .header {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 58px !important;
    min-height: 58px !important;
    padding: 8px 12px !important;
    background: #efefef !important;
  }

  body.task-mail #layout-sidebar .header .button,
  body.task-mail #layout-sidebar .compose {
    width: calc(100% - 24px) !important;
    height: 40px !important;
    margin: 1px 12px !important;
    border-radius: 2px !important;
    background: #e7c978 !important;
    color: #3f3219 !important;
    font-weight: 700 !important;
  }

  body.task-mail #layout-sidebar .folderlist li,
  body.task-mail #layout-sidebar .folderlist li a {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 38px !important;
    line-height: 38px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  body.task-mail #layout-list {
    position: absolute !important;
    z-index: 8 !important;
    top: 88px !important;
    left: 220px !important;
    right: auto !important;
    bottom: 0 !important;
    width: 460px !important;
    min-width: 460px !important;
    max-width: 460px !important;
    height: auto !important;
    flex: none !important;
    transform: none !important;
    overflow: hidden !important;
    border-right: 1px solid #d9d9d9 !important;
    background: #fff !important;
  }

  body.task-mail #layout-list > .header {
    min-height: 58px !important;
    height: 58px !important;
    background: #fafafa !important;
    border-bottom: 1px solid #ddd !important;
  }

  body.task-mail #layout-list .scroller {
    overflow: auto !important;
  }

  body.task-mail #layout-content {
    position: absolute !important;
    z-index: 6 !important;
    top: 88px !important;
    left: 680px !important;
    right: 0 !important;
    bottom: 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    flex: none !important;
    transform: none !important;
    overflow: auto !important;
    background: #fff !important;
  }

  body.task-mail #layout-content > .header,
  body.task-mail #layout-content .content-head {
    min-height: 58px !important;
    background: #fafafa !important;
    border-bottom: 1px solid #ddd !important;
  }

  body.task-mail .messagelist tr {
    height: 58px !important;
  }

  body.task-mail .messagelist tr.selected td {
    background: #fff5d9 !important;
  }

  body.task-mail .messagelist tr:hover td {
    background: #fff9e9 !important;
  }

  body.task-mail #layout-content:after {
    content: "企业邮箱";
    position: absolute;
    z-index: -1;
    right: 8%;
    bottom: 8%;
    color: #f2f2f2;
    font-size: 86px;
    font-weight: 700;
    letter-spacing: 8px;
    transform: rotate(-8deg);
    pointer-events: none;
  }
}

html, body {
  font-family: "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", Arial, sans-serif !important;
  color: var(--brand-text);
}

body.task-login {
  background: linear-gradient(135deg, #f7f4ed 0%, #fff 48%, #eee9dc 100%) !important;
}

.task-login #layout-content {
  background: transparent !important;
}

.task-login #login-form {
  border: 1px solid #ded7c6;
  border-radius: 8px;
  box-shadow: 0 16px 45px rgba(35, 30, 20, .13);
  background: rgba(255,255,255,.96);
}

.task-login #logo:after {
  content: "企业邮箱";
  display: block;
  color: var(--brand-dark);
  font-size: 27px;
  font-weight: 700;
  letter-spacing: 2px;
  margin: 8px 0 22px;
}

.task-login #logo img { display: none !important; }

button.btn-primary,
.btn.btn-primary,
.floating-action-buttons a.button {
  background: var(--brand-gold) !important;
  border-color: #c59d48 !important;
  color: #241e13 !important;
  box-shadow: none !important;
}

button.btn-primary:hover,
.btn.btn-primary:hover {
  background: #c69d48 !important;
}

#layout-menu {
  background: linear-gradient(180deg, var(--brand-dark), var(--brand-dark-2)) !important;
  color: #fff;
  border-right: 0 !important;
}

#layout-menu .popover-header,
#layout-menu .special-buttons {
  background: transparent !important;
}

#layout-menu .button,
#layout-menu a {
  color: #e8e8e8 !important;
}

#layout-menu .button.selected,
#layout-menu .button:hover,
#layout-menu a:hover {
  background: rgba(213,174,89,.20) !important;
  color: var(--brand-gold-soft) !important;
}

#layout-sidebar {
  background: var(--brand-sidebar) !important;
  border-right: 1px solid var(--brand-line) !important;
}

#layout-list {
  border-right: 1px solid var(--brand-line) !important;
  background: #fff !important;
}

#layout-content { background: #fff !important; }

.header,
.listbox .header,
.content-head,
#layout-list > .header,
#layout-content > .header {
  background: #fafafa !important;
  border-color: var(--brand-line) !important;
}

.menu.toolbar a.selected,
.listing li.selected,
.listing tr.selected td,
.messagelist tr.selected td {
  background: #f5e7c4 !important;
  color: #382b12 !important;
}

.listing li:hover,
.listing tr:hover td,
.messagelist tr:hover td {
  background: #fbf5e7 !important;
}

.messagelist td,
.listing td {
  border-bottom-color: #ececec !important;
}

.folderlist li a {
  color: #4a4a4a !important;
}

.folderlist li.selected > a {
  color: #8b641d !important;
  font-weight: 700;
}

.quota-widget .bar .value { background: var(--brand-gold) !important; }

input:focus, textarea:focus, select:focus,
.form-control:focus {
  border-color: #caa24e !important;
  box-shadow: 0 0 0 .16rem rgba(202,162,78,.18) !important;
}

@media screen and (min-width: 769px) {
  body.task-mail #layout,
  body.task-addressbook #layout,
  body.task-settings #layout {
    position: fixed !important;
    inset: 0 !important;
    padding-top: 86px !important;
    display: grid !important;
    grid-template-columns: 220px minmax(390px, 32vw) minmax(480px, 1fr) !important;
    grid-template-rows: minmax(0, 1fr) !important;
    grid-template-areas: "sidebar list content" !important;
    background: #fff !important;
  }

  body.task-mail #layout-menu,
  body.task-addressbook #layout-menu,
  body.task-settings #layout-menu {
    position: fixed !important;
    z-index: 1000 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: auto !important;
    height: 86px !important;
    min-height: 86px !important;
    padding: 0 24px 0 185px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-end !important;
    overflow: visible !important;
    border-bottom: 1px solid #1d1d1d !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.18);
  }

  body.task-mail #layout-menu:before,
  body.task-addressbook #layout-menu:before,
  body.task-settings #layout-menu:before {
    content: "企业邮箱";
    position: absolute;
    left: 24px;
    top: 16px;
    color: #f0d483;
    font-size: 26px;
    line-height: 38px;
    font-weight: 700;
    letter-spacing: 2px;
  }

  #layout-menu .popover-header { display: none !important; }

  #layout-menu .menu.toolbar,
  #layout-menu .task-menu,
  #layout-menu .special-buttons {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    height: 42px !important;
    margin: 0 !important;
  }

  #layout-menu .button,
  #layout-menu a.button {
    min-width: 95px !important;
    height: 42px !important;
    padding: 10px 18px !important;
    border-radius: 0 !important;
    text-align: center !important;
    line-height: 22px !important;
  }

  #layout-menu .button.selected {
    background: var(--brand-gold) !important;
    color: #2e2515 !important;
  }

  body.task-mail #layout-sidebar,
  body.task-addressbook #layout-sidebar,
  body.task-settings #layout-sidebar {
    position: relative !important;
    grid-area: sidebar !important;
    inset: auto !important;
    width: auto !important;
    min-width: 0 !important;
    height: 100% !important;
    display: block !important;
    overflow: auto !important;
  }

  body.task-mail #layout-list,
  body.task-addressbook #layout-list,
  body.task-settings #layout-list {
    position: relative !important;
    grid-area: list !important;
    inset: auto !important;
    width: auto !important;
    min-width: 0 !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }

  body.task-mail #layout-content,
  body.task-addressbook #layout-content,
  body.task-settings #layout-content {
    position: relative !important;
    grid-area: content !important;
    inset: auto !important;
    width: auto !important;
    min-width: 0 !important;
    height: 100% !important;
    overflow: auto !important;
  }

  #layout-sidebar .header {
    min-height: 54px !important;
    background: #eee !important;
  }

  #layout-sidebar .header a.button.compose,
  #layout-sidebar a.button.compose {
    margin: 9px 14px !important;
    width: calc(100% - 28px) !important;
    border-radius: 3px !important;
    background: var(--brand-gold) !important;
    color: #2d2413 !important;
  }

  .folderlist li a {
    padding-top: 9px !important;
    padding-bottom: 9px !important;
  }

  #layout-list .header {
    min-height: 54px !important;
  }

  .messagelist tr { height: 52px !important; }

  body.task-login #layout {
    min-height: 100vh;
    background: transparent !important;
  }

  body.task-login #login-form {
    width: 410px !important;
    padding: 42px 50px !important;
  }
}

/* V5 final overrides must remain at the end of this file. */
@media screen and (min-width: 769px) {
  body.task-mail #layout-sidebar { display:flex!important; flex-direction:column!important; overflow:hidden!important; }
  body.task-mail #layout-sidebar > .header,
  body.task-mail #layout-sidebar .header { position:relative!important; inset:auto!important; flex:0 0 54px!important; width:100%!important; }
  body.task-mail #layout-sidebar > .scroller,
  body.task-mail #layout-sidebar .scroller { position:relative!important; inset:auto!important; display:block!important; flex:1 1 auto!important; width:100%!important; height:auto!important; min-height:0!important; overflow:auto!important; visibility:visible!important; opacity:1!important; }
  body.task-mail #layout-sidebar .folderlist,
  body.task-mail #layout-sidebar ul { position:relative!important; inset:auto!important; display:block!important; width:100%!important; height:auto!important; visibility:visible!important; opacity:1!important; }
  body.task-mail #layout-sidebar .folderlist li { position:relative!important; display:block!important; width:100%!important; min-height:38px!important; visibility:visible!important; }
  body.task-mail #layout-sidebar .folderlist li a { display:flex!important; align-items:center!important; width:100%!important; min-height:38px!important; padding:7px 16px!important; overflow:hidden!important; white-space:nowrap!important; text-overflow:ellipsis!important; font-size:14px!important; }
  body.task-mail #layout-menu .button,
  body.task-mail #layout-menu a.button { display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; gap:2px!important; min-width:76px!important; height:58px!important; padding:5px 10px!important; line-height:16px!important; overflow:hidden!important; }
  body.task-mail #layout-menu .button:before,
  body.task-mail #layout-menu a.button:before { position:static!important; margin:0!important; line-height:22px!important; }
  body.task-mail #layout-menu .button .inner,
  body.task-mail #layout-menu a.button .inner,
  body.task-mail #layout-menu .button span { position:static!important; display:block!important; max-width:100%!important; line-height:16px!important; white-space:nowrap!important; }
}