/* ============================= BelRePP | bel-theme.css | v2 | 2026-09-17 =====================================================
   v2: modernizzazione del layout. Intestazione di pagina a 56px (64px su desktop) con titolo grande e icona in riquadro;
   #cntLista ridimensionato di conseguenza. Contenuti in una colonna centrata (max 1240px) con liste a schede su griglia (1
   colonna su mobile, piu' colonne su desktop): immobili, societa', progetti, utilita', documenti, Data Room e sezioni di
   dettaglio. Contatori come pillole a destra. Scheda immobile in riquadro con righe separate e riga vuota nascosta. Su desktop
   (da 1024px) il menu inferiore diventa menu laterale; notifica chat in alto a destra. Calendario: altezza dello Scheduler
   adeguata alla nuova intestazione.
   v1: tema grafico sul modello di elisapwa.css, token --bel-* con html[data-bel-theme="bel-darkbase"] (default) e
   "bel-lightbase". Shell, liste, dettaglio immobile, form Bootstrap, login, jBox, DevExtreme 22.1 (SelectBox, DateBox,
   Scheduler, dialog, notify), contenitori con sfondo bianco inline. Font Inter variabile gia' presente in /fonts.
   ========================================================================================================================== */

/* ---------------------------------------------------------------------------------------------------------------------------
   FONT - Inter variabile gia' presente in /fonts (nessuna installazione sul server)
   --------------------------------------------------------------------------------------------------------------------------- */
@font-face {
 font-family: "BelSans";
 src: url("/fonts/Inter-upright.var.woff2") format("woff2");
 font-weight: 100 900;
 font-style: normal;
 font-display: swap;
}

/* ---------------------------------------------------------------------------------------------------------------------------
   TEMI UFFICIALI - bel-darkbase (default) / bel-lightbase
   --------------------------------------------------------------------------------------------------------------------------- */
:root,
html[data-bel-theme="bel-darkbase"] {
 /* BASE */
 --bel-bg-app: #0A1017;
 --bel-bg-main: #0F1620;
 --bel-bg-panel: #151E2A;
 --bel-bg-raised: #1B2635;
 --bel-bg-hover: #202D3E;
 --bel-bg-pressed: #263549;
 --bel-chrome: #0C131C;
 --bel-chrome-text: #E9EEF5;
 --bel-chrome-muted: #8A97A9;

 /* BORDI */
 --bel-border-soft: #1F2A38;
 --bel-border-medium: #2C3A4D;
 --bel-border-strong: #3B4C63;

 /* ACCENTO (blu del logo BEL) */
 --bel-accent: #5B9BFF;
 --bel-accent-strong: #3A7BEA;
 --bel-accent-hover: #7AAEFF;
 --bel-accent-soft: rgba(91, 155, 255, 0.14);
 --bel-accent-line: rgba(91, 155, 255, 0.40);
 --bel-on-accent: #FFFFFF;

 /* TESTI */
 --bel-text-main: #E6EBF2;
 --bel-text-secondary: #A5B1C2;
 --bel-text-muted: #6E7C8F;
 --bel-text-disabled: #4F5B6B;

 /* STATI */
 --bel-success: #3FCB7E;
 --bel-warning: #F2C14E;
 --bel-danger: #F06A6A;

 /* CHAT */
 --bel-bubble-in: #1B2635;
 --bel-bubble-in-text: #E6EBF2;
 --bel-bubble-out: #2F6FDB;
 --bel-bubble-out-text: #FFFFFF;

 /* OMBRE / OVERLAY / FOCUS */
 --bel-overlay: rgba(4, 8, 13, 0.62);
 --bel-shadow-soft: 0 1px 2px rgba(0, 0, 0, 0.30), 0 4px 12px rgba(0, 0, 0, 0.25);
 --bel-shadow-pop: 0 8px 28px rgba(0, 0, 0, 0.45), 0 2px 6px rgba(0, 0, 0, 0.30);
 --bel-focus-ring: 0 0 0 3px rgba(91, 155, 255, 0.35);
 --bel-scroll-thumb: #34445A;
 --bel-logo-filter: none;
 --bel-shadow-card: 0 1px 0 rgba(255, 255, 255, 0.03) inset, 0 1px 2px rgba(0, 0, 0, 0.25);
}

html[data-bel-theme="bel-lightbase"] {
 /* BASE */
 --bel-bg-app: #E9EDF2;
 --bel-bg-main: #F5F7FA;
 --bel-bg-panel: #FFFFFF;
 --bel-bg-raised: #FFFFFF;
 --bel-bg-hover: #EDF2F8;
 --bel-bg-pressed: #E2E9F2;
 --bel-chrome: #FFFFFF;
 --bel-chrome-text: #142033;
 --bel-chrome-muted: #66748A;

 /* BORDI */
 --bel-border-soft: #E2E7EE;
 --bel-border-medium: #CDD5E0;
 --bel-border-strong: #AEB9C8;

 /* ACCENTO */
 --bel-accent: #1E5FD6;
 --bel-accent-strong: #1E5FD6;
 --bel-accent-hover: #174CB0;
 --bel-accent-soft: rgba(30, 95, 214, 0.10);
 --bel-accent-line: rgba(30, 95, 214, 0.35);
 --bel-on-accent: #FFFFFF;

 /* TESTI */
 --bel-text-main: #142033;
 --bel-text-secondary: #4B5A6F;
 --bel-text-muted: #7B8799;
 --bel-text-disabled: #A7B0BD;

 /* STATI */
 --bel-success: #17864B;
 --bel-warning: #B7800B;
 --bel-danger: #D23C3C;

 /* CHAT */
 --bel-bubble-in: #FFFFFF;
 --bel-bubble-in-text: #142033;
 --bel-bubble-out: #1E5FD6;
 --bel-bubble-out-text: #FFFFFF;

 /* OMBRE / OVERLAY / FOCUS */
 --bel-overlay: rgba(20, 32, 51, 0.40);
 --bel-shadow-soft: 0 1px 2px rgba(20, 32, 51, 0.06), 0 4px 12px rgba(20, 32, 51, 0.06);
 --bel-shadow-pop: 0 10px 30px rgba(20, 32, 51, 0.16), 0 2px 6px rgba(20, 32, 51, 0.08);
 --bel-focus-ring: 0 0 0 3px rgba(30, 95, 214, 0.25);
 --bel-scroll-thumb: #C3CCD8;
 --bel-logo-filter: invert(1) hue-rotate(180deg) brightness(0.85);
 --bel-shadow-card: 0 1px 2px rgba(20, 32, 51, 0.05), 0 1px 1px rgba(20, 32, 51, 0.03);
}

/* ---------------------------------------------------------------------------------------------------------------------------
   GEOMETRIE DELLA SHELL
   --------------------------------------------------------------------------------------------------------------------------- */
