/* Webmail di Liberi: carattere e colori del sito sopra il tema Elastic di Roundcube.
   Colori del logo: asta #004a8f, scritta #00225a, piede #e0252d. */

@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url('figtree.woff2') format('woff2');
}

body,
input,
select,
textarea,
button,
.btn,
.popover,
.ui-dialog {
  font-family: 'Figtree', 'Roboto', sans-serif;
}

/* pulsanti principali: blu notte invece dell'azzurro di Elastic */
.btn-primary,
.btn-primary:disabled,
.btn-primary.disabled {
  background-color: #00225a;
  border-color: #00225a;
  color: #fff;
}

.btn-primary:not(:disabled):not(.disabled):hover,
.btn-primary:not(:disabled):not(.disabled):focus,
.btn-primary:not(:disabled):not(.disabled):active {
  background-color: #004a8f;
  border-color: #004a8f;
}

a,
a:hover,
.link {
  color: #004a8f;
}

/* pagina di accesso */
body.task-login {
  background-color: #f4f6fa;
}

body.task-login #logo {
  max-width: 17rem;
  margin-bottom: 1.5rem;
}

body.task-login #login-form .formbuttons .btn {
  width: 100%;
  border-radius: 999px;
  font-weight: 700;
}

/* modalità scura (impostazione del dispositivo): fondo scuro, quindi logo chiaro */
html.dark-mode body.task-login {
  background-color: #141b2b;
}

html.dark-mode body.task-login #logo {
  content: url('logo-light.svg');
}

html.dark-mode .btn-primary,
html.dark-mode .btn-primary:disabled {
  background-color: #004a8f;
  border-color: #004a8f;
}

html.dark-mode a,
html.dark-mode .link {
  color: #8fb3ea;
}

body.task-login #login-footer,
body.task-login #login-footer a {
  color: #5b6478;
}

html.dark-mode body.task-login #login-footer,
html.dark-mode body.task-login #login-footer a {
  color: #9aa6bd;
}

/* ---------- Webmail: rifiniture a mano sopra i colori generati ---------- */

/* menu laterale blu notte: voci chiare, quella attiva bianca con il punto rosso del logo */
#layout-menu .menu a,
#layout-menu .menu a:before {
  color: #c3cee0;
}

#layout-menu .menu a:hover,
#layout-menu .menu a:hover:before,
#layout-menu .menu a.selected,
#layout-menu .menu a.selected:before {
  color: #fff;
}

#layout-menu .menu a.selected {
  position: relative;
  background-color: rgba(255, 255, 255, 0.1);
}

#layout-menu .menu a.selected:after {
  content: '';
  position: absolute;
  top: 0.7rem;
  right: 1.05rem;
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 50%;
  background: #e0242d;
}

/* «Nuovo messaggio»: rosso come «Aderisci» sul sito */
#layout-menu .menu a.compose,
#layout-menu .menu a.compose:before,
#layout-menu .menu a.compose span,
#layout-menu .menu a.compose .inner {
  color: #fff;
}

#layout-menu .menu a.compose {
  margin: 0.5rem 0.45rem 0.75rem;
  border-radius: 0.75rem;
  background-color: #e0242d;
}

#layout-menu .menu a.compose:hover {
  background-color: #c40f1e;
}

#layout-menu .menu a.logout,
#layout-menu .menu a.logout:before {
  color: #ff8a8f;
}

#layout-menu .popover-header img {
  max-height: 2.4rem;
}

/* intestazioni delle colonne: titoli in blu notte, più decisi */
#layout > div > .header .header-title {
  color: #00225a;
  font-weight: 750;
}

/* cartella e messaggio selezionati: fondo azzurrino del sito, testo blu notte */
#layout-sidebar .listing li.selected > a,
#layout-sidebar .listing li.selected > a:before {
  color: #00225a;
  font-weight: 700;
}

table.messagelist tr.unread .subject a,
table.messagelist tr.unread .fromto {
  color: #00225a;
}

/* contatori dei non letti: pillola blu notte */
.listing li .unreadcount,
#mailboxlist .unreadcount {
  background-color: #00225a;
  color: #fff;
  border-radius: 999px;
}

/* campi: bordo blu al passaggio del cursore e in modifica */
.form-control:focus,
.custom-select:focus {
  border-color: #004a8f;
}

/* modalità scura: menu ancora più scuro, punto rosso visibile */
html.dark-mode #layout-menu {
  background-color: #0d1320;
}

html.dark-mode #layout > div > .header .header-title,
html.dark-mode #layout-sidebar .listing li.selected > a,
html.dark-mode table.messagelist tr.unread .subject a,
html.dark-mode table.messagelist tr.unread .fromto {
  color: #e6ecf6;
}