.select2-results__options {
	max-height: 200px;
	overflow-y: auto;
}

/** general rules **/
.small-box h3 {font-size:32px; margin-top:6px}

/** select2 **/
.modal-content .select2-container--default {z-index: 2050;}

/** top menu **/
.main-header .sidebar-toggle:before {content:''}
.profile-user-img { width: 100px; }
.input-group .input-group-btn .btn .fa {display:block;}
.products_dropdown {width:400px !important}

/** sidebar menu **/
.main-sidebar .user-panel, .sidebar-menu, .sidebar-menu>li.header {white-space: normal}

/* sidebar icon */
.sidebar-menu>li>a {padding-right:35px}
/* chevron position (only expanded menu) */
.sidebar-menu li>a>.pull-right-container {top:18px; margin-top:0}
/* menubox */
.sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse .sidebar-menu>li:hover>.treeview-menu {
	top:44px;
}
.sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse .sidebar-menu>li:hover>.treeview-menu,
.sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse .sidebar-menu>li:hover>a>span:not(.pull-right) {
	left:53px;
	width:250px;
	-webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, .2);
	-moz-box-shadow: 0 3px 5px rgba(0, 0, 0, .2);
	box-shadow: 0 0 5px rgba(0, 0, 0, .2);
	border-radius: 0;
}
/* menubox: box header */
.sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse .sidebar-menu>li:hover>a>span {padding-left:10px; padding-right:10px;}
/* menubox: hide header chevron */
.sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse .sidebar-menu>li:hover>a>span.pull-right-container:not(.pull-right) {
	display: none !important;
}

/* LA VOCE ACCESA — la pagina che si sta guardando.

   Il tema da solo non la segnala: `skins/_all-skins.css:90` mette `border-left:none` su
   ogni voce e poi `:101` prova a colorare quel bordo inesistente, quindi di un `active`
   restava soltanto il testo bianco. Sopra i 768px pero' il testo NON C'E': la barra e'
   ridotta a icone (`master_style.css:621`), e senza qualcosa che accenda l'icona non c'e'
   nessun modo di sapere in che pagina si e'. Da qui la barretta a sinistra fatta con
   `box-shadow:inset`, che si vede anche quando la riga e' larga 50 pixel.

   `menu-open` e' li' insieme ad `active` perche' e' la classe con cui AdminLTE apre un
   sottomenu e gira la freccia: il menu mette tutte e due sul gruppo della pagina corrente,
   cosi' a barra estesa il gruppo giusto e' gia' aperto. */
.skin-blue .sidebar-menu > li.active > a,
.skin-blue .sidebar-menu > li.menu-open > a {
	background: rgba(0, 0, 0, .25);
	color: #ffffff;
	box-shadow: inset 3px 0 0 #45aef1;
}
.skin-blue .sidebar-menu > li.active > a > .fa,
.skin-blue .sidebar-menu > li.menu-open > a > .fa {
	color: #45aef1;
}
.skin-blue .sidebar-menu .treeview-menu > li.active > a {
	color: #ffffff;
	font-weight: 600;
}

/* submenus */
.treeview-menu>li>a {padding-left:10px; padding-right:10px;}
.treeview-menu>li>a .label {border-radius:.25em; margin-right:2px}
.treeview-menu>li>a .fas {margin-right:3px}
.treeview-menu>li>a>.pull-right-container {top:11px; right:0; margin-top:0}

section {background: transparent !important}
section.content a {text-decoration: underline}
section.content a.btn {text-decoration: none}

/* box stat */
.small-box {margin-bottom:15px}
.small-box h3 {margin-top:0; margin-bottom:3px; font-size:28px;}
.small-box p {margin-bottom:0}
.small-box .icon {font-size:45px;}
.small-box:hover .icon {font-size:50px;}

/* forms */
[type=checkbox]+label:before, [type=checkbox]:not(.filled-in)+label:after {top:1px}
.form-group p.help-block {margin-top:3px; margin-bottom:0}

/* tables */
.table-filters {background-color:rgba(0, 0, 0, 0.05)}
.table-bordered>thead {border-top:1px solid #ddd}
.table-bordered, .table-bordered>tbody>tr>td, .table-bordered>tbody>tr>th,
.table-bordered>tfoot>tr>td, .table-bordered>tfoot>tr>th, .table-bordered>thead>tr>td, .table-bordered>thead>tr>th {
	border-top-color: #ddd;
	border-right-color: #ddd;
	border-bottom-color: #ddd;
	border-left-color: #ddd
}
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {white-space:initial}

/* btn */
.btn {font-size:1rem}
.btn-xs {font-size:12px}
.btn-sm {font-size:0.875rem}
.btn-lg {font-size:1.25rem}

/* sortable */
.ui-state-default {
	background:#fff;
	cursor: n-resize;
}
#sortable li {
	list-style: none;
	padding:3px 0;
}
#sortable li .fa fa-sort {
	margin-right: 10px;
}

/** temp position style lib **/
.btn.disabled, .btn:disabled {opacity:0.35}
.form-group label:empty {margin-bottom:-3px}
.info-box-text, .progress-description {white-space: initial;}