:root {
 --bel-header-h: 50px;
 --bel-nav-h: 58px;
 --bel-section-h: 56px;
 --bel-rail-w: 236px;
 --bel-content-max: 1240px;
 --bel-gutter: 12px;
 --bel-radius-s: 8px;
 --bel-radius-m: 12px;
 --bel-radius-l: 18px;
 --bel-font: "BelSans", "Segoe UI", Roboto, Arial, sans-serif;
}

@media (min-width: 769px) {
 :root {
  --bel-nav-h: 52px;
  --bel-section-h: 64px;
  --bel-gutter: 24px;
 }
}

/* ---------------------------------------------------------------------------------------------------------------------------
   BASE
   --------------------------------------------------------------------------------------------------------------------------- */
html[data-bel-theme] body {
 font-family: var(--bel-font);
 color: var(--bel-text-main);
 background: var(--bel-bg-main);
 letter-spacing: -0.005em;
 font-feature-settings: "cv11", "ss01";
}

html[data-bel-theme] body.bgtrasp {
 background: transparent !important;
}

html[data-bel-theme] a {
 color: var(--bel-accent);
}

html[data-bel-theme] ::selection {
 background: var(--bel-accent-line);
}

html[data-bel-theme] :focus-visible {
 outline: none !important;
 box-shadow: var(--bel-focus-ring) !important;
 border-radius: var(--bel-radius-s);
}

html[data-bel-theme] .text-muted {
 color: var(--bel-text-muted) !important;
}

html[data-bel-theme] .text-primary {
 color: var(--bel-accent) !important;
}

html[data-bel-theme] h1, html[data-bel-theme] h2, html[data-bel-theme] h3,
html[data-bel-theme] h4, html[data-bel-theme] h5, html[data-bel-theme] h6 {
 color: var(--bel-text-main);
}

html[data-bel-theme] .ps__thumb-y,
html[data-bel-theme] .ps__thumb-x {
 background-color: var(--bel-scroll-thumb) !important;
}

html[data-bel-theme] .ps .ps__rail-y:hover,
html[data-bel-theme] .ps .ps__rail-y.ps--clicking,
html[data-bel-theme] .ps .ps__rail-x:hover {
 background-color: transparent !important;
}

@media (prefers-reduced-motion: reduce) {
 html[data-bel-theme] *,
 html[data-bel-theme] *::before,
 html[data-bel-theme] *::after {
  transition-duration: 0.01ms !important;
  animation-duration: 0.01ms !important;
 }
}

/* ---------------------------------------------------------------------------------------------------------------------------
   SHELL - sfondo, header, capsula dell'iframe
   --------------------------------------------------------------------------------------------------------------------------- */
html[data-bel-theme] body.belShell {
 background: var(--bel-bg-app);
}

html[data-bel-theme] #bgApp {
 background-color: var(--bel-bg-app) !important;
 background-position: center center !important;
}

html[data-bel-theme] .appHeader {
 top: 0;
 min-height: calc(var(--bel-header-h) + env(safe-area-inset-top));
 max-height: none;
 height: calc(var(--bel-header-h) + env(safe-area-inset-top));
 padding: env(safe-area-inset-top) 12px 0 12px;
 background: var(--bel-chrome);
 color: var(--bel-chrome-text);
 border-bottom: 1px solid var(--bel-border-soft);
 box-shadow: none;
 justify-content: space-between;
 gap: 12px;
}

html[data-bel-theme] .appHeader:before {
 background: var(--bel-chrome);
}

html[data-bel-theme] .appHeader .left,
html[data-bel-theme] .appHeader .right {
 position: relative;
 left: auto;
 right: auto;
 top: auto;
 height: var(--bel-header-h);
 display: flex;
 align-items: center;
 gap: 6px;
 flex: 0 0 auto;
}

html[data-bel-theme] .appHeader .left img {
 width: 40px;
 height: 40px;
 filter: var(--bel-logo-filter);
}

html[data-bel-theme] .appHeader .pageTitle {
 flex: 1 1 auto;
 min-width: 0;
 height: auto;
 margin: 0;
 padding: 0;
 font-family: var(--bel-font);
 font-size: 16px;
 font-weight: 600;
 letter-spacing: 0.01em;
 line-height: var(--bel-header-h);
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
 text-align: center;
 color: var(--bel-chrome-text);
}

html[data-bel-theme] .belIconBtn {
 width: 38px;
 height: 38px;
 border: 0;
 border-radius: 50%;
 background: transparent;
 color: var(--bel-chrome-muted);
 display: inline-flex;
 align-items: center;
 justify-content: center;
 font-size: 21px;
 padding: 0;
 cursor: pointer;
 transition: background-color 0.15s ease, color 0.15s ease;
}

html[data-bel-theme] .belIconBtn:hover {
 background: var(--bel-bg-hover);
 color: var(--bel-chrome-text);
}

html[data-bel-theme] .belIconBtn:active {
 background: var(--bel-bg-pressed);
}

html[data-bel-theme] .belIconBtn ion-icon {
 font-size: 21px;
 margin: 0;
 --ionicon-stroke-width: 36px;
}

html[data-bel-theme="bel-darkbase"] .belIconBtn .belThemeToDark,
html[data-bel-theme="bel-lightbase"] .belIconBtn .belThemeToLight {
 display: none;
}

html[data-bel-theme] .appHeader .imgThumb {
 width: 32px;
 min-width: 32px;
 max-width: 32px;
 height: 32px;
 margin: 0;
 border: 1px solid var(--bel-border-medium) !important;
 border-radius: 50%;
}

html[data-bel-theme] .appHeader .imgThumb img {
 width: 30px;
 height: 30px;
 object-fit: cover;
}

html[data-bel-theme] #cntCounter {
 display: none;
}

html[data-bel-theme] #appCapsule {
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 width: 100%;
 height: 100%;
 margin: 0;
 padding: calc(var(--bel-header-h) + env(safe-area-inset-top)) 0 calc(var(--bel-nav-h) + env(safe-area-inset-bottom)) 0;
}

html[data-bel-theme] #appCapsule .section.full {
 height: 100%;
}

html[data-bel-theme] #cntIfmApp {
 border: 0 !important;
 background: transparent;
}

html[data-bel-theme] #ifmApp {
 background: transparent;
}

/* ---------------------------------------------------------------------------------------------------------------------------
   SHELL - menu inferiore
   --------------------------------------------------------------------------------------------------------------------------- */
html[data-bel-theme] .appBottomMenu {
 min-height: calc(var(--bel-nav-h) + env(safe-area-inset-bottom));
 height: calc(var(--bel-nav-h) + env(safe-area-inset-bottom));
 padding: 0 4px env(safe-area-inset-bottom) 4px;
 background: var(--bel-chrome);
 border-top: 1px solid var(--bel-border-soft);
 box-shadow: none;
 justify-content: space-around;
}

html[data-bel-theme] .appBottomMenu .item {
 flex: 1 1 0;
 min-width: 0;
 height: var(--bel-nav-h);
 margin: 0 !important;
 color: var(--bel-text-muted);
 -webkit-tap-highlight-color: transparent;
}

