/* ========================================
   FIX CARDS E DATATABLES - BOOTSTRAP 5
   ======================================== */

/* Card con icona e titolo (es. Impersonifica Utenti) */
.card {
    display: inline-block;
    position: relative;
    width: 100%;
    margin: 25px 0;
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.14);
    border-radius: 6px;
    color: rgba(0, 0, 0, 0.87);
    background: #fff;
}

    .card .card-header {
        padding: 15px;
        margin: -20px 15px 0;
        border-radius: 3px;
        background: #007BC0;
        box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(0, 123, 192, 0.4);
        color: #ffffff;
        align-items: center;
        justify-content: center;
        /* width: 70px;*/
        height: 70px;
        min-width: 70px;
        min-height: 70px;
        display: inline-flex;
    }

.card-header-tabs {
    display: flex !important;
    background-color: transparent;
    border: 0 !important;
    text-align: left !important;
    justify-content: start !important;
}

.card-header-tabs > a {
    color: #FFFFFF !important;
    font-weight: 500;
    border-radius: 3px;
    line-height: 24px;
    text-transform: uppercase;
    font-size: 12px;
}

.card-header-page {
    height: 50px !important;
    min-height: 50px !important;
  /*  padding: 10px !important;*/
    font-size: 14px !important;
}

.card .card-header img.menu-icon {
    width: 40px;
    height: 40px;
    margin: 0;
    object-fit: contain;
}

        .card .card-header.card-header-icon {
            float: left;
        }

        .card .card-header.bg-primary {
            background: linear-gradient(60deg, #007BC0, #005A8C) !important;
            box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(0, 123, 192, 0.4) !important;
        }

    .card .card-header-info {
        background: linear-gradient(60deg, #26c6da, #00acc1);
        box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(0, 188, 212, 0.4);
    }

    .card .card-content {
        padding: 15px 30px;
        position: relative;
        padding-top: 15px;
    }

    .card .card-body {
        padding: 15px 30px;
    }

    .card .card-title:not(.card-calendar, .card-title) {
        margin-top: 0;
        margin-bottom: 5px;
        font-size: 18px;
        font-weight: 400;
        line-height: 1.4em;
        min-height: 40px;
    }

    .card .card-title {
        margin-top: 0;
        margin-bottom: 3px;
    }

.marginzero {
    margin: 0 !important;
}

/* Row contenitore */
.row {
    margin-right: -15px;
    margin-left: -15px;
}

/* Material datatables container */
.material-datatables {
    clear: both;
    padding-top: 10px;
}

/* Pulsanti */
.btn {
    position: relative;
    padding: 12px 30px;
    margin: 10px 1px;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.42857143;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0;
    border: 0;
    border-radius: 3px;
    outline: 0;
    transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    will-change: box-shadow, transform;
    cursor: pointer;
}

    .btn:hover {
        box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
    }

.btn-success {
    color: #fff;
    background-color: #4caf50;
    box-shadow: 0 2px 2px 0 rgba(76, 175, 80, 0.14), 0 3px 1px -2px rgba(76, 175, 80, 0.2), 0 1px 5px 0 rgba(76, 175, 80, 0.12);
}

    .btn-success:hover {
        background-color: #449d48;
        box-shadow: 0 14px 26px -12px rgba(76, 175, 80, 0.42), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(76, 175, 80, 0.2);
    }

.btn-info {
    color: #fff;
    background-color: #00acc1;
    box-shadow: 0 2px 2px 0 rgba(0, 172, 193, 0.14), 0 3px 1px -2px rgba(0, 172, 193, 0.2), 0 1px 5px 0 rgba(0, 172, 193, 0.12);
}

    .btn-info:hover {
        background-color: #00838f;
        box-shadow: 0 14px 26px -12px rgba(0, 172, 193, 0.42), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 172, 193, 0.2);
    }

.btn i {
    font-size: 17px;
}

/* DataTables - stile tabella */
.table {
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 1rem !important;
    background-color: transparent !important;
    border-collapse: collapse !important;
}

    .table thead th {
        padding: 15px 10px !important;
        border-bottom: 1px solid #ddd !important;
        font-size: 17px !important;
        font-weight: 300 !important;
        background-color: transparent !important;
        vertical-align: middle !important;
        text-align: left !important;
        resize: horizontal;
        overflow: auto;
    }

    .table tbody td {
        padding: 15px 10px !important;
        border-bottom: 1px solid #ddd !important;
        font-size: 0.9375rem !important;
        font-weight: 300 !important;
        vertical-align: middle !important;
        line-height: 1.5 !important;
    }

.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, 0.02) !important;
}

