/*
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 *   http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on an
 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied.  See the License for the
 * specific language governing permissions and limitations
 * under the License.
 */

/* Label/tag denoting the user that shared a connection */
.jdbc-share-tag {

    background: #0095ff;
    padding: 0.25em;

    -moz-border-radius:    0.25em;
    -webkit-border-radius: 0.25em;
    -khtml-border-radius:  0.25em;
    border-radius:         0.25em;

    color: white;
    font-size: 0.75em;
    font-weight: bold;

}
.totp-enroll p,.totp-details{font-size:.8em}.totp-qr-code{text-align:center}.totp-qr-code img{margin:1em;border:1px solid rgba(0,0,0,0.25);box-shadow:1px 1px 2px rgba(0,0,0,0.25);cursor:pointer}h3.totp-details-header{font-size:.8em}h3.totp-details-header::before{content:'▸ '}.totp-details-visible h3.totp-details-header::before{content:'▾ '}.totp-details,.totp-hide-details{display:none}.totp-details-visible .totp-details{display:table}.totp-details-visible .totp-hide-details{display:inline}.totp-details-visible .totp-show-details{display:none}.totp-hide-details,.totp-show-details{color:blue;text-decoration:underline;cursor:pointer;margin:0 .25em;font-weight:normal}.totp-details{margin:0 auto}.totp-details th{padding-right:.25em;text-align:left}.totp-details td{font-family:monospace}.totp-detail{display:inline-block;margin:0 .25em}
/* ===================================================================
   LOGIN PAGE - stile identico al dialog di logout
   Box: max 720px, gradient navy, padding 60/50, border 30px
   Logo: max 560px, margin 35px
   Titolo: 16px uppercase letter-spacing 3px
   Bottone: bianco #f5f5f5 testo nero
   Warning: 12px uppercase letter-spacing 2px
   Sfondo esterno: #141821 (come la home)
   =================================================================== */

.login-ui{
 display:flex !important;
 align-items:center !important;
 justify-content:center !important;
 min-height:100vh !important;
 background:#141821 !important;
 margin:0 !important;
 padding:0 !important;
}

/* Anche html/body devono avere lo stesso navy per evitare
   bande bianche laterali se il contenuto non riempie tutto */
html:has(.login-ui),
body:has(.login-ui){
 background:#141821 !important;
 background-color:#141821 !important;
 margin:0 !important;
}

.login-dialog{
 width:92% !important;
 max-width:720px !important;
 min-height:auto !important;
 margin:auto !important;

 display:flex !important;
 flex-direction:column !important;
 align-items:center !important;
 text-align:center !important;

 background:linear-gradient(180deg,#141821,#07090f) !important;
 border:1px solid rgba(255,255,255,0.08) !important;
 border-radius:30px !important;
 padding:60px 50px !important;
 box-shadow:0 40px 120px rgba(0,0,0,0.9) !important;

 color:#f5f5f5 !important;
}

.login-ui h1,
.login-ui .logo,
.login-ui .app-name,
.login-ui .version{
 display:none !important;
}

/* Wrapper del form e contenitori interni: larghezza piena
   per permettere agli input/bottoni di espandersi davvero */
.login-dialog form,
.login-dialog .login-form,
.login-dialog .login-fields,
.login-dialog .buttons,
.login-dialog .labeled-field,
.login-dialog .field{
 width:100% !important;
 max-width:100% !important;
 box-sizing:border-box !important;
 display:block !important;
 margin:0 !important;
 padding:0 !important;
}

/* LOGO - dimensione coerente col logout */
.login-dialog .massini-logo{
 width:100% !important;
 max-width:560px !important;
 margin:0 auto 35px auto !important;
 display:block !important;
}

/* TITOLO "MGMT SECURITY IT" - stile identico al logout */
.login-dialog .massini-title{
 color:#ddd !important;
 letter-spacing:3px !important;
 font-size:32px !important;
 font-weight:600 !important;
 margin:0 0 30px 0 !important;
 text-transform:uppercase !important;
}

/* CAMPI INPUT username/password */
/* Campi testo username/password: larghezza allineata alla scritta
   MASSINI (dalla M iniziale alla I finale, senza INDUSTRIES) */
.login-ui input:not([type="submit"]),
.login-dialog input:not([type="submit"]){
 background:#f5f5f5 !important;
 color:#000 !important;
 border:none !important;
 border-radius:14px !important;
 padding:16px 20px !important;
 width:100% !important;
 max-width:460px !important;
 font-size:18px !important;
 margin:6px auto !important;
 box-sizing:border-box !important;
 display:block !important;
}

.login-ui input::placeholder,
.login-dialog input::placeholder{
 color:#888 !important;
 font-size:16px !important;
}

/* Bottone "continue-login" non va mostrato in condizioni normali:
   Guacamole lo tiene nel DOM ma hidden via angular ng-show.
   Lo nascondiamo a prescindere (il bottone login principale basta). */
.login-ui input.continue-login,
.login-dialog input.continue-login,
.login-ui input[name="continue"],
.login-dialog input[name="continue"]{
 display:none !important;
}

/* BOTTONE "ENTRA" - sfondo #f5f5f5 forzato.
   IMPORTANTE: Guacamole 1.6 usa <input type="submit"> non <button> */
.login-ui button,
.login-dialog button,
.login-ui input[type="submit"]:not(.continue-login):not([name="continue"]),
.login-dialog input[type="submit"]:not(.continue-login):not([name="continue"]){
 background:#f5f5f5 !important;
 background-color:#f5f5f5 !important;
 color:#000 !important;
 border:none !important;
 border-radius:14px !important;
 width:100% !important;
 max-width:460px !important;
 min-width:0 !important;
 padding:16px 32px !important;
 font-size:18px !important;
 font-weight:600 !important;
 letter-spacing:1px !important;
 text-transform:uppercase !important;
 margin:20px auto 0 auto !important;
 cursor:pointer !important;
 box-shadow:0 6px 20px rgba(0,0,0,0.4) !important;
 transition:all 0.2s ease !important;
 display:block !important;
 box-sizing:border-box !important;
 /* feature OpenType: spegni small-caps */
 font-variant:normal !important;
 font-variant-caps:normal !important;
 font-variant-numeric:normal !important;
 font-feature-settings:"smcp" 0, "c2sc" 0, "pcap" 0, "c2pc" 0, "unic" 0 !important;
 -webkit-font-feature-settings:"smcp" 0, "c2sc" 0, "pcap" 0, "c2pc" 0, "unic" 0 !important;
 font-family:inherit !important;
 -webkit-appearance:none !important;
 appearance:none !important;
}

.login-ui button:hover,
.login-dialog button:hover,
.login-ui input[type="submit"]:not(.continue-login):not([name="continue"]):hover,
.login-dialog input[type="submit"]:not(.continue-login):not([name="continue"]):hover{
 background:#ffffff !important;
 background-color:#ffffff !important;
 color:#000 !important;
 box-shadow:0 8px 28px rgba(255,255,255,0.25) !important;
 transform:translateY(-1px) !important;
}

/* blindatura colore testo dentro il bottone (solo se <button>
   con span interni - gli <input> non hanno figli) */
.login-ui button *,
.login-dialog button *{
 color:#000 !important;
 text-transform:uppercase !important;
 font-variant:normal !important;
 font-variant-caps:normal !important;
 font-feature-settings:"smcp" 0, "c2sc" 0, "pcap" 0, "c2pc" 0 !important;
 -webkit-font-feature-settings:"smcp" 0, "c2sc" 0, "pcap" 0, "c2pc" 0 !important;
 font-family:inherit !important;
 font-size:inherit !important;
 letter-spacing:inherit !important;
}

/* FOOTER "ACCESSO MONITORATO / ATTIVITA REGISTRATA"
   - stile identico al logout */
.login-dialog .massini-warning{
 color:#8a8a8a !important;
 font-size:12px !important;
 letter-spacing:2px !important;
 margin:35px 0 0 0 !important;
 line-height:1.6 !important;
 text-transform:uppercase !important;
}

/* Mobile */
@media (max-width:600px){
 .login-dialog{
  padding:40px 25px !important;
  border-radius:20px !important;
 }
 .login-dialog .massini-logo{
  margin-bottom:25px !important;
 }
 .login-ui input,
 .login-ui button,
 .login-dialog button{
  min-width:200px !important;
  padding:14px 20px !important;
  font-size:16px !important;
 }
}



/* === GREEN TO #f5f5f5 === */
.nav-tabs > li.active > a,
.settings .tab.active,
.tabs .active {
    background:#f5f5f5 !important;
    color:#000 !important;
    border-bottom:2px solid #f5f5f5 !important;
}

/* hover */
.nav-tabs > li > a:hover {
    background:rgba(245,245,245,0.2) !important;
}

/* OPTIONS DROPDOWN BLACK */
.menu,
.dropdown-menu,
.user-menu {
    background:#000 !important;
    color:#fff !important;
}

.menu a,
.dropdown-menu a {
    color:#fff !important;
}

.menu a:hover,
.dropdown-menu a:hover {
    background:rgba(255,255,255,0.1) !important;
}


/* === HOVER TAB FIX === */
.nav-tabs > li > a:hover,
.tabs li:hover,
.settings .tab:hover {
    background: #000 !important;
    color: #fff !important;
}

/* active tab keep white */
.nav-tabs > li.active > a {
    background: #f5f5f5 !important;
    color: #000 !important;
}

/* ensure text always white on dark areas */
.nav-tabs > li > a {
    color: #fff !important;
}


/* =========================
   MASSINI TAB + MENU FIX
   ========================= */

/* inactive tabs: white text */
.nav-tabs > li > a,
.settings .tabs .tab,
.settings .menu .tab,
.settings .tab,
.settings li a,
.settings .header a {
    color: #ffffff !important;
}

/* hover tabs: black background + white text */
.nav-tabs > li > a:hover,
.nav-tabs > li:hover > a,
.settings .tabs .tab:hover,
.settings .menu .tab:hover,
.settings .tab:hover,
.settings li:hover > a,
.settings .header a:hover {
    background: #000000 !important;
    color: #ffffff !important;
    border-color: #000000 !important;
}

/* active/current tabs: #f5f5f5 background + black text */
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus,
.settings .tabs .tab.active,
.settings .menu .tab.active,
.settings .tab.active,
.settings li.active > a,
.settings li[aria-selected="true"] > a,
.settings a[aria-current="page"] {
    background: #f5f5f5 !important;
    color: #000000 !important;
    border-color: #f5f5f5 !important;
    box-shadow: none !important;
}

/* force green legacy states off */
[style*="#b7c97b"],
[style*="#c0d08a"],
[style*="rgb(183, 201, 123)"],
[style*="rgb(192, 208, 138)"],
.bg-success,
.label-success,
.btn-success,
.success,
.active.success {
    background: #f5f5f5 !important;
    color: #000000 !important;
    border-color: #f5f5f5 !important;
}

/* user dropdown/menu background black */
.menu,
.menu *[role="menu"],
.menu-contents,
.menu-contents *,
.dropdown-menu,
.dropdown-menu *,
.user-menu,
.user-menu *,
.header-menu,
.header-menu * {
    background-color: #000000 !important;
    border-color: rgba(255,255,255,0.10) !important;
}

/* dropdown/menu text white */
.menu a,
.menu span,
.menu div,
.menu li,
.dropdown-menu a,
.dropdown-menu span,
.dropdown-menu div,
.dropdown-menu li,
.user-menu a,
.user-menu span,
.user-menu div,
.user-menu li,
.header-menu a,
.header-menu span,
.header-menu div,
.header-menu li {
    color: #ffffff !important;
}

/* dropdown hover */
.menu a:hover,
.menu li:hover,
.dropdown-menu a:hover,
.dropdown-menu li:hover,
.user-menu a:hover,
.user-menu li:hover,
.header-menu a:hover,
.header-menu li:hover {
    background: rgba(255,255,255,0.12) !important;
    color: #ffffff !important;
}

/* disabled dropdown/menu item */
.menu .disabled,
.menu .disabled *,
.dropdown-menu .disabled,
.dropdown-menu .disabled *,
.user-menu .disabled,
.user-menu .disabled * {
    color: rgba(255,255,255,0.38) !important;
}

/* icon colors inside dropdown */
.menu .icon,
.dropdown-menu .icon,
.user-menu .icon,
.header-menu .icon,
.menu svg,
.dropdown-menu svg,
.user-menu svg,
.header-menu svg {
    color: #ffffff !important;
    fill: currentColor !important;
}

/* settings page body readability */
.settings,
.settings *,
.settings-page,
.settings-page * {
    border-color: rgba(255,255,255,0.08) !important;
}


/* === FORCE BLACK BACKGROUND SETTINGS === */
body,
.app,
#app,
.settings,
.settings-page,
.settings-container,
.main,
.content {
    background: #000000 !important;
    color: #ffffff !important;
}

/* tables background */
table,
thead,
tbody,
tr,
td,
th {
    background: #000000 !important;
    color: #ffffff !important;
}

/* header section */
.header,
.navbar {
    background: #000000 !important;
}

/* filter bar */
input,
select {
    background: #111 !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
}


/* === HOVER MENU WHITE === */
.nav-tabs > li > a:hover,
.tabs li:hover,
.settings .tab:hover,
.settings li:hover > a,
.settings a:hover {
    background: #f5f5f5 !important;
    color: #000 !important;
}

/* keep text readable */
.nav-tabs > li > a {
    color: #ffffff !important;
}


/* === INPUT WHITE ENTERPRISE FIX === */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="search"],
textarea,
select {
    background: #f5f5f5 !important;
    color: #000000 !important;
    border: 1px solid rgba(0,0,0,0.15) !important;
}

/* placeholder readability */
input::placeholder,
textarea::placeholder {
    color: #666 !important;
}

/* checkbox keep visible */
input[type="checkbox"] {
    background: #f5f5f5 !important;
    border: 1px solid #999 !important;
}


/* === FINAL USER TEXT COLOR FIX === */
table tbody tr td,
table tbody tr td a,
.user-list td,
.connection-list td {
    color: #f5f5f5 !important;
}

/* selected row */
table tbody tr.selected td,
table tbody tr.active td {
    color: #f5f5f5 !important;
}

/* hover menu white */
.nav-tabs > li > a:hover,
.settings .tab:hover {
    background: #f5f5f5 !important;
    color: #000 !important;
}

/* active tab */
.nav-tabs > li.active > a {
    background: #f5f5f5 !important;
    color: #000 !important;
}

/* dropdown black */
.menu,
.dropdown-menu,
.user-menu {
    background: #000 !important;
    color: #fff !important;
}

.menu a,
.dropdown-menu a {
    color: #fff !important;
}

.menu a:hover,
.dropdown-menu a:hover {
    background: rgba(255,255,255,0.1) !important;
}

/* input background */
input, textarea, select {
    background: #f5f5f5 !important;
    color: #000 !important;
}


/* === DEFAULT ROW BACKGROUND FIX === */
table tbody tr {
    background: #f5f5f5 !important;
    color: #000 !important;
}

/* keep hover contrast */
table tbody tr:hover {
    background: #e0e0e0 !important;
}

/* selected row */
table tbody tr.selected,
table tbody tr.active {
    background: #dcdcdc !important;
}


/* === ICON COLOR FIX === */
table tbody tr td .icon,
table tbody tr td i,
table tbody tr td svg {
    color: #f5f5f5 !important;
    fill: #f5f5f5 !important;
}

/* specific user icon */
.glyphicon,
.fa,
.material-icons {
    color: #f5f5f5 !important;
}

/* ensure inside rows */
table tbody tr td * {
    color: inherit !important;
}


/* === MINIMAL ICON FIX (no global side effects) === */
/* Target Guacamole user icons in lists */
.user-list .icon,
.user-list .user-icon,
.connection-list .icon,
.connection-list .user-icon,
.all-connections .icon,
.current-connections .icon,
.connection-listing .icon,
.connections .icon,
.caption .icon,
a.home-connection .icon,
a.home-connection-group .icon,
.recent-connections .connection .icon,
.recent-connections .connection-group .icon,
.glyphicon-user,
.fa-user {
    filter: brightness(0) invert(1) !important; /* force to light */
}

/* Ensure icon SVGs inside list cells are visible */
.user-list td svg,
.connection-list td svg,
.all-connections svg,
.current-connections svg {
    fill: #f5f5f5 !important;
}

/* Keep text as previously set */
.user-list td,
.connection-list td {
    color: #f5f5f5 !important;
}


/* === GROUP ICON FIX === */
.user-group-list .icon,
.connection-group-list .icon,
.group-list .icon,
.fa-users,
.glyphicon-user,
.glyphicon-group {
    filter: brightness(0) invert(1) !important;
}

/* SVG group icons */
.user-group-list svg,
.connection-group-list svg {
    fill: #f5f5f5 !important;
}


/* === USER ICON HOVER / SELECTED BLACK === */
table tbody tr:hover .icon,
table tbody tr:hover i,
table tbody tr:hover svg,
table tbody tr.selected .icon,
table tbody tr.selected i,
table tbody tr.selected svg {
    filter: brightness(0) invert(0) !important; /* force black */
    color: #000 !important;
    fill: #000 !important;
}


/* === FORM FIELD WHITE BG FIX === */
input[type="text"],
input[type="number"],
input[type="password"],
input[type="email"],
textarea,
select {
    background: #f5f5f5 !important;
    color: #000000 !important;
}

/* dropdown selected (tipo ROOT verde fix) */
select option:checked,
select option:selected {
    background: #f5f5f5 !important;
    color: #000000 !important;
}

/* label text */
label {
    color: #ffffff !important;
}


/* === STRONG FORM OVERRIDE === */
.guac-form input,
.guac-form select,
.guac-form textarea,
.settings input,
.settings select,
.settings textarea,
input,
select,
textarea {
    background: #f5f5f5 !important;
    color: #000 !important;
}

/* FORCE SELECT DISPLAY (fix ROOT green) */
select,
select:focus,
select:hover {
    background-color: #f5f5f5 !important;
    color: #000 !important;
}

/* OPTION list (browser dependent but try) */
option {
    background: #f5f5f5 !important;
    color: #000 !important;
}

/* LABELS stay white */
label {
    color: #ffffff !important;
}


/* ===============================================
   MASSINI v2.1 - FIX HOVER VERDE LISTA CONNESSIONI
   Target: Guacamole 1.6.0 settings/connections
   =============================================== */

/* righe lista connessioni/gruppi/utenti - hover */
.list-pager .page:hover,
.connection:hover,
.connection-group:hover,
.user:hover,
.user-group:hover,
.choice:hover,
.caption:hover,
.list-item:hover,
.settings .list-item:hover,
.settings .caption:hover,
.settings .connection:hover,
.settings .connection-group:hover,
.settings .user:hover,
.settings .user-group:hover,
div[ng-repeat] > .caption:hover,
div[ng-repeat] > .choice:hover {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000 !important;
}