html[data-bel-theme] .appBottomMenu .item:before {
 left: 50%;
 right: auto;
 width: 24px;
 height: 3px;
 margin-left: -12px;
 border-radius: 0 0 3px 3px;
 background: transparent;
 transition: background-color 0.15s ease;
}

html[data-bel-theme] .appBottomMenu .item.active:before {
 background: var(--bel-accent);
}

html[data-bel-theme] .appBottomMenu .item .col {
 position: relative;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center !important;
 gap: 4px;
 height: 100%;
 padding: 0;
}

html[data-bel-theme] .appBottomMenu .item ion-icon,
html[data-bel-theme] .appBottomMenu .item:hover ion-icon {
 display: block;
 margin: 0 !important;
 font-size: 23px;
 color: var(--bel-text-muted);
 --ionicon-stroke-width: 32px;
}

html[data-bel-theme] .appBottomMenu .item .btnTitle {
 display: block !important;
 max-width: 100%;
 padding: 0 !important;
 font-family: var(--bel-font) !important;
 font-size: 10px !important;
 font-weight: 550 !important;
 line-height: 1.1;
 letter-spacing: -0.01em;
 color: var(--bel-text-muted) !important;
 white-space: nowrap;
 overflow: visible;
}

html[data-bel-theme] .appBottomMenu .item.active ion-icon,
html[data-bel-theme] .appBottomMenu .item.active .btnTitle {
 color: var(--bel-accent) !important;
}

html[data-bel-theme] .appBottomMenu .item:active {
 opacity: 1;
 background: var(--bel-bg-hover);
}

html[data-bel-theme] .appBottomMenu .badge {
 position: absolute;
 top: 7px;
 left: 50%;
 right: auto;
 transform: translateX(4px);
 min-width: 17px;
 height: 17px;
 padding: 0 5px;
 border-radius: 9px;
 font-size: 10px;
 font-weight: 700;
 line-height: 17px;
 background: var(--bel-danger) !important;
 color: #FFFFFF !important;
 box-shadow: 0 0 0 2px var(--bel-chrome);
}

html[data-bel-theme] .appBottomMenu .badge:empty {
 display: none;
}

@media (min-width: 769px) {
 html[data-bel-theme] .appBottomMenu {
  padding-left: 16px;
  padding-right: 16px;
 }

 html[data-bel-theme] .appBottomMenu .item .col {
  flex-direction: row;
  gap: 8px;
 }

 html[data-bel-theme] .appBottomMenu .item ion-icon,
 html[data-bel-theme] .appBottomMenu .item:hover ion-icon {
  font-size: 21px;
 }

 html[data-bel-theme] .appBottomMenu .item .btnTitle {
  font-size: 13.5px !important;
  font-weight: 500 !important;
 }

 html[data-bel-theme] .appBottomMenu .item:hover .btnTitle,
 html[data-bel-theme] .appBottomMenu .item:hover ion-icon {
  color: var(--bel-text-main) !important;
 }

 html[data-bel-theme] .appBottomMenu .item.active:hover .btnTitle,
 html[data-bel-theme] .appBottomMenu .item.active:hover ion-icon {
  color: var(--bel-accent) !important;
 }

 html[data-bel-theme] .appBottomMenu .badge {
  top: 9px;
  left: 30px;
  transform: none;
 }
}

@media (max-width: 340px) {
 html[data-bel-theme] .appBottomMenu .item .btnTitle {
  display: none !important;
 }
}

/* ---------------------------------------------------------------------------------------------------------------------------
   SHELL - loader, notifica nuovo messaggio, anteprima documenti, dialog DevExtreme
   --------------------------------------------------------------------------------------------------------------------------- */
html[data-bel-theme] #loader {
 background: var(--bel-bg-main);
}

html[data-bel-theme] #loader .spinner-border {
 color: var(--bel-accent) !important;
 width: 2.2rem;
 height: 2.2rem;
 border-width: 0.18em;
}

html[data-bel-theme] .notification-box {
 padding: calc(env(safe-area-inset-top) + 8px) 10px 0 10px;
 margin-top: 0 !important;
}

html[data-bel-theme] .notification-dialog.android-style {
 max-width: 460px;
 margin: 0 auto;
 background: var(--bel-bg-raised);
 color: var(--bel-text-main);
 border: 1px solid var(--bel-border-medium);
 border-radius: var(--bel-radius-m);
 box-shadow: var(--bel-shadow-pop);
}

html[data-bel-theme] .notification-dialog .notification-header {
 color: var(--bel-text-secondary);
 border-bottom-color: var(--bel-border-soft);
}

html[data-bel-theme] .notification-dialog.android-style .notification-header .in strong {
 color: var(--bel-text-main);
 font-weight: 600;
}

html[data-bel-theme] .notification-dialog.android-style .notification-header .close-button {
 color: var(--bel-text-muted);
}

html[data-bel-theme] .notification-dialog .notification-content {
 color: var(--bel-text-secondary);
}

html[data-bel-theme] .notification-thumb {
 border: 1px solid var(--bel-border-medium) !important;
}

html[data-bel-theme] #cntPrev {
 background-color: var(--bel-bg-panel) !important;
 border: 1px solid var(--bel-border-medium) !important;
 box-shadow: var(--bel-shadow-pop) !important;
}

html[data-bel-theme] #prevHeader {
 background-color: var(--bel-chrome) !important;
 border-bottom: 1px solid var(--bel-border-soft);
}

html[data-bel-theme] #prevHeader img {
 filter: var(--bel-logo-filter);
}

html[data-bel-theme] #prevTitle {
 color: var(--bel-chrome-text) !important;
 font-family: var(--bel-font) !important;
 font-size: 15px !important;
 font-weight: 500 !important;
}

html[data-bel-theme] #cntExit a,
html[data-bel-theme] #cntOpen a,
html[data-bel-theme] #cntDelete a {
 color: var(--bel-accent);
}

html[data-bel-theme] #cntPrevDoc {
 background-color: var(--bel-bg-main);
}

html[data-bel-theme] .dx-popup-title.dx-toolbar {
 background-color: var(--bel-chrome) !important;
 color: var(--bel-chrome-text) !important;
 font-family: var(--bel-font) !important;
 font-weight: 600 !important;
 border-bottom: 1px solid var(--bel-border-soft);
}

/* ---------------------------------------------------------------------------------------------------------------------------
   PAGINE - contenitori con sfondo bianco scritto inline
   --------------------------------------------------------------------------------------------------------------------------- */
html[data-bel-theme] #mainCnt,
html[data-bel-theme] #cntLista {
 background-color: var(--bel-bg-main) !important;
}

html[data-bel-theme] #mainCnt [style*="background-color: white"],
html[data-bel-theme] #mainCnt [style*="background-color:white"],
html[data-bel-theme] #cntFramePrev {
 background-color: var(--bel-bg-main) !important;
}

