/* =====================================================================
 * JUCIL · Marca del webmail sobre el tema Elastic de Roundcube
 * Colores: Verde Amazónico #184548 · Verde Esmeralda #64BB72 · Verde Pizarra #226866 · Blanco Humo #F0F0F0
 * ===================================================================== */
@font-face{font-family:"Poppins";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/poppins-400.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/poppins-500.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/poppins-600.woff2) format("woff2")}
@font-face{font-family:"Poppins";font-style:normal;font-weight:700;font-display:swap;src:url(fonts/poppins-700.woff2) format("woff2")}

/* ---------- Colores de la marca (generados compilando Elastic con las variables de JUCIL) ---------- */
body, button, input, optgroup, select, textarea, .popover{font-family:Roboto, sans-serif;font-family:"Poppins", "Roboto", sans-serif}
a{color:#226866}
a:hover{color:#154240}
#layout > div > .header{background-color:#F0F0F0}
#rcmdraglayer{background-color:#123A3D}
p.image-attachment{background-color:rgba(24, 69, 72, 0.05)}
.quota-widget .value{background-color:#184548}
.image-tools{background-color:rgba(24, 69, 72, 0.4)}
.image-tools a:focus, .image-tools a:hover{background-color:rgba(24, 69, 72, 0.5) !important}
.table-widget table.options-table tr.selected td{background-color:#e8eced}
.floating-action-buttons a.button{background:#184548;box-shadow:0 0 5px 5px #4ebdc4}
.btn:focus{box-shadow:0 0 0 0.2rem rgba(24, 69, 72, 0.3)}
.btn-link{color:#226866}
.btn-primary{background:#184548;border-color:#184548}
.btn-primary:focus{background:#123335;border-color:#0f2b2d;box-shadow:0 0 0 0.2rem rgba(24, 69, 72, 0.5)}
.btn-primary:hover{background:#123335;border-color:#0f2b2d}
.btn-primary.disabled, .btn-primary:disabled{background:#184548;border-color:#184548}
.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active{background:#0b2022;border-color:#09191a}
.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus{box-shadow:0 0 0 0.2rem rgba(24, 69, 72, 0.53)}
.ui-menu .ui-state-active{background-color:#184548 !important}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link:focus{background-color:rgba(24, 69, 72, 0.5)}
.ui-slider .ui-slider-range{background:#3eb3bb}
.ui-slider .ui-slider-handle.ui-state-active{background:#184548;border-color:#000000}
.ui-datepicker .ui-datepicker-days-cell-over a, .ui-datepicker .ui-datepicker-days-cell-over a.ui-state-default, .ui-datepicker .ui-state-highlight, .ui-datepicker.ui-widget-content .ui-state-highlight{background:#3eb3bb;color:#184548}
.ui-datepicker a.ui-state-active{background:#184548 !important}
html.layout-small .popover-header, html.layout-phone .popover-header{background-color:#000000}
.menu a:not(.disabled):focus, .menu a:not(.disabled):hover{background-color:#e8e8e8}
.menu.toolbar a.selected{color:#4FA95F}
.menu.toolbar .dropbutton:not(.disabled):hover{background-color:#e8e8e8}
.menu.toolbar .dropbutton a.dropdown:hover{background-color:#dcdcdc}
.popover .menu li a:not(.disabled):hover{background-color:#184548}
.popover .menu .dropbutton a.dropdown:hover{background-color:#184548}
.searchbar a.selected{color:#4FA95F}
.ui.alert{background-color:rgba(24, 69, 72, 0.05)}
.ui.alert.alert-success > i.icon:before{color:#4FA95F}
.ui.alert a:not(.btn){color:#184548}
.ui.alert.boxinformation{background-color:rgba(24, 69, 72, 0.2)}
.ui.alert.boxconfirmation{background-color:rgba(79, 169, 95, 0.2)}
#messagestack .alert-info.information{background-color:#184548}
#messagestack .alert-success{background-color:#4FA95F}
.listing li.selected, .listing tr.selected td{background-color:#e8eced}
html:not(.touch) .listing li > a:focus, html:not(.touch) .listing.focus tbody tr.focused > td:first-child, html:not(.touch) .listing.focus:not(.withselection) tbody tr.focused > td.selection + td{border-left:2px solid #318e95}
.popupmenu .listing li > a:not(.disabled):hover{background-color:#184548}
.popupmenu .listing li.selected{background-color:#184548}
ul.treelist li.selected > div > a, ul.treelist li.selected > a{background-color:#e8eced}
.folderlist li.mailbox .unreadcount{background:#184548}
.folderlist li.mailbox.recent > a{color:#000000}
.folderlist li.mailbox.recent > a > .unreadcount{background:#184548}
.formcontent.raweditor .CodeMirror-focused{border-color:#184548;box-shadow:0 0 0 0.2rem rgba(24, 69, 72, 0.25)}
.input-group a:focus{background-color:rgba(24, 69, 72, 0.25)}
.multi-input > .content.focused{border-color:#184548;box-shadow:0 0 0 0.2rem rgba(24, 69, 72, 0.25)}
.file-upload.droptarget.active{border-color:#b5b5b5}
.file-upload.droptarget.hover{border-color:#b5b5b5;background-color:#e8e8e8}
.recipient-input.focus{border-color:#184548;box-shadow:0 0 0 0.2rem rgba(24, 69, 72, 0.25)}
.tagedit-list[tabindex="-1"]{border-color:#184548;box-shadow:0 0 0 0.2rem rgba(24, 69, 72, 0.25)}
@media screen and (min-width: 481px){
#layout-menu .popover-header{background-color:#123A3D !important}
#layout-menu{background-color:#123A3D}
#taskmenu a.selected{background:#1C4D50}
#taskmenu a.selected:hover{background:#1C4D50}
#taskmenu a:hover{background:#1C4D50}
#taskmenu .special-buttons{background-color:#123A3D}
#taskmenu .action-buttons a{color:#64BB72}
#taskmenu .action-buttons a:hover{color:#8FD39A;background:#1C4D50}
}
@media screen and (max-width: 768px){
#layout > div > .header{background-color:#F0F0F0}
#layout > div > .footer{background-color:#F0F0F0}
}
@media screen and (max-width: 480px){
.ui-dialog .ui-dialog-titlebar{background-color:#F0F0F0}
.ui-dialog .ui-dialog-buttonpane{background-color:#F0F0F0}
}
@media screen and (min-width: 769px){
.header a.button.icon:not(.disabled):focus, .header a.button.icon:not(.disabled):hover{background-color:#e8e8e8}
}
@media screen and (min-width: 1025px){
#taskmenu a:focus{background-color:#1C4D50}
}

/* ---------- Pantalla de acceso ---------- */
body.task-login{background:radial-gradient(900px 620px at 0% 0%,rgba(34,104,102,.95) 0,rgba(34,104,102,0) 62%),radial-gradient(900px 700px at 100% 112%,rgba(100,187,114,.38) 0,rgba(100,187,114,0) 62%),#123A3D !important}
body.task-login #layout-content{background:transparent !important}
body.task-login #logo{width:auto;max-width:112px;max-height:112px;margin-bottom:22px;filter:drop-shadow(0 10px 24px rgba(0,0,0,.35))}
body.task-login #login-form{background:#fff;border-radius:22px;padding:30px 28px 18px;box-shadow:0 30px 70px rgba(0,0,0,.35);max-width:420px;width:calc(100% - 32px);box-sizing:border-box}
body.task-login #login-form .input-group-text{background:#F0F0F0;border-color:#D9E2E2;color:#184548}
body.task-login #login-form .form-control{border-color:#D9E2E2}
body.task-login #login-form .form-control:focus{border-color:#64BB72;box-shadow:0 0 0 3px rgba(100,187,114,.25)}
body.task-login #login-form .button.mainaction,body.task-login #rcmloginsubmit{background:#184548;border-color:#184548;border-radius:12px;font-weight:600;letter-spacing:.02em}
body.task-login #login-form .button.mainaction:hover,body.task-login #rcmloginsubmit:hover{background:#226866;border-color:#226866}
body.task-login #login-footer{color:#4A5C5D;font-weight:500}
body.task-login #login-footer a{color:#226866}
html.dark-mode body.task-login #login-form{background:#0F2E30}
html.dark-mode body.task-login #login-form .input-group-text{background:#164245;border-color:#1F4245;color:#64BB72}
html.dark-mode body.task-login #login-footer{color:#9DBFBD}

/* ---------- Detalles ---------- */
#layout-menu .popover-header img, #layout-menu #logo{max-height:48px}
.unreadcount, .listing li .count, .badge-primary{background-color:#64BB72 !important;color:#0C2A2C !important}