/*
==================================================
GESTIONALE CUSTOM - TASKS PAGE CSS (new.css)
==================================================
Stili moderni per la pagina Pratiche/Tasks.
Contiene:
- Variabili CSS globali (--gc-*)
- Border radius harmony per .gc-tasks-page
- Stat cards e filtri moderni
- Paginazione stile pill
- Filtro contatto con Select2
- Tabella tasks responsive con cards mobile
- Dropdown menu in child rows (responsive)
- Header sticky e scrollbar sincronizzata
- Badge, label e status moderni
==================================================
*/

.gc-tasks-page .gc-tasks-paging .paging_bootstrap > span,
.gc-tasks-page .gc-tasks-paging .paging_bootstrap > span > a,
.gc-tasks-page .gc-tasks-paging .paging_bootstrap > span > a.current {
	display: flex !important;
	flex-wrap: nowrap !important;
	gap: 8px !important;
	justify-content: center !important;
	align-items: center !important;
	flex-direction: row !important;
	min-width: 38px;
	height: 38px;
	padding: 0 12px;
	border: 1px solid var(--gc-border);
	border-radius: 999px;
	background: #fff;
	color: #344054;
	text-decoration: none;
	font-size: 14px;
}

.gc-tasks-page .gc-tasks-paging .paging_bootstrap > span > a.current {
	background: var(--gc-primary);
	border-color: var(--gc-primary);
	color: #fff;
}

.gc-tasks-page .gc-tasks-paging .paging_bootstrap > span > a.disabled {
	opacity: .5;
	cursor: not-allowed;
	pointer-events: none;
}
/*
  Global UI overrides for new filters & stat cards.
  Keep selectors scoped with `.gc-*` to avoid side effects.
*/

:root{
	--gc-surface: #ffffff;
	--gc-muted: #667085;
	--gc-border: #E5EAF2;
	--gc-shadow: 0 10px 30px rgba(16, 24, 40, 0.08);
	--gc-radius-lg: 16px;
	--gc-radius-md: 12px;
	--gc-radius-sm: 10px;
	--gc-radius-xs: 8px;
	--gc-primary-color: #1570EF;
}

/* ------------------------------------------------------------------
   Border radius harmony (Tasks page)
   Scoped to .gc-tasks-page to avoid global side effects
-------------------------------------------------------------------*/

.gc-tasks-page .panel.panel-default{
	border-radius: var(--gc-radius-lg) !important;
}

.gc-tasks-page .panel.panel-default > .panel-heading{
	border-top-left-radius: var(--gc-radius-lg) !important;
	border-top-right-radius: var(--gc-radius-lg) !important;
}

.gc-tasks-page .panel.panel-default > .panel-body,
.gc-tasks-page .panel.panel-default > .panel-footer{
	border-bottom-left-radius: var(--gc-radius-lg) !important;
	border-bottom-right-radius: var(--gc-radius-lg) !important;
}

.gc-tasks-page .form-group-default,
.gc-tasks-page .form-group-default .form-control,
.gc-tasks-page .form-group-default .select2-container .select2-choice,
.gc-tasks-page .input-group .input-group-addon,
.gc-tasks-page .select2-container .select2-choice,
.gc-tasks-page .select2-container-multi .select2-choices,
.gc-tasks-page .select2-drop,
.gc-tasks-page .dropdown-menu,
.gc-tasks-page .btn{
	border-radius: var(--gc-radius-md) !important;
}

/* Fix input-group/btn-group: primo elemento angoli solo a sinistra, ultimo solo a destra */
/* ESCLUDI tr.child (responsive) dove il bottone deve avere tutti gli angoli */
.gc-tasks-page .input-group > .form-control:first-child,
.gc-tasks-page .input-group > .input-group-addon:first-child,
.gc-tasks-page .input-group > .btn:first-child,
.gc-tasks-page .input-group > input:first-child + .input-group-addon,
.gc-tasks-page *:not(tr.child) > .btn-group > .btn:first-child:not(:only-child):not(.dropdown-toggle){
	border-top-right-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
	border-top-left-radius: var(--gc-radius-md) !important;
	border-bottom-left-radius: var(--gc-radius-md) !important;
}

.gc-tasks-page .input-group > .form-control:last-child,
.gc-tasks-page .input-group > .input-group-addon:last-child,
.gc-tasks-page .input-group > .btn:last-child,
.gc-tasks-page *:not(tr.child) > .btn-group > .btn:last-child:not(:only-child):not(.dropdown-toggle){
	border-top-left-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
	border-top-right-radius: var(--gc-radius-md) !important;
	border-bottom-right-radius: var(--gc-radius-md) !important;
}

/* Eccezione: pulsante singolo nel btn-group (es. Azioni) - tutti gli angoli arrotondati */
.gc-tasks-page .btn-group > .btn:only-child,
.gc-tasks-page .btn-group .dropdown-toggle,
.gc-tasks-page table.dataTable .btn-group .btn.dropdown-toggle,
.gc-tasks-page table.dataTable tr.child .btn-group .btn,
.gc-tasks-page table.dataTable tr.child .btn-group > .btn,
.gc-tasks-page table.dataTable tr.child .btn{
	border-radius: var(--gc-radius-md) !important;
}