/* stato expanded / selected della lista */
.connection.expanded,
.connection-group.expanded,
.user.expanded,
.user-group.expanded,
.caption.expanded,
.choice.expanded,
.list-item.expanded,
.connection.selected,
.connection-group.selected,
.caption.selected,
.choice.selected {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000 !important;
}

/* figli interni (icone, testo, span) sulle righe hover/selected */
.connection:hover *,
.connection-group:hover *,
.user:hover *,
.user-group:hover *,
.choice:hover *,
.caption:hover *,
.list-item:hover *,
.connection.expanded *,
.connection-group.expanded *,
.caption.expanded *,
.choice.expanded * {
    background-color: #f5f5f5 !important;
    color: #000 !important;
}

/* override colori verdi legacy residui (palette Guacamole default) */
[style*="#b7c97b"],
[style*="#c0d08a"],
[style*="#9dbd5c"],
[style*="#a0c060"],
[style*="#607830"],
[style*="rgb(183, 201, 123)"],
[style*="rgb(192, 208, 138)"],
[style*="rgb(157, 189, 92)"],
[style*="rgb(96, 120, 48)"] {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000 !important;
    border-color: #f5f5f5 !important;
}


/* ===============================================
   MASSINI v2.2 - FIX DATA-SOURCE / PAGE-TABS
   Target: pagina "Modifica Utente" e simili
   Problema: pillole tipo "Shared Connections (PostgreSQL)"
   - testo nero su fondo nero (invisibili)
   - hover verde #607830 / #84af2c
   Soluzione: testo bianco leggibile, hover #f5f5f5
   =============================================== */

/* stato normale: testo sempre visibile (bianco) */
.page-tabs .page-list li a,
.page-tabs .page-list li a[href],
.page-tabs .page-list li a:visited,
.page-tabs .page-list li a[href]:visited,
.section-tabs li a,
.section-tabs li a[href],
.section-tabs li a:visited,
.section-tabs li a[href]:visited,
.identifier-set li a,
.identifier-set li a[href],
.identifier-set .member a,
.identifier-set .caption,
.manage-user .page-tabs li a,
.manage-user .section-tabs li a,
.manage-user-group .page-tabs li a,
.manage-user-group .section-tabs li a,
.manage-connection .page-tabs li a,
.manage-connection-group .page-tabs li a {
    color: #ffffff !important;
    background-color: transparent !important;
}

/* stato hover: sfondo #f5f5f5 + testo nero */
.page-tabs .page-list li a:hover,
.page-tabs .page-list li a[href]:hover,
.section-tabs li a:hover,
.section-tabs li a[href]:hover,
.identifier-set li a:hover,
.identifier-set li a[href]:hover,
.identifier-set .member a:hover,
.identifier-set .caption:hover,
.manage-user .page-tabs li a:hover,
.manage-user .section-tabs li a:hover,
.manage-user-group .page-tabs li a:hover,
.manage-user-group .section-tabs li a:hover,
.manage-connection .page-tabs li a:hover,
.manage-connection-group .page-tabs li a:hover {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
}

/* stato current/active della pillola (pagina corrente) */
.page-tabs .page-list li.current a,
.page-tabs .page-list li a.current,
.section-tabs li.current a,
.section-tabs li a.current,
.page-tabs .page-list li.selected a,
.section-tabs li.selected a {
    background-color: #f5f5f5 !important;
    color: #000000 !important;
}

/* icone / lucchetto dentro le pillole visibili in stato normale */
.page-tabs .page-list li a .icon,
.page-tabs .page-list li a img,
.section-tabs li a .icon,
.section-tabs li a img,
.identifier-set li a .icon,
.identifier-set li a img {
    filter: brightness(0) invert(1) !important;  /* icona bianca sul nero */
}

/* icone / lucchetto in hover: nero su sfondo chiaro */
.page-tabs .page-list li a:hover .icon,
.page-tabs .page-list li a:hover img,
.section-tabs li a:hover .icon,
.section-tabs li a:hover img,
.identifier-set li a:hover .icon,
.identifier-set li a:hover img,
.page-tabs .page-list li.current a .icon,
.section-tabs li.current a .icon {
    filter: brightness(0) invert(0) !important;  /* icona nera sul chiaro */
}

/* catch-all per verdi Guacamole legacy sui link */
a[style*="#607830"],
a[style*="#84af2c"],
a[style*="rgb(96, 120, 48)"],
a[style*="rgb(132, 175, 44)"],
li[style*="#607830"],
li[style*="#84af2c"] {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
}


/* ===================================================================
   MASSINI v2.3 - UNIVERSAL FIX HOVER VERDE + TESTO INVISIBILE
   Target: TUTTI i selettori Guacamole 1.6.0 che producono
           sfondo verde (#607830/#84af2c/#b7c97b) al hover
           o testo nero invisibile su sfondo nero.
   Basato su mappatura completa del sorgente Guacamole.
   =================================================================== */

/* -------------------------------------------------------------------
   1) HOME SCREEN - recent connections + connection tiles
   ------------------------------------------------------------------- */
.recent-connections .connection,
.recent-connections .connection-group,
a.home-connection,
a.home-connection-group {
    color: #ffffff !important;
}

.recent-connections .connection:hover,
.recent-connections .connection-group:hover,
a.home-connection:hover,
a.home-connection-group:hover,
.empty.balancer a.home-connection-group:hover {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
}

/* -------------------------------------------------------------------
   2) MENU DROPDOWN - menu, breadcrumbs, zoom, user menu
   ------------------------------------------------------------------- */
.menu-dropdown .menu-contents li a,
.menu-dropdown .menu-contents li a[href],
#filesystem-menu .header.breadcrumbs .breadcrumb,
#guac-menu a,
#guac-menu #zoom-in,
#guac-menu #zoom-out,
.user-menu a,
.menu-dropdown a {
    color: #ffffff !important;
}

.menu-dropdown .menu-contents li a:hover,
.menu-dropdown .menu-contents li a[href]:hover,
#filesystem-menu .header.breadcrumbs .breadcrumb:hover,
#guac-menu #zoom-in:hover,
#guac-menu #zoom-out:hover,
#guac-menu a:hover,
.user-menu a:hover,
.menu-dropdown a:hover {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
}

/* -------------------------------------------------------------------
   3) LIST ITEMS - caption, choice, selected, expanded
      (già coperto da v2.1 ma con più selettori / specificita)
   ------------------------------------------------------------------- */
.list-item,
.list-item .name,
.list-item .caption,
.list-item:not(.selected) .caption {
    color: #ffffff !important;
}

.list-item.selected,
.list-item.selected .caption,
.list-item.selected .name {
    background: #f5f5f5 !important;
    background-color: #f5f5f5 !important;
    color: #000000 !important;
}

.list-item:not(.selected) .caption:hover,
.list-item:not(.selected):hover,
.list-item:not(.selected):hover .caption,
.list-item:not(.selected):hover .name {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
}

/* -------------------------------------------------------------------
   4) SETTINGS - session list / active session list
   ------------------------------------------------------------------- */
.settings table.session-list tr.session,
.settings table.session-list tr.session td,
.settings .session-list tr,
.settings .session-list tr td {
    color: #ffffff !important;
}

.settings table.session-list tr.session:hover,
.settings table.session-list tr.session:hover td,
.settings .session-list tr:hover,
.settings .session-list tr:hover td {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
}

/* -------------------------------------------------------------------
   5) USER / USER-GROUP / CONNECTION / CONNECTION-GROUP LINKS
   ------------------------------------------------------------------- */
.user a, .user a[href],
.user-group a, .user-group a[href],
.connection a, .connection a[href],
.connection-group a, .connection-group a[href] {
    color: #ffffff !important;
}

.user a:visited, .user a[href]:visited,
.user-group a:visited, .user-group a[href]:visited,
.connection a:visited, .connection a[href]:visited,
.connection-group a:visited, .connection-group a[href]:visited {
    color: #ffffff !important;
}

.user a:hover, .user a[href]:hover,
.user-group a:hover, .user-group a[href]:hover,
.connection a:hover, .connection a[href]:hover,
.connection-group a:hover, .connection-group a[href]:hover {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
}

/* -------------------------------------------------------------------
   6) LOCATION CHOOSER - dropdown percorso
   ------------------------------------------------------------------- */
/* -------------------------------------------------------------------
   6) LOCATION CHOOSER - dropdown percorso
   FIX v3.5: testo NERO per padre e figli dell'albero (ROOT + sottogruppi).
   Icone mantenute in blu Massini per distinguersi dal testo.
   Sfondo del campo chiaro #f5f5f5, quindi nero si legge perfetto.
   ------------------------------------------------------------------- */
.location-chooser,
.location-chooser .dropdown,
.location-chooser .location,
.location-chooser div,
.location-chooser a,
.location-chooser li,
.location-chooser .caption,
.location-chooser .caption .name,
.location-chooser .name,
.location-chooser .menu-title,
.location-chooser .menu-contents,
.location-chooser .menu-contents li,
.location-chooser .menu-contents a,
.location-chooser .list-item,
.location-chooser .list-item .caption,
.location-chooser .list-item .name,
.location-chooser .list-item a,
.location-chooser .connection-group,
.location-chooser .connection-group .caption,
.location-chooser .connection-group .name,
.location-chooser .connection-group a {
    color: #000000 !important;
}

/* Icone dentro location-chooser: NESSUN filter, nessun bg-color,
   lascio che il background-image SVG originale venga mostrato.
   Alta specificita' (html body) per battere le regole globali che
   applicano brightness(0) invert(1) sulle .caption .icon.type */
html body .location-chooser .icon,
html body .location-chooser .list-item .icon,
html body .location-chooser .caption .icon,
html body .location-chooser .caption .icon.type,
html body .location-chooser .caption .icon.location,
html body .location-chooser .list-item .icon.type,
html body .location-chooser .icon.type,
html body .location-chooser .icon.group,
html body .location-chooser svg,
html body .location-chooser .list-item svg,
html body .location-chooser .caption svg,
html body .location-chooser i,
html body .location-chooser .glyphicon {
    filter: none !important;
    -webkit-filter: none !important;
    background-color: transparent !important;
    color: #28477D !important;
    fill: #28477D !important;
}

.location-chooser .dropdown li:hover,
.location-chooser .dropdown a:hover,
.location-chooser li:hover,
.location-chooser a:hover,
.location-chooser .list-item:hover,
.location-chooser .list-item:hover .caption,
.location-chooser .list-item:hover .name,
.location-chooser .list-item:hover a,
.location-chooser .menu-contents li:hover,
.location-chooser .menu-contents a:hover {
    background-color: #e8eef5 !important;
    background: #e8eef5 !important;
    color: #000000 !important;
}

/* -------------------------------------------------------------------
   7) MANAGE-USER / MANAGE-CONNECTION - notice, permissions
   ------------------------------------------------------------------- */
.manage-user .notice,
.manage-user-group .notice,
.manage-connection .notice,
.manage-connection-group .notice {
    color: #ffffff !important;
}

.manage-user a,
.manage-user-group a,
.manage-connection a,
.manage-connection-group a,
.manage-user .permission,
.manage-user-group .permission {
    color: #ffffff !important;
}

.manage-user a:hover,
.manage-user-group a:hover,
.manage-connection a:hover,
.manage-connection-group a:hover,
.manage-user .permission:hover,
.manage-user-group .permission:hover {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
}

/* -------------------------------------------------------------------
   8) BREADCRUMBS GENERICHE (anche fuori da filesystem-menu)
   ------------------------------------------------------------------- */
.breadcrumbs,
.breadcrumbs .breadcrumb,
.breadcrumb {
    color: #ffffff !important;
}

.breadcrumbs .breadcrumb:hover,
.breadcrumb:hover,
.breadcrumbs a:hover {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
}

/* -------------------------------------------------------------------
   9) PAGINATORE LISTE (list-pager)
   ------------------------------------------------------------------- */
.list-pager .page,
.list-pager a,
.list-pager .page-number {
    color: #ffffff !important;
}

.list-pager .page:hover,
.list-pager a:hover,
.list-pager .page-number:hover,
.list-pager .page.current {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
}

/* -------------------------------------------------------------------
   10) PERMESSI / GRANTS (matrix di permessi in Modifica Utente)
   ------------------------------------------------------------------- */
.permission-flag,
.permission-selector,
.object-permissions li,
.system-permissions li,
.effective-permissions li {
    color: #ffffff !important;
}

.permission-flag:hover,
.permission-selector:hover,
.object-permissions li:hover,
.system-permissions li:hover,
.effective-permissions li:hover {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
}

/* -------------------------------------------------------------------
   11) SHARING PROFILE (presente nel tuo screenshot iniziale)
   ------------------------------------------------------------------- */
.sharing-profile,
.sharing-profile a,
a.sharing-profile {
    color: #ffffff !important;
}

.sharing-profile:hover,
.sharing-profile a:hover,
a.sharing-profile:hover {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
}

/* -------------------------------------------------------------------
   12) CATCH-ALL STRUTTURALE - tutti i link/pulsanti verdi legacy
       dentro le aree di settings e manage
   ------------------------------------------------------------------- */
.settings a,
.settings-page a,
.manage-user a,
.manage-user-group a,
.manage-connection a,
.manage-connection-group a,
.home a {
    color: #ffffff;  /* no !important qui: lascia prevalere regole specifiche già definite */
}

/* Qualunque elemento cliccabile dentro settings/manage/home che al hover
   diventi verde oliva Guacamole -> diventa #f5f5f5 */
.settings *:hover[style*="#607830"],
.settings *:hover[style*="#84af2c"],
.manage-user *:hover[style*="#607830"],
.manage-user *:hover[style*="#84af2c"],
.home *:hover[style*="#607830"],
.home *:hover[style*="#84af2c"] {
    background-color: #f5f5f5 !important;
    color: #000000 !important;
}

/* -------------------------------------------------------------------
   13) OVERRIDE INLINE STYLE - verdi applicati via attribute style=""
   ------------------------------------------------------------------- */
[style*="background-color: #607830"],
[style*="background-color:#607830"],
[style*="background-color: #84af2c"],
[style*="background-color:#84af2c"],
[style*="background-color: rgb(96, 120, 48)"],
[style*="background-color: rgb(132, 175, 44)"],
[style*="background:#607830"],
[style*="background: #607830"],
[style*="background:#84af2c"],
[style*="background: #84af2c"] {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
}

/* -------------------------------------------------------------------
   14) NAMES COLOR FIX - testo nome connessione/utente visibile
   ------------------------------------------------------------------- */
.list-item .name,
.connection .name,
.connection-group .name,
.user .name,
.user-group .name,
.caption .name,
.caption span,
.choice .name,
.choice span {
    color: inherit !important;  /* eredita dal parent (#fff normale, #000 hover) */
}


/* ===================================================================
   MASSINI v2.4 - FIX TESTO TAB SELEZIONATA (scritta nera)
   Problema: quando la pillola/tab è selezionata lo sfondo diventa
             #f5f5f5 ma il testo resta bianco => invisibile.
   Target: tab "PostgreSQL ✓" / "Shared Connections (PostgreSQL)"
   Soluzione: forzare colore NERO sulla tab attiva con massima
              specificità, coprendo tutte le varianti di classe che
              Guacamole 1.6.0 applica alla tab corrente.
   =================================================================== */

/* --- TAB ATTIVE: tutti i pattern possibili --- */
.page-tabs .page-list li.current a,
.page-tabs .page-list li.current a[href],
.page-tabs .page-list li.current a:visited,
.page-tabs .page-list li.current a[href]:visited,
.page-tabs .page-list li.current a:hover,
.page-tabs .page-list li.current a[href]:hover,
.page-tabs .page-list li.selected a,
.page-tabs .page-list li.selected a[href],
.page-tabs .page-list li.active a,
.page-tabs .page-list li.active a[href],
.page-tabs .page-list li a.current,
.page-tabs .page-list li a.selected,
.page-tabs .page-list li a.active,
.page-tabs .page-list li[aria-selected="true"] a,
.page-tabs .page-list li[aria-current="page"] a,
.page-tabs .page-list li a[aria-current="page"],
.page-tabs .page-list li a[aria-current="true"],

.section-tabs li.current a,
.section-tabs li.current a[href],
.section-tabs li.current a:visited,
.section-tabs li.current a[href]:visited,
.section-tabs li.current a:hover,
.section-tabs li.current a[href]:hover,
.section-tabs li.selected a,
.section-tabs li.selected a[href],
.section-tabs li.active a,
.section-tabs li.active a[href],
.section-tabs li a.current,
.section-tabs li a.selected,
.section-tabs li a.active,
.section-tabs li[aria-selected="true"] a,
.section-tabs li[aria-current="page"] a,
.section-tabs li a[aria-current="page"],
.section-tabs li a[aria-current="true"],

.identifier-set li.current a,
.identifier-set li.selected a,
.identifier-set li.active a,
.identifier-set li a.current,
.identifier-set li a.selected,
.identifier-set li a.active,

.manage-user .page-tabs li.current a,
.manage-user .section-tabs li.current a,
.manage-user-group .page-tabs li.current a,
.manage-user-group .section-tabs li.current a,
.manage-connection .page-tabs li.current a,
.manage-connection-group .page-tabs li.current a {
    color: #000000 !important;
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
}

/* --- TESTO INTERNO della tab attiva (span, em, checkmark, etc.) --- */
.page-tabs .page-list li.current a *,
.page-tabs .page-list li.current a[href] *,
.page-tabs .page-list li.selected a *,
.page-tabs .page-list li.active a *,
.page-tabs .page-list li a.current *,
.page-tabs .page-list li[aria-current="page"] a *,
.page-tabs .page-list li a[aria-current="page"] *,

.section-tabs li.current a *,
.section-tabs li.current a[href] *,
.section-tabs li.selected a *,
.section-tabs li.active a *,
.section-tabs li a.current *,
.section-tabs li[aria-current="page"] a *,
.section-tabs li a[aria-current="page"] *,

.manage-user .page-tabs li.current a *,
.manage-user .section-tabs li.current a *,
.manage-user-group .page-tabs li.current a *,
.manage-connection .page-tabs li.current a * {
    color: #000000 !important;
    background-color: transparent !important;
    background: transparent !important;
}

/* --- ICONA / CHECKMARK della tab attiva: nera --- */
.page-tabs .page-list li.current a .icon,
.page-tabs .page-list li.current a img,
.page-tabs .page-list li.current a svg,
.page-tabs .page-list li.selected a .icon,
.page-tabs .page-list li.selected a img,
.page-tabs .page-list li.active a .icon,
.page-tabs .page-list li a.current .icon,
.page-tabs .page-list li a.current img,
.page-tabs .page-list li a.current svg,
.page-tabs .page-list li[aria-current="page"] a .icon,
.page-tabs .page-list li[aria-current="page"] a img,
.page-tabs .page-list li[aria-current="page"] a svg,