/** select2 **/
.select2-container--bootstrap4 .select2-selection {border-radius:0; min-height: 2.573rem;}
.select2-container--bootstrap4 .select2-selection.select2-selection--multiple {height: auto !important}
.select2-container .select2-selection--single .select2-selection__rendered {
    padding: 0.375rem 0.75rem;
    line-height: 2.25rem;
    color: #495057;
}
.select2-container--bootstrap4 .select2-selection--single .select2-selection__placeholder {
	line-height: 1em;
}
.select2-dropdown .select2-search__field, .select2-search--inline .select2-search__field {
	border-radius:0
}
.select2-results {
	max-height: 300px;
	overflow: overlay;
}

/** invoice withdrawal **/
.invoice {background: #fff !important}
.invoice-name {color: #999999;}
.invoice.personal-data-off .personal {opacity: 0.2;}
.invoice .hidden-row .personal-row {opacity: 0.2;}
.invoice.personal-data-off .personal h4 {opacity:0.2}

@media only screen and (max-width: 767px) {
	.info-box-icon {
		height: 50px;
		width: 50px;
		font-size: 25px;
		line-height: 50px;
		position: absolute;
		top: 50%;
		margin-top: -40px;
		margin-left: 5px;
	}
}

/** logs **/
pre.log {
	overflow-x: auto;
	white-space: pre-wrap;
	white-space: -moz-pre-wrap;
	white-space: -pre-wrap;
	white-space: -o-pre-wrap;
	word-wrap: break-word;
 }


/* fix blue color */
.tabs-vertical li .nav-link.active,
.tabs-vertical li .nav-link:hover,
.tabs-vertical li .nav-link.active:focus {
	background: #45aef1;
}
.pagination li a.current, .pagination li a.current:hover {
	border: 1px solid #367fa9;
	background-color: #45AEF1;
}

@media only screen and (min-width: 767px) {
	.login-box {
		margin: 10% auto auto 10%;
	}
}
.login-box-body, .register-box-body {
	background: white;
}
.select2-container--bootstrap4 .select2-selection__clear {
	margin-right: 1.0em;
}

/*!
 * Generated with CSS Flag Sprite generator (https://www.flag-sprites.com/) -
 */
 .flag{display:inline-block;position: relative;width:16px;height:11px;background:url('https://flag-sprites.com/img/flags.png') no-repeat}.flag.flag-gu{background-position:-96px -55px}.flag.flag-mn{background-position:-208px -88px}.flag.flag-va{background-position:-48px -154px}.flag.flag-tibet{background-position:-32px -143px}.flag.flag-fo{background-position:-64px -44px}.flag.flag-th{background-position:-16px -143px}.flag.flag-tr{background-position:-144px -143px}.flag.flag-tl{background-position:-80px -143px}.flag.flag-kz{background-position:-144px -77px}.flag.flag-zm{background-position:-16px -165px}.flag.flag-uz{background-position:-32px -154px}.flag.flag-dk{background-position:-64px -33px}.flag.flag-scotland{background-position:-176px -121px}.flag.flag-gi{background-position:-224px -44px}.flag.flag-gy{background-position:-128px -55px}.flag.flag-bj{background-position:-112px -11px}.flag.flag-fr{background-position:-80px -44px}.flag.flag-mo{background-position:-224px -88px}.flag.flag-ir{background-position:-112px -66px}.flag.flag-io{background-position:-80px -66px}.flag.flag-tm{background-position:-96px -143px}.flag.flag-ch{background-position:-96px -22px}.flag.flag-mt{background-position:-32px -99px}.flag.flag-nl{background-position:-240px -99px}.flag.flag-gp{background-position:-16px -55px}.flag.flag-im{background-position:-48px -66px}.flag.flag-tv{background-position:-176px -143px}.flag.flag-mu{background-position:-48px -99px}.flag.flag-pe{background-position:-96px -110px}.flag.flag-vi{background-position:-112px -154px}.flag.flag-hn{background-position:-176px -55px}.flag.flag-ss{background-position:-128px -132px}.flag.flag-ae{background-position:-16px 0}.flag.flag-td{background-position:-240px -132px}.flag.flag-pw{background-position:0 -121px}.flag.flag-nu{background-position:-32px -110px}.flag.flag-bt{background-position:-208px -11px}.flag.flag-ms{background-position:-16px -99px}.flag.flag-cv{background-position:-240px -22px}.flag.flag-es{background-position:-224px -33px}.flag.flag-mh{background-position:-144px -88px}.flag.flag-la{background-position:-160px -77px}.flag.flag-vn{background-position:-128px -154px}.flag.flag-py{background-position:-16px -121px}.flag.flag-br{background-position:-176px -11px}.flag.flag-ye{background-position:-224px -154px}.flag.flag-ie{background-position:0 -66px}.flag.flag-gh{background-position:-208px -44px}.flag.flag-cg{background-position:-80px -22px}.flag.flag-cu{background-position:-224px -22px}.flag.flag-hu{background-position:-224px -55px}.flag.flag-sg{background-position:-224px -121px}.flag.flag-at{background-position:-176px 0}.flag.flag-lk{background-position:-224px -77px}.flag.flag-vu{background-position:-144px -154px}.flag.flag-bo{background-position:-160px -11px}.flag.flag-jo{background-position:-208px -66px}.flag.flag-er{background-position:-208px -33px}.flag.flag-za{background-position:-256px -154px}.flag.flag-rs{background-position:-80px -121px}.flag.flag-nr{background-position:-16px -110px}.flag.flag-ls{background-position:-256px -77px}.flag.flag-jm{background-position:-192px -66px}.flag.flag-tz{background-position:-208px -143px}.flag.flag-ki{background-position:-16px -77px}.flag.flag-sj{background-position:0 -132px}.flag.flag-cz{background-position:-16px -33px}.flag.flag-pg{background-position:-128px -110px}.flag.flag-lv{background-position:-32px -88px}.flag.flag-do{background-position:-96px -33px}.flag.flag-lu{background-position:-16px -88px}.flag.flag-no{background-position:-256px -99px}.flag.flag-kw{background-position:-112px -77px}.flag.flag-mx{background-position:-96px -99px}.flag.flag-yt{background-position:-240px -154px}.flag.flag-ly{background-position:-48px -88px}.flag.flag-cy{background-position:0 -33px}.flag.flag-ph{background-position:-144px -110px}.flag.flag-my{background-position:-112px -99px}.flag.flag-sm{background-position:-48px -132px}.flag.flag-et{background-position:-240px -33px}.flag.flag-ru{background-position:-96px -121px}.flag.flag-tj{background-position:-48px -143px}.flag.flag-ai{background-position:-64px 0}.flag.flag-pl{background-position:-176px -110px}.flag.flag-kp{background-position:-64px -77px}.flag.flag-uy{background-position:-16px -154px}.flag.flag-gb{background-position:-112px -44px}.flag.flag-gs{background-position:-64px -55px}.flag.flag-kurdistan{background-position:-96px -77px}.flag.flag-rw{background-position:-112px -121px}.flag.flag-ec{background-position:-128px -33px}.flag.flag-mm{background-position:-192px -88px}.flag.flag-pa{background-position:-80px -110px}.flag.flag-wales{background-position:-160px -154px}.flag.flag-kg{background-position:-256px -66px}.flag.flag-ve{background-position:-80px -154px}.flag.flag-tk{background-position:-64px -143px}.flag.flag-ca{background-position:-16px -22px}.flag.flag-is{background-position:-128px -66px}.flag.flag-ke{background-position:-240px -66px}.flag.flag-ro{background-position:-64px -121px}.flag.flag-gq{background-position:-32px -55px}.flag.flag-pt{background-position:-256px -110px}.flag.flag-tf{background-position:-256px -132px}.flag.flag-ad{background-position:0 0}.flag.flag-sk{background-position:-16px -132px}.flag.flag-pm{background-position:-192px -110px}.flag.flag-om{background-position:-64px -110px}.flag.flag-an{background-position:-112px 0}.flag.flag-ws{background-position:-192px -154px}.flag.flag-sh{background-position:-240px -121px}.flag.flag-mp{background-position:-240px -88px}.flag.flag-gt{background-position:-80px -55px}.flag.flag-cf{background-position:-64px -22px}.flag.flag-zanzibar{background-position:0 -165px}.flag.flag-mw{background-position:-80px -99px}.flag.flag-catalonia{background-position:-32px -22px}.flag.flag-ug{background-position:-240px -143px}.flag.flag-je{background-position:-176px -66px}.flag.flag-km{background-position:-32px -77px}.flag.flag-in{background-position:-64px -66px}.flag.flag-bf{background-position:-48px -11px}.flag.flag-mc{background-position:-80px -88px}.flag.flag-sy{background-position:-192px -132px}.flag.flag-sn{background-position:-64px -132px}.flag.flag-kr{background-position:-80px -77px}.flag.flag-eu{background-position:-256px -33px}.flag.flag-bn{background-position:-144px -11px}.flag.flag-st{background-position:-144px -132px}.flag.flag-england{background-position:-192px -33px}.flag.flag-lc{background-position:-192px -77px}.flag.flag-dm{background-position:-80px -33px}.flag.flag-be{background-position:-32px -11px}.flag.flag-ni{background-position:-224px -99px}.flag.flag-ua{background-position:-224px -143px}.flag.flag-mz{background-position:-128px -99px}.flag.flag-pf{background-position:-112px -110px}.flag.flag-tn{background-position:-112px -143px}.flag.flag-ee{background-position:-144px -33px}.flag.flag-xk{background-position:-208px -154px}.flag.flag-sx{background-position:-176px -132px}.flag.flag-sd{background-position:-192px -121px}.flag.flag-gd{background-position:-128px -44px}.flag.flag-ci{background-position:-112px -22px}.flag.flag-sz{background-position:-208px -132px}.flag.flag-cl{background-position:-144px -22px}.flag.flag-fi{background-position:0 -44px}.flag.flag-ga{background-position:-96px -44px}.flag.flag-jp{background-position:-224px -66px}.flag.flag-de{background-position:-32px -33px}.flag.flag-np{background-position:0 -110px}.flag.flag-re{background-position:-48px -121px}.flag.flag-bg{background-position:-64px -11px}.flag.flag-sc{background-position:-160px -121px}.flag.flag-ng{background-position:-208px -99px}.flag.flag-qa{background-position:-32px -121px}.flag.flag-mk{background-position:-160px -88px}.flag.flag-aw{background-position:-208px 0}.flag.flag-kn{background-position:-48px -77px}.flag.flag-al{background-position:-80px 0}.flag.flag-bw{background-position:-240px -11px}.flag.flag-um{background-position:-256px -143px}.flag.flag-ky{background-position:-128px -77px}.flag.flag-tt{background-position:-160px -143px}.flag.flag-so{background-position:-80px -132px}.flag.flag-lt{background-position:0 -88px}.flag.flag-by{background-position:-256px -11px}.flag.flag-bb{background-position:0 -11px}.flag.flag-us{background-position:0 -154px}.flag.flag-md{background-position:-96px -88px}.flag.flag-ag{background-position:-48px 0}.flag.flag-hm{background-position:-160px -55px}.flag.flag-as{background-position:-160px 0}.flag.flag-eg{background-position:-160px -33px}.flag.flag-sv{background-position:-160px -132px}.flag.flag-sl{background-position:-32px -132px}.flag.flag-fk{background-position:-32px -44px}.flag.flag-am{background-position:-96px 0}.flag.flag-ck{background-position:-128px -22px}.flag.flag-tw{background-position:-192px -143px}.flag.flag-kh{background-position:0 -77px}.flag.flag-to{background-position:-128px -143px}.flag.flag-se{background-position:-208px -121px}.flag.flag-cd{background-position:-48px -22px}.flag.flag-pn{background-position:-208px -110px}.flag.flag-gr{background-position:-48px -55px}.flag.flag-id{background-position:-256px -55px}.flag.flag-vc{background-position:-64px -154px}.flag.flag-somaliland{background-position:-96px -132px}.flag.flag-bi{background-position:-96px -11px}.flag.flag-pk{background-position:-160px -110px}.flag.flag-pr{background-position:-224px -110px}.flag.flag-bd{background-position:-16px -11px}.flag.flag-co{background-position:-192px -22px}.flag.flag-fm{background-position:-48px -44px}.flag.flag-bm{background-position:-128px -11px}.flag.flag-ar{background-position:-144px 0}.flag.flag-bv{background-position:-224px -11px}.flag.flag-sb{background-position:-144px -121px}.flag.flag-mq{background-position:-256px -88px}.flag.flag-eh{background-position:-176px -33px}.flag.flag-bh{background-position:-80px -11px}.flag.flag-it{background-position:-144px -66px}.flag.flag-hr{background-position:-192px -55px}.flag.flag-sa{background-position:-128px -121px}.flag.flag-mv{background-position:-64px -99px}.flag.flag-mg{background-position:-128px -88px}.flag.flag-dz{background-position:-112px -33px}.flag.flag-gg{background-position:-192px -44px}.flag.flag-gm{background-position:-256px -44px}.flag.flag-af{background-position:-32px 0}.flag.flag-li{background-position:-208px -77px}.flag.flag-sr{background-position:-112px -132px}.flag.flag-vg{background-position:-96px -154px}.flag.flag-cr{background-position:-208px -22px}.flag.flag-tc{background-position:-224px -132px}.flag.flag-ao{background-position:-128px 0}.flag.flag-ma{background-position:-64px -88px}.flag.flag-mr{background-position:0 -99px}.flag.flag-gn{background-position:0 -55px}.flag.flag-ne{background-position:-176px -99px}.flag.flag-nf{background-position:-192px -99px}.flag.flag-wf{background-position:-176px -154px}.flag.flag-hk{background-position:-144px -55px}.flag.flag-gf{background-position:-160px -44px}.flag.flag-ps{background-position:-240px -110px}.flag.flag-ic{background-position:-240px -55px}.flag.flag-cw{background-position:-256px -22px}.flag.flag-ml{background-position:-176px -88px}.flag.flag-ax{background-position:-224px 0}.flag.flag-gl{background-position:-240px -44px}.flag.flag-dj{background-position:-48px -33px}.flag.flag-cn{background-position:-176px -22px}.flag.flag-ht{background-position:-208px -55px}.flag.flag-lr{background-position:-240px -77px}.flag.flag-tg{background-position:0 -143px}.flag.flag-ba{background-position:-256px 0}.flag.flag-ge{background-position:-144px -44px}.flag.flag-bz{background-position:0 -22px}.flag.flag-au{background-position:-192px 0}.flag.flag-iq{background-position:-96px -66px}.flag.flag-cm{background-position:-160px -22px}.flag.flag-gw{background-position:-112px -55px}.flag.flag-az{background-position:-240px 0}.flag.flag-na{background-position:-144px -99px}.flag.flag-fj{background-position:-16px -44px}.flag.flag-zw{background-position:-32px -165px}.flag.flag-bs{background-position:-192px -11px}.flag.flag-il{background-position:-16px -66px}.flag.flag-nz{background-position:-48px -110px}.flag.flag-me{background-position:-112px -88px}.flag.flag-si{background-position:-256px -121px}.flag.flag-nc{background-position:-160px -99px}.flag.flag-lb{background-position:-176px -77px}

/* ═══════════════════════════════════════════════════════════════════════════
   COLONNA «ULTIMO AGGANCIO» DELL'ELENCO SPOKE — e perché non usa i .label

   Il tema definisce i .label come testo BIANCO su tinta piena, con
   `font-weight: lighter` e `font-size: 75%`, e il bianco è imposto con
   `!important` (master_style.css, riga 8799). Misurato:

       bianco su #ffbf36 (label-warning) ... 1,65 : 1
       bianco su #f83f37 (label-danger) .... 3,65 : 1
       #999 su bianco (text-muted) ......... 2,85 : 1

   La soglia WCAG AA per il testo piccolo è 4,5 : 1. Il giallo è a un terzo di
   quella soglia: su uno schermo di furgone, o semplicemente di giorno, la data
   dentro il badge giallo non si legge — ed è proprio la riga che deve saltare
   all'occhio, perché segnala uno spoke fermo.

   Qui la tinta passa dal fondo al testo: fondo pallido, scritta scura, un
   bordo che tiene la forma del badge. Misurato con la stessa formula:

       #6b4300 su #fff4d6 (fermo) ......... 7,89 : 1
       #8b1a10 su #fdecea (mai) ........... 8,15 : 1
       #444 su bianco (attivo) ............ 9,74 : 1

   I nomi delle classi non entrano nell'elenco `.label-*` del tema, quindi il
   `color: #fff !important` di quella riga non le tocca.
   ═══════════════════════════════════════════════════════════════════════════ */

.stato-aggancio {
	display: inline-block;
	padding: .25em .55em;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.3;
	white-space: nowrap;
	border-radius: .25em;
	border: 1px solid transparent;
}

.stato-aggancio .fa {
	margin-right: .35em;
}

/* Mai agganciato nello storico rimasto dopo la potatura a 24 mesi. */
.stato-aggancio-mai {
	color: #8b1a10;
	background-color: #fdecea;
	border-color: #e9a79f;
}

/* Fermo da almeno GIORNI_INATTIVO giorni. */
.stato-aggancio-fermo {
	color: #6b4300;
	background-color: #fff4d6;
	border-color: #e0a800;
}

/* Agganciato di recente: nessun allarme, ma la data deve restare leggibile. */
.stato-aggancio-attivo {
	color: #444;
	background-color: transparent;
	border-color: transparent;
	font-weight: 400;
}

/* I giorni di fermo, dentro il badge: stessa tinta, un filo più leggeri. */
.stato-aggancio .stato-aggancio-giorni {
	font-weight: 400;
	opacity: .85;
}

/* Stessa medicina per il badge dei gemelli, che sta nella stessa tabella e
   soffriva dello stesso bianco-su-giallo. */
.badge-gemelli {
	display: inline-block;
	padding: .2em .5em;
	margin-left: .4em;
	font-size: 11px;
	font-weight: 600;
	line-height: 1.3;
	white-space: nowrap;
	border-radius: .25em;
	color: #5a3d00;
	background-color: #fff4d6;
	border: 1px solid #e0a800;
	cursor: help;
}

/* In stampa i fondi pallidi sbiadiscono: resta il bordo a tenere la forma. */
@media print {
	.stato-aggancio, .badge-gemelli {
		border-color: #999;
		background-color: transparent !important;
	}
}

/* Il badge del tipo, nella stessa tabella e con lo stesso problema: «Da classificare» era
   bianco su #ffbf36, cioè 1,65 : 1. Qui la tinta sta nel testo, come per l'aggancio. */
.badge-tipo {
	display: inline-block;
	padding: .25em .55em;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.3;
	white-space: nowrap;
	border-radius: .25em;
	border: 1px solid transparent;
}

.badge-tipo-cliente {
	color: #0b4a70;          /* 8,35 : 1 su #e7f3fa */
	background-color: #e7f3fa;
	border-color: #a9cfe4;
}

.badge-tipo-neutro {
	color: #454545;          /* 8,26 : 1 su #eeeeee */
	background-color: #eee;
	border-color: #ccc;
}

.badge-tipo-daclassificare {
	color: #6b4300;          /* 7,89 : 1 su #fff4d6 */
	background-color: #fff4d6;
	border-color: #e0a800;
}

@media print {
	.badge-tipo {
		border-color: #999;
		background-color: transparent !important;
	}
}

/* L'avviso «questo spoke fa gia' parte di un'altra tratta», nella maschera della tratta.
   Stessa medicina dei due badge qui sopra: la tinta sta nel testo, non nel fondo, perche' i
   `.label` del tema stampano bianco su tinta piena e non arrivano ai 4,5 : 1 di WCAG AA.
   Non e' un errore ed e' per questo che non e' rosso: lo stesso posto puo' stare in piu'
   tratte, e in produzione ci stavano cinque spoke su cinquantaquattro. E' un'informazione
   che chi sta associando deve vedere prima di cliccare, non un divieto. */
.badge-tratta {
	display: inline-block;
	padding: .2em .55em;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.3;
	border-radius: .25em;
	color: #0b4a70;          /* 8,35 : 1 su #e7f3fa */
	background-color: #e7f3fa;
	border: 1px solid #a9cfe4;
	cursor: help;
}

@media print {
	.badge-tratta {
		border-color: #999;
		background-color: transparent !important;
	}
}

/* ═══════════════════════════════════════════════════════════════════════════
   TELEFONO E TABLET — revisione responsive dell'11 settembre 2026

   Misurato aprendo le 46 pagine del pannello a 375, 768 e 1280 px (Chrome con
   emulazione mobile) prima di scrivere una riga. Tre fatti spiegano quasi tutto:

   1. `.wrapper` ha `overflow-x: hidden`. Ciò che sfora la pagina non fa comparire
      la barra di scorrimento: SPARISCE. Le tabelle dei report fuori da
      `.table-responsive` avevano le colonne di destra invisibili e irraggiungibili
      (su /reports.trips i pulsanti «Mappa» e stampa, su un telefono).
   2. `bootstrap-extend.css:13843` impone `html, body { font-size: 12px !important }`
      fra 320 e 767 px. Da lì i pulsanti alti 29 px e i campi a 12 px, sui quali
      Safari per iPhone ingrandisce la pagina a ogni tocco (lo fa sotto i 16 px).
   3. I pulsanti di riga della stylelib sono `.btn-xs`, 21-25 x 21 px.

   Tutto quello che segue sta dentro `@media screen and (max-width: …)`: sopra i
   991 px non cambia niente — misurato pixel per pixel a 992, 1024 e 1280 con gli
   stessi dati. L'unica regola fuori è la barra alta (A), che cambia zero pixel.
   `screen` non è pignoleria: un A4 verticale è largo circa 718 px, quindi senza,
   queste regole valevano anche in STAMPA, e l'elenco spoke con i nomi veri usciva
   tagliato sulla carta (misurato l'11 settembre 2026).
   ═══════════════════════════════════════════════════════════════════════════ */

/* A. Barra alta: la .row dentro la navbar ha i margini negativi di Bootstrap senza un
      contenitore che li compensi, e sforava di 15 px a destra a OGNI larghezza: il menu
      a tendina dell'utente usciva di 11 px dallo schermo del telefono. */
.main-header .navbar > .row { margin-right: 0; }
.main-header .navbar > .row > .col-auto { padding-right: 0; }

/* Mappa di /reports.path. L'altezza stava in uno style in linea con !important — il 90 %
   di una colonna flex la cui altezza non comprende la mappa, cioè una percentuale ciclica:
   sul desktop funzionava perché la colonna la tira il form accanto; sotto i 992 px la mappa
   restava alta 157 px e usciva dal suo riquadro, sopra il piè di pagina. Classe e non #map
   perché spokes/create ed edit hanno un <img id="map"> che non va toccato. */
.mappa-percorso { height: 90%; max-height: 90%; }

@media screen and (max-width: 991px) {
	.mappa-percorso { height: 60vh; min-height: 300px; max-height: none; }

	/* Pulsanti di riga (matita, croce, occhio, lente) e d'intestazione delle tabelle:
	   da 24 x 21 a 34 x 32 px. Le tabelle si allargano di una decina di pixel e
	   continuano a scorrere dentro .table-responsive. */
	.table .btn-group > .btn-xs,
	.table-responsive .btn-xs { min-width: 34px; min-height: 32px; padding: 7px 9px; line-height: 16px; }
	.box-header > .btn-xs.ibox-title-azione { padding: 6px 9px; line-height: 18px; margin: 3px 0; }

	/* Casella di spunta del tema: l'input è a -9999px apposta e si tocca la <label> vuota
	   che la disegna; era 35 x 25 px. */
	.form-group [type=checkbox] + label:empty { min-width: 40px; height: 38px; }

	/* Il «?» d'aiuto accanto al titolo: il tema lo trasforma in una barra grigia vuota alta
	   32 px. Resta un'icona in alto a destra. */
	.content-header > .breadcrumb { position: absolute; top: 20px; right: 20px; margin-top: 0; background: transparent; padding: 7px 5px; }
	.content-header > .breadcrumb a { display: inline-block; padding: 8px; }

	/* Lettore QR della raccolta: 150 px fissi nello <style> di include/head, cioè un mirino
	   di 148 x 111 px. `div#` per battere quella regola, che nella cascata viene dopo. */
	div#qr-reader, div#qr-reader-test { width: 100%; max-width: 400px; }
	#qr-reader button, #qr-reader-test button { padding: 8px 14px; }
	#getLocation, .vtabs .btn-sm { padding-top: .6rem; padding-bottom: .6rem; }

	/* Intestazione delle giornate del report mensile: il tema la rende flex e il pulsante
	   «Mostra dettagli» (overflow hidden, nowrap) veniva schiacciato fino a «Mos». */
	.card-header { flex-wrap: wrap; }
	.card-header > .btn { flex-shrink: 0; padding-top: 9px; padding-bottom: 9px; }

	/* Dettaglio del log utenti: il .card-body è flex dentro .row e il suo min-width:auto
	   gli impediva di stringersi sotto la riga più lunga del <pre>, che usciva dal modal. */
	.modal-body > .row > .card-body { min-width: 0; }

	/* Campo zoom della mappa degli spoke: 27 x 24 px, senza classe. */
	input#zoom { width: 72px; height: 36px; }


	/* /reports.distance: la colonna «Come si spiega» schiacciata alla parola più lunga
	   dava righe alte 560 px. */
	.come-si-spiega { min-width: 220px; }

	/* Campi a 16 px: sotto, Safari ingrandisce la pagina al tocco — sull'iPhone (dove il
	   tema li porta a 12 px) e anche sull'iPad in verticale (14 px), per questo fino a 991.
	   `height: auto` perché a 16 px il testo non stava nell'altezza fissa del tema. */
	input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=submit]):not([type=button]):not([type=file]):not([type=range]),
	select, select.form-control, textarea, textarea.form-control, .select2-search__field { font-size: 16px; }
	.form-control { height: auto; }
	/* La select2 non è un campo (non fa zoomare), ma accanto ai campi a 16 px restava a 12 e
	   alta 31: nello stesso form due misure. */
	.select2-container .select2-selection--single .select2-selection__rendered { font-size: 16px; }
	.select2-container--bootstrap4 .select2-selection { min-height: 35px; }
}