/* Input nascosto seguito da addon: l'addon prende angoli a sinistra */
.gc-tasks-page .input-group > input[type="hidden"]:first-child + .input-group-addon,
.gc-tasks-page .input-group > input[type="hidden"]:first-child + .btn{
	border-top-left-radius: var(--gc-radius-md) !important;
	border-bottom-left-radius: var(--gc-radius-md) !important;
	border-top-right-radius: var(--gc-radius-md) !important;
	border-bottom-right-radius: var(--gc-radius-md) !important;
}

/* Stile contatto nel filtro */
.gc-tasks-page #filter_contact_wrapper{
	position: relative;
}

/* Container con contatto selezionato */
.gc-tasks-page .gc-contact-selected{
	display: flex;
	align-items: center;
	gap: 8px;
}

.gc-tasks-page .gc-contact-selected #str_assigned_task_contact{
	flex: 1;
	min-width: 0;
	font-size: 14px;
	font-weight: 500;
	color: #101828;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	min-height: 35px;
	line-height: 35px;
}

.gc-tasks-page .gc-contact-selected #btn_clear_filter_by_contact{
	width: 24px;
	height: 24px;
	min-width: 24px;
	flex-shrink: 0;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50% !important;
	background: var(--gc-primary-color) !important;
	border-color: var(--gc-primary-color) !important;
	color: #fff !important;
	font-size: 10px;
}

.gc-tasks-page .gc-contact-selected #btn_clear_filter_by_contact:hover{
	opacity: 0.85;
}

/* Container ricerca contatto (select2) */
.gc-tasks-page .gc-contact-search{
	display: flex;
	align-items: center;
	gap: 8px;
}

.gc-tasks-page .gc-contact-search .select2-container{
	flex: 1;
	min-width: 0;
}

.gc-tasks-page .gc-contact-search #btn_clear_filter_by_contact{
	width: 24px;
	height: 24px;
	min-width: 24px;
	flex-shrink: 0;
	padding: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50% !important;
	background: var(--gc-primary-color) !important;
	border-color: var(--gc-primary-color) !important;
	color: #fff !important;
	font-size: 10px;
}

/* Smaller controls */
.gc-tasks-page .btn.btn-xs,
.gc-tasks-page .btn.btn-sm{
	border-radius: var(--gc-radius-sm) !important;
}

/* Keep pill-like elements as pills */
.gc-tasks-page .label,
.gc-tasks-page .badge,
.gc-tasks-page .gc-pill,
.gc-tasks-page .gc-status-badge{
	border-radius: 999px !important;
}

/* Inputs within form-group-default sometimes inherit squared corners */
.gc-tasks-page input.form-control,
.gc-tasks-page select.form-control,
.gc-tasks-page textarea.form-control{
	border-radius: var(--gc-radius-md) !important;
}

/* Table container rounding */
.gc-tasks-page .gc-table-panel{
	border-radius: var(--gc-radius-lg);
}

/* Dropdown action menu inside table/responsive */
.gc-tasks-page .dropdown-menu{
	border-radius: var(--gc-radius-md) !important;
}

/* Avoid rounding the pagination circles */
.gc-tasks-page .dataTables_wrapper .dataTables_paginate ul > li > a,
.gc-tasks-page .dataTables_wrapper .dataTables_paginate ul > li > span{
	border-radius: 50% !important;
}

/* ------------------------------------------------------------------
   Tasks table: horizontal scroll + top scrollbar sync (desktop)
   Mobile: cards generated automatically (JS)
-------------------------------------------------------------------*/

.gc-tasks-page .table-responsive{
	-webkit-overflow-scrolling: touch;
}

/* Desktop: container tabella scrollabile orizzontalmente */
.gc-tasks-page #container_table_tasks{
	overflow-x: hidden;
	overflow-y: visible;
	-webkit-overflow-scrolling: touch;
}

/* Mostra scrollbar solo quando c'è overflow (JS aggiunge classe .has-overflow) */
.gc-tasks-page #container_table_tasks.has-overflow{
	overflow-x: auto;
}

/* Stile per dropdown che si apre verso l'alto */
.gc-tasks-page #table_tasks .dropdown-menu.dropdown-menu-up{
	margin-top: 0;
	margin-bottom: 2px;
}

/* Scrollbar superiore - nascosta di default, visibile solo con .has-overflow */
.gc-tasks-page .gc-table-scroll-top{
	overflow-x: auto;
	overflow-y: hidden;
	height: 14px;
	margin: 0 0 10px 0;
	display: none;
}

.gc-tasks-page .gc-table-scroll-top.has-overflow{
	display: block;
}

.gc-tasks-page .gc-table-scroll-top__inner{
	height: 1px;
}

/* Keep table cells on one line so horizontal scroll is meaningful */
/* Header può andare a capo, celle dati restano su una riga */
.gc-tasks-page #table_tasks thead th{
	white-space: normal;
	word-wrap: break-word;
}

.gc-tasks-page #table_tasks tbody td{
	white-space: normal;
}