.section-tabs li.current a .icon,
.section-tabs li.current a img,
.section-tabs li.current a svg,
.section-tabs li.selected a .icon,
.section-tabs li.active a .icon,
.section-tabs li a.current .icon,
.section-tabs li[aria-current="page"] a .icon,
.section-tabs li[aria-current="page"] a img,
.section-tabs li[aria-current="page"] a svg {
    filter: brightness(0) invert(0) !important;  /* icona/checkmark NERO */
    color: #000000 !important;
    fill: #000000 !important;
}

/* --- FALLBACK: regola finalissima con alta specificità per catturare
       qualsiasi link con sfondo chiaro #f5f5f5 o bianco - forza testo nero.
       Evita che restino scritte bianche su sfondo chiaro ovunque. --- */
.page-tabs a[style*="#f5f5f5"],
.page-tabs a[style*="#ffffff"],
.section-tabs a[style*="#f5f5f5"],
.section-tabs a[style*="#ffffff"],
a[style*="background-color: #f5f5f5"],
a[style*="background:#f5f5f5"],
a[style*="background: #f5f5f5"] {
    color: #000000 !important;
}

/* Children di link con sfondo chiaro: anche loro neri */
.page-tabs a[style*="#f5f5f5"] *,
.section-tabs a[style*="#f5f5f5"] *,
a[style*="background-color: #f5f5f5"] *,
a[style*="background: #f5f5f5"] * {
    color: #000000 !important;
}


/* ===================================================================
   MASSINI v2.5 - DEFINITIVO: tab attiva con testo nero
   Strategia: non sappiamo quale classe applica Guacamole alla tab
   corrente (non è .current, non è .selected, non è .active).
   Soluzione robusta a 3 livelli:

   LIVELLO A - CSS :has() (browser moderni):
     Selezioniamo qualsiasi <a> il cui background computed sia chiaro
     e forziamo testo nero. Non dipende dal nome della classe.

   LIVELLO B - Detect da struttura DOM:
     In molte versioni di Guacamole la tab corrente è un <span>
     (senza <a>) mentre le altre tab sono <a>. Uno <span> dentro
     .page-tabs/.section-tabs è quindi la tab attiva per definizione.

   LIVELLO C - Override con selettore attributo ampio:
     Colpiamo qualsiasi elemento con class*="current", class*="active",
     class*="selected" dentro le page-tabs, coprendo classi custom
     come "page-list-item-current", "section-tab-current", ecc.
   =================================================================== */

/* --- LIVELLO B: la tab corrente in Guacamole è spesso uno <span>
       non cliccabile (senza <a>) perché sei già su quella pagina --- */
.page-tabs .page-list li > span,
.page-tabs .page-list li > span *,
.section-tabs li > span,
.section-tabs li > span *,
.page-tabs > ul > li > span,
.page-tabs > ul > li > span * {
    color: #000000 !important;
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
}

/* Lo span della tab attiva: anche senza <a>, stile coerente */
.page-tabs .page-list li:not(:has(a)) {
    background-color: #f5f5f5 !important;
    color: #000000 !important;
}

.page-tabs .page-list li:not(:has(a)) *,
.section-tabs li:not(:has(a)) *,
.page-tabs .page-list li:not(:has(a[href])) *,
.section-tabs li:not(:has(a[href])) * {
    color: #000000 !important;
}

/* --- LIVELLO C: qualsiasi classe che contenga "current", "active",
       "selected" dentro le tabs (pattern ampio per coprire nomi
       custom generati da Guacamole/Angular) --- */
.page-tabs [class*="current"],
.page-tabs [class*="Current"],
.page-tabs [class*="active"],
.page-tabs [class*="Active"],
.page-tabs [class*="selected"],
.page-tabs [class*="Selected"],
.section-tabs [class*="current"],
.section-tabs [class*="Current"],
.section-tabs [class*="active"],
.section-tabs [class*="Active"],
.section-tabs [class*="selected"],
.section-tabs [class*="Selected"] {
    color: #000000 !important;
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
}

.page-tabs [class*="current"] *,
.page-tabs [class*="Current"] *,
.page-tabs [class*="active"] *,
.page-tabs [class*="Active"] *,
.page-tabs [class*="selected"] *,
.page-tabs [class*="Selected"] *,
.section-tabs [class*="current"] *,
.section-tabs [class*="Current"] *,
.section-tabs [class*="active"] *,
.section-tabs [class*="Active"] *,
.section-tabs [class*="selected"] *,
.section-tabs [class*="Selected"] * {
    color: #000000 !important;
    background-color: transparent !important;
    background: transparent !important;
}

/* --- LIVELLO A: :has() -- qualsiasi li che contenga un elemento
       con sfondo chiaro applicato inline => testo interno nero --- */
.page-tabs li:has([style*="#f5f5f5"]),
.page-tabs li:has([style*="#F5F5F5"]),
.page-tabs li:has([style*="#ffffff"]),
.section-tabs li:has([style*="#f5f5f5"]),
.section-tabs li:has([style*="#F5F5F5"]) {
    color: #000000 !important;
}

.page-tabs li:has([style*="#f5f5f5"]) *,
.page-tabs li:has([style*="#F5F5F5"]) *,
.page-tabs li:has([style*="#ffffff"]) *,
.section-tabs li:has([style*="#f5f5f5"]) *,
.section-tabs li:has([style*="#F5F5F5"]) * {
    color: #000000 !important;
}

/* --- LIVELLO TRASVERSALE: primo elemento figlio delle tabs.
       In Guacamole la tab attiva è tipicamente il primo <li> del
       gruppo (quando si è sulla pagina corrente). Non possiamo
       basarci solo su :first-child perché non sempre è vero,
       ma aggiungiamo regole per il caso comune "la pagina in cui
       sei già" = tab evidenziata. --- */

/* --- REGOLA UNIVERSALE FORTE: qualsiasi elemento dentro .page-tabs
       o .section-tabs che abbia lo sfondo #f5f5f5 (anche via CSS
       computed tramite altre regole) deve avere testo nero.
       Questa è la rete di sicurezza finale: se un elemento ha
       sfondo chiaro, deve avere testo scuro, indipendentemente
       dalle classi. --- */
.page-tabs a[style*="background"][style*="f5f5f5"],
.page-tabs a[style*="background"][style*="F5F5F5"],
.section-tabs a[style*="background"][style*="f5f5f5"],
.section-tabs a[style*="background"][style*="F5F5F5"],
.page-tabs span[style*="background"][style*="f5f5f5"],
.section-tabs span[style*="background"][style*="f5f5f5"] {
    color: #000000 !important;
}

/* --- SAFETY NET: disabilita qualsiasi regola precedente che forzi
       color: #ffffff sui link dentro tabs CHIARE.
       Usiamo specificità crescente per vincere contro v2.2 --- */
body .page-tabs .page-list li:not(:hover) > span,
body .section-tabs li:not(:hover) > span,
html body .page-tabs .page-list > li > span,
html body .section-tabs > ul > li > span,
html body .page-tabs > ul > li > span {
    color: #000000 !important;
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
}

html body .page-tabs .page-list > li > span *,
html body .section-tabs > ul > li > span *,
html body .page-tabs > ul > li > span * {
    color: #000000 !important;
}


/* ===================================================================
   MASSINI v2.6 - DEFINITIVO UNIVERSALE
   APPROCCIO: risolve alla radice tramite due regole universali finali
   che colpiscono TUTTI gli elementi dove "sfondo chiaro = testo nero"
   a prescindere da classi, pseudo-classi, struttura DOM.

   Problemi risolti:
   - "PostgreSQL" tab attiva: bianco su #f5f5f5
   - "All Connections": nero su nero a riposo, visibile solo al hover
   - Altri punti analoghi sparsi in tutta la UI
   =================================================================== */

/* -------------------------------------------------------------------
   REGOLA UNIVERSALE 1: TUTTI i testi dentro page-tabs/section-tabs
   sono BIANCHI per default, NERI quando la tab ha sfondo chiaro.
   Lavoriamo sul <li> contenitore: se è la tab attiva riceve background
   chiaro e il CSS normale (senza !important) fa ereditare il colore.
   ------------------------------------------------------------------- */

/* Reset: testo bianco per default nelle tabs */
body .page-tabs,
body .page-tabs *,
body .section-tabs,
body .section-tabs *,
html body .page-tabs a,
html body .page-tabs a *,
html body .page-tabs span,
html body .section-tabs a,
html body .section-tabs a *,
html body .section-tabs span {
    color: #ffffff;
}

/* Tab attiva = qualunque li che abbia sfondo diverso dal nero puro.
   Usiamo i selettori CSS standard per identificarla.
   In Guacamole 1.6 la tab corrente è tipicamente un <li> con
   una classe custom + uno <span> invece di <a>. */

/* A) Qualsiasi <span> diretto figlio di <li> dentro le tabs = attiva */
html body .page-tabs li > span,
html body .page-tabs .page-list li > span,
html body .section-tabs li > span,
html body .page-tabs ul li > span,
html body .section-tabs ul li > span {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
    padding: inherit;
}

html body .page-tabs li > span *,
html body .page-tabs .page-list li > span *,
html body .section-tabs li > span *,
html body .page-tabs ul li > span *,
html body .section-tabs ul li > span * {
    color: #000000 !important;
    background: transparent !important;
    background-color: transparent !important;
}

/* B) <li> con qualsiasi classe contenente "current", "active",
      "selected" (case insensitive) */
html body .page-tabs li[class*="urrent"],
html body .page-tabs li[class*="ctive"],
html body .page-tabs li[class*="elected"],
html body .section-tabs li[class*="urrent"],
html body .section-tabs li[class*="ctive"],
html body .section-tabs li[class*="elected"],
html body .page-tabs a[class*="urrent"],
html body .page-tabs a[class*="ctive"],
html body .page-tabs a[class*="elected"],
html body .section-tabs a[class*="urrent"],
html body .section-tabs a[class*="ctive"],
html body .section-tabs a[class*="elected"] {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
}

html body .page-tabs li[class*="urrent"] *,
html body .page-tabs li[class*="ctive"] *,
html body .page-tabs li[class*="elected"] *,
html body .section-tabs li[class*="urrent"] *,
html body .section-tabs li[class*="ctive"] *,
html body .section-tabs li[class*="elected"] *,
html body .page-tabs a[class*="urrent"] *,
html body .page-tabs a[class*="ctive"] *,
html body .page-tabs a[class*="elected"] *,
html body .section-tabs a[class*="urrent"] *,
html body .section-tabs a[class*="ctive"] *,
html body .section-tabs a[class*="elected"] * {
    color: #000000 !important;
    background: transparent !important;
    background-color: transparent !important;
}

/* -------------------------------------------------------------------
   REGOLA UNIVERSALE 2: ALL CONNECTIONS / CURRENT CONNECTIONS problem
   (sezione CONNESSIONI della pagina utente)
   Sono link/tab che Guacamole usa per filtrare la vista connessioni.
   Struttura: div con pulsanti tipo tab accanto a titolo "CONNESSIONI"
   ------------------------------------------------------------------- */

/* Container che ha questi filtri - applichiamo regola ampia */
.connection-listing a,
.connection-listing button,
.connection-listing .tab,
.connection-listing li,
.connection-listing-filter a,
.connection-listing-filter button,
.connections a[href],
.connections button,
.connections .filter,
.connection-filter,
.connection-filter a,
.connection-filter button,
.manage-user .connections a,
.manage-user .connections button,
.manage-user-group .connections a,
.manage-user-group .connections button,
.filter-current,
.filter-all,
.all-connections,
.current-connections {
    color: #ffffff !important;
    background-color: transparent !important;
}

.connection-listing a:hover,
.connection-listing button:hover,
.connection-listing .tab:hover,
.connection-listing-filter a:hover,
.connection-listing-filter button:hover,
.connections a[href]:hover,
.connections button:hover,
.connection-filter a:hover,
.connection-filter button:hover,
.manage-user .connections a:hover,
.manage-user .connections button:hover,
.manage-user-group .connections a:hover,
.manage-user-group .connections button:hover {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
}

/* -------------------------------------------------------------------
   REGOLA UNIVERSALE 3: la più potente di tutte.
   QUALSIASI link, button o span all'interno delle aree manage/settings
   deve avere colore bianco a riposo (leggibile su nero).
   Se l'elemento ha sfondo chiaro applicato da qualsiasi altra regola,
   subentra la regola 4 che lo rende nero.
   ------------------------------------------------------------------- */

/* Forza testo bianco su tutti gli <a> e <button> e <span> dentro
   le aree manage/settings a meno che non siano dentro form o input */
html body .manage-user a:not(:hover),
html body .manage-user-group a:not(:hover),
html body .manage-connection a:not(:hover),
html body .manage-connection-group a:not(:hover),
html body .settings a:not(:hover),
html body .settings-page a:not(:hover),
html body .manage-user button:not(:hover),
html body .manage-user-group button:not(:hover),
html body .settings button:not(:hover) {
    color: #ffffff !important;
}

/* -------------------------------------------------------------------
   REGOLA UNIVERSALE 4 (RETE DI SICUREZZA FINALE):
   SE un elemento ha sfondo chiaro applicato INLINE via style="",
   il suo testo diventa nero. Usa :has() supportato da tutti i
   browser moderni (Chrome 105+, Firefox 121+, Safari 15.4+).
   ------------------------------------------------------------------- */
*[style*="background-color: #f5f5f5"],
*[style*="background-color:#f5f5f5"],
*[style*="background: #f5f5f5"],
*[style*="background:#f5f5f5"],
*[style*="background-color: #F5F5F5"],
*[style*="background-color:#F5F5F5"],
*[style*="background-color: rgb(245, 245, 245)"] {
    color: #000000 !important;
}

*[style*="background-color: #f5f5f5"] *,
*[style*="background-color:#f5f5f5"] *,
*[style*="background: #f5f5f5"] *,
*[style*="background:#f5f5f5"] *,
*[style*="background-color: #F5F5F5"] *,
*[style*="background-color:#F5F5F5"] * {
    color: #000000 !important;
}

/* -------------------------------------------------------------------
   REGOLA UNIVERSALE 5: pulsanti generici "button" stile Guacamole.
   I pulsanti "Current Connections" / "All Connections" potrebbero
   essere <button> veri e propri, non <a>. Li copriamo tutti.
   ------------------------------------------------------------------- */
html body button,
html body input[type="button"],
html body input[type="submit"],
html body a.button {
    color: #ffffff;
    background-color: transparent;
}

/* Stato attivo/current di un button */
html body button.current,
html body button.active,
html body button.selected,
html body button[class*="current"],
html body button[class*="active"],
html body button[class*="selected"],
html body input[type="button"].current,
html body input[type="button"].active,
html body a.button.current,
html body a.button.active {
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    color: #000000 !important;
}

/* Hover uniforme su qualunque pulsante */
html body .connections button:hover,
html body .connection-listing button:hover,
html body .manage-user button:hover,
html body .settings button:hover {
    background-color: #f5f5f5 !important;
    color: #000000 !important;
}


/* ===================================================================
   MASSINI v2.7 - FIX CHIRURGICO TAB ATTIVA
   Classe reale scoperta via DOM inspection:
     <a class="home ng-binding current" ...>PostgreSQL</a>
   Quindi il selettore giusto è: a.current (dentro .page-tabs)
   e a.home.current in generale.
   Usiamo specificità alta per vincere su tutte le regole precedenti.
   =================================================================== */

/* Tab attiva: <a> con classe "current" -> testo nero */
html body a.current,
html body a.home.current,
html body .page-tabs a.current,
html body .page-tabs a.home.current,
html body .section-tabs a.current,
html body li.linked a.current,
html body li.linked a.home.current {
    color: #000000 !important;
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
}

html body a.current *,
html body a.home.current *,
html body .page-tabs a.current *,
html body li.linked a.current * {
    color: #000000 !important;
}

/* Checkmark ::before della tab attiva: nero */
html body a.current::before,
html body a.home.current::before,
html body li.linked a.current::before {
    color: #000000 !important;
    filter: brightness(0) invert(0) !important;
}

/* Hover sulla tab attiva: resta nero */
html body a.current:hover,
html body a.home.current:hover,
html body li.linked a.current:hover {
    color: #000000 !important;
    background-color: #f5f5f5 !important;
}

/* Link .home non-current (tab non selezionate): bianchi a riposo */
html body a.home:not(.current),
html body li.linked a.home:not(.current) {
    color: #ffffff !important;
    background-color: transparent !important;
}

/* Hover sulle tab non-current: sfondo chiaro + testo nero */
html body a.home:not(.current):hover,
html body li.linked a.home:not(.current):hover {
    color: #000000 !important;
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
}

/* =================== STESSA LOGICA per .section-tabs ===================
   Per la sezione CONNESSIONI (Current Connections / All Connections).
   Probabilmente usano la stessa classe ".current" con una struttura
   simile. Usiamo lo stesso pattern .current per coprirli tutti. */

html body .tabs a.current,
html body .tabs li.current,
html body .tabs li.current a,
html body .connections a.current,
html body .connections li.current a,
html body [ng-repeat] a.current {
    color: #000000 !important;
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
}

html body .tabs a:not(.current),
html body .connections a:not(.current) {
    color: #ffffff !important;
    background-color: transparent !important;
}

html body .tabs a:not(.current):hover,
html body .connections a:not(.current):hover {
    color: #000000 !important;
    background-color: #f5f5f5 !important;
}


/* ===================================================================
   MASSINI v2.8 - NUCLEAR FIX TAB POSTGRESQL
   Dopo aver scoperto DOM reale: <a class="home ng-binding current">
   Serve massima specificità per battere TUTTE le regole precedenti
   che forzano color:#fff. Uso :is() + specificità massimale + ID
   selectors fake + attributi per garantire la vittoria.
   =================================================================== */

/* Selettori con specificità MOLTO ALTA per vincere su qualunque
   altra regola color:#fff !important applicata altrove */

html body div#content a.current,
html body div#content a.home.current,
html body div#content a.home.ng-binding.current,
html body .manage-user a.current,
html body .manage-user a.home.current,
html body .manage-user a.home.ng-binding.current,
html body div.view a.current,
html body div.view a.home.current,
html body [class*="manage"] a.current,
html body [class*="manage"] a.home.current,
html body a[class~="current"][class~="home"],
html body a[href*="#/manage"].current,
html body a[href*="#/manage"].home.current,
html body li.linked > a.current,
html body li.linked > a.home.current {
    color: #000000 !important;
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
    text-shadow: none !important;
    -webkit-text-fill-color: #000000 !important;  /* Safari/Chrome edge case */
}