html[data-bel-theme] #mainCnt [style*="color:#404040"],
html[data-bel-theme] #mainCnt [style*="color: #404040"],
html[data-bel-theme] #mainCnt [style*="color:#333"] {
 color: var(--bel-text-main) !important;
}

html[data-bel-theme] #mainCnt [style*="color:#1E74FD"],
html[data-bel-theme] #mainCnt [style*="color: #1E74FD"],
html[data-bel-theme] #mainCnt [style*="color:rgb(30, 116, 253)"] {
 color: var(--bel-accent) !important;
}

html[data-bel-theme] #mainCnt [style*="color:#8b98a5"] {
 color: var(--bel-text-muted) !important;
}

html[data-bel-theme] #mainCnt [style*="border-bottom: 1px solid #E1E1E1"] {
 border-bottom-color: var(--bel-border-soft) !important;
}

/* ---------------------------------------------------------------------------------------------------------------------------
   PAGINE - intestazione di pagina (titolo grande, icona in riquadro, allineata alla colonna dei contenuti)
   --------------------------------------------------------------------------------------------------------------------------- */
html[data-bel-theme] .fillHeader1 {
 position: relative;
 height: var(--bel-section-h) !important;
 padding: 0 var(--bel-gutter) !important;
 display: flex;
 align-items: center;
 overflow: visible;
 background-color: var(--bel-bg-main) !important;
 border-bottom: 1px solid var(--bel-border-soft);
 box-shadow: none;
}

html[data-bel-theme] .fillHeader1 .title {
 width: 100%;
 max-width: var(--bel-content-max);
 margin: 0 auto !important;
 padding: 0 !important;
 font-family: var(--bel-font);
 font-size: 19px !important;
 font-weight: 650 !important;
 letter-spacing: -0.015em;
 line-height: var(--bel-section-h);
 color: var(--bel-text-main) !important;
 white-space: nowrap;
}

html[data-bel-theme] .fillHeader1 .title > div,
html[data-bel-theme] .fillHeader1 #titoloSezione,
html[data-bel-theme] .fillHeader1 #prjTitle {
 align-items: center;
 margin-top: 0 !important;
 font-size: 19px !important;
 font-weight: 650 !important;
 min-width: 0;
}

html[data-bel-theme] .fillHeader1 .title > div > div {
 margin-top: 0 !important;
 line-height: 1.2;
 min-width: 0;
 overflow: hidden;
 text-overflow: ellipsis;
}

html[data-bel-theme] .fillHeader1 .title > div > div:first-child {
 display: flex;
 align-items: center;
 justify-content: center;
 flex: 0 0 auto;
 width: 36px !important;
 height: 36px;
 margin-right: 12px;
 border-radius: var(--bel-radius-m);
 background: var(--bel-accent-soft);
 font-size: 19px !important;
 color: var(--bel-accent) !important;
 overflow: visible;
}

html[data-bel-theme] .fillHeader1 [style*="color:white"],
html[data-bel-theme] .fillHeader1 [style*="color: white"] {
 color: var(--bel-text-main) !important;
}

html[data-bel-theme] .fillHeader1 .clipped {
 font-size: 19px !important;
 font-weight: 650 !important;
}

html[data-bel-theme] .fillHeader1 #imgFiltro {
 color: var(--bel-text-secondary) !important;
 margin-top: 0 !important;
 top: calc(var(--bel-section-h) / 2 - 9px);
 right: var(--bel-gutter) !important;
}

html[data-bel-theme] #cntFiltro {
 background-color: var(--bel-bg-raised) !important;
 border: 1px solid var(--bel-border-medium) !important;
 border-radius: var(--bel-radius-s) !important;
 box-shadow: var(--bel-shadow-pop);
 top: calc(var(--bel-section-h) - 4px) !important;
 right: var(--bel-gutter) !important;
}

html[data-bel-theme] #txtFiltro {
 color: var(--bel-text-main) !important;
 width: calc(100% - 16px);
 left: 8px;
}

html[data-bel-theme] #tCounter {
 color: var(--bel-text-muted) !important;
 right: var(--bel-gutter) !important;
 top: 0 !important;
 font-size: 13px !important;
 font-weight: 500;
 line-height: var(--bel-section-h);
}

@media (min-width: 769px) {
 html[data-bel-theme] .fillHeader1 .title,
 html[data-bel-theme] .fillHeader1 .title > div,
 html[data-bel-theme] .fillHeader1 #titoloSezione,
 html[data-bel-theme] .fillHeader1 #prjTitle,
 html[data-bel-theme] .fillHeader1 .clipped {
  font-size: 22px !important;
 }

 html[data-bel-theme] .fillHeader1 .title > div > div:first-child {
  width: 40px !important;
  height: 40px;
  font-size: 21px !important;
 }
}

/* ---------------------------------------------------------------------------------------------------------------------------
   PAGINE - liste (Mobilekit listview + sidebar dashboard)
   --------------------------------------------------------------------------------------------------------------------------- */
html[data-bel-theme] .listview {
 color: var(--bel-text-main);
 background: transparent;
 border-color: var(--bel-border-soft);
}

html[data-bel-theme] .listview > li:after {
 background: var(--bel-border-soft);
 left: 70px;
 right: 0;
}

html[data-bel-theme] .image-listview > li {
 padding-top: 0;
 padding-bottom: 0;
}

html[data-bel-theme] .image-listview > li .item {
 min-height: 60px;
 padding: 10px 44px 10px 16px;
}

html[data-bel-theme] .image-listview > li a.item,
html[data-bel-theme] .image-listview > li .item .in {
 color: var(--bel-text-main) !important;
 font-size: 15px;
 font-weight: 550;
}

html[data-bel-theme] .image-listview > li a.item {
 transition: background-color 0.12s ease;
 cursor: pointer;
}

html[data-bel-theme] .image-listview > li a.item:active {
 background: var(--bel-bg-pressed);
}

@media (hover: hover) {
 html[data-bel-theme] .image-listview > li a.item:hover {
  background: var(--bel-bg-hover);
 }
}

html[data-bel-theme] .image-listview > li .item .icon-box,
html[data-bel-theme] .image-listview > li .item .icon-box.bg-primary {
 min-width: 38px;
 max-width: 38px;
 width: 38px;
 height: 38px;
 border-radius: var(--bel-radius-m);
 margin-right: 16px;
 font-size: 19px;
 background: var(--bel-accent-soft) !important;
 color: var(--bel-accent) !important;
 box-shadow: inset 0 0 0 1px var(--bel-accent-line);
}

html[data-bel-theme] .image-listview > li .item .icon-box ion-icon {
 --ionicon-stroke-width: 36px;
}

html[data-bel-theme] .image-listview > li .item .image {
 border: 1px solid var(--bel-border-medium);
}

html[data-bel-theme] .sidebar [data-toggle="collapse"]:after {
 border-color: var(--bel-text-muted) !important;
 opacity: 0.8;
}

