/* Webmail — Општина Радовиш (Roundcube/Elastic override). Crest palette: crimson #990000, gold #d9a441, ivory #f6f1e8. */
:root{--rd-red:#990000;--rd-red-d:#6f0000;--rd-gold:#d9a441;--rd-ivory:#f6f1e8;--rd-ink:#2a1f1c}
html body{--bs-primary:#990000}
/* header bars + menus */
#layout-menu,#layout>.menu,#layout-sidebar .header,#layout>.sidebar>.header,.header,#layout-list .header,#layout-content>.header,.ui-dialog-titlebar{background-color:var(--rd-red)!important;color:#fff!important}
#layout>.menu{background:var(--rd-red-d)!important}
#layout>.menu a{color:#f6e9d9!important}
#layout>.menu a.selected,#layout>.menu a:hover{background:var(--rd-red)!important;color:#fff!important}
#layout>.menu a.selected:before,#layout>.menu a:hover:before{color:var(--rd-gold)!important}
/* buttons + links + selection */
.btn.btn-primary,button.btn-primary,.btn-primary,input.button.mainaction,.formbuttons .btn.mainaction,.formbuttons button.mainaction{background-color:var(--rd-red)!important;border-color:var(--rd-red-d)!important;color:#fff!important}
.btn.btn-primary:hover,.btn-primary:hover{background-color:var(--rd-red-d)!important}
a,.toolbar a.button:hover,.pagenav a{color:var(--rd-red)}
.listing li.selected,.listing li.selected:hover,table.records-table tr.selected td,table.records-table tr.selected:hover td,.messagelist tr.selected td,.messagelist tr.focused td{background-color:#f3e1e1!important;color:var(--rd-ink)!important}
.form-control:focus,.custom-select:focus{border-color:var(--rd-red)!important;box-shadow:0 0 0 .2rem rgba(153,0,0,.18)!important}
.custom-control-input:checked~.custom-control-label::before{background-color:var(--rd-red)!important;border-color:var(--rd-red)!important}
.progress-bar,.quota .value{background-color:var(--rd-red)!important}
.badge-primary,.unreadcount{background-color:var(--rd-gold)!important;color:var(--rd-ink)!important}
/* login page */
body.task-login{background:linear-gradient(160deg,var(--rd-ivory) 0%,#efe3d0 100%)!important}
body.task-login #layout-content,body.task-login #layout{background:transparent!important}
body.task-login #layout-content{display:flex;flex-direction:column;align-items:center;justify-content:center}
img#logo{max-height:104px;width:auto;margin:0 0 18px;filter:drop-shadow(0 6px 10px rgba(110,20,10,.18))}
form#login-form{width:min(26rem,92vw)!important;max-width:none!important;box-sizing:border-box;background:#fff!important;border:1px solid #d9c7b0!important;border-radius:18px!important;box-shadow:0 20px 48px rgba(110,20,10,.14),0 2px 8px rgba(110,20,10,.06)!important;padding:28px 28px 18px!important;overflow:visible!important}
form#login-form table{width:100%;border-collapse:separate;border-spacing:0}
form#login-form td.input{padding:0}
form#login-form .input-group{margin:0 0 14px;border:1px solid #e3d9c8;border-radius:12px;overflow:hidden;background:#fff;box-shadow:none}
form#login-form .input-group:focus-within{border-color:var(--rd-red);box-shadow:0 0 0 3px rgba(153,0,0,.12)}
form#login-form .input-group-text,form#login-form .input-group-prepend,form#login-form .input-group-prepend .input-group-text{background:var(--rd-ivory)!important;border:0!important;color:var(--rd-red)!important;border-radius:0!important}
form#login-form .form-control{border:0!important;box-shadow:none!important;border-radius:0!important;background:#fff!important;height:3rem}
form#login-form p.formbuttons{margin:6px 0 0}
form#login-form button.submit,form#login-form #rcmloginsubmit{width:100%;border:0!important;border-radius:12px!important;background:linear-gradient(180deg,#a60a0a,var(--rd-red))!important;color:#fff!important;font-weight:700;letter-spacing:.08em;padding:.85rem 1rem!important;box-shadow:0 6px 14px rgba(153,0,0,.25)}
form#login-form button.submit:hover{background:var(--rd-red-d)!important}
form#login-form #login-footer{margin:18px -4px 0;padding-top:14px;border-top:1px solid #efe6d6;text-align:center;color:#7a6f66;font-size:.85rem}
.rd-credit{position:fixed;left:0;right:0;bottom:14px;text-align:center;font:13px/1.4 system-ui,"Segoe UI",sans-serif;color:#7a6f66;pointer-events:none}
.rd-credit a{pointer-events:auto;color:#5d524a;text-decoration:none;font-weight:600;display:inline-flex;align-items:center;gap:7px;vertical-align:middle;margin-left:4px}
.rd-credit a:hover{color:var(--rd-red)}
.rd-credit img{height:24px;width:24px;display:block}
body:not(.task-login) .rd-credit{display:none}

/* ---- inside the mailbox: readable toolbars on the crimson bars ---- */
.header .toolbar a,.header .toolbar a.button,.header .toolbar a .inner,.header .toolbar a:before,.header .toolbar a.button:before,
#layout-list .header .toolbar a,#layout-content .header .toolbar a,#layout-content .header .toolbar a .inner,#layout-list .header .toolbar a .inner{color:#fff!important;opacity:1!important;text-shadow:none!important}
.header .toolbar a.disabled,.header .toolbar a.disabled .inner,.header .toolbar a.disabled:before,.header .toolbar a:disabled,.header .toolbar a:disabled .inner,.header .toolbar a:disabled:before{color:rgba(255,255,255,.55)!important;opacity:1!important}
.header .toolbar a:not(.disabled):hover,.header .toolbar a:not(.disabled):hover .inner,.header .toolbar a:not(.disabled):hover:before{color:var(--rd-gold)!important;background:rgba(255,255,255,.10)!important}
.header .toolbar a.button.selected,.header .toolbar a.button.selected .inner{color:var(--rd-gold)!important}
.header .header-title,.header .header-title *,.header .searchbar,#layout-sidebar .header a,.header .menu a{color:#fff!important}
.header .icon,.header a.icon:before{color:#fff!important}
/* left menu */
#layout>.menu a,#layout>.menu a .inner,#layout>.menu a:before{color:#f6e9d9!important}
#layout>.menu a.compose,#layout>.menu a.compose .inner{color:#fff!important;font-weight:600}
#layout>.menu a.compose:before{color:var(--rd-gold)!important}
#layout>.menu a.selected,#layout>.menu a.selected .inner,#layout>.menu a.selected:before{color:#fff!important}
#layout>.menu a.logout,#layout>.menu a.logout .inner{color:#ffd9d2!important}
#layout>.menu a.logout:before{color:#ffb3a6!important}
/* the sidebar user bar */
#layout-sidebar .header .header-title,.header .username{color:#fff!important}
body.task-login #layout-content{min-height:100vh;box-sizing:border-box;padding:24px 0 64px}

/* v7: centre the crest + card in the viewport, centred credit */
body.task-login #layout-content{margin:0!important;padding:0 0 72px!important;min-height:100vh!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;box-sizing:border-box}
body.task-login img#logo{margin:0 0 20px!important}
body.task-login form#login-form{margin:0!important}
.rd-credit{left:0!important;right:0!important;bottom:18px!important;display:flex;justify-content:center;align-items:center}
.rd-credit a{margin:0!important;gap:9px!important;font-size:14px;color:#5d524a}
.rd-credit img{height:28px!important;width:28px!important}

/* v8: municipality-style lockup above the card; group sits higher */
body.task-login img#logo{display:none!important}
body.task-login #layout-content{justify-content:flex-start!important;padding:clamp(28px,9vh,110px) 0 84px!important}
.rd-lockup{display:flex;align-items:center;gap:clamp(12px,2vw,20px);margin:0 auto 26px;max-width:92vw}
.rd-lockup img{height:clamp(64px,10vh,96px);width:auto;filter:drop-shadow(0 6px 10px rgba(110,20,10,.18))}
.rd-lockup-t{display:flex;flex-direction:column;font-family:"Noto Serif","Source Serif Pro",Georgia,"Times New Roman",serif;color:#1f1a17;line-height:1.15}
.rd-l1{font-size:clamp(13px,1.9vw,19px);letter-spacing:.01em}
.rd-rule{display:block;height:1px;background:#990000;margin:6px 0 4px;width:100%}
.rd-l2{font-size:clamp(24px,4.2vw,40px);font-weight:400;letter-spacing:.005em;white-space:nowrap}
/* v9: Elastic offsets the form with top:20% - that was the real reason it sat too low */
body.task-login form#login-form{top:0!important;position:relative!important}

/* v10: the message list is NOT crimson - dark text like the navigation (light mode), white text in dark mode */
.messagelist tr td, .messagelist tr td a, .messagelist tr td a span, .messagelist tr td span.adr, .messagelist tr td span.adr span,
.messagelist td.subject span.subject, .messagelist td.subject span.fromto, .messagelist td.subject a, .messagelist td.subject a span.subject,
.messagelist tr.unread td, .messagelist tr.unread td a, .messagelist tr.unread td a span, .messagelist tr.unread td.subject span.subject, .messagelist tr.unread td.subject a span.subject,
.messagelist tr.selected td, .messagelist tr.selected td a, .messagelist tr.selected td a span, .messagelist tr.focused td, .messagelist tr.focused td a, .messagelist tr.focused td a span {color:#2a1f1c!important}
.messagelist td.subject span.date, .messagelist td.subject span.size, .messagelist tr td span.date{color:#737677!important}
.messagelist tr.unread td, .messagelist tr.unread td a span.subject, .messagelist tr.unread td span.fromto, .messagelist tr.unread td span.adr{font-weight:700}
.messagelist tr.selected td, .messagelist tr.focused td, .messagelist tr.selected:hover td{background-color:#f3e1e1!important}
/* dark mode */
html.dark-mode .messagelist tr td, html.dark-mode .messagelist tr td a, html.dark-mode .messagelist tr td a span, html.dark-mode .messagelist tr td span.adr, html.dark-mode .messagelist tr td span.adr span,
html.dark-mode .messagelist td.subject span.subject, html.dark-mode .messagelist td.subject span.fromto, html.dark-mode .messagelist td.subject a, html.dark-mode .messagelist td.subject a span.subject,
html.dark-mode .messagelist tr.unread td, html.dark-mode .messagelist tr.unread td a, html.dark-mode .messagelist tr.unread td a span, html.dark-mode .messagelist tr.unread td.subject span.subject,
html.dark-mode .messagelist tr.selected td, html.dark-mode .messagelist tr.selected td a, html.dark-mode .messagelist tr.selected td a span, html.dark-mode .messagelist tr.focused td, html.dark-mode .messagelist tr.focused td a, html.dark-mode .messagelist tr.focused td a span{color:#f4f4f4!important}
html.dark-mode .messagelist td.subject span.date, html.dark-mode .messagelist td.subject span.size, html.dark-mode .messagelist tr td span.date{color:#a9b0b3!important}
html.dark-mode .messagelist tr.selected td, html.dark-mode .messagelist tr.focused td, html.dark-mode .messagelist tr.selected:hover td{background-color:rgba(153,0,0,.42)!important}
html.dark-mode .listing li.selected, html.dark-mode .listing li.selected:hover, html.dark-mode table.records-table tr.selected td, html.dark-mode table.records-table tr.selected:hover td{background-color:rgba(153,0,0,.42)!important;color:#fff!important}
html.dark-mode .listing li.selected a, html.dark-mode .listing li a{color:#f4f4f4!important}
html.dark-mode a{color:#ff9a8f}
html.dark-mode #layout-list .scroller, html.dark-mode .messagelist{color:#f4f4f4}

/* v11: list text = ink (light) / white (dark); specificity raised */
html body table.messagelist.records-table tbody tr td,html body table.messagelist.records-table tbody tr td a,html body table.messagelist.records-table tbody tr td a span,html body table.messagelist.records-table tbody tr td span,html body table.messagelist.records-table tbody tr td.subject span.subject,html body table.messagelist.records-table tbody tr td.subject span.fromto,html body table.messagelist.records-table tbody tr td.subject span.adr,html body table.messagelist.records-table tbody tr td.subject a.subject span{color:#2a1f1c!important}
html body table.messagelist.records-table tbody tr td.subject span.date, html body table.messagelist.records-table tbody tr td.subject span.size{color:#737677!important}
html.dark-mode body table.messagelist.records-table tbody tr td,html.dark-mode body table.messagelist.records-table tbody tr td a,html.dark-mode body table.messagelist.records-table tbody tr td a span,html.dark-mode body table.messagelist.records-table tbody tr td span,html.dark-mode body table.messagelist.records-table tbody tr td.subject span.subject,html.dark-mode body table.messagelist.records-table tbody tr td.subject span.fromto,html.dark-mode body table.messagelist.records-table tbody tr td.subject span.adr,html.dark-mode body table.messagelist.records-table tbody tr td.subject a.subject span{color:#f4f4f4!important}
html.dark-mode body table.messagelist.records-table tbody tr td.subject span.date, html.dark-mode body table.messagelist.records-table tbody tr td.subject span.size{color:#a9b0b3!important}
/* top-left corner: crimson block behind the crest */
#layout-menu .popover-header, #layout-menu > .popover-header{background:var(--rd-red)!important;border-bottom:1px solid rgba(255,255,255,.14)!important}
#layout-menu #logo, #layout-menu .popover-header img{filter:drop-shadow(0 2px 4px rgba(0,0,0,.35))!important;opacity:1!important}
html.dark-mode #layout-menu .popover-header{background:var(--rd-red-d)!important}
/* v12: login group half an inch lower */
body.task-login #layout-content{padding-top:calc(clamp(28px,9vh,110px) + 48px)!important}

/* v13: forgotten-password hint under the login button */
form#login-form p.rd-forgot{margin:14px 0 0;text-align:center;font-size:.86rem;line-height:1.4;color:#6b5f56}