/* Pseudo-elemento ::before (checkmark) */
html body div#content a.current::before,
html body div#content a.home.current::before,
html body .manage-user a.current::before,
html body .manage-user a.home.current::before,
html body [class*="manage"] a.current::before,
html body li.linked > a.current::before,
html body li.linked > a.home.current::before {
    color: #000000 !important;
    background-color: transparent !important;
    -webkit-text-fill-color: #000000 !important;
    filter: none !important;
}

/* Tutti i figli della tab current */
html body div#content a.current *,
html body .manage-user a.current *,
html body [class*="manage"] a.current *,
html body li.linked > a.current * {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
    background: transparent !important;
    background-color: transparent !important;
}

/* Catch-all finale basato sul pattern href che punta alla stessa pagina
   Quando href punta a /manage/ ed è .current = tab attiva della page-tabs */
html body a[ng-click="navigateToPage(page)"].current,
html body a[ng-class*="current"].current {
    color: #000000 !important;
    background-color: #f5f5f5 !important;
    -webkit-text-fill-color: #000000 !important;
}


/* ===================================================================
   MASSINI v2.10 - ICONE BIANCHE -> SCURE AL HOVER
   Obiettivo: tutti gli elementi visivi BIANCHI su sfondo nero
   (icone, checkbox vuoti, monitor, cartelle, ecc.) devono
   diventare SCURI al passaggio del mouse, dello stesso colore
   della spunta ☑ (che gi\u00e0 funziona correttamente).

   Regola generale applicata in tutto il programma:
   - riposo: bianche (filter invert(1)) come gi\u00e0 sono
   - hover: nere (filter invert(0)) per essere visibili su #f5f5f5
   =================================================================== */

/* ----------------------------------------------------------------
   A) RIGHE DELLE LISTE (connection, user, group, caption, choice,
      list-item, table row) -> al hover tutte le icone diventano nere
   ---------------------------------------------------------------- */
.connection:hover .icon,
.connection:hover svg,
.connection:hover img,
.connection:hover i,
.connection:hover .glyphicon,
.connection:hover .fa,
.connection:hover input[type="checkbox"],

.connection-group:hover .icon,
.connection-group:hover svg,
.connection-group:hover img,
.connection-group:hover i,
.connection-group:hover .glyphicon,
.connection-group:hover .fa,
.connection-group:hover input[type="checkbox"],

.user:hover .icon,
.user:hover svg,
.user:hover img,
.user:hover i,
.user:hover .glyphicon,
.user:hover .fa,
.user:hover input[type="checkbox"],

.user-group:hover .icon,
.user-group:hover svg,
.user-group:hover img,
.user-group:hover i,
.user-group:hover .glyphicon,
.user-group:hover .fa,
.user-group:hover input[type="checkbox"],

.caption:hover .icon,
.caption:hover svg,
.caption:hover img,
.caption:hover i,
.caption:hover .glyphicon,
.caption:hover .fa,
.caption:hover input[type="checkbox"],

.choice:hover .icon,
.choice:hover svg,
.choice:hover img,
.choice:hover i,
.choice:hover .glyphicon,
.choice:hover .fa,
.choice:hover input[type="checkbox"],

.list-item:hover .icon,
.list-item:hover svg,
.list-item:hover img,
.list-item:hover i,
.list-item:hover .glyphicon,
.list-item:hover .fa,
.list-item:hover input[type="checkbox"],

table tbody tr:hover .icon,
table tbody tr:hover svg,
table tbody tr:hover img,
table tbody tr:hover i,
table tbody tr:hover .glyphicon,
table tbody tr:hover .fa,
table tbody tr:hover input[type="checkbox"] {
    filter: brightness(0) invert(0) !important;
    color: #000000 !important;
    fill: #000000 !important;
    stroke: #000000 !important;
}

/* SVG deep (path/circle/rect interni) al hover */
.connection:hover svg *,
.connection-group:hover svg *,
.user:hover svg *,
.user-group:hover svg *,
.caption:hover svg *,
.choice:hover svg *,
.list-item:hover svg *,
table tbody tr:hover svg *,
.connection:hover path,
.connection:hover circle,
.connection:hover rect,
.connection-group:hover path,
.connection-group:hover circle,
.connection-group:hover rect,
.user:hover path,
.user-group:hover path,
.caption:hover path,
.choice:hover path,
.list-item:hover path,
table tbody tr:hover path {
    fill: #000000 !important;
    stroke: #000000 !important;
    color: #000000 !important;
}

/* ----------------------------------------------------------------
   B) STATO SELECTED / EXPANDED / ACTIVE
      Quando la riga \u00e8 selezionata (non solo hover) e ha sfondo
      chiaro, le icone devono essere scure
   ---------------------------------------------------------------- */
.connection.selected .icon,
.connection.selected svg,
.connection.selected img,
.connection.selected input[type="checkbox"],
.connection-group.selected .icon,
.connection-group.selected svg,
.connection-group.selected img,
.user.selected .icon,
.user.selected svg,
.user.selected img,
.user-group.selected .icon,
.user-group.selected svg,
.list-item.selected .icon,
.list-item.selected svg,
.list-item.selected img,
.caption.selected .icon,
.caption.selected svg,
.choice.selected .icon,
.choice.selected svg,
.connection.expanded .icon,
.connection.expanded svg,
.connection-group.expanded .icon,
.connection-group.expanded svg,
.caption.expanded .icon,
.caption.expanded svg,
.choice.expanded .icon,
.choice.expanded svg,
table tbody tr.selected .icon,
table tbody tr.selected svg,
table tbody tr.selected img {
    filter: brightness(0) invert(0) !important;
    color: #000000 !important;
    fill: #000000 !important;
    stroke: #000000 !important;
}

.connection.selected svg *,
.connection-group.selected svg *,
.user.selected svg *,
.list-item.selected svg *,
.caption.selected svg *,
.choice.selected svg *,
.connection.selected path,
.connection-group.selected path,
.list-item.selected path,
.caption.selected path,
.choice.selected path {
    fill: #000000 !important;
    stroke: #000000 !important;
}

/* ----------------------------------------------------------------
   C) BREADCRUMBS, MENU DROPDOWN, USER-MENU al hover
   ---------------------------------------------------------------- */
.breadcrumbs .breadcrumb:hover .icon,
.breadcrumbs .breadcrumb:hover svg,
.breadcrumbs .breadcrumb:hover img,
.breadcrumb:hover .icon,
.breadcrumb:hover svg,
.breadcrumb:hover img,

.menu-dropdown .menu-contents li:hover .icon,
.menu-dropdown .menu-contents li:hover svg,
.menu-dropdown .menu-contents li:hover img,
.menu-dropdown a:hover .icon,
.menu-dropdown a:hover svg,
.menu-dropdown a:hover img,

.user-menu li:hover .icon,
.user-menu li:hover svg,
.user-menu a:hover .icon,
.user-menu a:hover svg,

#guac-menu a:hover .icon,
#guac-menu a:hover svg,
#guac-menu a:hover img,
#guac-menu li:hover .icon,
#guac-menu li:hover svg {
    filter: brightness(0) invert(0) !important;
    color: #000000 !important;
    fill: #000000 !important;
    stroke: #000000 !important;
}

/* ----------------------------------------------------------------
   D) HOME SCREEN - tiles di connection recenti
   Target: icone piccole (monitor, protocollo) - NON i thumbnail
   della connessione che sono <img> con screenshot reale.
   ---------------------------------------------------------------- */
a.home-connection:hover .icon,
a.home-connection-group:hover .icon,
.recent-connections .connection:hover .icon,
.recent-connections .connection-group:hover .icon {
    filter: brightness(0) invert(0) !important;
    color: #000000 !important;
    fill: #000000 !important;
}

/* SVG solo quando e' icona (dentro .icon) */
a.home-connection:hover .icon svg,
a.home-connection-group:hover .icon svg,
.recent-connections .connection:hover .icon svg,
.recent-connections .connection-group:hover .icon svg {
    fill: #000000 !important;
}

/* GLI SCREENSHOT DELLA CONNESSIONE (thumbnail) NON devono essere
   filtrati al hover - altrimenti diventano neri. Rimuovo ogni filter. */
a.home-connection:hover img,
a.home-connection:hover canvas,
a.home-connection-group:hover img,
a.home-connection-group:hover canvas,
.recent-connections .connection:hover img,
.recent-connections .connection:hover canvas,
.recent-connections .connection-group:hover img,
.recent-connections .connection-group:hover canvas,
a.home-connection .thumbnail,
a.home-connection:hover .thumbnail,
.recent-connections .thumbnail,
.recent-connections .thumbnail:hover,
.recent-connections .connection:hover .thumbnail,
.recent-connections .connection:hover .thumbnail img {
    filter: none !important;
    -webkit-filter: none !important;
    opacity: 1 !important;
}

/* ----------------------------------------------------------------
   E) PAGE-TABS / SECTION-TABS - icone dentro tab current o hover
   ---------------------------------------------------------------- */
.page-tabs a.current .icon,
.page-tabs a.current svg,
.page-tabs a.current img,
.page-tabs a:hover .icon,
.page-tabs a:hover svg,
.page-tabs a:hover img,
.section-tabs a.current .icon,
.section-tabs a.current svg,
.section-tabs a.current img,
.section-tabs a:hover .icon,
.section-tabs a:hover svg,
.section-tabs a:hover img,
a.home.current .icon,
a.home.current svg,
a.home.current img,
a.home:hover .icon,
a.home:hover svg,
a.home:hover img {
    filter: brightness(0) invert(0) !important;
    color: #000000 !important;
    fill: #000000 !important;
}

/* ----------------------------------------------------------------
   F) CHECKBOX NATIVI - il "quadrato vuoto" del tuo screenshot
      I checkbox non-checked hanno il filter invert(1) e al hover
      devono tornare invert(0) per essere visibili su #f5f5f5
   ---------------------------------------------------------------- */
.connection:hover input[type="checkbox"],
.connection-group:hover input[type="checkbox"],
.user:hover input[type="checkbox"],
.user-group:hover input[type="checkbox"],
.caption:hover input[type="checkbox"],
.choice:hover input[type="checkbox"],
.list-item:hover input[type="checkbox"],
table tbody tr:hover input[type="checkbox"],
li:hover > input[type="checkbox"],
li:hover input[type="checkbox"],
label:hover input[type="checkbox"],
div:hover > input[type="checkbox"] {
    filter: none !important;
    accent-color: #000000 !important;
    -webkit-filter: none !important;
}

/* ----------------------------------------------------------------
   G) REGOLA GENERICA DI SICUREZZA (catch-all)
      QUALSIASI elemento con filter invert(1) al hover diventa invert(0)
   ---------------------------------------------------------------- */
*:hover > .icon[style*="invert(1)"],
*:hover > .icon[style*="brightness(0) invert(1)"],
*:hover > svg[style*="invert(1)"],
*:hover > img[style*="invert(1)"] {
    filter: brightness(0) invert(0) !important;
}


/* ===================================================================
   MASSINI v2.11 - SVG FILL FIX (approccio corretto)
   Le icone sono SVG inline: al hover bisogna cambiare il
   fill/stroke dei path interni, non usare filter o color.

   Strategia:
   - Reset filter che le schiarivano (spesso non serve)
   - Forzare fill: #000 su <svg>, <path>, <circle>, <rect>,
     <polygon>, <g> al hover e stato selected
   - Usare currentColor trick per SVG che ereditano dal parent
   =================================================================== */

/* ----------------------------------------------------------------
   1) SVG inline: forzare FILL NERO al hover delle righe
   ---------------------------------------------------------------- */
.connection:hover svg,
.connection:hover svg path,
.connection:hover svg g,
.connection:hover svg circle,
.connection:hover svg rect,
.connection:hover svg polygon,
.connection:hover svg line,
.connection:hover svg ellipse,
.connection:hover svg use,

.connection-group:hover svg,
.connection-group:hover svg path,
.connection-group:hover svg g,
.connection-group:hover svg circle,
.connection-group:hover svg rect,
.connection-group:hover svg polygon,

.user:hover svg,
.user:hover svg path,
.user:hover svg g,
.user:hover svg circle,
.user:hover svg rect,

.user-group:hover svg,
.user-group:hover svg path,
.user-group:hover svg g,
.user-group:hover svg circle,
.user-group:hover svg rect,

.caption:hover svg,
.caption:hover svg path,
.caption:hover svg g,
.caption:hover svg circle,
.caption:hover svg rect,

.choice:hover svg,
.choice:hover svg path,
.choice:hover svg g,
.choice:hover svg circle,
.choice:hover svg rect,

.list-item:hover svg,
.list-item:hover svg path,
.list-item:hover svg g,
.list-item:hover svg circle,
.list-item:hover svg rect,

table tbody tr:hover svg,
table tbody tr:hover svg path,
table tbody tr:hover svg g,
table tbody tr:hover svg circle,
table tbody tr:hover svg rect,
table tbody tr:hover svg polygon,

li:hover > svg,
li:hover svg path,
li:hover svg g,
li:hover svg circle,
li:hover svg rect {
    fill: #000000 !important;
    stroke: #000000 !important;
}

/* Reset eventuali filter precedenti sulle svg al hover */
.connection:hover svg,
.connection-group:hover svg,
.user:hover svg,
.user-group:hover svg,
.caption:hover svg,
.choice:hover svg,
.list-item:hover svg,
table tbody tr:hover svg,
li:hover svg {
    filter: none !important;
    -webkit-filter: none !important;
    color: #000000 !important;
}

/* ----------------------------------------------------------------
   2) STATO SELECTED / EXPANDED - stesso fill nero
   ---------------------------------------------------------------- */
.connection.selected svg,
.connection.selected svg path,
.connection.selected svg g,
.connection.selected svg circle,
.connection.selected svg rect,
.connection.selected svg polygon,

.connection-group.selected svg,
.connection-group.selected svg path,
.connection-group.selected svg g,
.connection-group.selected svg circle,
.connection-group.selected svg rect,

.user.selected svg,
.user.selected svg path,
.user.selected svg g,
.user.selected svg circle,

.user-group.selected svg,
.user-group.selected svg path,
.user-group.selected svg g,

.caption.selected svg,
.caption.selected svg path,
.caption.selected svg g,
.caption.selected svg circle,
.caption.selected svg rect,

.choice.selected svg,
.choice.selected svg path,
.choice.selected svg g,

.list-item.selected svg,
.list-item.selected svg path,
.list-item.selected svg g,

.connection.expanded svg,
.connection.expanded svg path,
.connection.expanded svg g,
.connection-group.expanded svg,
.connection-group.expanded svg path,
.caption.expanded svg,
.caption.expanded svg path,
.choice.expanded svg,
.choice.expanded svg path,

table tbody tr.selected svg,
table tbody tr.selected svg path,
table tbody tr.selected svg g,
table tbody tr.selected svg circle,
table tbody tr.selected svg rect {
    fill: #000000 !important;
    stroke: #000000 !important;
    filter: none !important;
    -webkit-filter: none !important;
    color: #000000 !important;
}

/* ----------------------------------------------------------------
   3) BREADCRUMBS, MENU DROPDOWN, USER-MENU, GUAC-MENU al hover
   ---------------------------------------------------------------- */
.breadcrumbs .breadcrumb:hover svg,
.breadcrumbs .breadcrumb:hover svg path,
.breadcrumbs .breadcrumb:hover svg g,
.breadcrumb:hover svg,
.breadcrumb:hover svg path,
.breadcrumb:hover svg g,

.menu-dropdown .menu-contents li:hover svg,
.menu-dropdown .menu-contents li:hover svg path,
.menu-dropdown .menu-contents li:hover svg g,
.menu-dropdown a:hover svg,
.menu-dropdown a:hover svg path,

.user-menu li:hover svg,
.user-menu li:hover svg path,
.user-menu a:hover svg,
.user-menu a:hover svg path,

#guac-menu a:hover svg,
#guac-menu a:hover svg path,
#guac-menu li:hover svg,
#guac-menu li:hover svg path {
    fill: #000000 !important;
    stroke: #000000 !important;
    filter: none !important;
    color: #000000 !important;
}

/* ----------------------------------------------------------------
   4) HOME SCREEN
   ---------------------------------------------------------------- */
a.home-connection:hover svg,
a.home-connection:hover svg path,
a.home-connection:hover svg g,
a.home-connection-group:hover svg,
a.home-connection-group:hover svg path,
.recent-connections .connection:hover svg,
.recent-connections .connection:hover svg path,
.recent-connections .connection-group:hover svg,
.recent-connections .connection-group:hover svg path {
    fill: #000000 !important;
    stroke: #000000 !important;
    filter: none !important;
    color: #000000 !important;
}

/* ----------------------------------------------------------------
   5) PAGE-TABS / SECTION-TABS - SVG dentro tab current o hover
   ---------------------------------------------------------------- */
.page-tabs a.current svg,
.page-tabs a.current svg path,
.page-tabs a:hover svg,
.page-tabs a:hover svg path,
.section-tabs a.current svg,
.section-tabs a.current svg path,
.section-tabs a:hover svg,
.section-tabs a:hover svg path,
a.home.current svg,
a.home.current svg path,
a.home:hover svg,
a.home:hover svg path {
    fill: #000000 !important;
    stroke: #000000 !important;
    filter: none !important;
    color: #000000 !important;
}

/* ----------------------------------------------------------------
   6) OVERRIDE FILL INLINE BIANCO/CHIARO al hover
      Se gli SVG hanno fill="#fff" o fill="white" nell'attributo HTML,
      serve una regola che vinca anche su quello.
   ---------------------------------------------------------------- */
*:hover > svg[fill="#fff"],
*:hover > svg[fill="#ffffff"],
*:hover > svg[fill="white"],
*:hover svg[fill="#fff"],
*:hover svg[fill="#ffffff"],
*:hover svg[fill="white"],
*:hover svg [fill="#fff"],
*:hover svg [fill="#ffffff"],
*:hover svg [fill="white"],
*:hover path[fill="#fff"],
*:hover path[fill="#ffffff"],
*:hover path[fill="white"],
*:hover rect[fill="#fff"],
*:hover rect[fill="#ffffff"],
*:hover rect[fill="white"],
*:hover circle[fill="#fff"],
*:hover circle[fill="#ffffff"],
*:hover circle[fill="white"] {
    fill: #000000 !important;
}

/* ----------------------------------------------------------------
   7) currentColor TRICK - SVG che usano fill="currentColor"
      ereditano il colore dal parent. Se il parent al hover ha
      color:#000, lo erediteranno automaticamente.
   ---------------------------------------------------------------- */
