/* ============================================================
   Friday — override del tema base
   Caricato dopo custom.min.css per avere precedenza.
   ============================================================ */

/* Material Design Icons (self-hosted).
   Il tema Velzon usa MDI per breadcrumb-divider, accordion icons,
   close button, alcune icone in tabelle ed elenchi (\f012c, \f0140,
   \f0142, \f0156, \f035d, \f0360, \f0374, \f0415, \f0765, …).
   Carichiamo il solo font WOFF2 (~400KB) — nessun CSS aggiuntivo,
   le regole del tema usano già font-family: "Material Design Icons". */
@font-face {
	font-family: "Material Design Icons";
	src: url("../fonts/mdi/materialdesignicons-webfont.woff2") format("woff2");
	font-weight: normal;
	font-style: normal;
	font-display: block;
}

/* Google Places Autocomplete: il dropdown .pac-container ha z-index
   1000 di default, mentre i modali Bootstrap sono a 1055. Senza
   override, i suggerimenti finiscono sotto il modale e l'utente non
   li vede. Forziamo l'overlay sopra qualsiasi modale/offcanvas. */
.pac-container {
	z-index: 1100 !important;
}

/* Background sidebar — colore brand Friday */
:root,
[data-sidebar="dark"],
[data-sidebar-size],
html {
	--vz-vertical-menu-bg: #1a5589;
}

.app-menu.navbar-menu,
.app-menu.navbar-menu .navbar-brand-box,
.app-menu.navbar-menu .sidebar-background {
	background-color: #1a5589;
}

/* Fallback scroll del menu se Simplebar non parte. Calcolo l'altezza
   disponibile sotto il brand-box (~70px) per garantire scroll quando le
   voci superano la viewport. Simplebar, se inizializzato, sovrascrive
   questo con il suo wrapper. */
.app-menu.navbar-menu #scrollbar {
	overflow-y: auto;
	max-height: calc(100vh - 70px);
}

.app-menu.navbar-menu #scrollbar.simplebar-scrollable-y,
.app-menu.navbar-menu #scrollbar[data-simplebar].simplebar-scrollable-y {
	overflow: hidden;
	/* simplebar gestisce lo scroll via div interno */
}

/* Logo testuale "Friday" (al posto delle immagini png del tema).
   Centrato, peso bold, kerning leggero, colore bianco sul dark sidebar. */
.brand-friday {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	font-weight: 700;
	letter-spacing: -0.5px;
	text-decoration: none;
	line-height: 1;
}

.brand-friday__mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 6px;
	background: rgba(255, 255, 255, .18);
	color: #fff;
	font-size: 1rem;
	font-weight: 700;
}

.brand-friday__text {
	color: #fff;
	font-size: 1.25rem;
}