html[data-bel-theme] .sidebar-dropdown,
html[data-bel-theme] .sidebar-dropdown .sidebar-link {
 background: transparent !important;
 color: var(--bel-text-main) !important;
}

html[data-bel-theme] .sidebar-dropdown > li a.item {
 min-height: 48px;
 font-size: 14px;
 font-weight: 450;
}

html[data-bel-theme] .sidebar-dropdown > li:after {
 display: none;
}

html[data-bel-theme] .list-group-item {
 background: transparent;
 color: var(--bel-text-main);
 border-color: var(--bel-border-soft);
}

html[data-bel-theme] .baseLevFileIcon {
 color: var(--bel-accent) !important;
}

html[data-bel-theme] .badgeFiles,
html[data-bel-theme] .badgeChat {
 background: var(--bel-accent-strong) !important;
 color: var(--bel-on-accent) !important;
 box-shadow: 0 0 0 2px var(--bel-bg-main);
 font-weight: 700;
}

html[data-bel-theme] .badge-danger {
 background: var(--bel-danger) !important;
 color: #FFFFFF !important;
}

/* ---------------------------------------------------------------------------------------------------------------------------
   DETTAGLIO IMMOBILE - scheda, popup caricamento documento
   --------------------------------------------------------------------------------------------------------------------------- */
html[data-bel-theme] #cntDesc .txtTitle,
html[data-bel-theme] #cntDesc .txtTitle .clipped4 {
 color: var(--bel-text-main) !important;
 font-family: var(--bel-font) !important;
 font-weight: 500;
}

html[data-bel-theme] #cntDesc .iconTitle {
 color: var(--bel-accent) !important;
}

html[data-bel-theme] #imgImmobile {
 border: 1px solid var(--bel-border-medium) !important;
 border-radius: var(--bel-radius-m) !important;
 background: #FFFFFF;
}

html[data-bel-theme] .bgPopUp {
 background-color: var(--bel-overlay) !important;
 -webkit-backdrop-filter: blur(3px);
 backdrop-filter: blur(3px);
}

html[data-bel-theme] .popUpElements {
 background: var(--bel-bg-panel) !important;
 border: 1px solid var(--bel-border-medium) !important;
 border-radius: var(--bel-radius-l) !important;
 box-shadow: var(--bel-shadow-pop);
 overflow: hidden;
}

html[data-bel-theme] #popupHeader {
 height: 44px !important;
 align-items: center;
 padding: 0 8px;
 background-color: var(--bel-chrome) !important;
 border-bottom: 1px solid var(--bel-border-soft);
}

html[data-bel-theme] .popUpHeaderText {
 color: var(--bel-text-main) !important;
 font-family: var(--bel-font) !important;
 font-size: 15px !important;
 font-weight: 600 !important;
 line-height: 44px !important;
 height: 44px !important;
}

html[data-bel-theme] #cntForm label,
html[data-bel-theme] .popUpElements label {
 color: var(--bel-text-secondary) !important;
 font-weight: 500;
 line-height: 1.4 !important;
 margin-bottom: 4px;
}

html[data-bel-theme] #txtFileToUp {
 background-color: var(--bel-bg-raised) !important;
 color: var(--bel-text-main) !important;
}

html[data-bel-theme] input[type="file"]::-webkit-file-upload-button {
 background: var(--bel-bg-hover) !important;
 color: var(--bel-text-main);
 border: 1px solid var(--bel-border-medium) !important;
}

html[data-bel-theme] #cntPrevMsg {
 border: 1px solid var(--bel-border-medium) !important;
}

/* ---------------------------------------------------------------------------------------------------------------------------
   FORM E BOTTONI (Bootstrap)
   --------------------------------------------------------------------------------------------------------------------------- */
html[data-bel-theme] .form-control,
html[data-bel-theme] .form-select {
 background-color: var(--bel-bg-raised);
 color: var(--bel-text-main);
 border: 1px solid var(--bel-border-medium);
 border-radius: var(--bel-radius-s);
 min-height: 40px;
 font-size: 15px;
}

html[data-bel-theme] .form-control::placeholder {
 color: var(--bel-text-muted);
 opacity: 1;
}

html[data-bel-theme] .form-control:focus,
html[data-bel-theme] .form-select:focus {
 background-color: var(--bel-bg-raised);
 color: var(--bel-text-main);
 border-color: var(--bel-accent) !important;
 box-shadow: var(--bel-focus-ring) !important;
}

html[data-bel-theme] .form-control:disabled,
html[data-bel-theme] .form-control[readonly] {
 background-color: var(--bel-bg-hover) !important;
 color: var(--bel-text-secondary);
}

html[data-bel-theme] .input-group .btn {
 min-height: 40px;
}

html[data-bel-theme] .btn {
 border-radius: var(--bel-radius-s);
 font-weight: 600;
}

html[data-bel-theme] .btn-primary {
 background-color: var(--bel-accent-strong) !important;
 border-color: var(--bel-accent-strong) !important;
 color: var(--bel-on-accent) !important;
}

html[data-bel-theme] .btn-primary:hover,
html[data-bel-theme] .btn-primary:active {
 background-color: var(--bel-accent-hover) !important;
 border-color: var(--bel-accent-hover) !important;
}

html[data-bel-theme] .btn-outline-primary {
 color: var(--bel-accent) !important;
 border-color: var(--bel-accent-line) !important;
 background: transparent !important;
}

html[data-bel-theme] .btn-outline-primary:hover,
html[data-bel-theme] .btn-outline-primary:active {
 background: var(--bel-accent-soft) !important;
 border-color: var(--bel-accent) !important;
}

html[data-bel-theme] .form-check-input {
 background-color: var(--bel-bg-raised);
 border-color: var(--bel-border-strong);
}

html[data-bel-theme] .form-check-input:checked {
 background-color: var(--bel-accent-strong);
 border-color: var(--bel-accent-strong);
}

html[data-bel-theme] .card {
 background: var(--bel-bg-panel);
 color: var(--bel-text-main);
 border-color: var(--bel-border-soft);
}

/* ---------------------------------------------------------------------------------------------------------------------------
   LOGIN / RECUPERO PASSWORD / ADMIN (pagine trasparenti sopra l'immagine della shell)
   --------------------------------------------------------------------------------------------------------------------------- */
html[data-bel-theme] body.bgtrasp .center {
 width: min(340px, calc(100% - 32px));
 padding: 28px 24px 22px 24px;
 background-color: color-mix(in srgb, var(--bel-bg-panel) 92%, transparent);
 border: 1px solid var(--bel-border-medium);
 border-radius: var(--bel-radius-l);
 box-shadow: var(--bel-shadow-pop);
 color: var(--bel-text-main);
 font-family: var(--bel-font);
 -webkit-backdrop-filter: blur(14px);
 backdrop-filter: blur(14px);
}

html[data-bel-theme] body.bgtrasp .center > div {
 width: 100% !important;
 min-width: 0 !important;
 max-width: none !important;
}

