/* DonkeyTale skin. Extends Elastic (Roundcube, CC BY-SA 3.0).
   Preserve Roundcube controls, accessibility and mobile navigation. */
:root{--dt-bg:#f4eee5;--dt-panel:#ede4d7;--dt-side:#eee5d8;--dt-text:#382c21;--dt-muted:#806d59;--dt-line:#d8c8b4;--dt-accent:#bd6530;--dt-selected:#e5d5c0;--dt-orange:#ff8e44}
html.dark-mode{--dt-bg:#100e0c;--dt-panel:#1a1612;--dt-side:#15120f;--dt-text:#ede6dc;--dt-muted:#b1a08b;--dt-line:#332b22;--dt-accent:#dba573;--dt-selected:#302419}
body,html.dark-mode body{font-family:Arial,sans-serif;background:var(--dt-bg);color:var(--dt-text)}
a,html.dark-mode a{color:var(--dt-accent)}
#layout,#layout-list,html.dark-mode #layout-list{background:var(--dt-bg)}
#layout-sidebar,#layout-menu,html.dark-mode #layout-sidebar,html.dark-mode #layout-menu{background:var(--dt-side);border-color:var(--dt-line)}
#layout-content,html.dark-mode #layout-content{background:var(--dt-panel)}
#layout>div>.header,#layout>div>.footer,html.dark-mode #layout>div>.header,html.dark-mode #layout>div>.footer{background:var(--dt-side);color:var(--dt-muted);border-color:var(--dt-line)}
#layout-list,#layout-sidebar,html.dark-mode #layout-list,html.dark-mode #layout-sidebar{border-color:var(--dt-line)}
.searchbar,html.dark-mode .searchbar{background:var(--dt-side);border-color:var(--dt-line);color:var(--dt-muted)}
.searchbar input,html.dark-mode .searchbar input{background:transparent;color:var(--dt-text)}
.listing li,.listing tbody td,html.dark-mode .listing li,html.dark-mode .listing tbody td{border-color:var(--dt-line);color:var(--dt-text)}
.listing li>a,.listing tbody td a,html.dark-mode .listing li>a,html.dark-mode .listing tbody td a{color:var(--dt-text)}
.listing li.selected>a,.listing li.selected>div,.listing tr.selected td,.listing tr.focused td,html.dark-mode .listing li.selected>a,html.dark-mode .listing li.selected>div,html.dark-mode .listing tr.selected td,html.dark-mode .listing tr.focused td{background:var(--dt-selected);color:var(--dt-text)}
.listing li>a:hover,.listing li>div:hover,html.dark-mode .listing li>a:hover,html.dark-mode .listing li>div:hover{background:var(--dt-selected)}
.folderlist li a{padding-top:9px;padding-bottom:9px}.folderlist li.selected>div{box-shadow:inset 3px 0 var(--dt-orange);border-radius:6px}.folderlist{padding:10px}
.folderlist .unreadcount,html.dark-mode .folderlist .unreadcount{background:#62432d;color:#f3d8b8;border-radius:5px}
#taskmenu a,html.dark-mode #taskmenu a{color:var(--dt-muted)}
#taskmenu a.selected,#taskmenu a:hover,html.dark-mode #taskmenu a.selected,html.dark-mode #taskmenu a:hover{background:var(--dt-selected);color:var(--dt-accent)}
#taskmenu .action-buttons a,html.dark-mode #taskmenu .action-buttons a,.btn-primary,html.dark-mode .btn-primary{background:var(--dt-orange);border-color:var(--dt-orange);color:#25170e}
.btn-primary:hover,.btn-primary:focus,html.dark-mode .btn-primary:hover,html.dark-mode .btn-primary:focus{background:#ffa360;border-color:#ffa360;color:#25170e}
#taskmenu .special-buttons,html.dark-mode #taskmenu .special-buttons{background:var(--dt-side)}
#layout-menu .popover-header,html.dark-mode #layout-menu .popover-header{background:var(--dt-side)!important}
.toolbar a,.header a.button,html.dark-mode .toolbar a,html.dark-mode .header a.button{color:var(--dt-muted)!important}
.form-control,.custom-select,.input-group-text,html.dark-mode .form-control,html.dark-mode .custom-select,html.dark-mode .input-group-text{background:var(--dt-side);border-color:var(--dt-line);color:var(--dt-text)}
.form-control:focus,.custom-select:focus,html.dark-mode .form-control:focus{border-color:var(--dt-accent);box-shadow:0 0 0 3px #dba57322}
.ui-dialog,.ui-dialog-content,.ui-dialog .ui-dialog-titlebar,.ui-dialog .ui-dialog-buttonpane,.popover,.popover-body,.popupmenu,html.dark-mode .ui-dialog,html.dark-mode .ui-dialog-content,html.dark-mode .ui-dialog .ui-dialog-titlebar,html.dark-mode .ui-dialog .ui-dialog-buttonpane,html.dark-mode .popover,html.dark-mode .popover-body,html.dark-mode .popupmenu{background:var(--dt-panel);color:var(--dt-text);border-color:var(--dt-line)}
.propform td,.propform th,.propform fieldset,html.dark-mode .propform td,html.dark-mode .propform th,html.dark-mode .propform fieldset{border-color:var(--dt-line)}
#message-header{padding:28px 34px 20px;border-color:var(--dt-line)}
#message-header h2.subject{font:normal clamp(26px,2.8vw,40px)/1.2 Georgia,serif;padding:0 0 24px;color:var(--dt-text)}
#message-header .header,#message-header .header-content,html.dark-mode #message-header .header,html.dark-mode #message-header .header-content{color:var(--dt-muted);background:transparent}
#message-content{padding:10px 34px 40px;position:relative;z-index:1}#messagebody{line-height:1.8}
/* Decoration belongs to the shell. HTML emails retain their own safe formatting. */
.task-mail.action-preview #layout-content,.task-mail.action-show #layout-content{position:relative;isolation:isolate}
.task-mail.action-preview #layout-content:before,.task-mail.action-show #layout-content:before{content:'';position:fixed;right:-20px;bottom:-10px;width:clamp(220px,43vw,510px);height:76%;max-height:620px;background:url('../images/trees.png') right bottom/contain no-repeat;opacity:.12;pointer-events:none;z-index:-1}
.dark-mode .task-mail.action-preview #layout-content:before,.dark-mode .task-mail.action-show #layout-content:before{opacity:.28}
#message-header{position:relative;z-index:1}.messagelist tr td.subject{padding-top:18px;padding-bottom:18px}.messagelist .subject a{font-weight:600}.messagelist .fromto,.messagelist .date,.messagelist .size{color:var(--dt-muted)!important}
.dt-brand{display:none}.dt-eyebrow{font-size:10px;letter-spacing:2.5px;color:var(--dt-accent);font-weight:600}
/* Desktop: task menu shares the folder column instead of adding a fourth rail. */
@media(min-width:1201px){
 .task-mail.action-none #layout-sidebar{flex:0 0 240px;min-width:240px;max-width:240px;padding-top:176px;padding-bottom:66px}
 .task-mail.action-none #layout-menu{position:absolute;top:0;bottom:0;left:0;width:240px;z-index:5;background:transparent!important;pointer-events:none;border-right:1px solid var(--dt-line)}
 .task-mail.action-none #layout-menu a{pointer-events:auto}
 .task-mail.action-none #layout-menu>.popover-header{display:none}
 .task-mail.action-none .dt-brand{display:flex;align-items:center;gap:10px;position:absolute;top:34px;left:22px;text-decoration:none;color:var(--dt-text);font:27px Georgia,serif}
 .dt-brand img{width:42px;height:42px;object-fit:contain}.dt-brand small{display:block;font:9px Arial,sans-serif;letter-spacing:2.5px;color:var(--dt-accent);margin-top:8px}
 .task-mail.action-none #taskmenu .action-buttons{position:absolute;top:109px;left:14px;right:14px}
 .task-mail.action-none #taskmenu .action-buttons a{width:100%;max-width:none;height:52px;line-height:38px;border-radius:6px;text-align:left;padding:7px 15px;display:flex;gap:12px;align-items:center;color:#25170e}
 .task-mail.action-none #taskmenu .action-buttons a:before{font-size:20px;margin:0;line-height:38px;float:none}.task-mail.action-none #taskmenu .action-buttons .inner{font-size:14px;font-weight:600;display:inline}
 .task-mail.action-none #taskmenu>a.mail{display:none}
 .task-mail.action-none #taskmenu>a.contacts,.task-mail.action-none #taskmenu>a.settings{position:absolute;bottom:12px;width:44px;height:44px;padding:0}
 .task-mail.action-none #taskmenu>a.contacts{left:10px}.task-mail.action-none #taskmenu>a.settings{left:54px}
 .task-mail.action-none #taskmenu .special-buttons{position:absolute;bottom:12px;left:102px;display:flex;background:transparent!important}
 .task-mail.action-none #taskmenu .special-buttons a{width:42px;height:44px;padding:0;background:transparent}
 .task-mail.action-none #taskmenu>a.contacts:before,.task-mail.action-none #taskmenu>a.settings:before,.task-mail.action-none #taskmenu .special-buttons a:before{line-height:44px;margin:0;font-size:18px}
 .task-mail.action-none #taskmenu>a .inner,.task-mail.action-none #taskmenu .special-buttons .inner{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
 .task-mail.action-none #layout-list{flex:0 0 350px;max-width:350px;min-width:300px}
 .task-mail.action-none #messagelist-header{height:76px;min-height:76px;align-items:center}.task-mail.action-none #layout-content>.header{height:76px;min-height:76px;align-items:center}
 .task-mail.action-none #layout-sidebar>.header{height:45px;min-height:45px;font-weight:400;font-size:12px;padding:0 12px}
}
/* Real login form supplied by Roundcube, including CSRF and error messages. */
.task-login #layout{overflow:auto;align-items:center;justify-content:center;background:#100e0c;padding:40px}
.task-login #layout-content.dt-login{display:grid!important;grid-template-columns:1fr 1fr;flex:none!important;width:min(1100px,100%);height:auto;min-height:680px;max-width:none;border:1px solid #3b2d21;border-radius:15px;overflow:hidden;box-shadow:0 30px 110px #0006;background:#15120f;color:#ede6dc}
.dt-login-art{position:relative;background:radial-gradient(ellipse at 65% 35%,#674124 0,#322318 40%,#241b14 75%);padding:38px 46px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.dt-wordmark{display:flex;align-items:center;gap:12px;font:24px Georgia,serif;color:#eee0cd!important;text-decoration:none!important;position:relative;z-index:2}.dt-wordmark img{width:36px;height:36px}.dt-wordmark small{font:9px Arial,sans-serif;letter-spacing:3px;margin-left:8px;color:#d4a175}
.dt-art-copy{position:relative;z-index:2}.dt-art-copy h2{font:42px/1.13 Georgia,serif;letter-spacing:-1px;margin:18px 0 20px;color:#f0dfc8}.dt-art-copy>p:last-child{font-size:13px;color:#b8a18a}
.dt-envelope-art{height:285px;position:relative;margin:15px auto 5px;width:300px;transform:rotate(-8deg)}
.dt-orbit{position:absolute;border:1px solid #dba57325;border-radius:50%;width:290px;height:290px;top:-5px;left:5px}.dt-orbit:after{content:'';position:absolute;inset:-32px;border:1px solid #dba57315;border-radius:50%}
.dt-envelope-back{position:absolute;left:20px;top:-20px;width:260px;height:302px;background:#b87842;clip-path:polygon(0 44%,50% 0,100% 44%,100% 100%,0 100%);border-radius:10px;z-index:1}
.dt-paper{position:absolute;left:48px;top:5px;width:200px;height:230px;background:#ead3af;border-radius:5px;box-shadow:0 6px 16px #49281333;padding:25px;color:#815b39;transform:rotate(10deg);z-index:2}.dt-paper span{font:italic 19px Georgia,serif}.dt-paper i{display:block;height:1px;background:#b694694a;margin-top:20px}.dt-paper img{width:32px;height:32px;float:right;margin-top:15px}
.dt-envelope{position:absolute;left:20px;top:112px;width:260px;height:170px;border-radius:4px 4px 10px 10px;filter:drop-shadow(0 12px 18px #100b0844);overflow:hidden;z-index:3}.dt-envelope:before{content:'';position:absolute;inset:0;background:#d89451;clip-path:polygon(0 0,50% 58%,100% 0,100% 100%,0 100%)}.dt-envelope:after{content:'';position:absolute;inset:0;background:#e2a364;clip-path:polygon(0 100%,50% 45%,100% 100%)}
.dt-login-panel{display:flex;align-items:center;justify-content:center;padding:58px 50px}.dt-form-wrap{width:100%;max-width:360px}
.task-login #logo{display:block;position:static;top:auto;width:48px;height:48px;padding:0;margin:0 0 26px;max-width:none;max-height:none}
.dt-login-panel h2{font:36px/1.2 Georgia,serif;letter-spacing:-1px;margin:12px 0 14px;color:#ede6dc}.dt-login-intro{font-size:14px;line-height:1.7;color:#b1a08b;margin-bottom:28px}
.task-login #login-form{position:static;top:auto;width:100%;max-width:none;text-align:left;margin:0;padding:0}
.task-login #layout-content.dt-login{text-align:left}
.task-login #login-form .input-group{margin-bottom:18px}.task-login #login-form input{height:49px;font-size:14px;background:#100e0c!important;color:#ede6dc!important;border-color:#3a2d21!important;border-radius:6px}
.task-login #login-form .input-group-text{background:#211a14!important;color:#c49b76!important;border-color:#3a2d21!important}
.task-login #login-form button[type=submit]{width:100%;height:50px;margin-top:5px;background:#ff8e44;border:1px solid #ff8e44;border-radius:6px;color:#25170e;font-weight:600}
.task-login #login-footer{display:none}.dt-login-help{font-size:12px;line-height:1.9;color:#a6937d;margin:24px 0}.dt-login-help strong{font-weight:400;color:#d2b490}.dt-home-link{font-size:12px;color:#dba573!important}
:focus-visible{outline:2px solid #e8b384;outline-offset:3px}
@media(max-width:900px){.task-login #layout{padding:22px}.task-login #layout-content.dt-login{min-height:600px}.dt-login-art{padding:30px 25px}.dt-login-panel{padding:40px 30px}.dt-envelope-art{transform:scale(.82) rotate(-8deg);margin-left:-10px}.dt-art-copy h2{font-size:34px}}
@media(max-width:680px){.task-login #layout{padding:20px 16px}.task-login #layout-content.dt-login{display:block!important;min-height:0;max-width:420px}.dt-login-art{display:none}.dt-login-panel{padding:36px 28px}.dt-login-panel h2{font-size:32px}.task-login #logo{width:42px;height:42px}.dt-login-intro{font-size:13px}#message-header{padding:20px 18px}#message-content{padding:8px 18px 30px}.task-mail.action-preview #layout-content:before,.task-mail.action-show #layout-content:before{opacity:.08;width:65%;height:53%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}
/* Match composer controls to the warm shell. */
.recipient-input,.recipient-input input,.mce-container,.mce-toolbar-grp,.mce-btn,html.dark-mode .recipient-input,html.dark-mode .recipient-input input,html.dark-mode .mce-container,html.dark-mode .mce-toolbar-grp,html.dark-mode .mce-btn{background:var(--dt-side);color:var(--dt-text);border-color:var(--dt-line)}
#composebody,#composebodycontainer,.compose-headers,html.dark-mode #composebody,html.dark-mode #composebodycontainer,html.dark-mode .compose-headers{background:var(--dt-panel);color:var(--dt-text);border-color:var(--dt-line)}
#uploadform .file-upload,#uploadform .btn,html.dark-mode #uploadform .file-upload,html.dark-mode #uploadform .btn{background:var(--dt-selected);color:var(--dt-text);border-color:var(--dt-line)}
.btn-secondary,html.dark-mode .btn-secondary{background:var(--dt-selected);color:var(--dt-text);border-color:var(--dt-line)}
.floating-action-buttons a.button,html.dark-mode .floating-action-buttons a.button{background:var(--dt-orange);color:#25170e}