/* letshosting: personalizzazione grafica di Roundcube (skin elastic) */

body.task-login,
body.task-login #layout,
body.task-login #layout-content {
    background: #f6f2fd;
}

/* Pannello scuro a sinistra, come nella pagina di accesso del sito */
body.task-login {
    background: linear-gradient(90deg, #1f1433 0 40%, #f6f2fd 40%);
}

body.task-login #layout,
body.task-login #layout-content {
    background: transparent;
}

body.task-login::before {
    content: "La tua posta,\A il tuo dominio.";
    white-space: pre;
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    width: 40%;
    box-sizing: border-box;
    padding: 0 3rem 5rem;
    display: flex;
    align-items: flex-end;
    font: 900 clamp(2rem, 3.6vw, 3.4rem)/1.05 Nunito, 'Avenir Next', 'Trebuchet MS', Arial, sans-serif;
    letter-spacing: -0.03em;
    color: #fff;
    border-bottom: 0.6rem solid #f4d03f;
}

body.task-login #layout-content {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 40%;
    width: auto;
    max-width: none;
    margin: 0;
    padding: 1rem;
    overflow: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}

body.task-login #login-form {
    width: 100%;
    max-width: 26rem;
    margin: 0;
}

@media (max-width: 800px) {
    body.task-login {
        background: #f6f2fd;
    }

    body.task-login::before {
        display: none;
    }

    body.task-login #layout-content {
        left: 0;
    }
}

body.task-login #logo,
body.task-login #login-form {
    position: static;
    top: auto;
}

body.task-login #logo {
    display: block;
    width: 14rem;
    max-width: 80%;
    margin: 0 0 1.5rem;
    align-self: center;
}

body.task-login #login-form {
    background: #fff;
    border: 2px solid #1f1433;
    border-radius: 0;
    box-shadow: 5px 5px 0 0 #1f1433;
    padding: 1.5rem;
}

body.task-login #login-form table,
body.task-login #login-form .form-control {
    width: 100%;
}

body.task-login #login-form .form-control {
    border: 1px solid #dccff5;
    border-radius: 0;
}

body.task-login #login-form .form-control:focus {
    border-color: #6a3fd0;
    box-shadow: 0 0 0 .2rem rgba(106, 63, 208, .15);
}

#login-footer {
    color: #6b5d85;
    font-size: .8rem;
}

#login-footer a {
    color: #6a3fd0;
}

/* Pulsanti principali: giallo con bordo, come sul sito */
.btn.btn-primary,
.button.mainaction,
button.mainaction {
    background: #f4d03f !important;
    border: 2px solid #1f1433 !important;
    border-radius: 0 !important;
    color: #1f1433 !important;
    font-weight: 700;
}

.btn.btn-primary:hover,
.button.mainaction:hover,
button.mainaction:hover {
    background: #1f1433 !important;
    color: #f4d03f !important;
}

/* Interno della casella: colori ricavati da quelli originali della skin elastic */

/* Nella barra laterale stretta il logo intero non si legge: monogramma */
@media screen and (min-width: 481px) {
    #layout-menu .popover-header img {
        content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Crect x='4' y='4' width='40' height='40' fill='%23f4d03f'/%3E%3Ctext x='24' y='34' text-anchor='middle' font-family='Nunito,Trebuchet MS,Arial,sans-serif' font-size='26' font-weight='900' letter-spacing='-1.5' fill='%231f1433'%3Elh%3C/text%3E%3C/svg%3E");
        max-width: 42px;
        padding: .6rem;
    }
}

#taskmenu a.selected {
    background-color: #2e2147;
}