html[data-bel-theme] body.bgtrasp .center h2 {
 font-size: 22px;
 font-weight: 650;
 letter-spacing: -0.01em;
 margin-bottom: 10px;
}

html[data-bel-theme] body.bgtrasp .center label {
 color: var(--bel-text-secondary);
 font-size: 13px;
 font-weight: 500;
 margin-bottom: 4px;
}

html[data-bel-theme] body.bgtrasp .center .btn {
 min-height: 42px;
 margin-top: 6px;
}

html[data-bel-theme] body.bgtrasp .center .btn-outline-primary {
 background: var(--bel-accent-strong) !important;
 border-color: var(--bel-accent-strong) !important;
 color: var(--bel-on-accent) !important;
}

html[data-bel-theme] body.bgtrasp .center span {
 color: var(--bel-text-secondary);
 font-size: 13px;
}

html[data-bel-theme] .loginlink,
html[data-bel-theme] .subMenuTitle {
 color: var(--bel-accent) !important;
 font-size: 13px;
 font-weight: 600;
}

html[data-bel-theme] .mssg.bg-danger {
 background: transparent !important;
 color: var(--bel-danger);
 font-size: 13px;
 margin-top: 8px;
}

html[data-bel-theme] .mssg.bg-danger span {
 color: var(--bel-danger) !important;
}

/* ---------------------------------------------------------------------------------------------------------------------------
   JBOX
   --------------------------------------------------------------------------------------------------------------------------- */
html[data-bel-theme] .jBox-container {
 background: var(--bel-bg-panel) !important;
 color: var(--bel-text-main) !important;
 border: 1px solid var(--bel-border-medium);
 border-radius: var(--bel-radius-m) !important;
 box-shadow: var(--bel-shadow-pop) !important;
}

html[data-bel-theme] .jBox-title,
html[data-bel-theme] #popupadmin .jBox-title.jBox-draggable,
html[data-bel-theme] #popupadminerror .jBox-title.jBox-draggable {
 background: var(--bel-chrome) !important;
 color: var(--bel-text-main) !important;
 border-bottom: 1px solid var(--bel-border-soft) !important;
}

html[data-bel-theme] .jBox-closeButton svg {
 fill: var(--bel-text-muted) !important;
}

html[data-bel-theme] .jBox-pointer:after {
 background: var(--bel-bg-panel) !important;
}

html[data-bel-theme] .jBox-overlay {
 background-color: var(--bel-overlay) !important;
}

/* ---------------------------------------------------------------------------------------------------------------------------
   DEVEXTREME 22.1 - tema scuro solo sui componenti usati: SelectBox, DateBox/Calendar, Scheduler, dialog, notify
   --------------------------------------------------------------------------------------------------------------------------- */
html[data-bel-theme] .dx-widget,
html[data-bel-theme] .dx-theme-generic-typography {
 font-family: var(--bel-font) !important;
}

html[data-bel-theme="bel-darkbase"] .dx-widget {
 color: var(--bel-text-main);
}

html[data-bel-theme="bel-darkbase"] .dx-texteditor.dx-editor-outlined {
 background: var(--bel-bg-raised);
 border-color: var(--bel-border-medium);
 border-radius: var(--bel-radius-s);
}

html[data-bel-theme="bel-darkbase"] .dx-texteditor.dx-state-hover.dx-editor-outlined {
 border-color: var(--bel-border-strong);
}

html[data-bel-theme="bel-darkbase"] .dx-texteditor.dx-state-focused.dx-editor-outlined,
html[data-bel-theme="bel-darkbase"] .dx-texteditor.dx-state-active.dx-editor-outlined {
 border-color: var(--bel-accent);
}

html[data-bel-theme="bel-darkbase"] .dx-texteditor-input {
 color: var(--bel-text-main);
 background: transparent;
}

html[data-bel-theme="bel-darkbase"] .dx-placeholder,
html[data-bel-theme="bel-darkbase"] .dx-placeholder::before {
 color: var(--bel-text-muted);
}

html[data-bel-theme="bel-darkbase"] .dx-dropdowneditor-button .dx-button-content,
html[data-bel-theme="bel-darkbase"] .dx-dropdowneditor-icon,
html[data-bel-theme="bel-darkbase"] .dx-dropdowneditor.dx-state-hover .dx-dropdowneditor-icon,
html[data-bel-theme="bel-darkbase"] .dx-dropdowneditor.dx-state-active .dx-dropdowneditor-icon,
html[data-bel-theme="bel-darkbase"] .dx-dropdowneditor.dx-dropdowneditor-active .dx-dropdowneditor-icon {
 background: transparent !important;
 color: var(--bel-text-secondary) !important;
}

html[data-bel-theme="bel-darkbase"] .dx-overlay-content,
html[data-bel-theme="bel-darkbase"] .dx-popup-content,
html[data-bel-theme="bel-darkbase"] .dx-popup-normal {
 background: var(--bel-bg-panel);
 color: var(--bel-text-main);
 border-color: var(--bel-border-medium);
}

html[data-bel-theme="bel-darkbase"] .dx-popup-normal {
 border-radius: var(--bel-radius-m);
 box-shadow: var(--bel-shadow-pop);
}

html[data-bel-theme="bel-darkbase"] .dx-overlay-shader {
 background-color: var(--bel-overlay);
}

html[data-bel-theme="bel-darkbase"] .dx-popup-bottom.dx-toolbar,
html[data-bel-theme="bel-darkbase"] .dx-toolbar {
 background: transparent;
 color: var(--bel-text-main);
}

html[data-bel-theme="bel-darkbase"] .dx-dialog-message {
 color: var(--bel-text-main);
}

html[data-bel-theme="bel-darkbase"] .dx-list-item {
 color: var(--bel-text-main);
 border-top-color: var(--bel-border-soft) !important;
}

html[data-bel-theme="bel-darkbase"] .dx-list-item.dx-state-hover {
 background-color: var(--bel-bg-hover) !important;
 color: var(--bel-text-main) !important;
}

html[data-bel-theme="bel-darkbase"] .dx-list-item.dx-state-focused,
html[data-bel-theme="bel-darkbase"] .dx-list-item.dx-list-item-selected {
 background-color: var(--bel-accent-soft) !important;
 color: var(--bel-text-main) !important;
}

html[data-bel-theme="bel-darkbase"] .dx-button-mode-contained.dx-button-normal,
html[data-bel-theme="bel-darkbase"] .dx-button-mode-outlined.dx-button-normal {
 background-color: var(--bel-bg-raised);
 border-color: var(--bel-border-medium);
 color: var(--bel-text-main);
}

html[data-bel-theme="bel-darkbase"] .dx-button-mode-contained.dx-button-normal.dx-state-hover,
html[data-bel-theme="bel-darkbase"] .dx-button-mode-outlined.dx-button-normal.dx-state-hover {
 background-color: var(--bel-bg-hover);
}