.table-bordered {
    border: 1px solid #ddd !important;
}

    .table-bordered th,
    .table-bordered td {
        border: 1px solid #ddd !important;
    }

.table-hover tbody tr:hover {
    background-color: rgba(0, 0, 0, 0.04) !important;
}

/* DataTables - search box e controls */
.dataTables_wrapper .dataTables_filter {
    float: right !important;
    text-align: right !important;
}

    .dataTables_wrapper .dataTables_filter label {
        font-weight: 300 !important;
        color: #999 !important;
        font-size: 12px !important;
    }

    .dataTables_wrapper .dataTables_filter input {
        border: 0 !important;
        border-bottom: 1px solid #D2D2D2 !important;
        border-radius: 0 !important;
        padding: 7px 0 !important;
        margin-left: 10px !important;
        background-color: transparent !important;
        font-size: 14px !important;
        outline: none !important;
        box-shadow: none !important;
        width: 200px !important;
    }

        .dataTables_wrapper .dataTables_filter input:focus {
            /*border-bottom: 2px solid #9c27b0 !important;*/
            box-shadow: none !important;
        }

/* Nuova struttura DataTables v2.x - dt-search */
.dataTables_wrapper .dt-search {
    float: right !important;
    text-align: right !important;
    position: relative !important;
    display: inline-block !important;
}

    .dataTables_wrapper .dt-search label {
        font-weight: 300 !important;
        color: #999 !important;
        font-size: 12px !important;
        display: inline-block !important;
        margin-left: 10px !important;
        position: absolute !important;
        right: 5px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        pointer-events: none !important;
    }

    /* Icona search - verrà aggiunta con JavaScript */

    .dataTables_wrapper .dt-search input {
        border: 0 !important;
        border-top: 0 !important;
        border-left: 0 !important;
        border-right: 0 !important;
        border-bottom: 1px solid #D2D2D2 !important;
        border-radius: 0 !important;
        padding: 10px 35px 10px 5px !important;
        background-color: transparent !important;
        background-image: none !important;
        font-size: 14px !important;
        outline: none !important;
        box-shadow: none !important;
        width: 350px !important;
        display: inline-block !important;
        height: auto !important;
        line-height: 1.42857143 !important;
    }

        .dataTables_wrapper .dt-search input:focus {
            border: 0 !important;
            border-top: 0 !important;
            border-left: 0 !important;
            border-right: 0 !important;
            /*border-bottom: 2px solid #9c27b0 !important;*/
            box-shadow: none !important;
            outline: none !important;
        }

.dataTables_wrapper .dataTables_length {
    float: left !important;
}

    .dataTables_wrapper .dataTables_length label {
        font-weight: 400 !important;
        color: #999 !important;
        font-size: 12px !important;
    }

    .dataTables_wrapper .dataTables_length select {
        border: 0 !important;
        border-bottom: 1px solid #D2D2D2 !important;
        border-radius: 0 !important;
        padding: 7px 0 !important;
        margin: 0 10px !important;
        background-color: transparent !important;
        font-size: 14px !important;
        outline: none !important;
    }

/* Nuova struttura DataTables v2.x - dt-length */
.dataTables_wrapper .dt-length {
    float: left !important;
}

    .dataTables_wrapper .dt-length label {
        font-weight: 400 !important;
        color: #999 !important;
        font-size: 12px !important;
        display: inline-block !important;
    }

    .dataTables_wrapper .dt-length select {
        border: 0 !important;
        border-bottom: 1px solid #D2D2D2 !important;
        border-radius: 0 !important;
        padding: 7px 0 !important;
        margin: 0 10px !important;
        background-color: transparent !important;
        font-size: 14px !important;
        outline: none !important;
    }

/* Input di ricerca per colonna - sotto gli header */
.dataTables_wrapper input[type="search"],
.dataTables_wrapper thead input[type="search"],
.dataTables_wrapper thead input.form-control,
.dataTables_wrapper thead input.form-control-sm,
table thead input[type="search"],
table thead input.form-control {
    border: 1px solid #D2D2D2 !important;
    border-radius: 4px !important;
    padding: 7px 10px !important;
    background-color: #fff !important;
    font-size: 14px !important;
    width: 100% !important;
}

    .dataTables_wrapper input[type="search"]:focus,
    .dataTables_wrapper thead input[type="search"]:focus,
    .dataTables_wrapper thead input.form-control:focus,
    .dataTables_wrapper thead input.form-control-sm:focus,
    table thead input[type="search"]:focus,
    table thead input.form-control:focus {
        /* Puoi aggiungere qui lo stile focus se vuoi */
    }