body{color:#1f1433}
#layout>div>.header{color:#1f1433}
#layout>div>.header a.button{color:#1f1433}
@media screen and (min-width:481px){#layout-menu .popover-header{background-color:#1f1433!important}}
@media screen and (min-width:481px){#layout-menu{background-color:#1f1433}}
#rcmdraglayer{background-color:#1f1433}
p.image-attachment{background-color:rgba(106,63,208,.05)}
.quota-widget .value{background-color:#6a3fd0}
.image-tools{background-color:rgba(106,63,208,.4)}
.image-tools a:focus,.image-tools a:hover{background-color:rgba(106,63,208,.5)!important}
.table-widget table.options-table tr.selected td{color:#1f1433}
.floating-action-buttons a.button{background:#6a3fd0}
.btn:focus{box-shadow:0 0 0 .2rem rgba(106,63,208,.3)}
.btn-primary{background:#6a3fd0;border-color:#6a3fd0}
.btn-primary:focus{box-shadow:0 0 0 .2rem rgba(106,63,208,.5)}
.btn-primary.disabled,.btn-primary:disabled{background:#6a3fd0;border-color:#6a3fd0}
.btn-primary:not(:disabled):not(.disabled).active:focus,.btn-primary:not(:disabled):not(.disabled):active:focus{box-shadow:0 0 0 .2rem rgba(106,63,208,.53)}
.ui-menu .ui-state-active{background-color:#6a3fd0!important}
.ui-dialog .ui-dialog-title{color:#1f1433}
.ui-dialog .ui-dialog-titlebar-close{color:#1f1433}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link{color:#1f1433}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link:focus{background-color:rgba(106,63,208,.5)}
@media screen and (max-width:480px){.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button.btn-primary,.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button.btn-secondary{color:#1f1433}.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset a.btn-link{color:#1f1433}}
.ui-slider .ui-slider-handle.ui-state-active{background:#6a3fd0}
.ui-datepicker .ui-datepicker-next,.ui-datepicker .ui-datepicker-prev{color:#1f1433}
.ui-datepicker .ui-state-default,.ui-datepicker.ui-widget-content .ui-state-default{color:#1f1433}
.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{color:#6a3fd0}
.ui-datepicker a.ui-state-active{background:#6a3fd0!important}
.menu.toolbar a{color:#1f1433}
.menu.pagenav a{color:#1f1433}
.menu .buttons button{color:#1f1433}
.popover .menu li a:not(.disabled):hover{background-color:#6a3fd0}
.popover .menu li a[aria-haspopup].dropdown:after{color:#1f1433}
.popover .menu .dropbutton a.dropdown:hover{background-color:#6a3fd0}
@media screen and (max-width:768px){.menu.listing a{color:#1f1433}}
.searchbar a{color:#1f1433}
@media screen and (max-width:480px){#taskmenu a{color:#1f1433}}
@media screen and (min-width:481px){#taskmenu .special-buttons{background-color:#1f1433}#taskmenu .action-buttons a{color:#f4d03f}#taskmenu .action-buttons a:hover{color:#f4d03f}}
.ui.alert{color:#1f1433;background-color:rgba(106,63,208,.05)}
.ui.alert a:not(.btn){color:#6a3fd0}
.ui.alert.boxinformation{background-color:rgba(106,63,208,.2)}
#messagestack div{background-color:#1f1433}
#messagestack .alert-info.information{background-color:#6a3fd0}
#messagestack .alert-warning{color:#1f1433}
#messagestack .alert-warning>i.icon:before{color:#1f1433}
.listing li a,.listing tbody td{color:#1f1433}
.listing tbody td a{color:#1f1433}
.listing li.selected,.listing tr.selected td{color:#1f1433}
@media screen and (max-width:1200px){.listing.selection-large-only li.selected{color:#1f1433}}
.popupmenu .listing li>a:not(.disabled):hover{background-color:#6a3fd0}
.popupmenu .listing li.selected{background-color:#6a3fd0}
ul.treelist li.selected>a,ul.treelist li.selected>div>a{color:#1f1433}
.folderlist li.mailbox .unreadcount{background:#6a3fd0}
.folderlist li.mailbox.recent>a>.unreadcount{background:#6a3fd0}
.attachmentslist li .attachment-name{color:#1f1433}
.formcontent.raweditor .CodeMirror{color:#1f1433}
.formcontent.raweditor .CodeMirror-focused{border-color:#6a3fd0;box-shadow:0 0 0 .2rem rgba(106,63,208,.25)}
.input-group a:focus{background-color:rgba(106,63,208,.25)}
.proplist li.with-sublist>a.dropdown{color:#1f1433}
.multi-input>.content.focused{border-color:#6a3fd0;box-shadow:0 0 0 .2rem rgba(106,63,208,.25)}
.recipient-input.focus{border-color:#6a3fd0;box-shadow:0 0 0 .2rem rgba(106,63,208,.25)}
.recipient-input li.recipient a.button.icon,body>li.recipient.ui-sortable-helper a.button.icon{color:#1f1433}
.tagedit-list[tabindex="-1"]{border-color:#6a3fd0;box-shadow:0 0 0 .2rem rgba(106,63,208,.25)}
.form-control{color:#1f1433}
.form-control:focus{color:#1f1433;border-color:#6a3fd0;box-shadow:0 0 0 .2rem rgba(106,63,208,.25)}
.input-group-text{color:#1f1433}
.input-group-text input:focus{border-color:#6a3fd0!important}
.custom-switch .custom-control-input:focus~.custom-control-label:before{box-shadow:0 0 0 .2rem rgba(106,63,208,.25)}
.custom-switch .custom-control-input:focus:not(:checked)~.custom-control-label::before{border-color:#6a3fd0}
.custom-switch .custom-control-input:checked~.custom-control-label::before{border-color:#6a3fd0;background-color:#6a3fd0}
.custom-file-input:focus~.custom-file-label{border-color:#6a3fd0;box-shadow:0 0 0 .2rem rgba(106,63,208,.25)}
div.tox.focused{border-color:#6a3fd0!important;box-shadow:0 0 0 .2rem rgba(106,63,208,.25)!important}
div.tox .tox-dialog__header .tox-button{color:#1f1433}
div.tox .tox-dialog__footer .tox-button{background:#6a3fd0;border-color:#6a3fd0}
div.tox .tox-dialog__footer .tox-button:focus{box-shadow:0 0 0 .2rem rgba(106,63,208,.5)}
div.tox .tox-dialog__footer .tox-button.disabled,div.tox .tox-dialog__footer .tox-button:disabled{background:#6a3fd0;border-color:#6a3fd0}
div.tox .tox-dialog__footer .tox-button:not(:disabled):not(.disabled).active:focus,div.tox .tox-dialog__footer .tox-button:not(:disabled):not(.disabled):active:focus{box-shadow:0 0 0 .2rem rgba(106,63,208,.53)}
div.tox .tox-dialog__footer .tox-button:focus:not(:disabled){background:#6a3fd0;border-color:#6a3fd0}
div.tox .tox-dialog__title{color:#1f1433}
div.tox .tox-label{color:#1f1433}
div.tox .tox-color-input>input,div.tox .tox-listboxfield .tox-listbox--select,div.tox .tox-textarea,div.tox .tox-textfield{color:#1f1433}
div.tox .tox-color-input>input:focus,div.tox .tox-listboxfield .tox-listbox--select:focus,div.tox .tox-textarea:focus,div.tox .tox-textfield:focus{border-color:#6a3fd0;box-shadow:0 0 0 .2rem rgba(106,63,208,.25)}
@media screen and (max-width:480px){div.tox .tox-dialog__footer .tox-button{color:#1f1433!important}div.tox .tox-dialog__footer .tox-button:active,div.tox .tox-dialog__footer .tox-button:focus,div.tox .tox-dialog__footer .tox-button:hover{color:#1f1433}}
.googie_list li.googie_list_onhover{background-color:#6a3fd0}
.message-htmlpart blockquote,.message-part blockquote{color:#4f2ba8;border-left:2px solid #4f2ba8;border-right:2px solid #4f2ba8}