/* Mobile: hide the table and show cards */
@media (max-width: 991px){
	.gc-tasks-page .gc-table-scroll-top{
		display: none !important;
	}

	/* Nasconde scrollbar container in mobile */
	.gc-tasks-page #container_table_tasks{
		overflow-x: hidden !important;
		overflow-y: hidden !important;
	}

	/* In mobile usiamo la paginazione duplicata (sopra/sotto card) */
	.gc-tasks-page .dataTables_wrapper .dataTables_paginate{
		display: none !important;
	}

	/* Nasconde info originale in mobile (la mostriamo sotto le card) */
	.gc-tasks-page .dataTables_wrapper .dataTables_info{
		display: none !important;
	}

	.gc-tasks-page #table_tasks{
		display: none;
	}

	.gc-tasks-page #gc_tasks_cards{
		display: block;
	}

	.gc-tasks-page .gc-tasks-paging{
		display: block;
	}

	/* Info righe mobile - mostrata sotto paginazione bottom */
	.gc-tasks-page .gc-tasks-info-mobile{
		display: block;
		text-align: center;
		font-size: 13px;
		color: #667085;
		padding: 12px 0 8px 0;
		margin-top: 4px;
	}
}

/* Info mobile nascosta su desktop */
.gc-tasks-page .gc-tasks-info-mobile{
	display: none;
}

.gc-tasks-page .gc-tasks-paging{
	display: none;
	margin: 8px 0 12px 0;
}

.gc-tasks-page .gc-tasks-paging .dataTables_paginate,
.gc-tasks-page .gc-tasks-paging .paging_bootstrap{
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: wrap !important;
	justify-content: center !important;
	align-items: center !important;
	gap: 6px !important;
}

/* Forza layout orizzontale su ul.pagination in paginazione mobile */
.gc-tasks-page .gc-tasks-paging ul,
.gc-tasks-page .gc-tasks-paging ul.pagination{
	margin: 0 !important;
	padding-left: 0 !important;
	list-style: none !important;
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
	justify-content: center !important;
	align-items: center !important;
}

