/* Roise's inbox uses a full-width list inspired by the supplied reference. */
body:not(.task-login) { background: #f6f8fc; color: #202124; }
body:not(.task-login) #taskmenu { background: #f6f8fc; color: #444746; }
body:not(.task-login) #taskmenu a { color: #444746; }
body:not(.task-login) #taskmenu a.selected { background: #d3e3fd; color: #001d35; }
body:not(.task-login) .btn-primary { background: #0b57d0; border-color: #0b57d0; }
body:not(.task-login) .btn-primary:hover { background: #0842a0; border-color: #0842a0; }
body:not(.task-login) .listing li.selected > a { background: #d3e3fd; color: #001d35; }
body:not(.task-login) .listing li > a:hover { background: #e8edf5; }

@media (min-width: 1024px) {
  body.roise-shell { --roise-sidebar: 256px; font-family: Arial, Helvetica, sans-serif; }
  body.roise-shell #layout { display: grid; grid-template-columns: var(--roise-sidebar) minmax(0, 1fr); grid-template-rows: 72px minmax(0, 1fr); height: 100dvh; background: #f6f8fc; overflow: hidden; }
  body.roise-shell #layout-menu { display: none !important; }
  body.roise-shell #layout > h1.voice { position: absolute; }
  body.roise-shell .roise-topbar { grid-column: 1 / -1; grid-row: 1; display: grid; grid-template-columns: var(--roise-sidebar) minmax(280px, 1fr) auto; align-items: center; gap: 20px; padding-right: 24px; min-width: 0; z-index: 12; }
  .roise-brand { display: flex; align-items: center; gap: 12px; padding-left: 16px; min-width: 0; }
  .roise-nav-toggle { width: 40px; height: 40px; display: grid; place-items: center; border: 0; border-radius: 50%; color: #444746; background: transparent; flex-shrink: 0; }
  .roise-nav-toggle:hover { background: #e8edf5; }
  .roise-nav-toggle svg, .roise-folder-list svg { width: 20px; height: 20px; }
  .roise-brand-link { display: flex; align-items: center; gap: 10px; color: #444746; text-decoration: none !important; white-space: nowrap; }
  .roise-brand-link:hover { color: #202124; }
  .roise-brand-mark { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: #0b57d0; color: white; }
  .roise-brand-mark svg { width: 23px; height: 23px; }
  .roise-brand-name { font-size: 23px; font-weight: 400; letter-spacing: -.6px; }
  .roise-search-slot { max-width: 780px; min-width: 0; }
  .roise-topbar .searchbar { position: relative; height: 52px; border: 0; border-radius: 28px; padding: 0 14px 0 20px; background: #e9eef6; box-shadow: none; display: flex !important; align-items: center; }
  .roise-topbar .searchbar:focus-within { background: white; box-shadow: 0 1px 3px #3c404340, 0 1px 2px #3c404326; }
  .roise-topbar .searchbar form { flex: 1; display: flex; align-items: center; margin: 0; min-width: 0; }
  .roise-topbar .searchbar form::before { color: #444746; font-size: 19px; }
  .roise-topbar .searchbar input { padding: 0 14px; height: 50px; font-size: 16px; color: #202124; background: transparent !important; border: none !important; box-shadow: none !important; width: 100%; }
  .roise-topbar .searchbar .button { flex: 0 0 32px; height: 36px; line-height: 36px; border-radius: 50%; color: #444746; position: static; margin: 0; }
  .roise-topbar .searchbar .button:hover { background: #dfe5ef; }
  .roise-topbar .searchbar .button::before { float: none; line-height: 36px; font-size: 18px; }
  .roise-topbar .searchbar .button.search { display: none; }
  .roise-inbox-link { color: #444746; font-size: 16px; }
  .roise-top-actions { display: flex; align-items: center; gap: 8px; }
  .roise-top-actions > a { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; color: #5f6368; border-radius: 50%; font-size: 19px; text-decoration: none; }
  .roise-top-actions > a:hover { color: #202124; background: #e8edf5; }
  .roise-top-actions > a::before, .roise-profile-menu a::before { font-family: 'Icons'; font-size: 19px; }
  .roise-top-actions .contacts::before { content: '\f0c0'; font-weight: 900; }
  .roise-top-actions .settings::before { content: '\f013'; font-weight: 900; }
  .roise-top-actions .about::before { content: '\f059'; }
  .roise-top-actions > a .inner { display: none; }
  .roise-profile { position: relative; margin-left: 8px; }
  .roise-avatar { display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 50%; color: #fff; background: #7a4d2f; font-size: 17px; font-weight: 600; box-shadow: 0 0 0 4px #e4e9f2; }
  .roise-avatar:hover { box-shadow: 0 0 0 4px #d3e3fd; }
  .roise-profile-menu { position: absolute; top: 48px; right: 0; width: 300px; padding: 22px; border: 1px solid #e0e4ea; border-radius: 20px; background: #fff; box-shadow: 0 8px 30px #20212420; }
  .roise-profile-menu[hidden] { display: none; }
  .roise-profile-title, .roise-profile-email { display: block; }
  .roise-profile-title { font-size: 15px; }
  .roise-profile-email { color: #5f6368; font-size: 13px; margin: 8px 0 20px; overflow-wrap: anywhere; }
  .roise-profile-menu a.logout { display: flex; align-items: center; gap: 12px; color: #444746; font-size: 14px; }
  .roise-profile-menu a.logout::before { content: '\f2f5'; }
  body.roise-inbox #layout-sidebar, .roise-folders-side { grid-column: 1; grid-row: 2; background: transparent; border: 0; width: auto !important; min-width: 0 !important; max-width: none !important; display: flex !important; flex-direction: column; padding: 8px 14px 16px 0; overflow: hidden; }
  body.roise-inbox #layout-sidebar > .header, body.roise-inbox #layout-sidebar > .footer { display: none; }
  body.roise-shell .column-resizer { display: none !important; }
  .roise-compose-slot { padding: 0 0 16px 16px; flex: 0 0 auto; }
  .roise-compose-slot a.compose { display: inline-flex; align-items: center; gap: 16px; height: 58px; padding: 0 23px; color: #001d35; background: #c2e7ff; border-radius: 16px; box-shadow: none; font-size: 14px; font-weight: 600; text-decoration: none; }
  .roise-compose-slot a.compose::before { content: '\f304'; font-family: 'Icons'; font-size: 20px; }
  .roise-compose-slot a.compose:hover { box-shadow: 0 2px 5px #3c404340; background: #b5e1fd; }
  .roise-compose-slot a.compose .inner { display: inline !important; }
  body.roise-inbox #folderlist-content { flex: 1; background: transparent; }
  body.roise-inbox #mailboxlist, .roise-folder-list { margin: 0; padding: 0; list-style: none; }
  body.roise-inbox #mailboxlist li, .roise-folder-list li { border: 0; }
  body.roise-inbox #mailboxlist li > a, .roise-folder-list li > a { display: flex; align-items: center; gap: 16px; border: none; color: #444746; height: 36px; padding: 0 18px 0 28px; margin-right: 0; border-radius: 0 20px 20px 0; font-size: 14px; font-weight: 400; text-decoration: none; }
  body.roise-inbox #mailboxlist li > a::before { font-size: 17px; width: 20px; margin: 0; float: none; flex-shrink: 0; }
  body.roise-inbox #mailboxlist li.selected > a, .roise-folder-list li.selected > a { color: #001d35; background: #d3e3fd; font-weight: 600; }
  body.roise-inbox #mailboxlist li > a:hover, .roise-folder-list li > a:hover { background: #e8edf5; }
  body.roise-inbox #mailboxlist li.selected > a:hover, .roise-folder-list li.selected > a:hover { background: #d3e3fd; }
  body.roise-inbox #mailboxlist .unreadcount { margin-left: auto; background: none; color: inherit; padding: 0; font-size: 12px; }
  body.roise-inbox #mailboxlist .roise-starred > a::before { content: '\f005'; font-weight: 400; }
  body.roise-starred-active #mailboxlist li.selected > a { background: none; font-weight: 400; }
  body.roise-starred-active #mailboxlist .roise-starred > a { background: #d3e3fd; color: #001d35; font-weight: 600; }
  .roise-folder-list svg { flex-shrink: 0; }
  .roise-sidebar-identity { margin: auto 20px 0 28px; padding-top: 24px; color: #747775; font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 0 0 auto; }
  body.roise-inbox #layout-list { grid-column: 2; grid-row: 2; display: flex !important; flex-direction: column; width: auto !important; min-width: 0 !important; max-width: none !important; border: none; background: #fff; margin: 0 20px 20px 0; border-radius: 18px; overflow: hidden; }
  body.roise-inbox #layout-content { display: none !important; }
  body.roise-inbox #messagelist-header { flex: 0 0 52px; height: 52px; min-height: 52px; display: flex; align-items: center; gap: 4px; padding: 0 16px; background: #fff; border: none; }
  body.roise-inbox #messagelist-header > .header-title, body.roise-inbox #messagelist-header > .task-menu-button, body.roise-inbox #messagelist-header > .back-sidebar-button, body.roise-inbox #messagelist-header > .toolbar-menu-button { display: none !important; }
  .roise-select-all { appearance: auto; width: 15px; height: 15px; margin: 0 4px; accent-color: #0b57d0; cursor: pointer; }
  body.roise-inbox #messagelist-header .toolbar { display: flex !important; float: none; height: 36px; margin: 0; padding: 0; border: none; }
  body.roise-inbox #messagelist-header a { color: #5f6368; border: none; border-radius: 50%; height: 36px; line-height: 36px; }
  body.roise-inbox #messagelist-header a::before { font-size: 16px; line-height: 36px; float: none; margin: 0; }
  body.roise-inbox #messagelist-header a:hover { color: #202124; background: #e8edf5; }
  body.roise-inbox #messagelist-header a .inner { display: none !important; }
  body.roise-inbox #messagelist-header > a.refresh { width: 36px; margin: 0; padding: 0; text-align: center; }
  body.roise-inbox #messagelist-header .select::before { content: '\f0d7'; }
  body.roise-inbox #messagelist-header .options { order: 3; }
  .roise-selection-actions { display: none; align-items: center; gap: 2px; }
  body.roise-has-selection .roise-selection-actions { display: flex; }
  .roise-selection-actions a { width: 36px; text-align: center; }
  .roise-selection-actions .archive::before { content: '\f187'; font-family: 'Icons'; }
  .roise-selection-actions .delete::before { content: '\f2ed'; font-family: 'Icons'; }
  body.roise-inbox #messagelist-header .pagenav { display: flex !important; align-items: center; gap: 4px; position: static; height: 36px; line-height: 36px; min-height: 0; margin-left: auto; padding: 0; border: none; background: none; order: 10; }
  body.roise-inbox #messagelist-header .pagenav .firstpage, body.roise-inbox #messagelist-header .pagenav .lastpage, body.roise-inbox #messagelist-header .pagenav input { display: none !important; }
  body.roise-inbox #messagelist-header .pagenav .pagenav-text { order: 0; margin-right: 14px; color: #747775; font-size: 12px; white-space: nowrap; }
  body.roise-inbox #messagelist-header .pagenav a { width: 32px; padding: 0; text-align: center; order: 1; }
  body.roise-inbox #messagelist-header .pagenav a.disabled { opacity: .35; }
  body.roise-inbox #messagelist-content { flex: 1; width: 100%; min-height: 0; overflow: auto; background: #fff; }
  body.roise-inbox #messagelist { display: table; width: 100%; table-layout: fixed; border: 0; border-collapse: collapse; }
  body.roise-inbox #messagelist thead { display: none !important; }
  body.roise-inbox #messagelist tbody { display: block; width: 100%; }
  body.roise-inbox #messagelist tbody tr.message { display: grid; grid-template-columns: 32px 32px minmax(140px, 210px) minmax(0, 1fr) 108px 28px; align-items: center; position: relative; min-height: 44px; height: 44px; padding: 0 16px 0 12px; background: #f2f6fc; box-shadow: inset 0 -1px 0 #e4e8ee; border: 0; color: #3c4043; cursor: pointer; }
  body.roise-inbox #messagelist tbody tr.unread { background: #fff; color: #202124; font-weight: 600; }
  body.roise-inbox #messagelist tbody tr.message:hover { z-index: 1; box-shadow: inset 1px 0 0 #dadce0, inset -1px 0 0 #dadce0, 0 1px 3px #3c40432a; }
  body.roise-inbox #messagelist tbody tr.message.selected { background: #c2dbff !important; }
  body.roise-inbox #messagelist tbody td { display: block; border: 0; padding: 0; width: auto; min-width: 0; max-width: none; height: auto; vertical-align: middle; color: inherit; background: transparent !important; font-size: 14px; line-height: 44px; }
  body.roise-inbox #messagelist tbody td.selection { grid-column: 1; grid-row: 1; display: flex !important; align-items: center; justify-content: flex-start; visibility: visible; }
  body.roise-inbox #messagelist tbody td.selection input { appearance: auto; position: static; width: 15px; height: 15px; opacity: .65; margin: 0 0 0 6px; accent-color: #0b57d0; cursor: pointer; }
  body.roise-inbox #messagelist tbody td.flag { grid-column: 2; grid-row: 1; }
  body.roise-inbox #messagelist tbody td.fromto { grid-column: 3; grid-row: 1; padding-right: 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  body.roise-inbox #messagelist tbody td.subject { grid-column: 4; grid-row: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  body.roise-inbox #messagelist tbody td.date { grid-column: 5; grid-row: 1; text-align: right; font-size: 12px; color: #747775; padding-right: 10px; }
  body.roise-inbox #messagelist tbody td.attachment { grid-column: 6; grid-row: 1; }
  body.roise-inbox #messagelist tbody td.size, body.roise-inbox #messagelist tbody td.status, body.roise-inbox #messagelist tbody td.threads { display: none; }
  body.roise-inbox #messagelist tbody td.subject:has(> span.fromto) { grid-column: 3 / 6; display: grid; grid-template-columns: minmax(140px, 210px) minmax(0, 1fr) 108px; gap: 0; align-items: center; overflow: hidden; }
  body.roise-inbox #messagelist tbody td.subject > span.fromto { grid-column: 1; grid-row: 1; display: block; width: auto; float: none; min-width: 0; padding-right: 20px; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  body.roise-inbox #messagelist tbody td.subject > span.subject { grid-column: 2; grid-row: 1; display: block; width: auto; float: none; clear: none; min-width: 0; padding: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  body.roise-inbox #messagelist tbody td.subject > span.date { grid-column: 3; grid-row: 1; float: none; width: auto; padding-right: 10px; font-size: 12px; text-align: right; color: #747775; }
  body.roise-inbox #messagelist tbody td.subject > span.size { display: none; }
  body.roise-inbox #messagelist tbody td.subject .msgicon.status { display: none; }
  body.roise-inbox #messagelist tbody td.subject a { color: inherit; padding: 0; font-size: 14px; font-weight: inherit; text-decoration: none; }
  body.roise-inbox #messagelist tbody td.flags { display: contents; }
  body.roise-inbox #messagelist tbody td.flags > span.flag { grid-column: 2; grid-row: 1; display: grid; place-items: center; float: none; width: 24px; height: 36px; margin: 0; }
  body.roise-inbox #messagelist tbody td.flags > span.attachment { grid-column: 6; grid-row: 1; float: none; margin: 0; display: grid; place-items: center; width: 24px; }
  body.roise-inbox #messagelist tbody .unflagged::before { content: '\f005'; font-family: 'Icons'; font-weight: 400; color: #9aa0a6; font-size: 17px; }
  body.roise-inbox #messagelist tbody .flagged::before { content: '\f005'; font-family: 'Icons'; font-weight: 900; color: #f4b400; font-size: 17px; }
  body.roise-inbox #messagelist tbody .attachment::before { color: #747775; font-size: 15px; }
  body.roise-inbox #messagelist tbody .flag span { cursor: pointer; }
  .roise-empty-state { display: none; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 80px 24px; color: #747775; }
  .roise-empty-state > svg { width: 44px; height: 44px; stroke: #a7b8d0; margin-bottom: 22px; }
  .roise-empty-state h2 { font-size: 18px; font-weight: 400; color: #444746; }
  .roise-empty-state p { max-width: 420px; font-size: 13px; line-height: 1.6; margin-top: 8px; }
  #messagelist-content:not(:has(tr.message)) .roise-empty-state { display: flex; }
  body.roise-message #layout-content { grid-column: 2; grid-row: 2; display: flex !important; width: auto !important; min-width: 0 !important; max-width: none !important; border: none; background: #fff; margin: 0 20px 20px 0; border-radius: 18px; overflow: hidden; }
  body.roise-message #layout-content > .header { background: #fff; border-bottom: 1px solid #e8eaed; }
  body.roise-message #message-header { padding: 24px 30px 16px; }
  body.roise-message #message-header h2.subject { font-size: 24px; font-weight: 400; }
  body.roise-message #message-content { padding: 0 30px 30px; }
  body.roise-compose #layout { grid-template-columns: var(--roise-sidebar) minmax(0, 1fr) 260px; }
  body.roise-compose #layout-content { margin-right: 0; border-radius: 18px 0 0 18px; }
  body.roise-compose #layout-sidebar.sidebar-right { grid-column: 3; grid-row: 2; width: auto !important; min-width: 0 !important; max-width: none !important; border: none; margin: 0 20px 20px 0; background: #fff; border-radius: 0 18px 18px 0; border-left: 1px solid #edf0f5; }
  body.roise-compose #compose-headers { border-bottom: 1px solid #edf0f5; }
  body.roise-compose #compose-content .form-control { border-color: #dadce0; border-radius: 6px; }
  body.roise-compose #compose-content .formbuttons { background: #fff; border-top: 1px solid #edf0f5; padding: 16px 24px; }
  body.roise-compose .btn.send { border-radius: 24px; padding: 10px 24px; }
  body.roise-nav-collapsed { --roise-sidebar: 88px; }
  body.roise-nav-collapsed .roise-brand-name, body.roise-nav-collapsed .roise-brand-mark, body.roise-nav-collapsed .roise-sidebar-identity { display: none; }
  body.roise-nav-collapsed .roise-compose-slot { padding-left: 14px; }
  body.roise-nav-collapsed .roise-compose-slot .compose { width: 56px; padding: 0; justify-content: center; }
  body.roise-nav-collapsed .roise-compose-slot .compose .inner, body.roise-nav-collapsed .roise-folder-name { display: none !important; }
  body.roise-nav-collapsed #mailboxlist li > a { font-size: 0; padding-left: 28px; }
  body.roise-nav-collapsed #mailboxlist .unreadcount { display: none; }
  body.roise-nav-collapsed .roise-folder-list a { padding-left: 28px; }
}

@media (max-width: 1023px) {
  body.task-mail #layout-list, body.task-mail #layout-content { background: #fff; }
  body.task-mail .header { background: #f6f8fc; }
  body.task-mail .searchbar { background: #e9eef6; border-color: #e9eef6; }
  body.task-mail .messagelist tr.selected td { background: #d3e3fd; }
}