svg[fill="currentColor"],
svg[stroke="currentColor"],
svg path[fill="currentColor"],
svg path[stroke="currentColor"] {
    fill: currentColor;
    stroke: currentColor;
}

/* ----------------------------------------------------------------
   8) CATCH-ALL FINALE - qualsiasi SVG dentro un elemento :hover
      con sfondo chiaro -> riempimento nero
   ---------------------------------------------------------------- */
*:hover > svg,
*:hover > svg > *,
li:hover svg,
li:hover svg *,
tr:hover svg,
tr:hover svg *,
td:hover svg,
td:hover svg *,
div:hover > svg,
div:hover > svg > * {
    fill: #000000 !important;
    stroke: #000000 !important;
}


/* ===================================================================
   MASSINI v2.12 - FIX DIV.ICON CON BACKGROUND-IMAGE
   DOM reale scoperto:
     <div class="icon expand ng-scope" ng-click="..." ng-if="...">
   Le icone sono <div> con background-image CSS, NON svg n\u00e9 img.
   Il filter CSS (invert/brightness) le colpisce correttamente.
   Problema: al hover restano bianche (invert 1) invece di diventare
   nere (invert 0).
   =================================================================== */

/* Qualsiasi div.icon dentro un elemento in :hover -> filter invert 0 */
.connection:hover .icon,
.connection:hover div.icon,
.connection-group:hover .icon,
.connection-group:hover div.icon,
.user:hover .icon,
.user:hover div.icon,
.user-group:hover .icon,
.user-group:hover div.icon,
.caption:hover .icon,
.caption:hover div.icon,
.choice:hover .icon,
.choice:hover div.icon,
.list-item:hover .icon,
.list-item:hover div.icon,
table tbody tr:hover .icon,
table tbody tr:hover div.icon,
li:hover .icon,
li:hover div.icon,
tr:hover div.icon,

/* Specifici per le classi espansione (quella che hai condiviso) */
.connection:hover .icon.expand,
.connection-group:hover .icon.expand,
.caption:hover .icon.expand,
.choice:hover .icon.expand,
.list-item:hover .icon.expand,
.connection:hover .icon.collapse,
.connection-group:hover .icon.collapse,
.caption:hover .icon.collapse,
.choice:hover .icon.collapse,
.list-item:hover .icon.collapse,

/* Altre icone Guacamole tipiche (tipo-connessione) */
.connection:hover .icon.type,
.connection:hover .icon.protocol,
.connection:hover .icon.active,
.connection-group:hover .icon.type,
.caption:hover .icon.type,
.list-item:hover .icon.type {
    filter: brightness(0) invert(0) !important;
    -webkit-filter: brightness(0) invert(0) !important;
}

/* Stato SELECTED / EXPANDED - sfondo chiaro, icona scura */
.connection.selected .icon,
.connection.selected div.icon,
.connection-group.selected .icon,
.user.selected .icon,
.user-group.selected .icon,
.caption.selected .icon,
.choice.selected .icon,
.list-item.selected .icon,
.connection.expanded .icon,
.connection-group.expanded .icon,
.caption.expanded .icon,
.choice.expanded .icon,
table tbody tr.selected .icon,
table tbody tr.active .icon {
    filter: brightness(0) invert(0) !important;
    -webkit-filter: brightness(0) invert(0) !important;
}

/* Breadcrumbs / menu / home / tabs - div.icon al hover */
.breadcrumbs .breadcrumb:hover .icon,
.breadcrumb:hover .icon,
.menu-dropdown a:hover .icon,
.menu-dropdown li:hover .icon,
.user-menu a:hover .icon,
.user-menu li:hover .icon,
#guac-menu a:hover .icon,
#guac-menu li:hover .icon,
a.home-connection:hover .icon,
a.home-connection-group:hover .icon,
.recent-connections .connection:hover .icon,
.page-tabs a:hover .icon,
.page-tabs a.current .icon,
.section-tabs a:hover .icon,
.section-tabs a.current .icon {
    filter: brightness(0) invert(0) !important;
    -webkit-filter: brightness(0) invert(0) !important;
}


/* ===================================================================
   MASSINI v2.14 - FIX ICONE MIRATO (solo dove sfondo hover \u00e8 chiaro)
   
   Nota importante: la v2.13 precedente era troppo aggressiva -
   rendeva nere le icone al hover anche dove lo sfondo restava nero,
   causando invisibilit\u00e0 totale nella pagina Modifica Utente.
   
   Soluzione: agire SOLO nei contesti dove l'hover produce
   effettivamente uno sfondo chiaro #f5f5f5:
   - /settings/connections (lista principale)
   - /settings/users, /settings/userGroups
   - Home screen tiles
   
   Non agire nelle liste della pagina Modifica Utente
   (.manage-user .connections, .manage-user-group .connections)
   dove lo sfondo hover resta nero.
   =================================================================== */

/* 1) SETTINGS pages - liste principali con hover chiaro */
html body .settings .connection-group-list li:hover .icon,
html body .settings .connection-group-list .caption:hover .icon,
html body .settings .connection-group-list .list-item:hover .icon,
html body .settings .connection-group-list tr:hover .icon,

html body .settings .user-group-list li:hover .icon,
html body .settings .user-group-list .caption:hover .icon,
html body .settings .user-group-list .list-item:hover .icon,
html body .settings .user-group-list tr:hover .icon,

html body .settings .group-list li:hover .icon,
html body .settings .group-list .caption:hover .icon,
html body .settings .group-list .list-item:hover .icon,

/* Stato selected/expanded dentro settings */
html body .settings .connection-group-list .caption.selected .icon,
html body .settings .connection-group-list .caption.expanded .icon,
html body .settings .connection-group-list .list-item.selected .icon,
html body .settings .user-group-list .caption.selected .icon,
html body .settings .user-group-list .list-item.selected .icon,
html body .settings .group-list .caption.selected .icon {
    filter: brightness(0) invert(0) !important;
    -webkit-filter: brightness(0) invert(0) !important;
}

/* 2) SETTINGS tables (session-list ecc.) - hover chiaro */
html body .settings table tbody tr:hover .icon,
html body .settings table tbody tr.selected .icon {
    filter: brightness(0) invert(0) !important;
    -webkit-filter: brightness(0) invert(0) !important;
}

/* 3) HOME SCREEN tiles - hover chiaro */
html body a.home-connection:hover .icon,
html body a.home-connection-group:hover .icon,
html body .recent-connections .connection:hover .icon,
html body .recent-connections .connection-group:hover .icon {
    filter: brightness(0) invert(0) !important;
    -webkit-filter: brightness(0) invert(0) !important;
}

/* 4) PAGE-TABS / SECTION-TABS icone in tab current (sfondo chiaro) */
html body .page-tabs a.current .icon,
html body .section-tabs a.current .icon,
html body a.home.current .icon,
html body .page-tabs a:hover .icon,
html body .section-tabs a:hover .icon,
html body a.home:hover .icon {
    filter: brightness(0) invert(0) !important;
    -webkit-filter: brightness(0) invert(0) !important;
}

/* 5) RESET: nella pagina Modifica Utente (.manage-user),
      le icone al hover NON devono essere scurite,
      perch\u00e9 lo sfondo rimane nero. */
html body .manage-user .connections li:hover .icon,
html body .manage-user .connections .caption:hover .icon,
html body .manage-user-group .connections li:hover .icon,
html body .manage-user-group .connections .caption:hover .icon,
html body .manage-connection li:hover .icon,
html body .manage-connection-group li:hover .icon {
    filter: brightness(0) invert(1) !important;  /* restano BIANCHE */
    -webkit-filter: brightness(0) invert(1) !important;
}


/* ===================================================================
   MASSINI v2.16 - APPROCCIO CORRETTO: filter: none
   
   Diagnosi finale (dal tuo screenshot Utenti):
   - Il tema originale (riga 446, 463, etc.) applica
     "filter: brightness(0) invert(1)" per rendere BIANCHE le icone
     sullo sfondo nero.
   - Le icone Guacamole sono SVG con dettagli/trasparenze interne.
   - Applicare "brightness(0) invert(0)" al hover le appiattisce a
     un rettangolo nero pieno (perch\u00e9 brightness(0) azzera tutto).
   - Soluzione CORRETTA: al hover usare "filter: none" che
     rimuove il trattamento bianco e mostra l'icona nel suo colore
     ORIGINALE (che in Guacamole \u00e8 grigio scuro/nero con dettagli).
   =================================================================== */

/* Liste settings - al hover l'icona torna al colore originale */
html body .settings .connection-group-list li:hover .icon,
html body .settings .connection-group-list .caption:hover .icon,
html body .settings .connection-group-list .list-item:hover .icon,
html body .settings .connection-group-list tr:hover .icon,
html body .settings .user-group-list li:hover .icon,
html body .settings .user-group-list .caption:hover .icon,
html body .settings .user-group-list .list-item:hover .icon,
html body .settings .user-group-list tr:hover .icon,
html body .settings .group-list li:hover .icon,
html body .settings .group-list .caption:hover .icon,
html body .settings .group-list .list-item:hover .icon,

/* Liste dentro manage-user - stesso trattamento (sfondo hover chiaro) */
html body .manage-user .connection-group-list li:hover .icon,
html body .manage-user .connection-group-list .caption:hover .icon,
html body .manage-user .connection-group-list .list-item:hover .icon,
html body .manage-user-group .connection-group-list li:hover .icon,
html body .manage-user-group .connection-group-list .caption:hover .icon,
html body .manage-user .user-group-list li:hover .icon,
html body .manage-user-group .user-group-list li:hover .icon,

/* Stato selected / expanded */
html body .connection-group-list .caption.selected .icon,
html body .connection-group-list .caption.expanded .icon,
html body .connection-group-list .list-item.selected .icon,
html body .user-group-list .caption.selected .icon,
html body .user-group-list .list-item.selected .icon,
html body .group-list .caption.selected .icon,
html body .manage-user .connection-group-list .caption.selected .icon,
html body .manage-user .connection-group-list .list-item.selected .icon,

/* Tabelle generiche (es. Utenti, Groups, Sessions) */
html body .settings table tbody tr:hover .icon,
html body .settings table tbody tr.selected .icon,
html body .settings table tbody tr.active .icon,
html body table.user-list tbody tr:hover .icon,
html body table.user-list tbody tr.selected .icon,
html body table.group-list tbody tr:hover .icon,
html body table.connection-list tbody tr:hover .icon,

/* Menu dropdown, breadcrumbs, guac-menu */
html body .breadcrumbs .breadcrumb:hover .icon,
html body .breadcrumb:hover .icon,
html body .menu-dropdown a:hover .icon,
html body .menu-dropdown li:hover .icon,
html body .user-menu a:hover .icon,
html body .user-menu li:hover .icon,
html body #guac-menu a:hover .icon,
html body #guac-menu li:hover .icon,

/* Home screen */
html body a.home-connection:hover .icon,
html body a.home-connection-group:hover .icon,
html body .recent-connections .connection:hover .icon,
html body .recent-connections .connection-group:hover .icon,

/* Page-tabs / section-tabs */
html body .page-tabs a.current .icon,
html body .section-tabs a.current .icon,
html body a.home.current .icon,
html body .page-tabs a:hover .icon,
html body .section-tabs a:hover .icon,
html body a.home:hover .icon {
    filter: none !important;
    -webkit-filter: none !important;
}

/* Font-based icons (.fa-users, .glyphicon-*) - stesso trattamento */
html body .settings *:hover > .fa-users,
html body .settings *:hover > .glyphicon-user,
html body .settings *:hover > .glyphicon-group,
html body .settings *:hover .fa-users,
html body .settings *:hover .glyphicon-user,
html body .settings *:hover .glyphicon-group,
html body .settings .caption:hover .fa-users,
html body .settings .caption:hover .glyphicon-user,
html body .settings .caption:hover .glyphicon-group,
html body .settings li:hover .fa-users,
html body .settings li:hover .glyphicon-user,
html body .settings li:hover .glyphicon-group,
html body .settings tr:hover .fa-users,
html body .settings tr:hover .glyphicon-user,
html body .settings tr:hover .glyphicon-group,
html body .manage-user *:hover > .fa-users,
html body .manage-user *:hover > .glyphicon-user,
html body .manage-user *:hover > .glyphicon-group,
html body .manage-user li:hover .fa-users,
html body .manage-user li:hover .glyphicon-user,
html body .manage-user li:hover .glyphicon-group {
    filter: none !important;
    -webkit-filter: none !important;
}


/* ===================================================================
   MASSINI v2.18 - FIX DEFINITIVO ICONE PERMISSION EDITOR
   
   Diagnosi (corretta dopo screenshot utente):
   - Nella pagina Modifica Utente -> tab CONNESSIONI, le icone .icon
     (background-image PNG scuro) sono invisibili A RIPOSO perche'
     nessuna regola del tema le forza bianche su sfondo nero.
   - Al :hover la riga si colora CHIARA (non nera come ipotizzato in
     v2.17), quindi le icone devono diventare NERE, non bianche.
   
   Strategia:
   1) riposo  -> filter: brightness(0) invert(1) (bianche su nero)
   2) :hover  -> filter: none (icona nel suo colore originale scuro)
                 OPPURE invert(0) per sicurezza = sempre nera.
                 Uso "none" perche' preserva eventuali dettagli
                 di colore nell'icona originale.
   3) .selected / .expanded -> come hover (sfondo chiaro).
   =================================================================== */

/* 1) STATO DI RIPOSO: icone bianche su sfondo nero */
html body .manage-user             .icon,
html body .manage-user-group       .icon,
html body .manage-connection       .icon,
html body .manage-connection-group .icon {
    filter: brightness(0) invert(1) !important;
    -webkit-filter: brightness(0) invert(1) !important;
}

/* 2) HOVER: sfondo riga diventa chiaro -> icona scura (filter none
      ripristina il PNG originale, che e' gia' scuro) */
html body .manage-user             .connection:hover       .icon,
html body .manage-user             .connection-group:hover .icon,
html body .manage-user             .caption:hover          .icon,
html body .manage-user             .list-item:hover        .icon,
html body .manage-user             li:hover                .icon,
html body .manage-user             tr:hover                .icon,
html body .manage-user-group       .connection:hover       .icon,
html body .manage-user-group       .connection-group:hover .icon,
html body .manage-user-group       .caption:hover          .icon,
html body .manage-user-group       .list-item:hover        .icon,
html body .manage-user-group       li:hover                .icon,
html body .manage-user-group       tr:hover                .icon,
html body .manage-connection       .caption:hover          .icon,
html body .manage-connection       .list-item:hover        .icon,
html body .manage-connection       li:hover                .icon,
html body .manage-connection-group .caption:hover          .icon,
html body .manage-connection-group .list-item:hover        .icon,
html body .manage-connection-group li:hover                .icon {
    filter: none !important;
    -webkit-filter: none !important;
}

/* 3) SELECTED / EXPANDED: stesso trattamento (sfondo chiaro) */
html body .manage-user             .connection.selected        .icon,
html body .manage-user             .connection.expanded        .icon,
html body .manage-user             .connection-group.selected  .icon,
html body .manage-user             .connection-group.expanded  .icon,
html body .manage-user             .caption.selected           .icon,
html body .manage-user             .caption.expanded           .icon,
html body .manage-user             .list-item.selected         .icon,
html body .manage-user-group       .connection.selected        .icon,
html body .manage-user-group       .connection-group.expanded  .icon,
html body .manage-user-group       .caption.selected           .icon,
html body .manage-user-group       .caption.expanded           .icon,
html body .manage-connection       .caption.selected           .icon,
html body .manage-connection       .caption.expanded           .icon,
html body .manage-connection-group .caption.selected           .icon,
html body .manage-connection-group .caption.expanded           .icon {
    filter: none !important;
    -webkit-filter: none !important;
}

/* 4) FALLBACK per checkbox/flag all'interno delle righe hover:
      se qualche .icon generica (non .type / non .location) viene
      gia' gestita da altre regole del tema, non tocchiamola. */


/* ===================================================================
   MASSINI v2.20 - FIX ICONE HOME PAGE (TUTTE LE CONNESSIONI)
   DOM reale: <a class="home-connection"> con dentro .icon
   Le regole precedenti alla riga 599 applicavano invert(1) ma
   venivano perse nel cascade. Qui rimettiamo con alta specificita'
   e alla fine del file per vincere. Colpiamo anche a riposo
   (senza :hover), che era il caso mancante.
   =================================================================== */

html body a.home-connection .icon,
html body a.home-connection-group .icon,
html body .recent-connections .connection .icon,
html body .recent-connections .connection-group .icon,
html body .connections a.home-connection .icon,
html body .connections a.home-connection-group .icon,
html body .caption .icon.type,
html body .caption .icon.location,
html body a.home-connection .icon.type,
html body a.home-connection .icon.location,
html body a.home-connection-group .icon.type,
html body a.home-connection-group .icon.location {
    filter: brightness(0) invert(1) !important;
    -webkit-filter: brightness(0) invert(1) !important;
}

/* al hover (sfondo diventa chiaro): icone diventano scure */
html body a.home-connection:hover .icon,
html body a.home-connection-group:hover .icon,
html body .recent-connections .connection:hover .icon,
html body .recent-connections .connection-group:hover .icon {
    filter: brightness(0) invert(0) !important;
    -webkit-filter: brightness(0) invert(0) !important;
}


/* ===================================================================
   MASSINI v2.19 - LOGOUT / DISCONNECTED DIALOG
   
   JS (massini.js) aggiunge la classe .massini-logout alla <div>
   .notification di logout, e .has-massini-logout al <body>.
   Qui stilizziamo il dialog come una mini versione del login.
   =================================================================== */

/* Sfondo navy #141821 (uguale alla home) sulla parte ESTERNA al dialog.
   Strategia: colpiamo a tappeto html + body + ogni possibile wrapper
   fullscreen di Guacamole. Il box .notification.massini-logout e' sopra
   grazie al suo z-index + background proprio. */

/* 1) Regole base: html e body quando siamo in stato logout */
html.has-massini-logout,
html.has-massini-logout body,
body.has-massini-logout,
body.has-massini-logout > *:not(.notification):not(.massini-logout):not(script):not(style) {
    background: #141821 !important;
    background-color: #141821 !important;
    background-image: none !important;
}

/* 2) Tutti i wrapper Angular tipici di Guacamole 1.x */
body.has-massini-logout #content,
body.has-massini-logout .view,
body.has-massini-logout .main-view,
body.has-massini-logout [ng-view],
body.has-massini-logout [ui-view],
body.has-massini-logout .fatal-page-error,
body.has-massini-logout .home,
body.has-massini-logout .home-view,
body.has-massini-logout .client-page,
body.has-massini-logout .client-container,
body.has-massini-logout .display,
body.has-massini-logout .displayOuter,
body.has-massini-logout .page-wrapper,
body.has-massini-logout .viewport,
body.has-massini-logout .ng-scope {
    background: #141821 !important;
    background-color: #141821 !important;
    background-image: none !important;
}

