/*================================================================================
	Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template
	Version: 2.0
	Author: PIXINVENT
	Author URL: http://www.themeforest.net/user/pixinvent
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */

/* VARIABILI COLORI */
:root
{	

	--colore-principale-hex: #11395c;
	--colore-principale-rgb: rgb(17, 57, 92);
	--colore-principale-rgb-0-2: rgba(17, 57, 92, 0.2);
	--colore-principale-rgb-0-7: rgba(17, 57, 92, 0.7);
	
	--colore-secondario-hex: #ffd06e;
	--colore-secondario-rgb: rgb(255, 208, 110);
	--colore-secondario-rgb-0-2: rgba(255, 208, 110, 0.2);
	--colore-secondario-rgb-0-7: rgba(255, 208, 110, 0.7);
	
}

/*FINE DICHIARAZIONI VARIABILI*/

/*Login.php*/

.form-control:focus {
    border-color: var(--colore-principale-hex);
    outline: 0;
    box-shadow: 0 3px 10px 0 var(--colore-principale-rgb-0-2);
}

.input-group:not(.bootstrap-touchspin):focus-within .form-control, .input-group:not(.bootstrap-touchspin):focus-within .input-group-text {
    border-color: var(--colore-principale-hex);
    box-shadow: none;
}

/*FINE login.php*/

/*Index.php*/

.main-menu.menu-light .navigation > li.active > a {
    background: linear-gradient(118deg, var(--colore-principale-hex) , var(--colore-principale-rgb-0-7)); 
    box-shadow: 0 0 10px 1px var(--colore-secondario-rgb-0-7);
    color: #fff;
    font-weight: 400;
    border-radius: 4px;
}

.main-menu.menu-dark .navigation > li.active > a {
    background: linear-gradient(118deg, var(--colore-secondario-hex) , var(--colore-secondario-rgb-0-7));
    box-shadow: 0 0 10px 1px var(--colore-principale-rgb-0-7);
    color: #fff;
    font-weight: 400;
    border-radius: 4px;
}

.main-menu.menu-light .navigation > li ul .active {
    background: linear-gradient(118deg,  var(--colore-principale-hex) , var(--colore-principale-rgb-0-7));
    box-shadow: 0 0 10px 1px var(--colore-secondario-rgb-0-7);
    border-radius: 4px;
    z-index: 1;
}

.main-menu.menu-dark .navigation > li ul .active {
    background: linear-gradient(118deg,  var(--colore-secondario-hex) , var(--colore-secondario-rgb-0-7));
    box-shadow: 0 0 10px 1px var(--colore-principale-rgb-0-7);
    border-radius: 4px;
    z-index: 1;
}


.dark-layout .main-menu .collapse-toggle-icon {
    color: var(--colore-secondario-hex) !important;
}

a {
    color: var(--colore-principale-hex);
    text-decoration: none;
}

a:hover{
    color: var(--colore-secondario-hex);
    text-decoration: none;

}

html .content .content-wrapper .content-header-title {
    font-weight: 500;
    color: var(--colore-principale-hex);
    padding-right: 1rem;
    border-right: 1px solid #d6dce1;
}

.breadcrumb-item.active {
    color: var(--colore-principale-hex);
}

.dropdown-item.active, .dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: var(--colore-principale-hex);
}

.dropdown-item {
    display: block;
    width: 100%;
    padding: 0.65rem 1.28rem;
    clear: both;
    font-weight: 400;
    color: var(--colore-primario-hex);
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
}

.dropdown-item:hover, .dropdown-item:focus {
  color: var(--colore-secondario-hex);
  background-color: var(--colore-secondario-rgb-0-2); 
  }

.badge.badge-light-danger {
    background-color: var(--colore-secondario-rgb-0-2);
    color: var(--colore-secondario-hex) !important;
}

.btn-primary {
    border-color: var(--colore-principale-hex) !important;
    background-color: var(--colore-principale-hex) !important;
    color: #fff !important;
}

.btn-secondary {
    border-color: var(--colore-secondario-hex) !important;
    background-color: var(--colore-secondario-hex) !important;
    color: #fff !important;
}

.btn-secondary:focus, .btn-secondary:active, .btn-secondary.active {
    color: #fff;
    background-color: var(--colore-secondario-hex) !important;
}

.btn-primary:focus, .btn-primary:active, .btn-primary.active {
    color: #fff;
    background-color: var(--colore-secondario-hex) !important;
}

.btn-primary:hover:not(.disabled):not(:disabled) {
    box-shadow: 0 8px 25px -8px var(--colore-secondario-hex);
}

.alert-primary {
    background: var(--colore-secondario-rgb-0-2) !important;
    color: var(--colore-secondario-hex) !important;
}

.text-primary {
    color: var(--colore-principale-hex) !important;
}

