/* One reading card in the list's scroller; native UID rows stay native. */
body.mailserver-inline-enabled #messagelist-content { position:relative; }
body.mailserver-inline-enabled #layout-content { display:none!important; }
body.mailserver-inline-enabled #layout-list { flex:1!important; width:auto!important; max-width:none!important; }
.mailserver-inline-reader { position:absolute; left:12px; right:12px; z-index:4; display:flex; flex-direction:column; padding:8px 16px 20px; border:1px solid #e9e9e7; border-radius:12px; background:#fff; box-shadow:0 4px 16px #20212414; color:#252930; font:14px/1.5 Arial,sans-serif; }
.mailserver-inline-reader[hidden] { display:none!important; }
.mailserver-reader-controls { display:flex; align-items:center; justify-content:space-between; min-height:32px; gap:12px; }
.mailserver-reader-controls>div { display:flex; gap:4px; margin-left:auto; }
.mailserver-reader-controls button { width:32px; height:32px; padding:0; border:0; border-radius:7px; background:transparent; color:#6c7178; font:24px/32px Arial,sans-serif; }
.mailserver-reader-status { color:#626975; font-size:13px; line-height:20px; }
.mailserver-reader-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; padding:0 8px 8px; border-bottom:1px solid #f0f1f3; }
.mailserver-reader-actions button { min-height:36px; padding:7px 10px; border:0; border-radius:7px; background:transparent; color:#525b67; font:14px/20px Arial,Helvetica,sans-serif; }
.mailserver-reader-controls button:hover,.mailserver-reader-actions button:hover { background:#f2f3f5; }
.mailserver-inline-reader button:disabled { opacity:.4; cursor:default; }
.mailserver-inline-reader button:focus-visible { outline:2px solid #cba200; outline-offset:2px; }
.mailserver-inline-reader>#messagecontframe { display:block; width:100%; height:300px; min-height:220px; border:0; flex:none; background:#fff; }
.mailserver-reader-spacer { display:block; width:100%; height:400px; clear:both; margin-top:8px; pointer-events:none; }
body.task-mail.action-none .messagelist tr.mailserver-reader-open { height:auto!important; }
body.task-mail.action-none .messagelist tr.mailserver-reader-open>td { vertical-align:top; background:#fff!important; }
body.task-mail.action-none .messagelist tr.mailserver-reader-open>td.subject { display:block; height:auto!important; min-height:36px; overflow:visible!important; position:relative; }
body.task-mail.action-none .messagelist tr.mailserver-reader-open>td.subject>.fromto,
body.task-mail.action-none .messagelist tr.mailserver-reader-open>td.subject>.date { top:18px!important; }
body.task-mail.action-none .messagelist tr.mailserver-reader-open>td.subject>.mailserver-sender-avatar { top:18px!important; }
body.task-mail.action-none .messagelist tr.mailserver-reader-open>td.subject>.subject { line-height:36px!important; }
body.task-mail.action-none .messagelist tr.mailserver-reader-open>td.selection { padding-top:10px!important; }
body.task-mail.action-none .messagelist tr.mailserver-reader-open>td.flags { padding-top:7px!important; }
body.task-mail.action-none .messagelist tr.mailserver-reader-open.mailserver-has-attachments>td.subject>.fromto,
body.task-mail.action-none .messagelist tr.mailserver-reader-open.mailserver-has-attachments>td.subject>.date,
body.task-mail.action-none .messagelist tr.mailserver-reader-open.mailserver-has-attachments>td.subject>.mailserver-sender-avatar,
body.task-mail.action-none .messagelist tr.mailserver-reader-open.mailserver-has-attachments .mailserver-row-files { top:36px!important; }
body.task-mail.action-none .messagelist tr.mailserver-reader-open.mailserver-has-attachments>td.subject>.subject { line-height:72px!important; }
.mailserver-inline-reader.mailserver-reader-draft-dock { position:fixed; inset:auto 20px 20px auto; width:min(850px,calc(100vw - 40px)); max-height:85vh; overflow:auto; z-index:1100; }
.mailserver-reader-draft-dock>#messagecontframe,.mailserver-reader-draft-dock>.mailserver-reader-actions { display:none!important; }
.mailserver-detached-reader { position:fixed; left:17vw; top:100px; width:80vw; height:calc(100vh - 130px); z-index:1250; display:flex; flex-direction:column; overflow:hidden; resize:both; box-sizing:border-box; border:1px solid #e3e5e8; border-radius:12px; background:#fff; box-shadow:0 10px 40px #17203229; color:#252930; font:14px/1.5 Arial,sans-serif; }
.mailserver-detached-heading { display:flex; align-items:center; gap:12px; min-height:44px; padding:2px 12px 2px 20px; flex:0 0 auto; border-bottom:1px solid #f0f1f3; cursor:move; touch-action:none; }
.mailserver-detached-heading>strong { flex:1; min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:14px; }
.mailserver-detached-heading>div { display:flex; gap:5px; align-items:center; }
.mailserver-detached-heading button { border:0; border-radius:7px; background:transparent; color:#696f78; padding:6px 10px; font:13px/24px Arial,sans-serif; }
.mailserver-detached-heading button:last-child { font-size:24px; }
.mailserver-detached-heading button:hover { background:#f1f2f4; }
.mailserver-detached-status { padding:6px 20px; margin:0; flex:0 0 auto; color:#626975; font-size:13px; line-height:20px; }
.mailserver-detached-status:empty { display:none; }
.mailserver-detached-content { flex:1; min-height:0; overflow:auto; padding:8px 14px 18px; }
.mailserver-detached-frame { display:block; width:100%; min-height:220px; border:0; background:#fff; }
@media(max-width:620px) { .mailserver-detached-reader { left:0; top:0; width:100vw; height:100vh; border-radius:0; resize:none; } .mailserver-detached-content { padding:4px; } }
/* The same plugin stylesheet is also loaded in Roundcube's native preview. */
html.mailserver-inline-message,html.mailserver-inline-message body { height:auto!important; min-height:0!important; overflow:visible!important; }
html.mailserver-inline-message body { display:block!important; padding:0!important; background:#fff!important; }
html.mailserver-inline-message #layout { display:block!important; height:auto!important; min-height:0!important; padding:0!important; overflow:visible!important; }
html.mailserver-inline-message #layout-content { display:block!important; position:static!important; flex:none!important; height:auto!important; min-height:0!important; width:100%!important; margin:0!important; border:0!important; border-radius:0!important; overflow:visible!important; }
html.mailserver-inline-message #layout-content>.content { height:auto!important; flex:none!important; overflow:visible!important; padding:16px 20px!important; }
html.mailserver-inline-message #message-header .subject { margin-top:0; font-size:22px; line-height:1.35; font-weight:500; white-space:normal; overflow-wrap:anywhere; }
html.mailserver-inline-message #message-content { margin-top:20px; }
@media(min-width:1025px) {
  /* Both split modes retain the same authenticated frame and quick reply. */
  body.mailserver-reader-visible.mailserver-reading-right #messagelist-content { width:48%!important; max-width:48%; margin-right:52%; box-sizing:border-box; }
  body.mailserver-reader-visible.mailserver-reading-right .mailserver-inline-reader:not(.mailserver-reader-draft-dock) {
    position:fixed; top:120px; bottom:24px; left:calc(var(--ms-sidebar-width,242px) + (100vw - var(--ms-sidebar-width,242px)) * .48); right:28px; overflow:auto;
  }
  body.mailserver-reader-visible.mailserver-reading-bottom #messagelist-content { margin-bottom:46vh; }
  body.mailserver-reader-visible.mailserver-reading-bottom .mailserver-inline-reader:not(.mailserver-reader-draft-dock) {
    position:fixed; top:54vh; bottom:24px; left:calc(var(--ms-sidebar-width,242px) + 12px); right:28px; overflow:auto;
  }
  body:is(.mailserver-reading-right,.mailserver-reading-bottom) .mailserver-reader-spacer { height:0!important; margin:0; }
  body.task-mail.action-none.mailserver-reader-visible.mailserver-reading-right .messagelist tr { height:auto!important; }
  body.task-mail.action-none.mailserver-reader-visible.mailserver-reading-right .messagelist td.subject { height:auto!important; min-height:56px!important; padding:3px 0!important; }
  body.task-mail.action-none.mailserver-reader-visible.mailserver-reading-right .messagelist td.subject>.fromto {
    position:static!important; display:block; transform:none!important; width:calc(100% - 166px)!important; margin-left:40px; padding:0!important; line-height:24px!important;
  }
  body.task-mail.action-none.mailserver-reader-visible.mailserver-reading-right .messagelist td.subject>.subject { padding:0 12px 0 40px!important; line-height:24px!important; }
  body.task-mail.action-none.mailserver-reader-visible.mailserver-reading-right .messagelist td.subject>.date { top:4px!important; transform:none!important; line-height:24px!important; }
  body.task-mail.action-none.mailserver-reader-visible.mailserver-reading-right .messagelist td.subject>.mailserver-sender-avatar { top:17px!important; }
  body.task-mail.action-none.mailserver-reader-visible.mailserver-reading-right .messagelist .mailserver-row-files {
    position:relative!important; inset:auto!important; transform:none!important; margin:4px 6px 6px 40px!important;
  }
  body.task-mail.action-none.mailserver-reader-visible.mailserver-reading-right .messagelist tr.mailserver-reader-open.mailserver-has-attachments .mailserver-row-files { top:auto!important; }
  body.task-mail.action-none.mailserver-reader-visible.mailserver-reading-right .messagelist tr.mailserver-reader-open.mailserver-has-attachments>td.subject>.mailserver-sender-avatar { top:17px!important; }
}
@media(max-width:1024px) {
  .mailserver-inline-reader { left:4px; right:4px; padding:6px 6px 14px; }
  html.mailserver-inline-message #layout-content>.content { padding:12px 8px!important; }
  html.mailserver-inline-message #message-header .subject { font-size:18px; }
  body.task-mail.action-none .messagelist tr.mailserver-reader-open>td.subject>.fromto,
  body.task-mail.action-none .messagelist tr.mailserver-reader-open>td.subject>.date { position:static!important; transform:none!important; }
  body.task-mail.action-none .messagelist tr.mailserver-reader-open .mailserver-row-files { position:relative!important; top:auto!important; right:auto!important; transform:none!important; }
}

/* Native header controls retain their original container and event handlers. */
.mailserver-reader-more { display:inline-flex; align-items:center; position:relative; flex:0 0 auto; margin:0; padding:0; list-style:none; }
.mailserver-reader-more-fallback { align-self:flex-start; margin-left:auto; }
.mailserver-reader-more-toggle { display:inline-flex; align-items:center; justify-content:center; min-width:36px; min-height:36px; border:0; border-radius:7px; padding:4px 8px; background:transparent; color:#525b67; font:24px/24px Arial,Helvetica,sans-serif; cursor:pointer; }
.mailserver-reader-more-toggle:hover { background:#f2f3f5; }
.mailserver-reader-more-menu { position:fixed; z-index:1500; box-sizing:border-box; min-width:190px; width:max-content; max-width:calc(100vw - 16px); overflow:auto; overscroll-behavior:contain; padding:5px; border:1px solid #e1e4e9; border-radius:9px; background:#fff; color:#262930; box-shadow:0 6px 24px #20212424; text-align:left; }
.mailserver-reader-more-menu[hidden] { display:none!important; }
.mailserver-reader-more-menu .header-links { display:flex; flex-direction:column; flex-wrap:nowrap!important; gap:0!important; margin:0!important; }
.mailserver-reader-more-menu .header-links>a { width:100%!important; box-sizing:border-box; margin:0!important; padding:7px 12px!important; border:0; border-radius:5px; background:transparent; color:#414852; font:13px/20px Arial,Helvetica,sans-serif!important; text-decoration:none; white-space:normal; }
.mailserver-reader-more-menu [hidden] { display:none!important; }
.mailserver-reader-more-menu .header-links>a:hover { background:#f2f3f5; }
.mailserver-reader-more-menu .header-links>a.disabled { opacity:.5; cursor:default; }
.mailserver-reader-more-toggle:focus-visible,.mailserver-reader-more-menu .header-links>a:focus-visible { outline:2px solid var(--ms-focus,#ad7d00); outline-offset:-2px; }
@media(forced-colors:active) { .mailserver-reader-more-toggle:focus-visible,.mailserver-reader-more-menu .header-links>a:focus-visible { outline-color:Highlight!important; } }