/* Tutti gli input dovrebbero avere solo border-bottom stile Material Design */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="tel"],
input[type="url"],
input[type="date"],
input[type="datetime-local"],
input[type="month"],
input[type="time"],
input[type="week"],
textarea,
select {
    border: 0 !important;
    border-bottom: 1px solid #D2D2D2 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    padding: 7px 0 !important;
    outline: none !important;
    box-shadow: none !important;
}

    input[type="text"]:focus,
    input[type="password"]:focus,
    input[type="email"]:focus,
    input[type="number"]:focus,
    input[type="tel"]:focus,
    input[type="url"]:focus,
    input[type="date"]:focus,
    input[type="datetime-local"]:focus,
    input[type="month"]:focus,
    input[type="time"]:focus,
    input[type="week"]:focus,
    textarea:focus,
    select:focus {
        /*border-bottom: 2px solid #9c27b0 !important;*/
        box-shadow: none !important;
    }

/* ECCEZIONE: Input di ricerca per colonna - sotto gli header - devono avere tutti e 4 i bordi */
input.search-field,
.search-field,
thead input.search-field,
table thead input.search-field {
    border: 1px solid #D2D2D2 !important;
    border-radius: 4px !important;
    padding: 7px 10px !important;
    background-color: #fff !important;
    font-size: 14px !important;
    width: 100% !important;
}

    input.search-field:focus,
    .search-field:focus,
    thead input.search-field:focus,
    table thead input.search-field:focus {
        /* Puoi aggiungere qui lo stile focus se vuoi */
    }

/* Override per Bootstrap form-control - forza stile Material Design */
.form-control,
.form-control-sm,
input.form-control,
input.form-control-sm,
select.form-control,
select.form-control-sm {
    border: 0 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    padding: 7px 0 !important;
    outline: none !important;
    box-shadow: none !important;
    height: auto !important;
    line-height: normal !important;
}

textarea.form-control {
    border: 0 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    padding: 7px 0 !important;
    outline: none !important;
    box-shadow: none !important;
    height: auto !important;
    line-height: normal !important;
}

.form-control:focus,
.form-control-sm:focus,
input.form-control:focus,
input.form-control-sm:focus,
select.form-control:focus,
select.form-control-sm:focus {
    border: 0 !important;
    /*border-bottom: 2px solid #9c27b0 !important;*/
    box-shadow: none !important;
    background-color: transparent !important;
}

textarea.form-control:focus {
    border: 0 !important;
    box-shadow: none !important;
    background-color: transparent !important;
}

/* DataTables Buttons - fix per pulsante ESPORTA */
.dt-buttons {
    margin-bottom: 15px;
    float: left;
    background: transparent !important;
    padding: 0 !important;
    border: 0 !important;
}

.dt-button {
    border: 0 !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
}

    .dt-button:hover,
    .dt-button:focus,
    .dt-button:active {
        background: transparent !important;
        box-shadow: none !important;
        border: 0 !important;
        outline: none !important;
    }

.btnHeaderDT {
    display: inline-flex !important;
    align-items: center;
    padding: 12px 30px !important;
    margin: 10px 5px !important;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.42857143;
    text-decoration: none !important;
    text-transform: uppercase;
    letter-spacing: 0;
    border: 0 !important;
    border-radius: 3px;
    cursor: pointer;
    transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    white-space:nowrap;
}

    .btnHeaderDT.excel {
        color: #fff !important;
        background-color: #00884a !important;
        background-image: none !important;
        box-shadow: 0 2px 2px 0 rgba(102, 187, 106, 0.14), 0 3px 1px -2px rgba(102, 187, 106, 0.2), 0 1px 5px 0 rgba(102, 187, 106, 0.12) !important;
    }

        .btnHeaderDT.excel:hover {
            background-color: #00884a !important;
            background-image: none !important;
            box-shadow: 0 14px 26px -12px rgba(102, 187, 106, 0.42), 0 4px 23px 0px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(102, 187, 106, 0.2) !important;
        }

    .btnHeaderDT i.fa {
        margin-right: 8px !important;
        font-size: 17px !important;
    }

.file-excel-icon {
    color: #fff !important;
}