.main-menu .navbar-header .navbar-brand .brand-text {
    color: var(--colore-principale-hex);
    padding-left: 1rem;
    margin-bottom: 0;
    font-weight: 600;
    letter-spacing: 0.01rem;
    font-size: 1.45rem;
    animation: 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) 0s normal forwards 1 fadein;
}

.header-navbar .navbar-container ul.navbar-nav li i.ficon:hover, .header-navbar .navbar-container ul.navbar-nav li svg.ficon:hover {
    color: var(--colore-secondario-hex);
}

.page-item.active .page-link {
    z-index: 3;
    border-radius: 5rem;
    background-color: var(--colore-principale-hex);
    color: #fff !important;
    font-weight: 600;
}
/*FINE index.php*/

.flatpickr-calendar .flatpickr-day.selected, .flatpickr-calendar .flatpickr-day.selected:hover {
    background: var(--colore-principale-hex);
    color: #FFF;
    border-color: var(--colore-principale-hex);
}

table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before, table.dataTable.dtr-inline.collapsed>tbody>tr>th.dtr-control:before {
    top: 50%;
    left: 5px;
    height: 1em;
    width: 1em;
    margin-top: -9px;
    display: block;
    position: absolute;
    color: white;
    border: .15em solid white;
    border-radius: 1em;
    box-shadow: 0 0 0.2em #444;
    box-sizing: content-box;
    text-align: center;
    text-indent: 0 !important;
    font-family: "Courier New",Courier,monospace;
    line-height: 1em;
    content: "+";
    background-color: var(--colore-principale-hex);
	color : black;
}

.flatpickr-calendar .flatpickr-day.today {
    border-color: var(--colore-principale-hex);
}

.form-select:focus {
  border-color: var(--colore-principale-hex);
  outline: 0;
  box-shadow: 0 3px 10px 0 rgba(34, 41, 47, 0.1); 
}
  
html .pace .pace-progress {
    background: var(--colore-principale-hex);
}

.nav-tabs .nav-link.active {
    position: relative;
    color: var(--colore-principale-hex);
}

.nav-tabs .nav-link:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(
30deg
, var(--colore-principale-hex), var(--colore-secondario-rgb-0-7)) !important;
    transition: transform 0.3s;
    transform: translate3d(0, 150%, 0);
}

.btn-relief-primary {
    background-color: var(--colore-principale-hex);
    box-shadow: inset 0 -3px 0 0 rgb(34 41 47 / 20%);
    color: #fff;
    transition: all 0.2s ease;
}

.btn-relief-primary:active, .btn-relief-primary.active, .btn-relief-primary:focus {
    background-color: var(--colore-principale-hex);
}

.btn-relief-primary:hover:not(.disabled):not(:disabled) {
    background-color: var(--colore-principale-rgb-0-7);
}

.select2-container--classic .select2-selection--multiple .select2-selection__choice, .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: var(--colore-principale-hex) !important;
    border-color: var(--colore-secondario-hex) !important;
    color: #fff;
    padding: 2px 5px;
}

.select2-container--classic.select2-container--focus .select2-selection--multiple, .select2-container--default.select2-container--focus .select2-selection--multiple {
    border-color: var(--colore-principale-hex) !important;
    outline: 0;
}

.select2-container--classic .select2-results__option--highlighted, .select2-container--default .select2-results__option--highlighted {
    background-color: var(--colore-principale-rgb-0-2) !important;
    color: var(--colore-principale-hex) !important;
}

.select2-container--classic .select2-results__option[aria-selected='true'], .select2-container--default .select2-results__option[aria-selected='true'] {
    background-color: var(--colore-principale-hex) !important;
    color: #fff !important;
}

.select2-container--classic.select2-container--open .select2-selection--single, .select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--colore-principale-hex) !important;
    outline: 0;
}

.select2-container--classic .select2-selection--single:focus, .select2-container--default .select2-selection--single:focus {
    outline: 0;
    border-color: var(--colore-principale-hex) !important;
    box-shadow: 0 3px 10px 0 rgb(34 41 47 / 10%) !important;
}

.btn-outline-primary {
    border: 1px solid var(--colore-principale-hex) !important;
    background-color: transparent;
    color: var(--colore-principale-hex);
}

.btn-outline-secondary {
    border: 1px solid var(--colore-secondario-hex) !important;
    background-color: transparent;
    color: var(--colore-secondario-hex);
}

.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):focus {
    background-color: var(--colore-principale-rgb-0-2);
    color: var(--colore-principale-hex);
}

.btn-outline-primary:hover:not(.disabled):not(:disabled) {
    background-color: var(--colore-principale-rgb-0-2);
    color: var(--colore-principale-hex);
}

.btn-outline-primary:disabled, .btn-outline-primary.disabled {
    color: var(--colore-principale-hex);
    background-color: transparent;
}

.form-check-input:checked {
    background-color: var(--colore-principale-hex);
    border-color: var(--colore-principale-hex);
}

.form-check-input:focus {
    border-color: var(--colore-secondario-hex);
    outline: 0;
    box-shadow: 0 2px 4px 0 rgb(115 103 240 / 40%);
}