.gc-tasks-page .gc-tasks-paging ul > li,
.gc-tasks-page .gc-tasks-paging ul.pagination > li{
	display: inline-flex !important;
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

.gc-tasks-page .gc-tasks-paging .paging_bootstrap > span{
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
	justify-content: center !important;
	align-items: center !important;
	flex-direction: row !important;
}

/* Stili link paginazione mobile */
.gc-tasks-page .gc-tasks-paging ul > li > a,
.gc-tasks-page .gc-tasks-paging ul > li > span,
.gc-tasks-page .gc-tasks-paging ul.pagination > li > a,
.gc-tasks-page .gc-tasks-paging ul.pagination > li > span{
	min-width: 38px !important;
	height: 38px !important;
	padding: 0 12px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	border: 1px solid var(--gc-border) !important;
	border-radius: 999px !important;
	background: #fff !important;
	color: #344054 !important;
	text-decoration: none !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	box-sizing: border-box !important;
}

.gc-tasks-page .gc-tasks-paging ul > li.active > a,
.gc-tasks-page .gc-tasks-paging ul > li.active > span,
.gc-tasks-page .gc-tasks-paging ul.pagination > li.active > a,
.gc-tasks-page .gc-tasks-paging ul.pagination > li.active > span{
	background: var(--gc-primary-color) !important;
	border-color: var(--gc-primary-color) !important;
	color: #fff !important;
}

.gc-tasks-page .gc-tasks-paging ul > li.disabled > a,
.gc-tasks-page .gc-tasks-paging ul > li.disabled > span,
.gc-tasks-page .gc-tasks-paging ul.pagination > li.disabled > a,
.gc-tasks-page .gc-tasks-paging ul.pagination > li.disabled > span{
	opacity: .5 !important;
	cursor: not-allowed !important;
	pointer-events: none !important;
}

/* Fix paginazione Bootstrap che non ha ul.pagination ma span>a diretto */
.gc-tasks-page .gc-tasks-paging .paging_bootstrap > span > a{
	min-width: 38px !important;
	height: 38px !important;
	padding: 0 12px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	border: 1px solid var(--gc-border) !important;
	border-radius: 999px !important;
	background: #fff !important;
	color: #344054 !important;
	text-decoration: none !important;
	font-size: 14px !important;
	font-weight: 500 !important;
}

.gc-tasks-page .gc-tasks-paging .paging_bootstrap > span > a.current,
.gc-tasks-page .gc-tasks-paging .paging_bootstrap > span > a:hover:not(.disabled){
	background: var(--gc-primary-color) !important;
	border-color: var(--gc-primary-color) !important;
	color: #fff !important;
}

.gc-tasks-page .gc-tasks-paging .paging_bootstrap > span > a.disabled{
	opacity: .5 !important;
	cursor: not-allowed !important;
	pointer-events: none !important;
}

.gc-tasks-page .gc-tasks-cards{
	display: none;
}

.gc-tasks-page .gc-task-card{
	background: #fff;
	border: 1px solid var(--gc-border);
	border-radius: var(--gc-radius-lg);
	box-shadow: 0 8px 20px rgba(16, 24, 40, 0.06);
	padding: 12px;
	margin-bottom: 12px;
}

.gc-tasks-page .gc-task-card__head{
	font-weight: 700;
	color: #101828;
	margin-bottom: 10px;
}

.gc-tasks-page .gc-task-card__body{
	display: grid;
	grid-template-columns: 1fr;
	gap: 8px;
}

.gc-tasks-page .gc-task-card__row{
	display: grid;
	grid-template-columns: 140px 1fr;
	gap: 10px;
	align-items: start;
}

.gc-tasks-page .gc-task-card__label{
	color: var(--gc-muted);
	font-size: 12px;
	line-height: 1.2;
}

.gc-tasks-page .gc-task-card__value{
	color: #101828;
	font-size: 13px;
	line-height: 1.25;
}

.gc-tasks-page .gc-task-card__actions{
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px solid var(--gc-border);
	display: flex;
	justify-content: center;
	gap: 8px;
}

@media (max-width: 480px){
	.gc-tasks-page .gc-task-card__row{
		grid-template-columns: 1fr;
		gap: 4px;
	}
}

/* ------------------------------------------------------------------
   Stat cards
-------------------------------------------------------------------*/

.gc-stat-grid{
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
	margin-bottom: 18px;
}

@media (max-width: 1200px){
	.gc-stat-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 768px){
	.gc-stat-grid{ grid-template-columns: 1fr; }
}

.gc-stat-card{
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px 18px;
	border-radius: var(--gc-radius-lg);
	border: 1px solid var(--gc-border);
	background: var(--gc-surface);
	box-shadow: none;
}

.gc-stat-card__meta{
	min-width: 0;
}

.gc-stat-card__label{
	font-size: 13px;
	line-height: 1.2;
	color: #475467;
	margin-bottom: 10px;
}

.gc-stat-card__value{
	font-size: 34px;
	line-height: 1;
	font-weight: 700;
	color: #101828;
}

.gc-stat-card__icon{
	width: 44px;
	height: 44px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 12px;
	flex: 0 0 auto;
	font-size: 18px;
}

.gc-stat--blue{ background: #EFF6FF; border-color: #D6E4FF; }
.gc-stat--blue .gc-stat-card__icon{ background: #DBEAFE; color: #2563EB; }

.gc-stat--amber{ background: #FFF7ED; border-color: #FFE3C3; }
.gc-stat--amber .gc-stat-card__icon{ background: #FFEFD6; color: #C2410C; }

.gc-stat--rose{ background: #FFF1F2; border-color: #FFD0D5; }
.gc-stat--rose .gc-stat-card__icon{ background: #FFE4E6; color: #E11D48; }

.gc-stat--green{ background: #ECFDF3; border-color: #C7F2D7; }
.gc-stat--green .gc-stat-card__icon{ background: #D1FAE5; color: #16A34A; }

/* Title icon before "Filtra risultati" */
.gc-panel-title-icon{
	color: #1570EF;
	font-size: 16px;
	margin-right: 8px;
}

/* ------------------------------------------------------------------
   Tabs (radio -> pills)
-------------------------------------------------------------------*/

.gc-filter-tabs{
	margin-top: 6px;
}

.gc-filter-tabs input[type="radio"]{
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.gc-filter-tabs label{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 8px 16px;
	border-radius: 999px;
	border: 1px solid var(--gc-border);
	background: #ffffff;
	color: #101828;
	font-weight: 500;
	font-size: 13px;
	margin-right: 8px;
	margin-bottom: 8px;
	cursor: pointer;
	user-select: none;
	transition: all 0.15s ease;
}

/* Kill the Pages theme radio circles within our pill tabs */
.gc-filter-tabs label:before,
.gc-filter-tabs label:after,
.gc-filter-tabs.radio label:before,
.gc-filter-tabs.radio label:after,
.gc-filter-tabs.radio-success label:before,
.gc-filter-tabs.radio-success label:after{
	display: none !important;
	content: none !important;
}

.gc-filter-tabs input[type="radio"] + label{
	padding-left: 14px !important;
	margin-left: 0 !important;
}

.gc-filter-tabs input[type="radio"]:checked + label{
	background: var(--gc-primary-color) !important;
	border-color: var(--gc-primary-color) !important;
	color: #ffffff !important;
}

/* ------------------------------------------------------------------
   Table panel header (Elenco Pratiche)
-------------------------------------------------------------------*/

.gc-table-panel{
	border-radius: var(--gc-radius-lg);
	border: 1px solid var(--gc-border);
	overflow: hidden;
}

.gc-table-header{
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 20px;
	background: #ffffff;
	border-bottom: 1px solid var(--gc-border);
	flex-wrap: wrap;
	gap: 12px;
}

.gc-table-header__left{
	display: flex;
	align-items: center;
	gap: 14px;
}

.gc-table-header__icon{
	width: 48px;
	height: 48px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 12px;
	background: #DBEAFE;
	color: #2563EB;
	font-size: 20px;
}

.gc-table-header__meta{
	min-width: 0;
}

.gc-table-header__title{
	font-size: 16px;
	font-weight: 600;
	color: #101828;
	line-height: 1.3;
}

.gc-table-header__count{
	font-size: 13px;
	color: #667085;
	margin-top: 2px;
}

.gc-table-header__actions{
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}

/* Pulsante adatta colonne - nascosto su mobile */
#btn_fit_columns{
	display: none;
}

@media (min-width: 992px){
	#btn_fit_columns{
		display: inline-flex;
	}
}

@media (min-width: 1200px){
	#btn_fit_columns span{
		display: inline;
	}
}

@media (max-width: 1199px){
	#btn_fit_columns span{
		display: none;
	}
}

.gc-btn-outline{
	border-radius: var(--gc-radius-md) !important;
	border: 1px solid var(--gc-border) !important;
	background: #ffffff !important;
	color: #344054 !important;
	font-weight: 500 !important;
	font-size: 13px !important;
	padding: 10px 16px !important;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.gc-btn-outline:hover{
	background: #F9FAFB !important;
}

.gc-btn-primary{
	border-radius: var(--gc-radius-md) !important;
	border: 1px solid var(--gc-primary-color) !important;
	background: var(--gc-primary-color) !important;
	color: #ffffff !important;
	font-weight: 600 !important;
	font-size: 13px !important;
	padding: 10px 16px !important;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.gc-btn-primary:hover{
	opacity: 0.9;
}

/* ------------------------------------------------------------------
   DataTables pagination override
-------------------------------------------------------------------*/

.dataTables_wrapper .dataTables_paginate{
	text-align: right;
	padding-top: 16px;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 6px;
}

/* DataTables (paging_bootstrap) markup: <div class="dataTables_paginate ..."><ul><li class="prev|next|active|disabled"><a>...</a> */
.dataTables_wrapper .dataTables_paginate ul,
.dataTables_wrapper .dataTables_paginate ul.pagination{
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.dataTables_wrapper .dataTables_paginate ul > li{
	margin: 0 !important;
	padding: 0 !important;
}

.dataTables_wrapper .dataTables_paginate ul > li > a,
.dataTables_wrapper .dataTables_paginate ul > li > span{
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0 !important;
	border-radius: 50% !important;
	border: 1px solid var(--gc-border) !important;
	background: #ffffff !important;
	color: #344054 !important;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	box-shadow: none !important;
	text-decoration: none !important;
	transition: all 0.15s ease;
}

.dataTables_wrapper .dataTables_paginate ul > li > a:hover{
	background: #F2F4F7 !important;
	border-color: #D0D5DD !important;
	color: #101828 !important;
}

.dataTables_wrapper .dataTables_paginate ul > li.active > a,
.dataTables_wrapper .dataTables_paginate ul > li.active > a:hover{
	background: var(--gc-primary-color) !important;
	border-color: var(--gc-primary-color) !important;
	color: #ffffff !important;
}

.dataTables_wrapper .dataTables_paginate ul > li.disabled > a,
.dataTables_wrapper .dataTables_paginate ul > li.disabled > a:hover{
	background: #F9FAFB !important;
	border-color: #E5EAF2 !important;
	color: #D0D5DD !important;
	cursor: not-allowed;
	opacity: 0.7;
}

/* Prev/Next: mantieni cerchio e centra l'icona */
.dataTables_wrapper .dataTables_paginate ul > li.prev > a,
.dataTables_wrapper .dataTables_paginate ul > li.next > a{
	font-size: 14px;
}

.dataTables_wrapper .dataTables_paginate ul > li.prev > a i,
.dataTables_wrapper .dataTables_paginate ul > li.next > a i{
	font-size: 16px;
	line-height: 1;
}

.dataTables_wrapper .dataTables_paginate .paginate_button{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	margin: 0;
	border-radius: 50% !important;
	border: 1px solid var(--gc-border) !important;
	background: #ffffff !important;
	color: #344054 !important;
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
	transition: all 0.15s ease;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover{
	background: #F2F4F7 !important;
	border-color: #D0D5DD !important;
	color: #101828 !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{
	background: var(--gc-primary-color) !important;
	border-color: var(--gc-primary-color) !important;
	color: #ffffff !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover{
	background: #F9FAFB !important;
	border-color: #E5EAF2 !important;
	color: #D0D5DD !important;
	cursor: not-allowed;
	opacity: 0.6;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.previous,
.dataTables_wrapper .dataTables_paginate .paginate_button.next{
	font-size: 14px;
	width: 36px;
	height: 36px;
}

/* DataTables info text */
.dataTables_wrapper .dataTables_info{
	font-size: 13px;
	color: #667085;
	padding-top: 14px;
}

/* ------------------------------------------------------------------
   Progress bar (task checklist)
-------------------------------------------------------------------*/

.gc-progress{
	display: flex;
	align-items: center;
	gap: 8px;
	justify-content: center;
}

.gc-progress__bar{
	width: 50px;
	height: 4px;
	background: #E5EAF2;
	border-radius: 999px;
	overflow: hidden;
	flex-shrink: 0;
}

.gc-progress__fill{
	height: 100%;
	border-radius: 999px;
	background: #F97066;
	transition: width 0.3s ease;
}

.gc-progress__fill--low{
	background: #F97066;
}

.gc-progress__fill--mid{
	background: #FDB022;
}

.gc-progress__fill--high{
	background: #32D583;
}

.gc-progress__text{
	font-size: 12px;
	color: #667085;
	white-space: nowrap;
	min-width: 32px;
	text-align: center;
}

.gc-progress__badge{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 2px 8px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 600;
	white-space: nowrap;
	min-width: 36px;
}

.gc-progress__badge--low{
	background: #FEE4E2;
	color: #F04438;
}

.gc-progress__badge--mid{
	background: #FEF0C7;
	color: #DC6803;
}

.gc-progress__badge--high{
	background: #D1FADF;
	color: #039855;
}

/* ------------------------------------------------------------------
   Date badges (scadenza e date generiche)
-------------------------------------------------------------------*/

.gc-date-badge{
	display: inline-block;
	padding: 4px 10px;
	border-radius: var(--gc-radius-sm);
	font-size: 13px;
	font-weight: 500;
	color: #344054;
	background: transparent;
}

.gc-date-badge--neutral{
	color: #667085;
	background: #F9FAFB;
	border: 1px solid #E5EAF2;
}

.gc-date-badge--danger{
	color: #F04438;
	background: #FEF3F2;
	border: 1px solid #FECDCA;
}

.gc-date-badge--warning{
	color: #DC6803;
	background: #FFFAEB;
	border: 1px solid #FEDF89;
}

/* ------------------------------------------------------------------
   Status badge (In lavorazione, Trasmessa, etc)
-------------------------------------------------------------------*/

.gc-status-badge{
	display: inline-block;
	padding: 4px 12px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 500;
	color: #344054;
	background: #F9FAFB;
	border: 1px solid #E5EAF2;
}

.gc-status-badge--success{
	color: #039855;
	background: #ECFDF3;
	border-color: #A6F4C5;
}

.gc-status-badge--info{
	color: #0284c7;
	background: #e0f2fe;
	border-color: #7dd3fc;
}

.gc-status-badge--warning{
	color: #DC6803;
	background: #FFFAEB;
	border-color: #FEDF89;
}

.gc-status-badge--danger{
	color: #F04438;
	background: #FEF3F2;
	border-color: #FECDCA;
}

.gc-status-badge--muted{
	color: #667085;
	background: #F9FAFB;
	border-color: #E5EAF2;
}

/* ------------------------------------------------------------------
   Oggetto task cell
-------------------------------------------------------------------*/

.gc-taskcell{
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

.gc-taskcell__title{
	font-size: 13px;
	font-weight: 700;
	color: #101828;
	line-height: 1.25;
	letter-spacing: 0.2px;
}

.gc-taskcell__sub{
	line-height: 1.2;
}

.gc-taskcell__meta{
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	color: #667085;
	font-size: 12px;
}

.gc-taskmeta__item{
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.gc-pill{
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 3px 10px;
	border-radius: 999px;
	border: 1px solid #E5EAF2;
	background: #F9FAFB;
	color: #344054;
	font-size: 11px;
	font-weight: 600;
	white-space: nowrap;
}

.gc-pill i{
	font-size: 12px;
	line-height: 1;
}

.gc-pill--amber{
	background: #FFFAEB;
	border-color: #FEDF89;
	color: #B54708;
}

.gc-pill--teal{
	background: #ECFDF3;
	border-color: #A6F4C5;
	color: #027A48;
}

.gc-pill--blue{
	background: #EFF8FF;
	border-color: #B2DDFF;
	color: #175CD3;
}

/* ------------------------------------------------------------------
   Resizable table columns
-------------------------------------------------------------------*/

.gc-table-resizable thead th{
	position: relative;
	overflow: visible;
}

/* Keep DataTables sort icons away from the resize handle */
.gc-table-resizable.dataTable thead th.sorting,
.gc-table-resizable.dataTable thead th.sorting_asc,
.gc-table-resizable.dataTable thead th.sorting_desc,
.gc-table-resizable.dataTable thead th.sorting_asc_disabled,
.gc-table-resizable.dataTable thead th.sorting_desc_disabled{
	background-position: right 26px center !important;
	padding-right: 46px !important;
}

.gc-col-resize-handle{
	position: absolute;
	top: 0;
	right: 0;
	width: 14px;
	height: 100%;
	cursor: col-resize;
	background: transparent;
	z-index: 10;
	touch-action: none;
}

.gc-col-resize-handle:after{
	content: "";
	position: absolute;
	top: 8px;
	bottom: 8px;
	right: 6px;
	width: 2px;
	border-radius: 999px;
	background: #D0D5DD;
	opacity: 0.25;
	transition: opacity 0.15s ease, background 0.15s ease;
}

.gc-col-resize-handle:hover,
.gc-col-resize-handle.active{
	background: transparent;
	opacity: 1;
}

.gc-col-resize-handle:hover:after,
.gc-col-resize-handle.active:after{
	background: var(--gc-primary-color);
	opacity: 0.9;
}

body.gc-col-resizing{
	cursor: col-resize !important;
	user-select: none !important;
	-webkit-user-select: none !important;
}

body.gc-col-resizing *{
	cursor: col-resize !important;
}

/* Make table use fixed layout for resizing */
.gc-table-resizable{
	table-layout: fixed;
}

.gc-table-resizable th,
.gc-table-resizable td{
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Allow wrapping in specific cells (oggetto task) */
.gc-table-resizable td .gc-taskcell,
.gc-table-resizable td .gc-taskcell *{
	white-space: normal;
	word-wrap: break-word;
}

/* ------------------------------------------------------------------
   DataTables Responsive - Child row modern styling
-------------------------------------------------------------------*/

/* Toggle button (+ / -) */
table.dataTable.dtr-inline.collapsed tbody td:first-child:before,
table.dataTable.dtr-inline.collapsed tbody th:first-child:before{
	top: 50% !important;
	transform: translateY(-50%);
	left: 8px !important;
	height: 22px !important;
	width: 22px !important;
	font-size: 14px !important;
	line-height: 18px !important;
	border: none !important;
	border-radius: 8px !important;
	box-shadow: 0 2px 6px rgba(16, 24, 40, 0.1) !important;
	background: var(--gc-primary-color) !important;
	color: #fff !important;
	font-weight: 600 !important;
	transition: transform 0.15s ease, background 0.15s ease;
}

table.dataTable.dtr-inline.collapsed tbody tr.parent td:first-child:before,
table.dataTable.dtr-inline.collapsed tbody tr.parent th:first-child:before{
	background: #F04438 !important;
	content: '−' !important;
}

/* Child row container */
table.dataTable tr.child{
	background: linear-gradient(135deg, #F9FAFB 0%, #F2F4F7 100%) !important;
	padding: 0 !important;
}

table.dataTable tr.child > td{
	padding: 16px 20px 20px 44px !important;
	border-left: 3px solid var(--gc-primary-color) !important;
}

table.dataTable tr.child:hover{
	background: linear-gradient(135deg, #F9FAFB 0%, #F2F4F7 100%) !important;
}

/* Child row list */
table.dataTable tr.child ul.dtr-details{
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 12px 24px;
	width: 100%;
	margin: 0 !important;
	padding: 0 !important;
}

table.dataTable tr.child ul.dtr-details li{
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 12px 16px !important;
	margin: 0;
	background: #ffffff;
	border: 1px solid var(--gc-border);
	border-radius: 10px;
	box-shadow: 0 1px 3px rgba(16, 24, 40, 0.04);
	white-space: normal !important;
	transition: box-shadow 0.15s ease;
}

table.dataTable tr.child ul.dtr-details li:hover{
	box-shadow: 0 4px 12px rgba(16, 24, 40, 0.08);
}

table.dataTable tr.child ul.dtr-details li:first-child{
	padding-top: 12px !important;
}

table.dataTable tr.child ul.dtr-details li:last-child{
	border-bottom: 1px solid var(--gc-border) !important;
}

/* Label */
table.dataTable tr.child span.dtr-title{
	display: block !important;
	min-width: unset !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	color: #667085 !important;
	margin-bottom: 2px;
}

/* Value */
table.dataTable tr.child span.dtr-data{
	display: block;
	font-size: 13px;
	font-weight: 500;
	color: #101828;
	line-height: 1.4;
	word-break: break-word;
}

/* Make badges/pills inside child rows look good */
table.dataTable tr.child .gc-date-badge,
table.dataTable tr.child .gc-status-badge,
table.dataTable tr.child .gc-pill,
table.dataTable tr.child .gc-progress{
	margin-top: 4px;
}

/* Progress bar in child row - stack vertically */
table.dataTable tr.child .gc-progress{
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
}

table.dataTable tr.child .gc-progress__bar{
	width: 100%;
	max-width: 120px;
}

/* ------------------------------------------------------------------
   Dropdown "Azioni" - DESKTOP MODE (normal table rows)
   Fix: menu hidden by next row
-------------------------------------------------------------------*/

/* Allow dropdown to overflow table */
.table-responsive{
	overflow: visible !important;
}

table.dataTable{
	overflow: visible !important;
}

table.dataTable tbody{
	overflow: visible !important;
}

table.dataTable tbody tr{
	position: relative;
}

table.dataTable tbody td{
	overflow: visible !important;
}

/* Desktop dropdown positioning */
table.dataTable > tbody > tr:not(.child) .btn-group,
table.dataTable > tbody > tr:not(.child) .dropdown{
	position: relative;
}

table.dataTable > tbody > tr:not(.child) .dropdown-menu{
	position: absolute !important;
	z-index: 1060 !important;
}

/* ------------------------------------------------------------------
   Dropdown "Azioni" in child row (responsive mode ONLY)
-------------------------------------------------------------------*/

/* Container */
table.dataTable > tbody > tr.child .btn-group,
table.dataTable > tbody > tr.child .dropdown{
	margin-top: 12px;
	position: relative;
	display: inline-block;
}

/* Button styling - wider with proper spacing */
table.dataTable > tbody > tr.child .btn-group > .btn,
table.dataTable > tbody > tr.child .dropdown > .btn,
table.dataTable > tbody > tr.child .btn{
	padding: 12px 36px 12px 20px !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	border-radius: 10px !important;
	background: var(--gc-primary-color) !important;
	border-color: var(--gc-primary-color) !important;
	color: #fff !important;
	box-shadow: 0 4px 14px rgba(21, 112, 239, 0.3) !important;
	white-space: nowrap !important;
	min-width: 130px !important;
	text-align: left;
	letter-spacing: 0.2px;
	transition: all 0.15s ease;
}

table.dataTable > tbody > tr.child .btn-group > .btn:hover,
table.dataTable > tbody > tr.child .dropdown > .btn:hover{
	background: #1259c7 !important;
	border-color: #1259c7 !important;
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(21, 112, 239, 0.35) !important;
}

/* Caret spacing fix */
table.dataTable > tbody > tr.child .btn .caret,
table.dataTable > tbody > tr.child .btn .fa-caret-down{
	margin-left: 12px !important;
}

/* Dropdown menu - open UPWARD in child rows */
table.dataTable > tbody > tr.child .btn-group > .dropdown-menu,
table.dataTable > tbody > tr.child .dropdown > .dropdown-menu,
table.dataTable > tbody > tr.child .dropdown-menu{
	position: absolute !important;
	bottom: 100% !important;
	top: auto !important;
	left: auto !important;
	right: 0 !important;
	margin-bottom: 8px !important;
	margin-top: 0 !important;
	border-radius: 12px !important;
	box-shadow: 0 -8px 32px rgba(16, 24, 40, 0.2) !important;
	border: 1px solid var(--gc-border) !important;
	padding: 10px 0 !important;
	min-width: 240px !important;
	z-index: 1100 !important;
	background: #fff !important;
}

/* ============================================
   NUCLEAR RESET: Remove ALL borders from dropdown in child rows
   ============================================ */

/* KILL the ::after pseudo-element line from pages.css .dropdown-default */
table.dataTable tr.child .dropdown-menu::after,
table.dataTable tr.child .dropdown-menu:after,
table.dataTable tr.child .btn-group .dropdown-menu::after,
table.dataTable tr.child .btn-group .dropdown-menu:after,
.dropdown-default table.dataTable tr.child .dropdown-menu:after{
	display: none !important;
	content: none !important;
	height: 0 !important;
	width: 0 !important;
	background: transparent !important;
	border: none !important;
}

/* Reset every possible element inside dropdown */
table.dataTable tr.child .dropdown-menu,
table.dataTable tr.child .dropdown-menu *,
table.dataTable tr.child .btn-group .dropdown-menu,
table.dataTable tr.child .btn-group .dropdown-menu *{
	border-top: none !important;
	border-bottom: none !important;
	border-left: none !important;
	border-right: none !important;
	box-shadow: none !important;
	text-decoration: none !important;
}

/* Restore only the outer border on the menu itself */
table.dataTable tr.child .dropdown-menu,
table.dataTable tr.child .btn-group .dropdown-menu{
	border: 1px solid var(--gc-border) !important;
	box-shadow: 0 -8px 32px rgba(16, 24, 40, 0.2) !important;
}

/* Li elements - absolutely no borders */
table.dataTable tr.child .dropdown-menu li,
table.dataTable tr.child .dropdown-menu > li,
table.dataTable tr.child ul.dropdown-menu > li,
table.dataTable tr.child .btn-group .dropdown-menu > li{
	border: 0 !important;
	border-bottom: 0 !important;
	border-top: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	background: transparent !important;
	list-style: none !important;
}

/* A elements - no borders, no text-decoration */
table.dataTable tr.child .dropdown-menu li a,
table.dataTable tr.child .dropdown-menu > li > a,
table.dataTable tr.child .btn-group .dropdown-menu > li > a{
	border: 0 !important;
	border-bottom: 0 !important;
	text-decoration: none !important;
	background: transparent !important;
}

/* Menu items */
table.dataTable > tbody > tr.child .dropdown-menu > li{
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	border: none !important;
	border-bottom: none !important;
	background: transparent !important;
}

table.dataTable > tbody > tr.child .dropdown-menu > li:last-child{
	border-bottom: none !important;
}

table.dataTable > tbody > tr.child .dropdown-menu > li > a{
	display: flex !important;
	align-items: center;
	gap: 14px;
	padding: 14px 22px !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #344054 !important;
	text-decoration: none !important;
	white-space: nowrap !important;
	transition: all 0.12s ease;
	background: transparent !important;
	border: none !important;
	border-bottom: none !important;
	box-shadow: none !important;
	outline: none !important;
}

table.dataTable > tbody > tr.child .dropdown-menu > li > a:hover{
	background: linear-gradient(90deg, #EFF6FF 0%, #F9FAFB 100%) !important;
	color: var(--gc-primary-color) !important;
	padding-left: 28px !important;
}

table.dataTable > tbody > tr.child .dropdown-menu > li > a i{
	font-size: 16px;
	color: #667085;
	width: 24px;
	text-align: center;
	flex-shrink: 0;
	transition: color 0.12s ease;
}

table.dataTable > tbody > tr.child .dropdown-menu > li > a:hover i{
	color: var(--gc-primary-color);
}

/* Divider in menu */
table.dataTable > tbody > tr.child .dropdown-menu .divider,
table.dataTable > tbody > tr.child .dropdown-menu > li.divider{
	height: 1px !important;
	margin: 8px 18px !important;
	background: var(--gc-border) !important;
	border: none !important;
}