/* Fix per pulsante dentro dt-button */
.dt-button .btnHeaderDT {
    margin: 0 !important;
}

/* Rimuovi tutti gli stili di default dai buttons container */
.dt-buttons.btn-group {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.dt-buttons .btn-group {
    background: transparent !important;
    box-shadow: none !important;
}

.dataTables_wrapper .dataTables_info {
    padding-top: 8px !important;
    font-size: 12px !important;
    color: #999 !important;
    font-weight: 300 !important;
}

/* Nuova struttura DataTables v2.x - dt-info */
.dataTables_wrapper .dt-info {
    padding-top: 8px !important;
    font-size: 12px !important;
    color: #999 !important;
    font-weight: 300 !important;
}

.dataTables_wrapper .dataTables_paginate {
    padding-top: 8px !important;
    float: right !important;
}

/* Nuova struttura DataTables v2.x - dt-paging */
.dataTables_wrapper .dt-paging {
    padding-top: 8px !important;
    float: right !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 4px 10px !important;
    margin: 0 2px !important;
    border: 0 !important;
    border-radius: 3px !important;
    background-color: transparent !important;
    color: #999 !important;
    cursor: pointer !important;
    font-size: 12px !important;
    font-weight: 400 !important;
}

    .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
        background-color: rgba(153, 153, 153, 0.2) !important;
        color: #3C4858 !important;
    }

    .dataTables_wrapper .dataTables_paginate .paginate_button.current {
        background-color: transparent !important;
        color: #9c27b0 !important;
        font-weight: 500 !important;
    }

    .dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
        color: #ddd !important;
        cursor: default !important;
    }

        .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
            background-color: transparent !important;
            color: #ddd !important;
        }

/* Nuova struttura DataTables v2.x - dt-paging buttons */
.dataTables_wrapper .dt-paging .dt-paging-button {
    padding: 4px 10px !important;
    margin: 0 2px !important;
    border: 0 !important;
    border-radius: 3px !important;
    background-color: transparent !important;
    color: #999 !important;
    cursor: pointer !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    text-decoration: none !important;
    display: inline-block !important;
}

    .dataTables_wrapper .dt-paging .dt-paging-button:hover {
        background-color: rgba(153, 153, 153, 0.2) !important;
        color: #3C4858 !important;
    }

    .dataTables_wrapper .dt-paging .dt-paging-button.current {
        background-color: transparent !important;
        color: #9c27b0 !important;
        font-weight: 500 !important;
    }

    .dataTables_wrapper .dt-paging .dt-paging-button.disabled {
        color: #ddd !important;
        cursor: default !important;
    }

        .dataTables_wrapper .dt-paging .dt-paging-button.disabled:hover {
            background-color: transparent !important;
            color: #ddd !important;
        }

/* Azioni nella tabella */
.td-actions {
    text-align: right;
    white-space: nowrap;
}

    .td-actions .btn {
        padding: 8px;
        margin: 2px;
        min-width: auto;
    }

        .td-actions .btn i {
            font-size: 20px;
        }

/* Text utilities */
.text-end {
    text-align: right;
}

.nowrap {
    white-space: nowrap;
}

/* Responsive */
@media (max-width: 768px) {
    .card .card-header {
        margin: -20px 10px 0;
    }

    .card .card-body {
        padding: 15px 15px !important;
    }

    .card .card-content {
        padding: 15px 15px !important;
    }

    .table thead {
        display: none;
    }

    .table tbody td {
        display: block;
        text-align: right;
        padding-left: 50%;
        position: relative;
    }

        .table tbody td:before {
            content: attr(data-label);
            position: absolute;
            left: 10px;
            font-weight: bold;
            text-align: left;
        }
}

/* 1. Reset e posizionamento della cella di controllo */
table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control,
table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control {
    padding-left: 38px !important; /* Spazio per non sovrapporre il testo */
    position: relative;
    cursor: pointer;
}



    /* 1. Definizione della forma e reset dimensioni */
    table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control:before,
    table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control:before {
        /* Geometria fissa */
        width: 20px !important;
        height: 20px !important;
        min-width: 20px !important;
        min-height: 20px !important;
        /* Forza il cerchio */
        border-radius: 50% !important;
        /* Posizionamento */
        top: 50% !important;
        left: 10px !important;
        margin-top: -10px !important; /* Metà dell'altezza per centrare */
        position: absolute;
        /* Allineamento simbolo interno */
        display: inline-flex !important; /* o flex */
        align-items: center !important;
        justify-content: center !important;
        /* Reset stili che potrebbero allungarlo */
        box-sizing: border-box !important;
        padding: 0 !important;
        text-indent: 0 !important;
        /* Estetica */
        background-color: #007bff !important;
        color: white !important;
        border: 2px solid white !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.3);
        font-family: 'Courier New', Courier, monospace !important;
        font-size: 16px !important;
        font-weight: bold !important;
        content: '+' !important;
    }