.fc .fc-button-primary:disabled {
    color: #fff;
    color: var(--fc-button-text-color, #fff);
    background-color: #2C3E50;
    background-color: var(--colore-principale-rgb-0-7, #2C3E50);
    border-color: #2C3E50;
    border-color: var(--colore-principale-hex, #2C3E50);
}

.fc .fc-button-primary {
    color: #fff;
    color: var(--fc-button-text-color, #fff);
    background-color: #2C3E50;
    background-color: var(--colore-principale-hex, #2C3E50);
    border-color: #2C3E50;
    border-color: var(--colore-principale-hex, #2C3E50);
}

.fc .fc-button-primary:not(:disabled):active, .fc .fc-button-primary:not(:disabled).fc-button-active {
    color: #fff;
    color: var(--fc-button-text-color, #fff);
    background-color: #1a252f;
    background-color: var(--colore-secondario-hex, #1a252f);
    border-color: #151e27;
    border-color: var(--colore-secondario-hex, #151e27);
}

.dark-layout .pagination:not([class*='pagination-']) .page-item.active .page-link {
    background-color: var(--colore-principale-hex);
}

.dark-layout .dropdown-menu .dropdown-item:hover, .dark-layout .dropdown-menu .dropdown-item:focus {
    background: var(--colore-secondario-rgb-0-7);
    color: var(--colore-secondario-hex);
}

.dark-layout .dropdown-menu .dropdown-item:active, .dark-layout .dropdown-menu .dropdown-item.active {
    color: #fff;
    background-color: var(--colore-secondario-hex);
}

.bullet.bullet-primary {
    background-color: var(--colore-principale-hex);
}

.bullet.bullet-secondary {
    background-color: var(--colore-secondario-hex);
}

.bg-light-primary {
    background: rgba(115,103,240,.12)!important;
    color: var(--colore-secondario-hex)!important;
}

.bg-light-secondary .fc-list-event-dot, .btn-secondary {
    border-color: var(--colore-secondario-hex)!important;
}

.bg-secondary, .btn-secondary {
    background-color: var(--colore-secondario-hex)!important;
}

.dropdown-menu .dropdown-item {
    width: 100%;
    cursor: pointer;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    margin-top: 0;
    margin-bottom: 0.5rem;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.2;
    color: #000;
}

.bg-primary {
  --bs-bg-opacity: 1;
  background-color: var(--colore-principale-hex) !important; }

.bg-secondary {
  --bs-bg-opacity: 1;
  background-color: var(--colore-secondario-hex) !important; }

/* ==========================
   Select2 – Miglioramenti UX
   - Clear (X) più grande, rosso e accessibile
   - Freccia spostata più a destra
   - Corretto stacking e larghezza in offcanvas
   Valido globalmente in tutta l'app
========================== */
/* Select2 dentro offcanvas */
.offcanvas .select2-container { width: 100% !important; }
.select2-container--open { z-index: 2000 !important; }
.offcanvas .select2-search__field { cursor: text; }

/* Spazio extra per area clear + freccia */
.select2-container--default .select2-selection--single {
    position: relative;
    padding-right: 4.4rem; /* default sicuro: spazio per X grande + freccia */
}
/* Se NON c'è la X (allowClear off o nessun valore selezionato), riduci il padding a destra.
   Usa :has come miglioramento progressivo: i browser che non lo supportano rimangono con il default sicuro. */
.select2-container--default .select2-selection--single:not(:has(.select2-selection__clear)) {
    padding-right: 2rem;
}

/* Clear (X) grande, cliccabile e con icona SVG rossa */
.select2-container--default .select2-selection--single .select2-selection__clear {
    position: absolute;
    right: 2.6rem; /* separazione dalla freccia */
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;  /* target touch più ampio */
    height: 2rem; /* target touch più ampio */
    font-size: 0; /* nasconde la X testuale */
    line-height: 0;
    border-radius: .35rem;
    color: transparent;
    cursor: pointer;
}
.select2-container--default .select2-selection--single .select2-selection__clear::before {
    content: '';
    display: block;
    width: 1.4rem;
    height: 1.4rem;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    /* icona X rossa (SVG inline) */
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><line x1='6' y1='6' x2='18' y2='18' stroke='%23dc3545' stroke-width='2' stroke-linecap='round'/><line x1='18' y1='6' x2='6' y2='18' stroke='%23dc3545' stroke-width='2' stroke-linecap='round'/></svg>");
}
.select2-container--default .select2-selection--single .select2-selection__clear:hover {
    background-color: rgba(220, 53, 69, .08);
}
.select2-container--default .select2-selection--single .select2-selection__clear:focus-visible {
    outline: 2px solid rgba(220,53,69,.5);
    outline-offset: 2px;
}

/* Freccia più a destra per non sovrapporsi alla X */
.select2-container--default .select2-selection--single .select2-selection__arrow {
    right: .15rem;
}