@media screen and (max-width: 767px) {
	/* Sidebar: sotto i 768 px il logo è nascosto (header.blade.php) e i 100 px del tema
	   lasciavano 50 px vuoti sopra la prima voce. */
	.main-sidebar { padding-top: 50px; }

	/* Margini: 30 px per lato su 375 sono un sesto dello schermo. */
	.content { padding: 15px; }
	.content-header { padding: 15px 15px 0; }
	.content-header h1 { font-size: 22px; }
	.content-header > .breadcrumb { top: 12px; right: 8px; }
	/* Box::openTitolo(..., 'col-sm-12') dentro una colonna senza .row: il padding si
	   raddoppiava attorno ai form. */
	section.content form > [class*="col-"] { padding-left: 0; padding-right: 0; }
	/* Lo stesso per i riquadri dei risultati dei report: Box::openTitolo(..., 'col-sm-12')
	   dentro .col-lg-9, colonna dentro colonna senza .row. Senza, il form e i risultati sotto
	   avevano larghezze diverse. */
	section.content [class*="col-"] > [class*="col-"] { padding-left: 0; padding-right: 0; }
	/* /events: l'avviso e la nota «totale approssimativo» sono figli diretti di .row, senza
	   colonna, e con il margine di 15 px toccavano il bordo dello schermo. Qui e non nel Blade,
	   perché una colonna attorno li sposterebbe di 15 px anche sul desktop. */
	section.content > .row > .alert { margin-left: 15px; margin-right: 15px; }
	section.content > .row > p.text-muted { padding-left: 11px; padding-right: 15px; }

	/* Pulsanti a portata di dito: erano alti 29 px. */
	.btn:not(.btn-xs):not(.btn-sm):not(.btn-app) { padding-top: .6rem; padding-bottom: .6rem; }

	/* Linguette verticali del profilo: sopra il contenuto, in orizzontale. */
	.vtabs, .vtabs .tab-content { display: block; }
	.vtabs .tabs-vertical { display: flex; flex-wrap: wrap; width: auto; border-right: 0; border-bottom: 1px solid rgba(120,130,140,.13); margin-bottom: 10px; }
	.vtabs .tabs-vertical li .nav-link { margin-bottom: 0; border-radius: 4px 4px 0 0; }
	/* `section.content a` è sottolineato (sopra): con il testo al posto delle icone le
	   linguette sembravano collegamenti. */
	.vtabs .nav-link { text-decoration: none; }

	/* Paginatore delle tabelle della stylelib: era position:absolute (master_style.css:2407)
	   e copriva il titolo; con molte pagine — gli eventi ne hanno 190.000 — i primi link
	   uscivano a sinistra dallo schermo. Va a capo sotto il titolo. */
	.box-header > .box-tools { position: static; margin-top: 8px; justify-content: flex-end; flex-wrap: wrap; }
	.box-footer > .box-tools { flex-wrap: wrap; }
	.box-tools > .clearfix { max-width: 100%; }
	.box-tools .pagination { flex-wrap: wrap; justify-content: flex-end; }
	/* La casella di filtro della colonna ID era larga 32 px. */
	table > tbody > tr.table-filters > td > input { min-width: 64px; }

	/* Calendari: giorni del datepicker 20 x 22 px, del daterangepicker 32 x 23. */
	.datepicker table tr td, .datepicker table tr th { width: 38px; height: 34px; }
	.daterangepicker td, .daterangepicker th { height: 32px; }
	.daterangepicker .range_inputs .btn { min-height: 34px; padding: 6px 12px; }

	/* Elenchi delle anagrafiche: con `white-space: initial` (sopra) ogni cella andava a
	   capo a ogni parola, «Min: / 0 C / - / Max: / 10 C» su cinque righe. Le righe restano
	   su una linea e la tabella scorre. Legato alla classe perché su /events, provato,
	   spingeva la colonna del veicolo fuori vista. */
	.tabella-anagrafica .table-responsive > .table > thead > tr > th,
	.tabella-anagrafica .table-responsive > .table > tbody > tr > td { white-space: nowrap; }
	.tabella-anagrafica .table-responsive > .table > tbody > tr > td > div:not(.btn-group) { white-space: normal; }
	/* ...ma la prima colonna (il nome) va a capo: con i nomi veri della produzione — fino a
	   87 caratteri — l'elenco spoke diventava largo 1.472 px e i pulsanti finivano a quattro
	   schermate di distanza. */
	.tabella-anagrafica .table-responsive > .table > tbody > tr > td:first-child { white-space: normal; min-width: 12rem; }
	/* Elenco mezzi: la «Sintesi» è un blocco che la tabella schiacciava a 110 px. Solo qui
	   sotto i 768: fra 768 e 991 spingeva il pulsante del dettaglio fuori dal riquadro. */
	.tabella-anagrafica .table-responsive > .table > tbody > tr > td > div:not(.btn-group) { min-width: 18rem; }
	/* Il prezzo del nowrap: le righe sono basse ma matita e croce finivano a una o due
	   schermate di scorrimento (sui sensori a x=763). L'ultima colonna, quella dei pulsanti,
	   resta appiccicata al bordo destro mentre il resto scorre — come la prima colonna della
	   griglia della flotta. Il fondo va dichiarato: una cella appiccicosa trasparente lascia
	   vedere il testo che le scorre sotto (#f2f2f2 = il grigio delle righe alterne). */
	.tabella-anagrafica .table-responsive > .table > thead > tr > th:last-child,
	.tabella-anagrafica .table-responsive > .table > tbody > tr > td:last-child {
		position: sticky; right: 0; z-index: 1; background-color: #fff;
		box-shadow: -6px 0 6px -4px rgba(0, 0, 0, .25);
	}
	.tabella-anagrafica .table-striped > tbody > tr:nth-of-type(odd) > td:last-child,
	.tabella-anagrafica .table-responsive > .table > tbody > tr.table-filters > td:last-child { background-color: #f2f2f2; }

	/* Avvisi lunghi nei riquadri («TRACKER DISCONNESSO DA 10208 MINUTI»): .badge è nowrap
	   e l'avviso veniva tagliato a destra. */
	.box-body p .badge { white-space: normal; text-align: left; line-height: 1.35; }

	/* Griglia della flotta: i numeri cliccabili erano bersagli da 16 x 17 px. */
	.griglia-flotta td > a { display: inline-block; padding: 8px 6px; }

	/* Tragitto disegnato di /reports.distance.track: viewBox 900 x 560 reso in 255 px,
	   scala illeggibile e tracciato spesso 0,85 px. */
	.tragitto-svg path, .tragitto-svg line { vector-effect: non-scaling-stroke; }
	.tragitto-svg text { font-size: 40px; }
}

@media screen and (max-width: 575px) {
	/* Sotto i 576 px la stylelib mostra già «pagina/totale» (.onlybox, d-sm-none): la
	   casella vuota del desktop è un doppione. NON allargare a 767: fra 576 e 767 la
	   .onlybox è nascosta e non resterebbe nessuna casella. */
	.box-tools .gotopage:not(.onlybox) { display: none; }
	/* 9em: «12345/190000» — gli eventi arrivano a 190.000 pagine — a 100 px diventava «12345/190». */
	.pagination > li > .gotopage.onlybox input { width: 9em; }

	/* Scheda del mezzo: i quattro dati 2 x 2 e senza icona, invece di quattro riquadri
	   impilati alti 540 px che spingevano l'avviso di disconnessione sotto la piega. */
	.scheda-veicolo-dati .info-box { min-height: 0; margin-bottom: 12px; padding: 10px 12px; }
	.scheda-veicolo-dati .info-box-icon { display: none; }
	.scheda-veicolo-dati .info-box-content { margin-left: 0; padding: 0; }
	.scheda-veicolo-dati .info-box-number { display: block; font-size: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	.scheda-veicolo-dati .info-box-text { font-size: 12px; }
}

@media screen and (max-width: 768px) {
	/* Login su telefono e iPad verticale: il riquadro era largo 691 px e appoggiato al bordo
	   destro, perché la regola `min-width: 767px` qui sopra (margin 10%) si sovrapponeva a
	   quella del tema a `max-width: 768px`. */
	.login-page { background-size: cover; padding-top: 20px; }
	.login-page .login-box { margin: 0 auto; max-width: 420px; }
}

/* Bootstrap 4 non mette `pointer-events: none` sul tooltip (Bootstrap 5 sì, di default).
   Su un bottone piccolo (`.btn-xs`, icona sola) vicino al bordo di una tabella, il tooltip
   può capitare a cavallo del bottone stesso: misurato su .giornate .btn-group, dove il
   tooltip "Vedi il dettaglio" arrivava a coprire l'intero pulsante e il click, invece di
   navigare, colpiva il `<div class="tooltip-inner">` sopra. Riguarda ogni tooltip del
   pannello, non solo quello. */
.tooltip { pointer-events: none; }