/* 3) Html stesso (rinforzo, no :has() per max compatibilita') */
html {
    background-color: transparent;
}
html:has(body.has-massini-logout) {
    background: #141821 !important;
    background-color: #141821 !important;
}

/* Nasconde residui di UI di Guacamole (header, menu, client canvas, ecc.) */
body.has-massini-logout #guac-menu,
body.has-massini-logout .header,
body.has-massini-logout .top-bar,
body.has-massini-logout .breadcrumbs,
body.has-massini-logout .client,
body.has-massini-logout .client-body,
body.has-massini-logout .display-wrapper,
body.has-massini-logout .client-view,
body.has-massini-logout guac-client,
body.has-massini-logout .connection-view {
    display: none !important;
}

/* Il dialog vero e proprio */
.notification.massini-logout {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translate(-50%, -50%) !important;

    width: 92% !important;
    max-width: 720px !important;
    min-height: auto !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;

    background: linear-gradient(180deg, #141821, #07090f) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: 30px !important;
    padding: 60px 50px !important;
    box-shadow: 0 40px 120px rgba(0,0,0,0.9) !important;

    color: #f5f5f5 !important;
    z-index: 100000 !important;
}

/* Logo Massini dentro il dialog (inserito dal JS) */
.notification.massini-logout .massini-logo {
    width: 100% !important;
    max-width: 560px !important;
    margin: 0 auto 35px auto !important;
    display: block !important;
}

/* Sottotitolo "MGMT SECURITY IT" */
.notification.massini-logout .massini-title {
    color: #ddd !important;
    letter-spacing: 3px !important;
    font-size: 32px !important;
    font-weight: 600 !important;
    margin: 0 0 30px 0 !important;
    text-transform: uppercase !important;
}

/* Testo principale "Sei stato disconnesso." */
.notification.massini-logout > p,
.notification.massini-logout > div:not(.massini-logo):not(.massini-title):not(.massini-warning):not(.button-list),
.notification.massini-logout .status-body,
.notification.massini-logout .notification-body,
.notification.massini-logout .notification-text {
    color: #f5f5f5 !important;
    background: transparent !important;
    font-size: 20px !important;
    margin: 0 0 30px 0 !important;
    padding: 0 !important;
    font-weight: 400 !important;
}

/* Contenitore dei bottoni */
.notification.massini-logout .button-list,
.notification.massini-logout .buttons,
.notification.massini-logout .actions {
    margin: 10px 0 0 0 !important;
    padding: 0 !important;
    background: transparent !important;
    display: flex !important;
    justify-content: center !important;
    gap: 12px !important;
}

/* Bottone "Accedi di nuovo" -> sfondo chiaro con testo nero */
.notification.massini-logout button,
.notification.massini-logout .button,
.notification.massini-logout a.button {
    background: #f5f5f5 !important;
    color: #000 !important;
    border: none !important;
    border-radius: 14px !important;
    width: auto !important;
    min-width: 260px !important;
    padding: 16px 32px !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    box-shadow: 0 6px 20px rgba(0,0,0,0.4) !important;
    transition: all 0.2s ease !important;
}

.notification.massini-logout button:hover,
.notification.massini-logout .button:hover,
.notification.massini-logout a.button:hover {
    background: #ffffff !important;
    color: #000 !important;
    box-shadow: 0 8px 28px rgba(255,255,255,0.25) !important;
    transform: translateY(-1px) !important;
}

/* Override eventuali regole globali del tema che forzano
   colori del testo dentro i bottoni del dialog logout */
.notification.massini-logout button *,
.notification.massini-logout .button *,
.notification.massini-logout a.button * {
    color: #000 !important;
}

/* Warning in fondo (inserito dal JS) */
.notification.massini-logout .massini-warning {
    color: #8a8a8a !important;
    font-size: 12px !important;
    letter-spacing: 2px !important;
    margin: 35px 0 0 0 !important;
    line-height: 1.6 !important;
    text-transform: uppercase !important;
}

/* Mobile: riduci padding e dimensioni */
@media (max-width: 600px) {
    .notification.massini-logout {
        padding: 40px 25px !important;
        border-radius: 20px !important;
    }
    .notification.massini-logout .massini-logo {
        margin-bottom: 25px !important;
    }
    .notification.massini-logout button,
    .notification.massini-logout .button {
        min-width: 200px !important;
        padding: 14px 24px !important;
        font-size: 16px !important;
    }
}


/* =====================================================================
   MASSINI v2.4 - HOVER LISTA HOME: bianco + nero
   Data: 2026-04-21
   Obiettivo: sulla riga lista "TUTTE LE CONNESSIONI", al passaggio
   del mouse -> sfondo bianco, testo nero, icona nera. Punto.
   ===================================================================== */

/* Riga hover: sfondo bianco */
html body .all-connections .list-item:hover,
html body .all-connections .connection:hover,
html body .all-connections .connection-group:hover,
html body .home-view .all-connections .list-item:hover {
    background-color: #ffffff !important;
    background: #ffffff !important;
    color: #000000 !important;
}

/* Icona protocollo NERA all'hover.
   IMPORTANTE: NON usare la shorthand "background: transparent" perche'
   resetta anche background-image, cancellando l'icona SVG. Usare SOLO
   background-color: transparent per neutralizzare la regola
   .list-item:hover * (riga 761) che inietta #f5f5f5 come background-color,
   preservando pero' il background-image dell'icona (guac-monitor.svg ecc.). */
html body .all-connections a.home-connection:hover .icon,
html body .all-connections a.home-connection:hover .icon.type,
html body .all-connections a.home-connection:hover .icon.protocol,
html body .all-connections a.home-connection:hover div.icon,
html body .all-connections a.home-connection-group:hover .icon,
html body .all-connections .list-item:hover .icon,
html body .all-connections .list-item:hover div.icon,
html body .all-connections .list-item:hover .icon.type,
html body .all-connections .list-item:hover .icon.protocol,
html body .all-connections .connection:hover .icon,
html body .all-connections .connection:hover div.icon,
html body .all-connections .connection:hover .icon.type,
html body .all-connections .connection:hover .icon.protocol,
html body .all-connections .connection-group:hover .icon,
html body .home-view a.home-connection:hover .icon,
html body .home-view .list-item:hover .icon,
html body .home-view .list-item:hover div.icon {
    filter: brightness(0) !important;
    -webkit-filter: brightness(0) !important;
    background-color: transparent !important;
}

/* Testo (nome connessione) nero su bianco */
html body .all-connections .list-item:hover *,
html body .all-connections .connection:hover *,
html body .all-connections .connection-group:hover *,
html body .home-view .list-item:hover * {
    color: #000000 !important;
    background-color: transparent !important;
}

/* Riapplica lo sfondo bianco solo al contenitore riga (le * sopra
   mettono tutti i figli trasparenti, ma la riga stessa deve restare bianca) */
html body .all-connections .list-item:hover,
html body .all-connections .connection:hover,
html body .all-connections .connection-group:hover {
    background-color: #ffffff !important;
}


/* =====================================================================
   MASSINI v2.5 - USER MENU (.menu) leggibile in tema scuro
   Data: 2026-04-21
   
   Problema: il pannello del menu utente in alto a destra usa la
   classe .menu (non .user-menu/.dropdown-menu come supposto prima),
   e la regola a riga 331-343 gli imposta background #000000
   identico al resto della pagina -> si fonde e non e' leggibile.
   
   Scelta utente: restare in tema B/N, fondo grigio molto scuro
   #1a1a1a per dare leggero contrasto senza usare colori.
   
   Il selettore "html body .menu" con !important deve vincere
   sulla regola precedente perche' piu' specifico e piu' in basso
   nel file.
   ===================================================================== */

/* --- Contenitore pannello: fondo grigio scuro, leggero bordo bianco --- */
html body .menu,
html body .menu-contents,
html body .menu *[role="menu"],
html body .user-menu,
html body .dropdown-menu,
html body .header-menu,
html body nav .menu,
html body #guac-menu .menu {
    background-color: #1a1a1a !important;
    background: #1a1a1a !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    border-radius: 0 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5) !important;
}

/* --- Tutti i figli: fondo trasparente per ereditare #1a1a1a dal padre,
   testo bianco --- */
html body .menu *,
html body .menu-contents *,
html body .user-menu *,
html body .dropdown-menu *,
html body .header-menu * {
    background-color: transparent !important;
    color: #ffffff !important;
}

/* --- Riapplica il fondo grigio SOLO al contenitore principale --- */
html body .menu,
html body .menu-contents {
    background-color: #1a1a1a !important;
}

/* --- Link nome utente in alto: bianco, grassetto, cliccabile ma NON blu --- */
html body .menu a,
html body .menu .username,
html body .menu .full-name,
html body .menu .user-info,
html body .menu .user-info a,
html body .menu-contents a,
html body .menu-contents .username {
    color: #ffffff !important;
    text-decoration: none !important;
    font-weight: 600 !important;
}

/* --- Voci "Home" / "Opzioni" / "Esci" di base --- */
html body .menu li,
html body .menu li a,
html body .menu-contents li,
html body .menu-contents li a {
    color: #ffffff !important;
    background-color: transparent !important;
    font-weight: 400 !important;
}