/* 2. Cambio simbolo e colore quando espanso */
table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td.dtr-control:before,
table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th.dtr-control:before,
table.dataTable.dtr-inline.collapsed > tbody > tr.dt-hasChild > td.dtr-control:before,
table.dataTable.dtr-inline.collapsed > tbody > tr.dt-hasChild > th.dtr-control:before {
    content: '-' !important;
    background-color: #d33333 !important;
}

/* 4. Rimuovi ombreggiatura default di DataTables che sporca l'icona */
table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control:before {
    box-sizing: content-box !important;
}

    table.dataTable > tbody > tr.child ul.dtr-details {
        display: block !important;
        list-style: none !important;
        padding: 10px !important;
        margin: 0 !important;
    }

        table.dataTable > tbody > tr.child ul.dtr-details > li {
            padding: 5px 0 !important;
            border-bottom: 1px solid #eee !important;
        }

    table.dataTable > tbody > tr.child span.dtr-title {
        font-weight: bold !important;
        color: #3C4858 !important;
        display: inline-block !important;
        min-width: 120px !important;
    }

    table.dataTable > tbody > tr.child span.dtr-data {
        color: #666 !important;
    }

/* Z-index per mantenere i bottoni sopra tutto */
.dt-buttons {
    position: relative;
    z-index: 100 !important;
}

/* Assicura che scroll e search siano sotto i bottoni */
.dt-scroll,
.dt-search {
    position: relative;
    z-index: 1;
}

.dt-scroll-body {
    height: calc(56vh - 10px) !important;
    max-height: none !important;
    box-sizing: border-box;
}


.dataTables_wrapper .dataTables_scrollBody {
    overflow-y: auto !important;
    min-height: 500px !important;
}

    /* L'input deve avere spazio a destra per l'icona */
    .dt-search input {
        padding-right: 35px !important;
        padding-left: 10px !important;
    }

    /* Posizionamento dell'icona in fondo (a destra) */
    .dt-search label {
        position: absolute;
        right: 12px; /* Distanza dal bordo destro */
        top: 50%;
        transform: translateY(-50%);
        margin: 0;
        pointer-events: none; /* Evita che l'icona blocchi il click sull'input */
        color: #6c757d;
    }

    /* Rimuoviamo eventuali decorazioni residue del vecchio tema */
    .dt-search .form-group {
        margin: 0;
        padding: 0;
        display: flex;
        align-items: center;
    }



/* Stile bottoni uniformato */
.dt-buttons .btn {
    position: relative;
    z-index: 999999999 !important;
   
}

/* Forza table-layout fixed su TUTTE le DataTables */
table.dataTable,
.dataTables_wrapper table.dataTable,
.dt-scroll-head table,
.dt-scroll-body table {
    table-layout: fixed !important;
}

    /* Assicura che le celle rispettino le larghezze */
    table.dataTable thead th,
    table.dataTable tbody td {
        box-sizing: border-box !important;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

/* Nascondi scroll orizzontale */
.dt-scroll-body {
    overflow-x: hidden !important;
}

/* Nasconde la scrollbar nativa su Chrome, Safari ed Edge */
.dt-scroll-body::-webkit-scrollbar {
    display: none;
    width: 0 !important;
}

/* Assicura che PerfectScrollbar sia l'unico elemento a gestire lo scroll */
.dt-scroll-body {
    -ms-overflow-style: none; /* IE e Edge vecchio */
    scrollbar-width: none; /* Firefox */
    overflow: hidden !important; /* Forza PerfectScrollbar a gestire il movimento */
}


.dt-select-checkbox {
    transform: scale(1.3) !important; 
    cursor: pointer !important;
    margin: 0 auto !important;
    display: block !important;
}

/* Opzionale: Centra verticalmente il checkbox nella cella */
td.dt-select {
    vertical-align: middle !important;
    text-align: center !important;
}

.btn.processing::after {
    display:none !important;
}

.placeholder {
    background-color: unset !important;
}

.dt-processing {
    z-index:99999999 !important;
}