/* Original Roundcube controls, arranged as one spacious Gmail-like navigation column. */
html:root body.cm-navigation {--cm-navigation-width:272px;}
html:root body.cm-navigation #layout-menu {
 display:flex!important;flex-direction:column;flex:0 0 var(--cm-navigation-width);
 width:var(--cm-navigation-width);min-width:var(--cm-navigation-width);max-width:var(--cm-navigation-width);
 height:100%;min-height:0;position:relative;inset:auto;margin:0;padding:0;
 border:0;border-radius:0;background:var(--cm-bg);box-shadow:none;overflow:hidden;
}
html:root body.cm-navigation #taskmenu {
 display:flex;flex-direction:column;flex:1;min-height:0;width:100%;height:100%;padding:0 0 12px;overflow:hidden;
}
html:root body.cm-navigation #layout-menu>.popover-header {display:none;}
html:root body.cm-navigation #taskmenu>.action-buttons {
 display:flex;position:static;order:0;flex:none;padding:6px 16px 16px;margin:0;width:auto;
}
html:root body.cm-navigation #taskmenu>.action-buttons a.compose {
 display:inline-flex!important;align-items:center;justify-content:flex-start;gap:14px;
 width:auto;min-width:184px;max-width:100%;height:56px;min-height:56px;margin:0;padding:0 24px 0 18px;
 border:0;border-radius:16px;background:var(--cm-compose);color:var(--cm-compose-text);box-shadow:0 1px 2px #0001;
 font-size:14px;font-weight:600;line-height:20px;text-decoration:none;
}
html:root body.cm-navigation #taskmenu>.action-buttons a.compose:before {
 content:""!important;display:block;position:static;float:none;flex:0 0 26px;width:26px;height:26px!important;margin:0;
 background:url('plus.svg') center/26px no-repeat;line-height:26px;
}
html:root body.cm-navigation #taskmenu>.action-buttons a.compose:hover {box-shadow:0 2px 6px #0003;filter:brightness(.98);}
html:root body.cm-navigation #taskmenu>a .inner,
html:root body.cm-navigation #taskmenu>.special-buttons>a .inner,
html:root body.cm-navigation #taskmenu>.action-buttons a.compose .inner {
 display:inline!important;min-width:0;max-width:none;padding:0;font-size:14px;font-weight:inherit;line-height:20px;
 white-space:normal;overflow:visible;text-overflow:clip;word-break:normal;
}
html:root body.cm-navigation #taskmenu>a,
html:root body.cm-navigation #taskmenu>.special-buttons>a {
 display:flex;position:static;align-items:center;justify-content:flex-start;gap:14px;
 order:3;flex:none;width:calc(100% - 24px);min-width:0;max-width:none;height:auto;min-height:44px;margin:2px 12px;padding:10px 16px;
 border:0;border-radius:24px;background:transparent;color:var(--cm-text);font-size:14px;font-weight:400;line-height:20px;
 text-align:left;white-space:normal;overflow:visible;box-sizing:border-box;
}
html:root body.cm-navigation #taskmenu>a:before,
html:root body.cm-navigation #taskmenu>.special-buttons>a:before {
 display:block;position:static;float:none;flex:0 0 22px;width:22px;height:24px!important;line-height:24px;margin:0;
 font-size:19px;text-align:center;color:var(--cm-muted);
}
html:root body.cm-navigation #taskmenu>a:hover,
html:root body.cm-navigation #taskmenu>.special-buttons>a:hover {background:var(--cm-hover);}
html:root body.cm-navigation #taskmenu>a.selected {background:var(--cm-selected);color:var(--cm-text);font-weight:600;}
html:root body.cm-navigation #taskmenu>.special-buttons {
 display:block;position:static;order:4;flex:none;width:100%;padding-top:4px;margin-top:6px;border-top:1px solid var(--cm-line);background:transparent;
}
html:root body.cm-navigation #taskmenu .special-buttons .theme,
html:root body.cm-navigation #taskmenu .special-buttons .about {display:none!important;}
html:root body.cm-navigation #taskmenu .logout {color:var(--cm-muted);}
html:root body.cm-navigation.cm-navigation-no-sections #taskmenu>.special-buttons {margin-top:auto;}
html:root body.cm-navigation #taskmenu>#layout-sidebar.cm-navigation-sections {
 display:flex!important;flex-direction:column;order:1;flex:1 1 auto!important;
 width:100%!important;min-width:0;max-width:100%;height:auto;min-height:140px;
 margin:0 0 14px;padding:0;border:0;border-radius:0;background:var(--cm-bg);overflow:hidden;
}
html:root body.cm-navigation #taskmenu>#layout-sidebar>.header {
 display:flex;align-items:center;flex:none;gap:0;min-height:50px;height:auto;line-height:1.4;
 padding:0 12px 8px 16px;margin:0;border:0;background:transparent;color:var(--cm-muted);
}
html:root body.cm-navigation #taskmenu>#layout-sidebar>.header .header-title {
 display:block;flex:1;min-width:0;max-width:none;white-space:normal;text-align:left;
 margin:0!important;padding:0!important;font-size:13px;font-weight:500;line-height:1.4;overflow:visible;
}
html:root body.cm-navigation #taskmenu>#layout-sidebar>.header .back-list-button,
html:root body.cm-navigation #taskmenu>#layout-sidebar>.header .task-menu-button {display:none!important;}
html:root body.cm-navigation #taskmenu>#layout-sidebar>.header>a {display:flex;align-items:center;justify-content:center;flex:0 0 40px;width:40px;height:40px;line-height:40px;}
html:root body.cm-navigation #taskmenu>#layout-sidebar .scroller {flex:1 1 auto;position:relative;min-height:0;overflow:auto;overscroll-behavior:contain;}
html:root body.cm-navigation #taskmenu>#layout-sidebar>.footer {min-height:0;height:auto;padding:4px 16px;border:0;background:transparent;}
html:root body.cm-navigation #taskmenu>#layout-sidebar>.footer:empty {display:none;}
html:root body.cm-navigation #mailboxlist li,
html:root body.cm-navigation #settings-menu li,
html:root body.cm-navigation #directorylist li,
html:root body.cm-navigation #savedsearchlist li {margin-right:12px;border:0;border-radius:0 24px 24px 0;}
html:root body.cm-navigation #mailboxlist li>div,
html:root body.cm-navigation #directorylist li>div,
html:root body.cm-navigation #savedsearchlist li>div {min-height:40px;line-height:40px;margin-right:0;border:0;border-radius:0 24px 24px 0;}
html:root body.cm-navigation #mailboxlist li a,
html:root body.cm-navigation #settings-menu li a,
html:root body.cm-navigation #directorylist li a,
html:root body.cm-navigation #savedsearchlist li a {min-height:40px;line-height:40px;font-size:14px;color:var(--cm-text);}
html:root body.cm-navigation #settings-menu li a {white-space:normal;line-height:20px;padding-top:10px;padding-bottom:10px;}
html:root body.cm-navigation #mailboxlist li.selected,
html:root body.cm-navigation #settings-menu li.selected,
html:root body.cm-navigation #directorylist li.selected,
html:root body.cm-navigation #savedsearchlist li.selected {background:var(--cm-selected);}
html:root body.cm-navigation #owner-mailboxes {max-width:100%;}
html:root body.cm-navigation .cm-top-brand {width:calc(var(--cm-navigation-width) - 28px);flex-basis:calc(var(--cm-navigation-width) - 28px);}
html:root body.cm-navigation #menu-overlay {display:none!important;}
.cm-navigation-backdrop {position:fixed;inset:0;background:rgba(0,0,0,.34);z-index:1200;}
.cm-navigation-backdrop[hidden] {display:none;}
@media(min-width:1201px) {
 html:root body.cm-navigation.cm-navigation-collapsed #layout-menu {display:none!important;}
 /* Preserve the outer gutter when the navigation no longer occupies space. */
 html:root body.cm-navigation.cm-navigation-collapsed #layout {padding-left:16px;}
 html:root body.cm-navigation #layout-list {margin-left:0;}
}
@media(max-width:1200px) {
 html:root body.cm-navigation #layout-menu {
  position:fixed;inset:0 auto 0 0;z-index:1201;flex:none;
  width:min(304px,calc(100vw - 24px));min-width:0;max-width:none;height:100%;height:100dvh;
  border-radius:0 24px 24px 0;background:var(--cm-bg);box-shadow:0 8px 28px #0003;
  transform:translateX(-110%);visibility:hidden;transition:transform .18s ease,visibility .18s;
 }
 html:root body.cm-navigation.cm-navigation-open #layout-menu {transform:translateX(0);visibility:visible;}
 html:root body.cm-navigation #layout-menu>.popover-header {
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex:none;
  height:64px;min-height:64px;padding:8px 16px!important;margin:0;border:0;background:transparent!important;color:var(--cm-text);
 }
 html:root body.cm-navigation #layout-menu>.popover-header #logo {display:block;position:static;width:38px;height:34px;max-width:none;max-height:none;margin:0;}
 html:root body.cm-navigation #layout-menu>.popover-header .cancel {
  display:flex!important;align-items:center;justify-content:center;position:static;flex:none;width:44px;height:44px;min-height:44px;
  padding:0;margin:0;border:0;border-radius:50%;background:transparent;color:var(--cm-muted);line-height:44px;cursor:pointer;
 }
 html:root body.cm-navigation #layout-menu>.popover-header .cancel:before {display:block;position:static;float:none;width:24px;height:24px;margin:0;font-size:22px;line-height:24px;text-align:center;}
 html:root body.cm-navigation #layout-menu>.popover-header .cancel:hover {background:var(--cm-hover);}
 html:root body.cm-navigation #layout-list {margin-left:12px;}
 html:root body.cm-navigation #taskmenu>#layout-sidebar .header-title.username {font-size:13px;}
 html:root body.cm-navigation #taskmenu>#layout-sidebar.cm-navigation-sections {min-height:100px;margin-bottom:8px;}
 html:root body.cm-navigation #mailboxlist li>div,
 html:root body.cm-navigation #directorylist li>div,
 html:root body.cm-navigation #savedsearchlist li>div,
 html:root body.cm-navigation #mailboxlist li a,
 html:root body.cm-navigation #directorylist li a,
 html:root body.cm-navigation #savedsearchlist li a {min-height:44px;line-height:44px;}
 html:root body.cm-navigation #taskmenu>.special-buttons {padding-bottom:env(safe-area-inset-bottom);}
}
@media(max-width:768px) {
 html:root body.cm-navigation .cm-top-brand {width:auto;flex-basis:auto;}
 html:root body.cm-navigation .cm-top-brand .cm-nav-toggle {display:inline-flex;}
 html:root body.cm-navigation .cm-top-brand>span {font-size:19px;}
 html:root body.cm-navigation .cm-top-brand {gap:8px;}
 html:root body.cm-navigation #cm-topbar {padding-left:8px;}
 html:root body.cm-navigation #layout-list {margin-left:0;}
 /* The top-level hamburger replaces duplicate in-panel navigation triggers. */
 html:root body.cm-navigation #layout-list>.header>.task-menu-button,
 html:root body.cm-navigation #layout-list>.header>.back-sidebar-button,
 html:root body.cm-navigation #layout-content>.header>.task-menu-button {display:none!important;}
}
@media(max-width:359px) {
 html:root body.cm-navigation .cm-top-brand>img {width:26px;height:26px;}
 html:root body.cm-navigation .cm-top-brand>span {font-size:17px;}
 html:root body.cm-navigation #cm-topbar {gap:4px;padding-right:8px;}
 html:root body.cm-navigation .cm-top-actions {gap:4px;}
}
@media(max-height:600px) {
 html:root body.cm-navigation #taskmenu {overflow:auto;}
 html:root body.cm-navigation #taskmenu>#layout-sidebar.cm-navigation-sections {flex:none!important;min-height:160px;max-height:240px;}
}
@media(prefers-reduced-motion:reduce) {html:root body.cm-navigation #layout-menu {transition:none;}}

/* Elastic has mobile !important rules for the former icon rail. Limit the overrides to this owned column. */
html:root body.cm-navigation #taskmenu a {border-bottom:0!important;}
html:root body.cm-navigation #taskmenu>a:before,
html:root body.cm-navigation #taskmenu>.special-buttons>a:before {float:none!important;width:22px!important;margin-right:0!important;}
html:root body.cm-navigation #taskmenu>.action-buttons a.compose:before {float:none!important;width:26px!important;margin-right:0!important;}
html:root body.cm-navigation #taskmenu .logout,
html:root body.cm-navigation #taskmenu .logout:hover {color:var(--cm-muted)!important;}
html:root body.cm-navigation #taskmenu>#layout-sidebar>.column-resizer {display:none!important;}

/* Descendant directory rows must not inherit the former toolbar's icon-grid geometry. */
html:root body.cm-navigation #taskmenu>#layout-sidebar .listing,
html:root body.cm-navigation #taskmenu>#layout-sidebar .listing li {display:block;float:none;max-width:none;}
html:root body.cm-navigation #taskmenu>#layout-sidebar .listing {width:100%;padding:0;}
html:root body.cm-navigation #taskmenu>#layout-sidebar .listing li {width:auto;min-width:0;height:auto;min-height:0;margin-bottom:4px;box-sizing:border-box;}
html:root body.cm-navigation #taskmenu>#layout-sidebar .listing li>a,
html:root body.cm-navigation #taskmenu>#layout-sidebar .listing li>div>a {
 display:block;float:none;position:relative;width:100%;max-width:100%;height:auto;min-height:40px;
 margin:0;padding:0 16px;box-sizing:border-box;border:0;border-radius:inherit;
 background:transparent;box-shadow:none;text-align:left;font-size:14px;line-height:40px;white-space:nowrap;
}
html:root body.cm-navigation #taskmenu>#layout-sidebar .listing li>a:before,
html:root body.cm-navigation #taskmenu>#layout-sidebar .listing li>div>a:before {
 display:inline-block;position:static;float:none!important;width:20px!important;height:20px!important;
 margin:0 12px 0 0!important;font-size:18px;line-height:20px;vertical-align:middle;text-align:center;
}
html:root body.cm-navigation #taskmenu>#layout-sidebar .treelist li>a {padding-left:1.5em;}
html:root body.cm-navigation #taskmenu>#layout-sidebar .treelist li ul li>a {padding-left:3em;}
html:root body.cm-navigation #taskmenu>#layout-sidebar .treelist li ul li li>a {padding-left:4.5em;}
html:root body.cm-navigation #taskmenu>#layout-sidebar .treelist li ul li li li>a {padding-left:6em;}
html:root body.cm-navigation #taskmenu>#layout-sidebar .treelist li ul li li li li>a {padding-left:7.5em;}
html:root body.cm-navigation #taskmenu>#layout-sidebar .treelist li ul li li li li li>a {padding-left:9em;}
html:root body.cm-navigation #taskmenu>#layout-sidebar .listing li.selected>a {font-weight:600;}
html:root body.cm-navigation #taskmenu>#layout-sidebar>.header .inner {display:none!important;}
@media(max-width:1200px) {
 html:root body.cm-navigation #taskmenu>#layout-sidebar .listing li>a,
 html:root body.cm-navigation #taskmenu>#layout-sidebar .listing li>div>a {min-height:44px;line-height:44px;}
}