html[data-bel-theme="bel-darkbase"] .dx-button-mode-contained.dx-button-default {
 background-color: var(--bel-accent-strong);
 border-color: var(--bel-accent-strong);
}

html[data-bel-theme="bel-darkbase"] .dx-button-mode-text.dx-button-normal,
html[data-bel-theme="bel-darkbase"] .dx-button .dx-icon,
html[data-bel-theme="bel-darkbase"] .dx-button-normal .dx-icon {
 color: var(--bel-text-main);
}

html[data-bel-theme="bel-darkbase"] .dx-button-mode-contained.dx-item-selected,
html[data-bel-theme="bel-darkbase"] .dx-buttongroup-item.dx-item-selected {
 background-color: var(--bel-accent-soft) !important;
 color: var(--bel-accent) !important;
}

html[data-bel-theme="bel-darkbase"] .dx-calendar {
 background: var(--bel-bg-panel);
}

html[data-bel-theme="bel-darkbase"] .dx-calendar-cell {
 color: var(--bel-text-main);
}

html[data-bel-theme="bel-darkbase"] .dx-calendar-cell.dx-calendar-other-view,
html[data-bel-theme="bel-darkbase"] .dx-calendar-cell.dx-calendar-empty-cell,
html[data-bel-theme="bel-darkbase"] .dx-calendar-body thead th {
 color: var(--bel-text-muted);
 box-shadow: none;
}

html[data-bel-theme="bel-darkbase"] .dx-calendar-cell.dx-state-hover span {
 background-color: var(--bel-bg-hover);
 color: var(--bel-text-main);
}

html[data-bel-theme="bel-darkbase"] .dx-calendar-cell.dx-calendar-selected-date span,
html[data-bel-theme="bel-darkbase"] .dx-calendar-cell.dx-calendar-selected-date.dx-calendar-today span {
 background-color: var(--bel-accent-strong);
 color: var(--bel-on-accent);
}

html[data-bel-theme="bel-darkbase"] .dx-calendar-navigator .dx-button,
html[data-bel-theme="bel-darkbase"] .dx-calendar-navigator .dx-button.dx-calendar-disabled-navigator-link {
 background: var(--bel-bg-raised);
 border-color: var(--bel-border-medium);
}

html[data-bel-theme="bel-darkbase"] .dx-calendar-navigator .dx-button .dx-icon,
html[data-bel-theme="bel-darkbase"] .dx-calendar-navigator .dx-calendar-caption-button .dx-button-text {
 color: var(--bel-text-main);
}

html[data-bel-theme="bel-darkbase"] .dx-scheduler-header,
html[data-bel-theme="bel-darkbase"] .dx-scheduler-work-space,
html[data-bel-theme="bel-darkbase"] .dx-scheduler-date-table-scrollable,
html[data-bel-theme="bel-darkbase"] .dx-scheduler-agenda .dx-scheduler-time-panel {
 background-color: var(--bel-bg-main) !important;
 border-color: var(--bel-border-soft) !important;
}

html[data-bel-theme="bel-darkbase"] .dx-scheduler-header {
 background-color: var(--bel-bg-panel) !important;
}

html[data-bel-theme="bel-darkbase"] .dx-scheduler-time-panel-cell,
html[data-bel-theme="bel-darkbase"] .dx-scheduler-date-table-cell,
html[data-bel-theme="bel-darkbase"] .dx-scheduler-header-panel-cell,
html[data-bel-theme="bel-darkbase"] .dx-scheduler-group-header,
html[data-bel-theme="bel-darkbase"] .dx-scheduler-agenda .dx-scheduler-time-panel-cell {
 border-color: var(--bel-border-soft) !important;
 color: var(--bel-text-secondary) !important;
}

html[data-bel-theme="bel-darkbase"] .dx-scheduler-agenda .dx-scheduler-appointment {
 background-color: var(--bel-bg-panel) !important;
 color: var(--bel-text-main) !important;
 box-shadow: inset 0 0 0 1px var(--bel-border-medium) !important;
 border-radius: var(--bel-radius-m);
}

html[data-bel-theme="bel-darkbase"] .dx-scheduler-appointment-content,
html[data-bel-theme="bel-darkbase"] .dx-scheduler-appointment-content-details {
 color: inherit;
}

html[data-bel-theme="bel-darkbase"] .dx-scheduler-agenda-nodata {
 color: var(--bel-text-muted);
}

html[data-bel-theme] .dx-button-has-text .dx-button-content {
 color: var(--bel-accent) !important;
 font-family: var(--bel-font) !important;
}

html[data-bel-theme="bel-darkbase"] .dx-scrollable-scroll-content {
 background-color: var(--bel-scroll-thumb);
}

/* ---------------------------------------------------------------------------------------------------------------------------
   LAYOUT - colonna dei contenuti centrata, liste a schede, scheda immobile, menu laterale su desktop
   --------------------------------------------------------------------------------------------------------------------------- */
html[data-bel-theme] #cntLista {
 height: calc(100% - var(--bel-section-h)) !important;
 padding: var(--bel-gutter) var(--bel-gutter) 96px var(--bel-gutter) !important;
}

html[data-bel-theme] body.dx-viewport #cntLista {
 padding: 0 !important;
}

html[data-bel-theme] body.dx-viewport .dx-scheduler-work-space {
 height: calc(100vh - var(--bel-section-h) - 50px) !important;
}

html[data-bel-theme] #cntLista > .wrapper {
 max-width: var(--bel-content-max);
 margin: 0 auto;
}

html[data-bel-theme] :is(#mainUl, #ulSocieta, #ulUtilita, #ulProgetti, #ulDocs, #lstDataRoom),
html[data-bel-theme] #cntLista .sidebar-content > ul.listview {
 display: grid;
 grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
 align-items: start;
 gap: 10px;
 width: 100%;
 max-width: var(--bel-content-max);
 margin: 0 auto !important;
 padding: 0;
 border: 0;
}

html[data-bel-theme] :is(#mainUl, #ulSocieta, #ulUtilita, #ulProgetti, #ulDocs, #lstDataRoom) > li,
html[data-bel-theme] #cntLista .sidebar-content > ul.listview > li {
 min-height: 0 !important;
 margin: 0 !important;
 padding: 0 !important;
 background: var(--bel-bg-panel);
 border: 1px solid var(--bel-border-soft);
 border-radius: 14px;
 box-shadow: var(--bel-shadow-card);
 overflow: hidden;
 transition: border-color 0.15s ease;
}

html[data-bel-theme] :is(#mainUl, #ulSocieta, #ulUtilita, #ulProgetti, #ulDocs, #lstDataRoom) > li:after,
html[data-bel-theme] #cntLista .sidebar-content > ul.listview > li:after {
 display: none;
}

html[data-bel-theme] :is(#mainUl, #ulUtilita, #lstDataRoom) > li:has(> a.item:not(.collapsed)[data-toggle]),
html[data-bel-theme] #cntLista .sidebar-content > ul.listview > li:has(a.item:not(.collapsed)[data-toggle]),
html[data-bel-theme] #lstDataRoom > li:has(> ul[style*="block"]) {
 border-color: var(--bel-accent-line);
}