/* --- Hover voce: grigio leggermente piu' chiaro --- */
html body .menu a:hover,
html body .menu li:hover,
html body .menu li a:hover,
html body .menu li:hover a,
html body .menu-contents a:hover,
html body .menu-contents li:hover,
html body .menu-contents li a:hover {
    background-color: #2a2a2a !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

/* --- Voce attiva "Home": grigio piu' marcato per distinguerla --- */
html body .menu li.active,
html body .menu li.selected,
html body .menu li.current,
html body .menu li.active a,
html body .menu li.selected a,
html body .menu-contents li.active,
html body .menu-contents li.selected {
    background-color: #333333 !important;
    color: #ffffff !important;
    font-weight: 600 !important;
}

/* --- Sottotitoli IT / Massini Industries: grigio chiaro leggibile --- */
html body .menu .user-info *,
html body .menu .user-details *,
html body .menu small,
html body .menu .caption,
html body .menu-contents small,
html body .menu-contents .caption {
    color: #cccccc !important;
    background-color: transparent !important;
    font-weight: 400 !important;
}

/* --- Separatori --- */
html body .menu hr,
html body .menu .divider,
html body .menu .separator,
html body .menu-contents hr,
html body .menu-contents .divider {
    border-color: rgba(255, 255, 255, 0.20) !important;
    background-color: rgba(255, 255, 255, 0.20) !important;
}

/* --- Icone nel menu: bianche (brightness(0) invert(1)) --- */
html body .menu .icon,
html body .menu .glyphicon,
html body .menu .fa,
html body .menu svg,
html body .menu-contents .icon,
html body .menu-contents svg {
    filter: brightness(0) invert(1) !important;
    -webkit-filter: brightness(0) invert(1) !important;
    color: #ffffff !important;
    fill: #ffffff !important;
    background-color: transparent !important;
}

/* ===================================================================
   MASSINI v3.2 - FIX DEFINITIVO HOVER/EXPANDED LISTA CONNESSIONI

   BUG CRITICO IDENTIFICATO: la regola esistente (riga 1187)
     .caption .name { color: inherit !important; }
   impedisce di colorare .name direttamente. Il .name eredita
   OBBLIGATORIAMENTE dal parent .caption.

   Quindi: per cambiare il colore del nome (es. "01 - MIAL", "DC1")
   devo colorare IL .caption e lasciare che .name erediti.

   Struttura DOM Guacamole 1.6 ricostruita da osservazione:
     .list-item.connection-group.expanded
       └── .caption              <- sfondo chiaro in stato expanded
             └── .icon
             └── .name           <- eredita color da .caption
       └── .children (o div)
             └── .list-item.connection:hover
                   └── .caption  <- sfondo chiaro in hover
                         └── .name
   =================================================================== */

/* --- HOVER: .caption sotto hover -> testo nero, .name eredita --- */
html body .settings .connection:hover > .caption,
html body .settings .connection-group:hover > .caption,
html body .settings .list-item:hover > .caption,
html body .settings .user:hover > .caption,
html body .settings .user-group:hover > .caption,
html body .settings .caption:hover,
html body .settings .connection > .caption:hover,
html body .settings .connection-group > .caption:hover,
html body .settings .list-item > .caption:hover {
    color: #000000 !important;
    background-color: #f5f5f5 !important;
    background: #f5f5f5 !important;
}

/* Caption anche in hover indiretto (il :hover e' sul wrapper) */
html body .settings .connection:hover .caption,
html body .settings .connection:hover .caption .name,
html body .settings .connection-group:hover .caption,
html body .settings .connection-group:hover .caption .name,
html body .settings .list-item:hover .caption,
html body .settings .list-item:hover .caption .name,
html body .settings .list-item:hover .name,
html body .settings .connection:hover .name,
html body .settings .connection-group:hover .name {
    color: #000000 !important;
}

/* Link anchor in hover: neri (li trattiamo come caso a parte perche'
   NON ereditano da color:inherit, hanno color proprio #fff !important
   dalle regole .connection a a riga 989). */
html body .settings .connection:hover a,
html body .settings .connection:hover a[href],
html body .settings .connection:hover a:visited,
html body .settings .connection-group:hover a,
html body .settings .connection-group:hover a[href],
html body .settings .connection-group:hover a:visited,
html body .settings .user:hover a,
html body .settings .user-group:hover a {
    color: #000000 !important;
}

/* --- EXPANDED: il .caption diretto di un gruppo espanso ha sfondo
       chiaro; mettiamo testo nero sul caption (il .name eredita). --- */
html body .settings .connection-group.expanded > .caption,
html body .settings .connection-group.expanded .caption,
html body .settings .connection-group.expanded .caption .name,
html body .settings .connection-group.expanded .name,
html body .settings .connection.expanded > .caption,
html body .settings .connection.expanded .caption,
html body .settings .connection.expanded .caption .name,
html body .settings .connection.expanded .name,
html body .settings .list-item.expanded > .caption,
html body .settings .list-item.expanded .caption,
html body .settings .list-item.expanded .caption .name,
html body .settings .list-item.expanded .name {
    color: #000000 !important;
}

/* Tutti i discendenti list-item dentro un gruppo espanso (es. DC1,
   sharing profiles) -> caption nero perche' ereditano sfondo chiaro */
html body .settings .connection-group.expanded .list-item > .caption,
html body .settings .connection-group.expanded .list-item .caption,
html body .settings .connection-group.expanded .list-item .caption .name,
html body .settings .connection-group.expanded .list-item .name,
html body .settings .connection-group.expanded .connection > .caption,
html body .settings .connection-group.expanded .connection .caption,
html body .settings .connection-group.expanded .connection .name,
html body .settings .connection-group.expanded .connection-group > .caption,
html body .settings .connection-group.expanded .connection-group .name {
    color: #000000 !important;
}

/* Link azione dentro gruppo espanso: Nuova Connessione/Gruppo/Sharing
   Hanno color:#fff sui loro <a> interni, quindi vanno forzati a nero */
html body .settings .connection-group.expanded .new-connection,
html body .settings .connection-group.expanded .new-connection a,
html body .settings .connection-group.expanded .new-connection a[href],
html body .settings .connection-group.expanded .new-connection-group,
html body .settings .connection-group.expanded .new-connection-group a,
html body .settings .connection-group.expanded .new-connection-group a[href],
html body .settings .connection-group.expanded .new-sharing-profile,
html body .settings .connection-group.expanded .new-sharing-profile a,
html body .settings .connection-group.expanded .new-sharing-profile a[href],
html body .settings .connection-group.expanded .choice,
html body .settings .connection-group.expanded .choice a,
html body .settings .connection-group.expanded .choice a[href],
html body .settings .connection.expanded .new-sharing-profile,
html body .settings .connection.expanded .new-sharing-profile a,
html body .settings .connection.expanded .choice,
html body .settings .connection.expanded .choice a {
    color: #000000 !important;
    opacity: 1 !important;
}

/* Anchor <a> dentro .caption dei gruppi/conn espansi (hanno
   color:#fff dalla regola .connection a) */
html body .settings .connection-group.expanded .caption a,
html body .settings .connection-group.expanded .caption a[href],
html body .settings .connection-group.expanded .caption a:visited,
html body .settings .connection-group.expanded > .caption a,
html body .settings .connection-group.expanded > .caption a[href],
html body .settings .connection.expanded .caption a,
html body .settings .connection.expanded > .caption a,
html body .settings .connection.expanded > .caption a[href] {
    color: #000000 !important;
}

/* --- ICONE: IMPORTANTE - nel tema originale le icone dei gruppi/
   connessioni sono rese BIANCHE via filter brightness(0) invert(1)
   (riga 624). Quando lo sfondo diventa chiaro (hover/expanded), diventano
   invisibili. Serve NEUTRALIZZARE il filter (filter: none) NON forzare
   brightness(0) invert(0) che le renderebbe quadratini neri pieni.
   Le icone hanno un background-image originale SCURO che deve tornare
   visibile senza filtri. --- */
html body .settings .connection:hover .icon,
html body .settings .connection-group:hover .icon,
html body .settings .list-item:hover .icon,
html body .settings .caption:hover .icon,
html body .settings .connection-group.expanded .icon,
html body .settings .connection.expanded .icon,
html body .settings .connection-group.expanded .list-item .icon,
html body .settings .connection-group.expanded .connection .icon,
html body .settings .connection-group.expanded .connection-group .icon {
    filter: none !important;
    -webkit-filter: none !important;
}

/* SVG: stesse condizioni, fill scuro invece di bianco */
html body .settings .connection:hover svg,
html body .settings .connection:hover svg path,
html body .settings .connection-group:hover svg,
html body .settings .connection-group:hover svg path,
html body .settings .list-item:hover svg,
html body .settings .list-item:hover svg path,
html body .settings .connection-group.expanded svg,
html body .settings .connection-group.expanded svg path,
html body .settings .connection.expanded svg,
html body .settings .connection.expanded svg path {
    filter: none !important;
    -webkit-filter: none !important;
    fill: #28477D !important;
    color: #28477D !important;
}

/* Glyphicon/i font-icon: scure su sfondo chiaro */
html body .settings .connection:hover i,
html body .settings .connection-group:hover i,
html body .settings .list-item:hover i,
html body .settings .connection-group.expanded i,
html body .settings .connection.expanded i,
html body .settings .connection:hover .glyphicon,
html body .settings .connection-group:hover .glyphicon,
html body .settings .connection-group.expanded .glyphicon {
    color: #28477D !important;
    filter: none !important;
    -webkit-filter: none !important;
}

/* ===================================================================
   MASSINI v3.4 - FIX SELECT NATIVO: valore selezionato visibile
   Problema: il testo "Organizzazione" nel <select> del campo Tipo
   appare bianco su sfondo chiaro anche con color:#000 !important.
   Causa: i browser moderni (Firefox/Edge) rendono il <select> nativo
   usando il tema del sistema operativo. Il CSS color non viene
   onorato completamente con appearance:auto.
   Soluzione: -webkit-appearance:none + appearance:none ripristina
   il controllo CSS. Serve ridisegnare la freccina dropdown.
   =================================================================== */

html body select,
html body .settings select,
html body .manage-connection select,
html body .manage-connection-group select,
html body .guac-form select,
html body .form select {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    background-color: #f5f5f5 !important;
    color: #000000 !important;
    padding: 4px 24px 4px 8px !important;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M2 2l4 4 4-4' stroke='%23000000' stroke-width='2' fill='none'/></svg>") !important;
    background-repeat: no-repeat !important;
    background-position: right 6px center !important;
    border: 1px solid rgba(40, 71, 125, 0.25) !important;
}

/* Option list (tendina aperta): il browser spesso la rende col tema
   OS ignorando CSS, ma proviamo comunque */
html body select option,
html body .settings select option,
html body select option:checked,
html body select option:selected,
html body select option:hover {
    background-color: #f5f5f5 !important;
    color: #000000 !important;
}

/* Focus/hover sul select: evidenzia con bordo blu, testo sempre nero */
html body select:focus,
html body select:hover,
html body .settings select:focus,
html body .settings select:hover {
    border: 1px solid #28477D !important;
    outline: none !important;
    color: #000000 !important;
    background-color: #f5f5f5 !important;
}

/* ===================================================================
   MASSINI v3.6 - FIX HOME (/#/): figli di gruppo espanso
   
   PROBLEMA: Nella pagina HOME (URL /#/), quando un .connection-group
   e' espanso, il suo sfondo diventa chiaro (#f5f5f5) grazie alla regola
   generale alla riga 735, ma le regole che rendono il TESTO NERO e le
   ICONE non-bianche sono limitate al prefisso ".settings" (righe
   3372-3484). Risultato: nella home i figli (AD1, AD2, SRV-OTPV dentro
   MGMT VIRT) hanno testo bianco + icone bianche su sfondo chiaro =
   invisibili.
   
   SOLUZIONE: Replicare le STESSE regole che gia' funzionano in .settings
   ma SENZA il prefisso .settings, cosi' si applicano anche alla home.
   Le regole sono copia-incolla letterale da righe 3372-3484 per
   garantire coerenza comportamentale tra home e settings.
   
   IMPORTANTE: Nessuna modifica alle regole esistenti. Solo aggiunta
   in coda per massima compatibilita'.
   =================================================================== */

/* TESTO: caption/name di gruppi/connessioni espansi -> NERO.
   Selettori che includono i figli annidati (discendenti, non solo
   diretti). Identico alle righe 3372-3385 ma senza .settings. */
html body .connection-group.expanded > .caption,
html body .connection-group.expanded .caption,
html body .connection-group.expanded .caption .name,
html body .connection-group.expanded .name,
html body .connection.expanded > .caption,
html body .connection.expanded .caption,
html body .connection.expanded .caption .name,
html body .connection.expanded .name,
html body .list-item.expanded > .caption,
html body .list-item.expanded .caption,
html body .list-item.expanded .caption .name,
html body .list-item.expanded .name {
    color: #000000 !important;
}

/* TESTO: tutti i discendenti list-item/connection dentro un gruppo
   espanso -> nero (ereditano sfondo chiaro).
   Identico alle righe 3389-3399 ma senza .settings. */
html body .connection-group.expanded .list-item > .caption,
html body .connection-group.expanded .list-item .caption,
html body .connection-group.expanded .list-item .caption .name,
html body .connection-group.expanded .list-item .name,
html body .connection-group.expanded .connection > .caption,
html body .connection-group.expanded .connection .caption,
html body .connection-group.expanded .connection .name,
html body .connection-group.expanded .connection-group > .caption,
html body .connection-group.expanded .connection-group .name {
    color: #000000 !important;
}

/* ANCHOR <a> dentro caption di gruppi/conn espansi -> neri.
   Identico alle righe 3425-3434 ma senza .settings. */
html body .connection-group.expanded .caption a,
html body .connection-group.expanded .caption a[href],
html body .connection-group.expanded .caption a:visited,
html body .connection-group.expanded > .caption a,
html body .connection-group.expanded > .caption a[href],
html body .connection.expanded .caption a,
html body .connection.expanded > .caption a,
html body .connection.expanded > .caption a[href] {
    color: #000000 !important;
}

/* ICONE: neutralizza filter brightness(0) invert(1) cosi' tornano
   visibili su sfondo chiaro (il background-image SVG originale e'
   scuro). Identico alle righe 3443-3454 ma senza .settings. */
html body .connection-group.expanded .icon,
html body .connection.expanded .icon,
html body .connection-group.expanded .list-item .icon,
html body .connection-group.expanded .connection .icon,
html body .connection-group.expanded .connection-group .icon {
    filter: none !important;
    -webkit-filter: none !important;
}

/* SVG: identico alle righe 3463-3471 ma senza .settings. */
html body .connection-group.expanded svg,
html body .connection-group.expanded svg path,
html body .connection.expanded svg,
html body .connection.expanded svg path {
    filter: none !important;
    -webkit-filter: none !important;
    fill: #28477D !important;
    color: #28477D !important;
}

/* GLYPHICON: identico alle righe 3477-3485 ma senza .settings. */
html body .connection-group.expanded i,
html body .connection.expanded i,
html body .connection-group.expanded .glyphicon {
    color: #28477D !important;
    filter: none !important;
    -webkit-filter: none !important;
}

/* build-tag: MASSINI-v3.6-HOME-EXPANDED-FIX-2026-04-22 */

/* ===================================================================
   MASSINI v3.10 - HOVER FIGLI GRUPPO ESPANSO (HOME + SETTINGS)
   
   OBIETTIVO: quando passi il mouse sopra una riga figlia (AD1, AD2,
   SRV-OTPV) dentro un gruppo espanso, la riga deve dare un feedback
   visivo distinguibile dal resto del gruppo espanso.
   
   VINCOLI IMPARATI DAGLI ESPERIMENTI PRECEDENTI:
   1. Il gruppo espanso ha sfondo #f5f5f5 (grigio chiaro)
   2. L'hover nativo e' #f5f5f5 -> non dà contrasto nel contenitore
   3. Forzare sfondo NERO + invert delle icone le rende quadrati bianchi
      pieni, perche' gli SVG Guacamole hanno trasparenze interne
   
   SOLUZIONE: mantenere hover CHIARO ma di SFUMATURA DIVERSA (#e0e0e0
   leggermente piu' scuro di #f5f5f5), testo NERO, icone NON TOCCATE
   (restano nel loro stato originale scuro, che si legge bene sia su
   #f5f5f5 che su #e0e0e0).
   =================================================================== */

html body .connection-group.expanded .connection:hover > .caption,
html body .connection-group.expanded .connection:hover > .caption .name,
html body .connection-group.expanded .connection:hover > .caption span,
html body .connection-group.expanded .connection:hover > .caption a,
html body .connection-group.expanded .connection:hover > .caption a[href],
html body .connection-group.expanded .list-item:hover > .caption,
html body .connection-group.expanded .list-item:hover > .caption .name,
html body .connection-group.expanded .list-item:hover > .caption span,
html body .connection-group.expanded .connection-group:hover > .caption,
html body .connection-group.expanded .connection-group:hover > .caption .name,
html body .settings .connection-group.expanded .connection:hover > .caption,
html body .settings .connection-group.expanded .connection:hover > .caption .name,
html body .settings .connection-group.expanded .connection:hover > .caption span,
html body .settings .connection-group.expanded .list-item:hover > .caption,
html body .settings .connection-group.expanded .list-item:hover > .caption .name,
html body .settings .connection-group.expanded .connection-group:hover > .caption,
html body .settings .connection-group.expanded .connection-group:hover > .caption .name {
    background-color: #d0d0d0 !important;
    background: #d0d0d0 !important;
    color: #000000 !important;
}

/* Cursor pointer per indicare cliccabilita' */
html body .connection-group.expanded .connection:hover,
html body .connection-group.expanded .list-item:hover,
html body .settings .connection-group.expanded .connection:hover,
html body .settings .connection-group.expanded .list-item:hover {
    cursor: pointer !important;
}

/* IMPORTANTE: NON applichiamo filter sulle icone.
   Lasciamo che le icone mantengano lo stile che hanno nello stato
   "gruppo espanso a riposo" (gia' corretto dal tema + v3.6).
   In questo modo evitiamo i "quadrati bianchi" causati da
   brightness(0) invert(1) su SVG con trasparenze. */

/* build-tag: MASSINI-v3.10-HOVER-LIGHT-GREY-2026-04-22 */


/* ===================================================================
   MASSINI v3.16 - ICONA UFFICIALE PER VOCE "Opzioni" NEL MENU UTENTE
   
   DIAGNOSI COMPLETA (dopo esecuzione snippet DevTools):
   Home     -> CLASSI "home ng-binding" + HREF "#/"
                bg-image: guac-home-dark.svg ✅ presente
   Opzioni  -> CLASSI "home ng-binding current" + HREF "#/settings/sessions"
                bg-image: NONE ❌ (tema Massini non l'ha definita)
   Esci     -> CLASSI "ng-binding logout"
                bg-image: guac-logout-dark.svg ✅ presente
   
   VERIFICATO sul server: /images/action-icons/guac-config-dark.svg esiste.
   
   SOLUZIONE: applichiamo guac-config-dark.svg al link di Opzioni con
   selettore ULTRA-MIRATO a[href="#/settings/sessions"]. Nessun altro
   elemento puo' matchare questo selettore.
   =================================================================== */

/* Icona ingranaggio per la voce Opzioni nel menu utente.
   Stessi identici parametri delle altre due icone funzionanti
   (stessi padding, position, size - cosi' si allinea perfetta). */
html body a.home[href="#/settings/sessions"],
html body a.home.current[href="#/settings/sessions"],
html body li a.home[href="#/settings/sessions"] {
    background-image: url("/images/action-icons/guac-config-dark.svg") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 18px 18px !important;
}

/* build-tag: MASSINI-v3.16-OPZIONI-CONFIG-ICON-2026-04-22 */

/* ===================================================================
   MASSINI v3.17 - FIX ICONA HOME SU STATO CURRENT
   
   BUG STORICO scoperto dagli snippet DevTools:
   - Home a riposo: bg-image = guac-home-dark.svg ✅ visibile
   - Home "current" (quando sei sulla home): bg-image = NONE ❌
   
   CAUSA: le regole alle righe 1770-1780 usano "background: #f5f5f5"
   (shorthand) che AZZERA anche background-image. Cosi' l'icona di
   Home viene persa quando e' current.
   
   FIX: ripristiniamo esplicitamente il background-image di Home su
   stato current, usando l'icona guac-home-dark.svg gia' presente
   sul server. Selettore ULTRA-mirato a[href="#/"] per non toccare
   altre tab current (es. Opzioni che e' anche a.home.current).
   =================================================================== */

html body a.home.current[href="#/"],
html body li.linked a.home.current[href="#/"],
html body .page-tabs a.home.current[href="#/"] {
    background-image: url("/images/action-icons/guac-home-dark.svg") !important;
    background-color: #f5f5f5 !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 18px 18px !important;
}

/* build-tag: MASSINI-v3.17-HOME-CURRENT-ICON-RESTORED-2026-04-22 */

/* ===================================================================
   MASSINI v3.18 - COLORE ICONE DROPDOWN COERENTE CON TESTO
   
   PROBLEMA: le icone SVG -dark del dropdown utente (Home, Opzioni,
   Esci) sono nere di default (disegnate per sfondi chiari).
   Sul tema Massini il dropdown ha sfondo NERO -> icone nere
   invisibili su sfondo nero.
   
   LOGICA DESIDERATA (come il testo):
   - Stato riposo (sfondo nero): icone BIANCHE (coerenti con testo)
   - Stato hover/current (sfondo chiaro #f5f5f5): icone NERE
     (coerenti con testo nero)
   
   SELETTORE: limitiamo SOLO ai link con bg-image nel dropdown,
   usando l'attribute selector [style*="guac-"] non e' affidabile;
   usiamo invece a.home e a.logout che sono le classi usate dal
   tema per queste voci dropdown (verificato da DevTools).
   =================================================================== */

/* STATO RIPOSO: icone bianche come il testo (dropdown tema dark) */
html body li.linked a.home:not(.current),
html body li.linked a.home:not(:hover):not(.current),
html body a.home:not(.current):not(:hover),
html body li.linked a.logout,
html body a.logout {
    filter: brightness(0) invert(1) !important;
    -webkit-filter: brightness(0) invert(1) !important;
}

/* STATO HOVER o CURRENT: icone nere (sfondo diventa chiaro) */
html body li.linked a.home.current,
html body li.linked a.home:hover,
html body a.home.current,
html body a.home:hover,
html body li.linked a.logout:hover,
html body a.logout:hover {
    filter: none !important;
    -webkit-filter: none !important;
}

/* build-tag: MASSINI-v3.18-ICONS-COLOR-MATCH-TEXT-2026-04-22 */

/* ===================================================================
   MASSINI v3.19 - FIX DUE ICONE NERE RESIDUE:
   1) Icona utente accanto a "webglan" (bottone dropdown in alto dx)
   2) Icona di Opzioni quando la riga e' hover/selected/current
   
   OSSERVAZIONE: nell'immagine, Opzioni ha sfondo grigio chiaro ma
   l'icona e' invisibile. Questo perche' v3.18 applica filter:none
   sulla riga current/hover, ma evidentemente non sta matchando
   tutti i casi. Rinforziamo con selettori piu' espliciti.
   
   OSSERVAZIONE 2: "webglan" ha un'icona utente (probabilmente in
   un .header-menu, .user-menu, .menu-dropdown-trigger) che e'
   NERA mentre il testo "webglan" e' BIANCO. Forziamo l'icona al
   colore del testo (bianco) con filter invert.
   =================================================================== */

/* FIX 1: icona utente "webglan" (bottone che apre il dropdown)
   - E' un elemento con classe tipo .user-icon, .header-user-icon,
     .user-menu-trigger, o simili. Applichiamo a tutte le varianti
     plausibili dei contenitori dropdown trigger. */
html body .header-menu .icon,
html body .header-menu .user-icon,
html body .header-menu img,
html body .header .user-menu .icon,
html body .header .user-menu-trigger .icon,
html body .header .menu-title .icon,
html body header .icon,
html body .menu-dropdown > .menu-title .icon,
html body .user-menu-dropdown .menu-title .icon,
html body .menu-title > .icon {
    filter: brightness(0) invert(1) !important;
    -webkit-filter: brightness(0) invert(1) !important;
}

/* FIX 2: icona "Opzioni" quando la riga e' hover/current/selected.
   Selettore piu' largo del v3.18 per coprire tutti gli stati. */
html body li.linked.current a.home,
html body li.linked a.home.current,
html body li.current > a.home,
html body li.linked.active a.home,
html body a.home.current[href*="settings"],
html body a.home.ng-binding.current {
    filter: none !important;
    -webkit-filter: none !important;
}

/* ALTERNATIVA: se il background-color della riga e' chiaro, l'icona
   DEVE essere scura. Forziamo filter:none per qualsiasi a.home dentro
   un contenitore con sfondo chiaro (hover o selected). */
html body li.linked:hover a.home,
html body li:hover > a.home,
html body li.linked.active a.home,
html body a.home:hover,
html body a.home:focus,
html body a.home.current {
    filter: none !important;
    -webkit-filter: none !important;
}

/* build-tag: MASSINI-v3.19-USER-ICON-AND-OPTIONS-HOVER-2026-04-22 */

/* ===================================================================
   MASSINI v3.20 - FIX DEFINITIVO icona utente "webglan"
   
   DATO CONFERMATO DA DEVTOOLS:
   - DOM: <div class="menu-title ng-binding">webglan</div>
          dentro .user-menu > .menu-dropdown > .menu-title
   - CSS attivo: .user-menu .menu-dropdown .menu-title {
       background-image: url(images/user-icons/guac-user.svg);
       padding-left: 2em; background-position: .5em;
     }
   - L'SVG e' scura (dark variant) -> nera su sfondo nero del tema
   
   FIX: applichiamo filter brightness(0) invert(1) sul selettore
   ESATTO, cosi' l'icona utente diventa bianca coerente col testo
   "webglan" che e' gia' bianco.
   
   Hover/open: icona torna scura (filter:none) se mai lo sfondo
   diventasse chiaro, altrimenti resta bianca.
   =================================================================== */

/* RIPOSO + HOVER + OPEN: icona utente SEMPRE BIANCA come il testo
   "webglan" (che e' sempre bianco in qualsiasi stato). */
html body .user-menu .menu-dropdown .menu-title,
html body .user-menu .menu-dropdown.open .menu-title,
html body .user-menu .menu-dropdown:hover .menu-title,
html body .user-menu .menu-dropdown:hover > .menu-title,
html body .user-menu .menu-dropdown.open:hover .menu-title {
    filter: brightness(0) invert(1) !important;
    -webkit-filter: brightness(0) invert(1) !important;
}

/* build-tag: MASSINI-v3.21-WEBGLAN-ALWAYS-WHITE-2026-04-22 */

/* ===================================================================
   MASSINI v3.22 - FIX ICONA HOME/OPZIONI QUANDO SELEZIONATA (current)
   
   SITUAZIONE OSSERVATA:
   - Voci non selezionate (sfondo nero): icone bianche visibili ✅
   - Voce selezionata (sfondo chiaro #f5f5f5): icona INVISIBILE ❌
   
   CAUSA: quando la riga e' .current, lo sfondo diventa chiaro ma
   una regola in conflitto applica filter: brightness(0) invert(1)
   (icona bianca) anche nello stato selected -> bianco su bianco.
   
   SOLUZIONE: regola ad ALTA SPECIFICITA' che forza filter:none SOLO
   quando .current (sfondo chiaro). Il "none" mostra l'SVG originale
   che e' scuro -> visibile sul grigio chiaro.
   
   Specificita' alta ottenuta con selettori concatenati multipli.
   =================================================================== */

/* VOCE SELEZIONATA/CURRENT nel dropdown: icone NERE (filter:none)
   Uso selettore "html body li.linked a.home.current" per alta specificita'
   (5 livelli + pseudo-classe = vince contro la maggior parte delle regole) */
html body li.linked a.home.current,
html body li.linked a.home.current.ng-binding,
html body li a.home.current,
html body a.home.current[href="#/"],
html body a.home.current[href="#/settings/sessions"],
html body .menu-dropdown li.linked a.home.current,
html body .user-menu li.linked a.home.current,
html body .dropdown-menu li.linked a.home.current {
    filter: none !important;
    -webkit-filter: none !important;
}

/* build-tag: MASSINI-v3.22-CURRENT-ICON-DARK-2026-04-22 */

/* ===================================================================
   MASSINI v3.23 - RIPRISTINO bg-image SU OPZIONI CURRENT
   
   DIAGNOSI: le icone delle voci CURRENT sono invisibili perche'
   il tema applica "background: #f5f5f5" (shorthand) che azzera
   anche il background-image.
   
   v3.17 aveva ripristinato il bg-image di Home.current.
   ORA ripristiniamo anche quello di Opzioni.current + tutti i
   possibili link .current nel dropdown utente.
   =================================================================== */

/* Opzioni.current: ripristina bg-image guac-config-dark.svg */
html body a.home.current[href="#/settings/sessions"],
html body li.linked a.home.current[href="#/settings/sessions"],
html body .menu-dropdown a.home.current[href="#/settings/sessions"],
html body .user-menu a.home.current[href="#/settings/sessions"] {
    background-image: url("/images/action-icons/guac-config-dark.svg") !important;
    background-color: #f5f5f5 !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 18px 18px !important;
}

/* Home.current: ripristina bg-image guac-home-dark.svg (rinforzo v3.17) */
html body a.home.current[href="#/"],
html body li.linked a.home.current[href="#/"],
html body .menu-dropdown a.home.current[href="#/"],
html body .user-menu a.home.current[href="#/"] {
    background-image: url("/images/action-icons/guac-home-dark.svg") !important;
    background-color: #f5f5f5 !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 18px 18px !important;
}

/* build-tag: MASSINI-v3.23-CURRENT-BG-IMAGE-RESTORED-2026-04-22 */

/* ===================================================================
   MASSINI v3.23 - ICONA OPZIONI SU CURRENT (bug stesso del v3.17)
   
   DIAGNOSI (dallo snippet DevTools):
   Opzioni.current -> bg-image: NONE + filter: none
   
   Stesso bug di Home pre-v3.17: la shorthand "background: #f5f5f5"
   del tema azzera il background-image per lo stato .current.
   
   Il v3.16 metteva il background-image sul link Opzioni, ma NON
   copriva lo stato current (che viene processato dopo e azzera).
   
   FIX: regola ultra-specifica che applica background-image E
   background-color separatamente (no shorthand) su Opzioni current.
   =================================================================== */

html body a.home.current[href="#/settings/sessions"],
html body li a.home.current[href="#/settings/sessions"],
html body li.linked a.home.current[href="#/settings/sessions"],
html body .page-tabs a.home.current[href="#/settings/sessions"],
html body a.home.ng-binding.current[href="#/settings/sessions"] {
    background-image: url("/images/action-icons/guac-config-dark.svg") !important;
    background-color: #f5f5f5 !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 18px 18px !important;
    filter: none !important;
    -webkit-filter: none !important;
}

/* build-tag: MASSINI-v3.23-OPZIONI-CURRENT-ICON-2026-04-22 */

/* ===================================================================
   MASSINI v3.24 - ARTIGLIERIA PESANTE su icone .current
   
   CAUSA ROOT DEFINITIVA (trovata ispezionando il CSS):
   Righe 1302-1306 del file originale applicano:
     background: #f5f5f5 !important;   <-- shorthand azzera bg-image
   su selettori tipo:
     .page-tabs .page-list li a.current, .section-tabs li a.current
   Specificita' loro: (0,4,1) -> 4 classi + 1 tag
   Specificita' mia v3.23: (0,3,2) -> vinceva PER POCO
   
   V3.24: selettori con specificita' (0,5,2) garantiscono vittoria.
   Uso doppie classi + attributi + html body per superare qualsiasi
   regola di Guacamole originale.
   =================================================================== */

/* OPZIONI current: specificita' massima */
html body .page-tabs .page-list li a.home.current[href="#/settings/sessions"],
html body .section-tabs li a.home.current[href="#/settings/sessions"],
html body li.linked a.home.ng-binding.current[href="#/settings/sessions"],
html body .user-menu li a.home.current[href="#/settings/sessions"],
html body .menu-dropdown li a.home.current[href="#/settings/sessions"],
html body div a.home.ng-binding.current[href="#/settings/sessions"] {
    background-image: url("/images/action-icons/guac-config-dark.svg") !important;
    background-color: #f5f5f5 !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 18px 18px !important;
    filter: none !important;
    -webkit-filter: none !important;
}

/* HOME current: specificita' massima (stesso problema) */
html body .page-tabs .page-list li a.home.current[href="#/"],
html body .section-tabs li a.home.current[href="#/"],
html body li.linked a.home.ng-binding.current[href="#/"],
html body .user-menu li a.home.current[href="#/"],
html body .menu-dropdown li a.home.current[href="#/"],
html body div a.home.ng-binding.current[href="#/"] {
    background-image: url("/images/action-icons/guac-home-dark.svg") !important;
    background-color: #f5f5f5 !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 18px 18px !important;
    filter: none !important;
    -webkit-filter: none !important;
}

/* build-tag: MASSINI-v3.24-CURRENT-ICONS-MAX-SPECIFICITY-2026-04-22 */

/* ===================================================================
   MASSINI v3.25 - DEFINITIVO usando selettore del DOM REALE
   
   SCOPERTA FINALE (snippet DevTools con ricerca regole matching):
   Guacamole ORIGINALE (1.guacamole.c2fc19251fc606ad2140.css) ha gia':
     .user-menu .menu-dropdown .menu-contents li a[href="#/settings/sessions"] {
       background-image: url("images/action-icons/guac-config-dark.svg");
     }
   ma senza !important, quindi viene sovrascritta dalla regola del tema
   Massini a riga ~1302 che usa shorthand "background: #f5f5f5 !important"
   (azzera bg-image).
   
   SOLUZIONE: usiamo ESATTO il selettore che Guacamole stesso usa per
   raggiungere l'elemento nel DOM reale, col doppio .user-menu per
   aumentare ancora specificita', e aggiungiamo !important.
   =================================================================== */

/* Opzioni current - SOLO stato current (sfondo chiaro, icona scura).
   Rimosso selettore senza .current che rompeva lo stato a riposo
   (forzava filter:none su sfondo nero = icona invisibile). */
html body .user-menu .menu-dropdown .menu-contents li a.home.current[href="#/settings/sessions"],
html body .user-menu .menu-dropdown .menu-contents li a.current[href="#/settings/sessions"],
html body .user-menu.user-menu .menu-dropdown .menu-contents li a.current[href="#/settings/sessions"],
html body div .user-menu .menu-dropdown .menu-contents li a.home.current[href="#/settings/sessions"] {
    background-image: url("/images/action-icons/guac-config-dark.svg") !important;
    background-color: #f5f5f5 !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 18px 18px !important;
    filter: none !important;
    -webkit-filter: none !important;
}

/* Home current - SOLO stato current. Stessa logica. */
html body .user-menu .menu-dropdown .menu-contents li a.home.current[href="#/"],
html body .user-menu .menu-dropdown .menu-contents li a.current[href="#/"],
html body .user-menu.user-menu .menu-dropdown .menu-contents li a.current[href="#/"],
html body div .user-menu .menu-dropdown .menu-contents li a.home.current[href="#/"] {
    background-image: url("/images/action-icons/guac-home-dark.svg") !important;
    background-color: #f5f5f5 !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 18px 18px !important;
    filter: none !important;
    -webkit-filter: none !important;
}

/* build-tag: MASSINI-v3.26-CURRENT-ONLY-DOM-BASED-2026-04-22 */

/* ===================================================================
   MASSINI v3.27 - VOCI MENU UTENTE SELEZIONATE: ICONA + TESTO #f5f5f5
   
   RICHIESTA UTENTE: sulla voce selezionata del dropdown utente
   (Home, Opzioni) icona e scritta devono essere color #f5f5f5;
   lo sfondo/evidenziazione della selezione NON va toccato
   (resta quello gia' applicato dal tema, attualmente scuro).
   
   STRATEGIA:
   - NON si tocca background-color (nessuna regola in questo blocco
     lo imposta) -> la selezione resta visivamente come la vedi oggi.
   - Si sostituisce la SVG di background con la variante CHIARA
     (guac-home.svg / guac-config.svg, senza suffisso "-dark"),
     cosi' l'icona appare chiara senza ricorrere a filter
     (il filter inverterebbe anche lo sfondo della riga).
   - Si forza filter:none per evitare che regole precedenti sporchino
     il rendering dell'SVG.
   - Si forza color:#f5f5f5 sul link .current e su TUTTI i suoi
     discendenti (.ng-binding, span, ecc.) per la scritta.
   
   SPECIFICITA': stessi selettori "html body .user-menu .menu-dropdown
   .menu-contents li a.home.current[href=...]" della v3.26 + varianti
   piu' corte, per vincere in qualsiasi struttura DOM reale.
   =================================================================== */

/* --- HOME .current: icona chiara (guac-home.svg) --- */
html body .user-menu .menu-dropdown .menu-contents li a.home.current[href="#/"],
html body .user-menu .menu-dropdown .menu-contents li a.current[href="#/"],
html body .user-menu.user-menu .menu-dropdown .menu-contents li a.home.current[href="#/"],
html body .user-menu.user-menu .menu-dropdown .menu-contents li a.current[href="#/"],
html body div .user-menu .menu-dropdown .menu-contents li a.home.current[href="#/"],
html body .menu-dropdown li.linked a.home.current[href="#/"],
html body li.linked a.home.current[href="#/"],
html body a.home.current[href="#/"] {
    background-image: url("/images/action-icons/guac-home.svg") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 18px 18px !important;
    color: #f5f5f5 !important;
    filter: none !important;
    -webkit-filter: none !important;
}

/* --- OPZIONI .current: icona chiara (guac-config.svg) --- */
html body .user-menu .menu-dropdown .menu-contents li a.home.current[href="#/settings/sessions"],
html body .user-menu .menu-dropdown .menu-contents li a.current[href="#/settings/sessions"],
html body .user-menu.user-menu .menu-dropdown .menu-contents li a.home.current[href="#/settings/sessions"],
html body .user-menu.user-menu .menu-dropdown .menu-contents li a.current[href="#/settings/sessions"],
html body div .user-menu .menu-dropdown .menu-contents li a.home.current[href="#/settings/sessions"],
html body .menu-dropdown li.linked a.home.current[href="#/settings/sessions"],
html body li.linked a.home.current[href="#/settings/sessions"],
html body a.home.current[href="#/settings/sessions"] {
    background-image: url("/images/action-icons/guac-config.svg") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 18px 18px !important;
    color: #f5f5f5 !important;
    filter: none !important;
    -webkit-filter: none !important;
}

/* --- Propaga color:#f5f5f5 a TUTTI i nodi testuali dentro .current
       (span, .ng-binding, div interni) --- */
html body .user-menu .menu-dropdown .menu-contents li a.home.current,
html body .user-menu .menu-dropdown .menu-contents li a.home.current *,
html body .user-menu .menu-dropdown .menu-contents li a.current,
html body .user-menu .menu-dropdown .menu-contents li a.current *,
html body li.linked a.home.current,
html body li.linked a.home.current *,
html body li.linked a.current,
html body li.linked a.current *,
html body a.home.current,
html body a.home.current * {
    color: #f5f5f5 !important;
}

/* build-tag: MASSINI-v3.27-CURRENT-ICON-TEXT-F5F5F5-KEEP-BG-2026-04-22 */

/* ===================================================================
   MASSINI v3.28 - FIX: -webkit-text-fill-color sovrascriveva color
   
   DIAGNOSI: la v3.27 impostava solo "color: #f5f5f5" sulla voce
   .current, ma le regole v2.8 (righe ~1875-1905) forzano anche
   "-webkit-text-fill-color: #000000 !important". In Chrome/Chromium
   (quindi anche nel client Guacamole) -webkit-text-fill-color
   VINCE su color per il rendering del testo -> la scritta restava
   nera nonostante la v3.27.
   
   FIX: oltre a color, si imposta esplicitamente
   -webkit-text-fill-color: #f5f5f5, su link .current, discendenti
   e ::before. Specificita' alta con selettori multipli per coprire
   ogni variante DOM (user-menu, menu-dropdown, li.linked, ecc.).
   =================================================================== */

html body .user-menu .menu-dropdown .menu-contents li a.home.current,
html body .user-menu .menu-dropdown .menu-contents li a.home.current *,
html body .user-menu .menu-dropdown .menu-contents li a.current,
html body .user-menu .menu-dropdown .menu-contents li a.current *,
html body .user-menu .menu-dropdown .menu-contents li a.home.ng-binding.current,
html body .user-menu .menu-dropdown .menu-contents li a.home.ng-binding.current *,
html body .user-menu li.linked a.home.current,
html body .user-menu li.linked a.home.current *,
html body .user-menu li.linked a.current,
html body .user-menu li.linked a.current *,
html body .menu-dropdown li.linked a.home.current,
html body .menu-dropdown li.linked a.home.current *,
html body li.linked a.home.current,
html body li.linked a.home.current *,
html body li.linked > a.home.current,
html body li.linked > a.home.current *,
html body li.linked > a.current,
html body li.linked > a.current *,
html body a.home.current,
html body a.home.current *,
html body a.current,
html body a.current *,
html body a.home.ng-binding.current,
html body a.home.ng-binding.current *,
html body a[class~="current"][class~="home"],
html body a[class~="current"][class~="home"] *,
html body a.home.current[href="#/"],
html body a.home.current[href="#/"] *,
html body a.home.current[href="#/settings/sessions"],
html body a.home.current[href="#/settings/sessions"] * {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
    text-shadow: none !important;
}

/* Pseudo-elemento ::before della voce .current (eventuale checkmark) */
html body .user-menu .menu-dropdown .menu-contents li a.home.current::before,
html body .user-menu .menu-dropdown .menu-contents li a.current::before,
html body li.linked a.home.current::before,
html body li.linked > a.home.current::before,
html body li.linked > a.current::before,
html body a.home.current::before,
html body a.current::before {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
}

/* build-tag: MASSINI-v3.28-WEBKIT-TEXT-FILL-COLOR-F5F5F5-2026-04-22 */

/* ===================================================================
   MASSINI v3.29 - UNIFORMA .current DEL DROPDOWN UTENTE
   ALLO STILE "NON-CURRENT" (come appare su /settings/users)
   
   SCENARIO:
   - Su /settings/users la voce "Opzioni" NON e' .current -> stile
     normale del dropdown (fondo nero, testo/icona chiari). OK.
   - Su /settings/sessions la voce "Opzioni" E' .current (href match)
     -> si attivano le regole v3.26 (bg #f5f5f5) e v2.8 (testo nero
     anche con -webkit-text-fill-color). KO: icona e testo diventano
     neri su fondo chiaro.
   
   OBIETTIVO: far comportare la voce .current del DROPDOWN esattamente
   come la stessa voce non-current (stile uniforme tra pagine).
   
   FIX DEFINITIVO:
   - background-color: transparent -> il nero del .menu traspare,
     identico al non-current di /settings/users.
   - background-image: variante CHIARA della SVG (guac-home.svg /
     guac-config.svg) -> icona chiara coerente col testo.
   - color + -webkit-text-fill-color: #f5f5f5 -> testo chiaro.
   - filter: none -> evita inversioni non volute.
   - Specificita' massimizzata con ripetizione di classi
     (.user-menu.user-menu, .current.current, ecc.) per battere in
     modo definitivo ogni regola precedente anche a parita' di
     ordinamento nel file.
   
   NOTA: questa regola si applica SOLO dentro .user-menu
   (il dropdown utente), NON tocca le tab .page-tabs/.section-tabs
   della pagina -> la selezione "Sessioni Attive" sulla barra delle
   tab resta invariata (bg chiaro + testo nero, come gia' era).
   =================================================================== */

/* --- HOME .current dentro dropdown utente --- */
html body .user-menu.user-menu .menu-dropdown.menu-dropdown .menu-contents.menu-contents li a.home.home.current.current[href="#/"],
html body .user-menu.user-menu .menu-dropdown.menu-dropdown .menu-contents.menu-contents li a.home.home.current.current[href="#/"] *,
html body .user-menu.user-menu li.linked.linked a.home.home.current.current[href="#/"],
html body .user-menu.user-menu li.linked.linked a.home.home.current.current[href="#/"] *,
html body .user-menu.user-menu a.home.home.ng-binding.current.current[href="#/"],
html body .user-menu.user-menu a.home.home.ng-binding.current.current[href="#/"] * {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
    text-shadow: none !important;
    background-color: transparent !important;
    background-image: url("/images/action-icons/guac-home.svg") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 18px 18px !important;
    filter: none !important;
    -webkit-filter: none !important;
}

/* --- OPZIONI .current dentro dropdown utente --- */
html body .user-menu.user-menu .menu-dropdown.menu-dropdown .menu-contents.menu-contents li a.home.home.current.current[href="#/settings/sessions"],
html body .user-menu.user-menu .menu-dropdown.menu-dropdown .menu-contents.menu-contents li a.home.home.current.current[href="#/settings/sessions"] *,
html body .user-menu.user-menu li.linked.linked a.home.home.current.current[href="#/settings/sessions"],
html body .user-menu.user-menu li.linked.linked a.home.home.current.current[href="#/settings/sessions"] *,
html body .user-menu.user-menu a.home.home.ng-binding.current.current[href="#/settings/sessions"],
html body .user-menu.user-menu a.home.home.ng-binding.current.current[href="#/settings/sessions"] * {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
    text-shadow: none !important;
    background-color: transparent !important;
    background-image: url("/images/action-icons/guac-config.svg") !important;
    background-repeat: no-repeat !important;
    background-position: 12px center !important;
    background-size: 18px 18px !important;
    filter: none !important;
    -webkit-filter: none !important;
}

/* --- Checkmark / ::before sulla .current nel dropdown utente --- */
html body .user-menu.user-menu .menu-dropdown.menu-dropdown .menu-contents.menu-contents li a.current.current::before,
html body .user-menu.user-menu li.linked.linked a.home.home.current.current::before {
    color: #f5f5f5 !important;
    -webkit-text-fill-color: #f5f5f5 !important;
    background-color: transparent !important;
    filter: none !important;
}

/* build-tag: MASSINI-v3.29-USERMENU-CURRENT-UNIFORMED-2026-04-22 */