html:root body.cm-navigation #taskmenu>#layout-sidebar>.header>a {flex-basis:44px;width:44px;min-width:44px;max-width:44px;height:44px;min-height:44px;line-height:44px;margin:0;padding:0;}
html:root body.cm-navigation #taskmenu>#layout-sidebar>.header>a:before {display:block;float:none!important;width:24px!important;height:24px!important;margin:0!important;font-size:20px;line-height:24px;text-align:center;}
html:root body.cm-navigation #taskmenu>#layout-sidebar .listing li>a:hover,
html:root body.cm-navigation #taskmenu>#layout-sidebar .listing li>div>a:hover {background:var(--cm-hover);}

html:root body.cm-navigation #taskmenu>.action-buttons {align-items:center;gap:8px;}
html:root body.cm-navigation #taskmenu>.action-buttons a.compose {flex:1 1 auto;min-width:0;padding-inline:14px;gap:10px;}
html:root body.cm-navigation #taskmenu>.action-buttons a.cm-folder-actions {display:flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;min-width:44px;padding:0;margin:0;border:0;border-radius:50%;background:transparent;color:var(--cm-muted);}
html:root body.cm-navigation #taskmenu>.action-buttons a.cm-folder-actions:before {content:'';display:block;float:none;margin:0;width:24px;height:24px;background:radial-gradient(circle at 50% 25%,currentColor 1.8px,transparent 2px),radial-gradient(circle at 50% 50%,currentColor 1.8px,transparent 2px),radial-gradient(circle at 50% 75%,currentColor 1.8px,transparent 2px);}
html:root body.cm-navigation #taskmenu>.action-buttons a.cm-folder-actions .inner {display:none!important;}
html:root body.cm-navigation #taskmenu>.action-buttons a.cm-folder-actions:hover {background:var(--cm-hover);}
html:root body.cm-navigation #taskmenu>#layout-sidebar.cm-owner-header-hidden>.header {display:none!important;}

/* Native icon rules must not position/clip the relocated folder action. */
html:root body.cm-navigation #taskmenu>.action-buttons a.cm-folder-actions {position:relative!important;inset:auto!important;display:inline-flex!important;visibility:visible!important;opacity:1;float:none!important;overflow:visible;box-sizing:border-box;max-width:44px;max-height:44px;line-height:1;}
html:root body.cm-navigation #taskmenu>.action-buttons a.cm-folder-actions:before {display:none!important;content:none!important;}
html:root body.cm-navigation #taskmenu>.action-buttons a.cm-folder-actions>.cm-folder-dots {display:block!important;flex:0 0 24px;width:24px;height:24px;overflow:visible;color:var(--cm-muted);pointer-events:none;}

html:root body.cm-navigation #taskmenu>.action-buttons a.cm-folder-actions {height:44px!important;min-height:44px!important;max-height:44px!important;padding:0!important;border:0!important;}