html[data-bel-theme] :is(#mainUl, #ulUtilita, #lstDataRoom) > li > ul,
html[data-bel-theme] #cntLista .sidebar-content > ul.listview > li ul.sidebar-dropdown {
 margin: 0 !important;
 padding: 6px 0 8px 0 !important;
 border-top: 1px solid var(--bel-border-soft);
}

html[data-bel-theme] .sidebar-dropdown > li.noBgImg6 {
 margin-left: 0 !important;
}

html[data-bel-theme] .sidebar-dropdown > li > a.item {
 min-height: 46px;
 padding: 8px 16px 8px 20px;
}

html[data-bel-theme] .sidebar-dropdown > li > a.item > div[style*="width:36px"] {
 margin-top: 0 !important;
 display: flex;
 align-items: center;
}

html[data-bel-theme] .sidebar-dropdown > li > a.item .baseLevFileIcon {
 font-size: 20px;
}

html[data-bel-theme] .sidebar-dropdown .in[style*="font-size:13px"] {
 font-size: 14px !important;
 font-weight: 500 !important;
}

html[data-bel-theme] .image-listview div[id^="badge"] {
 top: 30px !important;
 left: auto !important;
 right: 44px !important;
 width: auto !important;
 height: auto !important;
 transform: translateY(-50%);
}

html[data-bel-theme] .badgeFiles {
 position: static !important;
 display: inline-flex !important;
 min-width: 24px;
 height: 22px !important;
 padding: 0 8px !important;
 border-radius: 11px !important;
 font-size: 12px !important;
 line-height: 22px !important;
 background: var(--bel-accent-soft) !important;
 color: var(--bel-accent) !important;
 box-shadow: inset 0 0 0 1px var(--bel-accent-line) !important;
}

html[data-bel-theme] #lstDataRoom > li > a.item .in > span[style] {
 min-width: 28px;
 padding: 1px 9px;
 border-radius: 11px;
 text-align: center;
 font-size: 12px !important;
 font-weight: 650;
 color: var(--bel-text-secondary) !important;
 background: var(--bel-bg-hover);
}

html[data-bel-theme] #lstDataRoom li.sidebar-item > a {
 display: block;
 border-radius: var(--bel-radius-s);
}

/* scheda immobile */
html[data-bel-theme] #cntDesc {
 width: 100% !important;
 max-width: var(--bel-content-max);
 margin: 0 auto 12px auto !important;
 padding: 14px !important;
 background: var(--bel-bg-panel);
 border: 1px solid var(--bel-border-soft);
 border-radius: var(--bel-radius-l);
 box-shadow: var(--bel-shadow-card);
}

html[data-bel-theme] #cntDesc > .row {
 margin: 0;
 align-items: center;
 --bs-gutter-x: 16px;
}

html[data-bel-theme] #cntDesc > .row > div:first-child {
 margin-bottom: 0 !important;
 padding-left: 0;
}

html[data-bel-theme] #cntDesc > div[style*="border-bottom"] {
 display: none;
}

html[data-bel-theme] #cntDesc .txtTitle {
 justify-content: center !important;
 padding-right: 0;
 font-size: 14px !important;
 font-weight: 500 !important;
}

html[data-bel-theme] #cntDesc .txtTitle > div {
 height: auto !important;
 min-height: 38px;
 align-items: center;
 border-bottom: 1px solid var(--bel-border-soft);
}

html[data-bel-theme] #cntDesc .txtTitle > div:last-child {
 border-bottom: 0;
}

html[data-bel-theme] #cntDesc .txtTitle > div:has(.clipped4:empty) {
 display: none !important;
}

html[data-bel-theme] #cntDesc .iconTitle {
 display: inline-flex;
 width: 26px;
 margin-right: 6px !important;
 font-size: 17px !important;
}

html[data-bel-theme] #imgImmobile {
 width: 100%;
 aspect-ratio: 4 / 3;
 object-fit: contain !important;
 padding: 8px;
}

@media (min-width: 769px) {
 html[data-bel-theme] #cntDesc {
  padding: 18px !important;
 }

 html[data-bel-theme] #cntDesc .txtTitle {
  font-size: 16px !important;
 }

 html[data-bel-theme] #cntDesc .txtTitle > div {
  min-height: 46px;
 }
}

/* notifica: in alto a destra su schermi larghi */
@media (min-width: 769px) {
 html[data-bel-theme] .notification-box {
  left: auto;
  right: 16px;
  width: 440px;
 }
}

/* desktop: menu laterale al posto della barra inferiore */
@media (min-width: 1024px) {
 html[data-bel-theme] #appCapsule {
  padding: calc(var(--bel-header-h) + env(safe-area-inset-top)) 0 0 var(--bel-rail-w);
 }

 html[data-bel-theme] .appHeader .left {
  width: calc(var(--bel-rail-w) - 24px);
  padding-left: 4px;
 }

 html[data-bel-theme] .appHeader .pageTitle {
  text-align: left;
  font-size: 15px;
  color: var(--bel-chrome-muted);
 }

 html[data-bel-theme] .appBottomMenu {
  top: calc(var(--bel-header-h) + env(safe-area-inset-top));
  bottom: 0;
  left: 0;
  right: auto;
  width: var(--bel-rail-w);
  height: auto;
  min-height: 0;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 2px;
  padding: 16px 12px;
  border-top: 0;
  border-right: 1px solid var(--bel-border-soft);
 }

 html[data-bel-theme] .appBottomMenu .item {
  flex: 0 0 auto;
  width: 100%;
  height: 44px;
  border-radius: 10px;
 }

 html[data-bel-theme] .appBottomMenu .item:before {
  display: none;
 }

 html[data-bel-theme] .appBottomMenu .item:hover {
  background: var(--bel-bg-hover);
 }

 html[data-bel-theme] .appBottomMenu .item.active,
 html[data-bel-theme] .appBottomMenu .item.active:hover {
  background: var(--bel-accent-soft);
 }

 html[data-bel-theme] .appBottomMenu .item .col {
  flex-direction: row;
  justify-content: flex-start !important;
  gap: 12px;
  padding: 0 12px;
 }

 html[data-bel-theme] .appBottomMenu .item ion-icon,
 html[data-bel-theme] .appBottomMenu .item:hover ion-icon {
  font-size: 20px;
 }

 html[data-bel-theme] .appBottomMenu .item .btnTitle {
  font-size: 14px !important;
  font-weight: 550 !important;
 }

 html[data-bel-theme] .appBottomMenu .item.active .btnTitle {
  font-weight: 650 !important;
 }

 html[data-bel-theme] .appBottomMenu .badge {
  top: 50%;
  left: auto;
  right: 10px;
  transform: translateY(-50%);
  box-shadow: none;
 }
}