/* Sul tema con sidebar light, scuriamo il testo */
[data-sidebar="light"] .brand-friday__text {
	color: var(--vz-primary, #1a5589);
}

[data-sidebar="light"] .brand-friday__mark {
	background: rgba(26, 85, 137, .12);
	color: var(--vz-primary, #1a5589);
}

/* Login page: brand grande sopra il form */
.brand-friday--lg .brand-friday__mark {
	width: 40px;
	height: 40px;
	font-size: 1.25rem;
}

.brand-friday--lg .brand-friday__text {
	font-size: 1.75rem;
}

/* =====================================================
 * Chip selezione multipla — usato per "Tipologie applicate"
 * sul form impianto. Etichetta cliccabile a forma di pill,
 * check icon che appare a sinistra quando attiva.
 * ===================================================== */
.friday-chips {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
}

.friday-chip {
	position: relative;
	cursor: pointer;
	user-select: none;
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .45rem .9rem .45rem .8rem;
	border: 1.5px solid var(--vz-border-color, #e9ebec);
	background: #fff;
	border-radius: 9999px;
	font-size: .875rem;
	line-height: 1.2;
	color: var(--vz-body-color, #495057);
	transition: all .18s ease;
	margin: 0;
}

.friday-chip:hover {
	border-color: var(--vz-primary, #1a5589);
	background: rgba(26, 85, 137, .04);
	color: var(--vz-primary, #1a5589);
}

.friday-chip input[type="checkbox"] {
	/* nascondiamo l'input nativo ma lo lasciamo focusabile */
	position: absolute;
	opacity: 0;
	pointer-events: none;
	width: 0;
	height: 0;
}

.friday-chip__icon {
	width: 1.1em;
	height: 1.1em;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 1.05em;
	opacity: 0;
	transition: opacity .15s ease, transform .15s ease;
	transform: scale(.6);
}

.friday-chip--on {
	background: var(--vz-primary, #1a5589);
	border-color: var(--vz-primary, #1a5589);
	color: #fff;
	box-shadow: 0 2px 6px rgba(26, 85, 137, .25);
}

.friday-chip--on:hover {
	background: var(--vz-primary, #1a5589);
	color: #fff;
	filter: brightness(1.08);
}

.friday-chip--on .friday-chip__icon {
	opacity: 1;
	transform: scale(1);
}

/* Focus-visible per accessibilità tastiera */
.friday-chip input[type="checkbox"]:focus-visible+.friday-chip__icon,
.friday-chip:has(input[type="checkbox"]:focus-visible) {
	outline: 2px solid var(--vz-primary, #1a5589);
	outline-offset: 2px;
}

/* =====================================================
 * Global search — trigger nel topbar + modal centrale stile Spotlight
 * ===================================================== */

/* =====================================================
 * Dashboard mappa operativa — toggle layer
 * ===================================================== */
.dash-map__toggles {
	display: flex;
	flex-wrap: wrap;
	gap: .4rem;
}

.dash-map__toggle {
	--c: #1a5589;
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .25rem .65rem;
	background: #fff;
	border: 1.5px solid var(--c);
	color: var(--c);
	border-radius: 9999px;
	font-size: .8rem;
	cursor: pointer;
	user-select: none;
	transition: background .15s ease, opacity .15s ease;
	margin: 0;
}

.dash-map__toggle input[type="checkbox"] {
	position: absolute;
	opacity: 0;
	pointer-events: none;
	width: 0;
	height: 0;
}

.dash-map__toggle .dash-map__dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--c);
	flex-shrink: 0;
}

.dash-map__toggle .badge {
	font-size: .7rem;
	padding: 2px 6px;
}

.dash-map__toggle:hover {
	background: color-mix(in srgb, var(--c) 8%, white);
}

.dash-map__toggle--off {
	background: #f7f7fb;
	border-color: #e9ebec;
	color: #adb5bd;
	opacity: .65;
}

.dash-map__toggle--off .dash-map__dot {
	background: #adb5bd;
}

.dash-map__loading {
	position: absolute;
	top: 12px;
	left: 12px;
	background: rgba(255, 255, 255, .95);
	border: 1px solid var(--vz-border-color, #e9ebec);
	border-radius: 6px;
	padding: .35rem .7rem;
	font-size: .85rem;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
	z-index: 10;
}

.dash-map__info {
	max-width: 240px;
	font-size: .85rem;
}

.dash-map__info code {
	background: #f3f3f9;
	padding: 0 4px;
	border-radius: 3px;
}

/* Modal Spotlight: dialog centrato verso l'alto, backdrop più scuro */
.friday-search-modal .modal-dialog {
	margin-top: 10vh;
	max-width: 640px;
}

.modal-backdrop.show+.modal .friday-search-modal__header,
.friday-search-modal.show~.modal-backdrop.show {
	/* fallback no-op selector */
}

/* Backdrop più scuro sotto la search per dare focus al dialog */
.modal-backdrop.friday-search-backdrop {
	background: #0c1a2b;
	opacity: .55 !important;
}

.friday-search-modal .modal-content {
	border: 0;
	border-radius: 14px;
	overflow: hidden;
	box-shadow: 0 30px 80px rgba(0, 0, 0, .25);
}

.friday-search-modal__header {
	display: flex;
	align-items: center;
	gap: .75rem;
	padding: 1.1rem 1.25rem;
	border-bottom: 1px solid #f0f0f4;
}

.friday-search-modal__icon {
	color: var(--vz-text-muted, #878a99);
	font-size: 1.4rem;
}

.friday-search-modal__input {
	flex-grow: 1;
	border: 0;
	outline: 0;
	font-size: 1.15rem;
	color: #212529;
	background: transparent;
	padding: 0;
}

.friday-search-modal__input::placeholder {
	color: var(--vz-text-muted, #aaa);
	font-weight: 400;
}

.friday-search-modal__esc {
	background: #f3f3f9;
	border: 1px solid #e9ebec;
	color: #6c757d;
	padding: 2px 6px;
	border-radius: 4px;
	font-size: .7rem;
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

.friday-search-modal__spinner {
	margin-right: .35rem;
}

.friday-search-modal__body {
	max-height: 60vh;
	overflow-y: auto;
	padding: .5rem 0;
}

.friday-search-modal__hint {
	padding: 2.5rem 1rem 2rem;
	text-align: center;
	color: var(--vz-text-muted, #878a99);
	font-size: .9rem;
}

.friday-search-modal__group-title {
	padding: .8rem 1.25rem .35rem;
	font-size: .7rem;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--vz-text-muted, #878a99);
	font-weight: 600;
}

.friday-search-modal__item {
	display: flex;
	align-items: center;
	gap: .85rem;
	padding: .65rem 1.25rem;
	color: #212529;
	text-decoration: none;
	transition: background .12s ease;
	border-left: 3px solid transparent;
	outline: 0;
}

.friday-search-modal__item:hover,
.friday-search-modal__item:focus-visible,
.friday-search-modal__item:focus {
	background: rgba(26, 85, 137, .07);
	border-left-color: var(--vz-primary, #1a5589);
	color: #212529;
}

.friday-search-modal__item-icon {
	width: 36px;
	height: 36px;
	border-radius: 8px;
	background: rgba(26, 85, 137, .1);
	color: var(--vz-primary, #1a5589);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 1.1rem;
	flex-shrink: 0;
}

.friday-search-modal__item-title {
	font-size: .94rem;
	font-weight: 500;
	line-height: 1.25;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.friday-search-modal__item-sub {
	font-size: .8rem;
	color: var(--vz-text-muted, #878a99);
	margin-top: 2px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.friday-search-modal__item-go {
	color: var(--vz-text-muted, #adb5bd);
	font-size: 1.05rem;
	opacity: 0;
	transition: opacity .15s ease, transform .15s ease;
	transform: translateX(-4px);
}

.friday-search-modal__item:hover .friday-search-modal__item-go,
.friday-search-modal__item:focus .friday-search-modal__item-go {
	opacity: 1;
	transform: translateX(0);
}

.friday-search-modal__mark {
	background: rgba(26, 85, 137, .22);
	color: inherit;
	padding: 0 2px;
	border-radius: 3px;
	font-weight: 600;
}

.friday-search-modal__empty {
	padding: 2.5rem 1rem;
	text-align: center;
	color: var(--vz-text-muted, #878a99);
	font-size: .9rem;
}

.friday-search-modal__footer {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: .55rem 1.25rem;
	background: #f7f7fb;
	font-size: .72rem;
	color: var(--vz-text-muted, #878a99);
	border-top: 1px solid #f0f0f4;
}

.friday-search-modal__footer kbd {
	background: #fff;
	border: 1px solid #d0d3d9;
	color: #495057;
	padding: 1px 5px;
	border-radius: 3px;
	font-size: .68rem;
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

.friday-search-modal__item .min-w-0 {
	min-width: 0;
}

/* ============================================================
 *  Choices.js — allineamento al tema (look .form-select)
 *  Il choices.min.css base non combacia col tema Velzon: qui
 *  ridisegniamo il controllo come una form-select Bootstrap.
 * ============================================================ */

/* Niente margine sotto (il base mette 24px → campi sfalsati) */
.choices {
	margin-bottom: 0;
	position: relative;
	font-size: inherit;
}

.choices:focus {
	outline: none;
}

/* Il "box" del select = .form-select */
.choices__inner {
	display: flex;
	align-items: center;
	width: 100%;
	min-height: calc(1.5em + 0.75rem + 2px);
	padding: 0.375rem 2.25rem 0.375rem 0.75rem;
	font-size: 0.8125rem;
	font-weight: 400;
	line-height: 1.5;
	color: var(--vz-body-color, #212529);
	background-color: var(--vz-input-bg, #fff);
	border: 1px solid var(--vz-border-color, #ced4da);
	border-radius: var(--vz-border-radius, 0.25rem) !important;
	/* freccia identica a .form-select */
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23878a99' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
	background-size: 16px 12px;
	overflow: hidden;
	transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.choices[data-type*="select-multiple"] .choices__inner,
.choices[data-type*="text"] .choices__inner {
	background-image: none;
	/* multi/text: niente freccia */
	padding-right: 0.75rem;
	height: auto;
	flex-wrap: wrap;
}

/* La libreria aggiunge una sua freccia ::after: la togliamo (usiamo lo sfondo) */
.choices[data-type*="select-one"]::after {
	content: none !important;
}

/* Stato aperto/focus = focus della form-select */
.choices.is-focused .choices__inner,
.choices.is-open .choices__inner {
	border-color: var(--vz-primary, #405189);
	box-shadow: 0 0 0 0.15rem rgba(64, 81, 137, 0.25);
}

/* Disabilitato (es. impianto finché non scegli il cliente) */
.choices.is-disabled .choices__inner,
.choices.is-disabled .choices__input {
	background-color: var(--vz-light, #f3f6f9);
	cursor: not-allowed;
}

/* Valore selezionato (single) ben allineato a sinistra */
.choices__list {
	margin: 0;
	padding-left: 0;
	list-style: none;
}

.choices__list--single {
	flex: 1 1 auto;
	min-width: 0;
	padding: 0;
}

.choices__list--single .choices__item {
	width: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.choices__placeholder {
	opacity: .6;
}

/* Tag multipli */
.choices__list--multiple {
	display: inline;
}

.choices__list--multiple .choices__item {
	display: inline-block;
	padding: 2px 7px;
	margin: 2px 4px 2px 0;
	font-size: 0.72rem;
	font-weight: 400;
	color: #fff;
	background-color: var(--vz-primary, #405189);
	border: 1px solid var(--vz-primary, #405189);
	border-radius: 0.7rem;
}

/* Dropdown */
.choices__list--dropdown,
.choices__list[aria-expanded] {
	z-index: 1056;
	/* sopra i modali Bootstrap (1055) */
	background-color: var(--vz-secondary-bg, #fff);
	border: 1px solid var(--vz-border-color, #ced4da);
	border-radius: 0.25rem;
	box-shadow: 0 5px 18px rgba(0, 0, 0, .12);
	padding: 4px;
	margin-top: 2px;
	word-break: break-word;
}

.choices__list--dropdown .choices__list,
.choices__list[aria-expanded] .choices__list {
	margin: 0 !important;
	/* il tema mette margin:0 -16px → testo tagliato a sx */
	padding: 0 !important;
	max-height: 280px;
	overflow: auto;
}

.choices__list--dropdown .choices__item,
.choices__list[aria-expanded] .choices__item {
	font-size: 0.8125rem;
	padding: 0.4rem 0.6rem;
	border-radius: 0.25rem;
}

.choices__list--dropdown .choices__item--selectable.is-highlighted,
.choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
	background-color: var(--vz-tertiary-bg, #eef1f5);
	color: var(--vz-body-color, #212529);
}

/* nasconde l'etichetta "Press to select" del base */
.choices__list--dropdown .choices__item--selectable::after,
.choices__list[aria-expanded] .choices__item--selectable::after {
	display: none !important;
}

/* Campo di ricerca dentro il dropdown = .form-control */
.choices__input {
	padding: 0.375rem 0.6rem;
	font-size: 0.8125rem;
	background-color: var(--vz-input-bg, #fff);
	border: 1px solid var(--vz-border-color, #ced4da) !important;
	border-radius: 0.25rem;
	margin-bottom: 4px;
	color: var(--vz-body-color, #212529);
}

/* Dentro un .input-group (es. cliente + bottone "nuovo") */
.input-group>.choices {
	flex: 1 1 auto;
	width: 1%;
	margin-bottom: 0;
}

.input-group>.choices:not(:last-child) .choices__inner {
	border-top-right-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
}

.input-group>.choices:not(:first-child) .choices__inner {
	border-top-left-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
}

/* ---- Fix specifici contro il CSS base (specificità più alta) ---- */

/* Il base mette padding-bottom:7.5px sul select-one → testo non centrato.
   Riallineo il padding interno. */
.choices[data-type*="select-one"] .choices__inner {
	padding: 0.375rem 2.25rem 0.375rem 0.75rem;
	background-color: var(--vz-input-bg, #fff);
}

/* Il base dà padding-right:100px alle voci del dropdown (spazio per l'hint
   "Press to select"). Lo annulliamo: ecco il "listato sfalsato". */
.choices__list--dropdown .choices__item,
.choices__list[aria-expanded] .choices__item,
.choices__list--dropdown .choices__item--selectable,
.choices__list[aria-expanded] .choices__item--selectable,
.choices__list--dropdown .choices__item--selectable[data-select-text],
.choices__list[aria-expanded] .choices__item--selectable[data-select-text] {
	padding: 0.4rem 0.6rem !important;
	font-size: 0.8125rem;
}

/* Niente hint "Press to select" / freccia residua sulle voci */
.choices__list--dropdown .choices__item--selectable::after,
.choices__list[aria-expanded] .choices__item--selectable::after {
	content: none !important;
}

/* Il base usa display:inline-block sul valore singolo → riallineo a flex */
.choices[data-type*="select-one"] .choices__list--single {
	display: block;
}

/* Il campo di ricerca del base è inline-block con padding minimo: full width */
.choices__list--dropdown .choices__input {
	display: block;
	width: 100%;
	margin: 0 0 4px 0;
}

/* Dropdown dentro contenitori che fanno overflow (es. righe offerte/fatture
   in .table-responsive, o .card-body): quando un menu Choices è aperto il
   contenitore non deve tagliarlo. Si rilassa solo a dropdown aperto, quindi
   nessun effetto sullo scroll quando è chiuso. (:has già usato nel progetto) */
.table-responsive:has(.choices.is-open),
.card-body:has(.choices.is-open),
.card:has(.choices.is-open) {
	overflow: visible !important;
}
/* Postit "Le mie note" in dashboard */
.dash-note { background: #fff9c4; border: 1px solid #f3e58a; }
.dash-note .card-header { background: transparent; border-bottom: 1px solid #efdd7e; }
.dash-note .card-title { color: #7a6a14; }
.dash-note textarea { color: #5c5410; }
.dash-note textarea::placeholder { color: #b3a652; }