/* ==========================================================
   SPS MODERN 2027
   COMPONENTS.CSS

   Restyling conservativo OpenSTAManager
   - Widget dashboard
   - Pulsanti
   - Form e Select2
   - Panel
   - Tabelle e DataTables
   - Navigazione a schede

   Obiettivo:
   modernizzare senza alterare layout e funzionalita'
   ========================================================== */


/* ==========================================================
   01. WIDGET DASHBOARD
   ========================================================== */

/* Dimensioni e aspetto dei widget */
.content-wrapper .li-widget .info-box {
    height: 90px;
    min-height: 90px;
    margin-bottom: 0;

    border-radius: 10px;
    overflow: hidden;

    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);

    transform: none;
    transition: box-shadow 0.2s ease;
}

/* Hover senza spostamenti */
.content-wrapper .li-widget .info-box:hover {
    box-shadow: 0 5px 16px rgba(0, 0, 0, 0.10);
    transform: none;
}

/* Area colorata con icona */
.content-wrapper .li-widget .info-box-icon {
    height: 90px;
    line-height: 90px;
    border-radius: 0;
}

/* Animazione discreta delle icone */
.content-wrapper .li-widget .info-box-icon > .fa {
    transition: transform 0.2s ease;
}

.content-wrapper .li-widget .info-box:hover .info-box-icon > .fa {
    transform: scale(1.04);
}

/* Contenuto */
.content-wrapper .li-widget .info-box-content {
    overflow: hidden;
}

/* Titoli */
.content-wrapper .li-widget .info-box-text {
    font-size: 11px;
    line-height: 1.3;
    font-weight: 500;

    white-space: normal;
    overflow-wrap: break-word;
}

/* Numeri */
.content-wrapper .li-widget .info-box-number {
    font-weight: 700;
    line-height: 1.2;
}


/* ==========================================================
   02. FIX WIDGET CON LINK

   Corregge il disallineamento verticale dei widget
   con more_link_type = link, come Scadenze.

   IMPORTANTE: mantenere questa regola.
   ========================================================== */

.content-wrapper .li-widget > a.clickable {
    display: table-cell;
    vertical-align: top;
}


/* ==========================================================
   03. PULSANTI
   ========================================================== */

.btn {
    border-radius: 7px;
    font-weight: 500;

    transition:
        background-color 0.18s ease,
        border-color 0.18s ease,
        box-shadow 0.18s ease;
}

/* Hover */
.btn:hover:not(:disabled):not(.disabled) {
    box-shadow: 0 2px 7px rgba(0, 0, 0, 0.10);
}

/* Pulsanti compatti */
.btn-sm,
.btn-xs {
    border-radius: 6px;
}

/* Gruppi di pulsanti: angoli interni dritti */
.btn-group > .btn:not(:first-child):not(:last-child) {
    border-radius: 0;
}

.btn-group > .btn:first-child:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.btn-group > .btn:last-child:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}


/* ==========================================================
   04. INPUT E TEXTAREA
   ========================================================== */

.form-control {
    border-radius: 7px;

    transition:
        border-color 0.18s ease,
        box-shadow 0.18s ease;
}

/* Focus delicato */
.form-control:focus {
    box-shadow: 0 0 0 2px rgba(85, 145, 195, 0.12);
}

/* Campi non modificabili */
.form-control:disabled,
.form-control[readonly] {
    box-shadow: none;
}


/* ==========================================================
   05. SELECT2
   ========================================================== */

/* Select singola */
.select2-container--default .select2-selection--single {
    border-radius: 7px;

    transition:
        border-color 0.18s ease,
        box-shadow 0.18s ease;
}

/* Select multipla */
.select2-container--default .select2-selection--multiple {
    border-radius: 7px;
}

/* Focus */
.select2-container--default.select2-container--focus
.select2-selection {
    box-shadow: 0 0 0 2px rgba(85, 145, 195, 0.12);
}

/* Menu a tendina */
.select2-dropdown {
    border-radius: 8px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.10);
}


/* ==========================================================
   06. INPUT GROUP
   ========================================================== */

.input-group .form-control:first-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-group .form-control:last-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.input-group-btn > .btn {
    border-radius: 0;
}


/* ==========================================================
   07. CHECKBOX E RADIO
   ========================================================== */

input[type="checkbox"],
input[type="radio"] {
    accent-color: #668fb8;
}


/* ==========================================================
   08. FOCUS ACCESSIBILE
   ========================================================== */

.btn:focus-visible,
.form-control:focus-visible {
    outline: 2px solid rgba(85, 145, 195, 0.50);
    outline-offset: 2px;
}


/* ==========================================================
   09. PANEL

   Mantiene colori e struttura originali di OSM.
   Solo angoli morbidi e ombre leggere.
   ========================================================== */

.content-wrapper .panel {
    border-radius: 9px;

    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.055);

    transition: box-shadow 0.2s ease;
}

/* Intestazione: colori originali preservati */
.content-wrapper .panel > .panel-heading {
    border-radius: 8px 8px 0 0;
}

/* Titoli */
.content-wrapper .panel .panel-title {
    font-weight: 500;
}

/* Footer */
.content-wrapper .panel > .panel-footer {
    border-radius: 0 0 8px 8px;
}

/* Panel annidati */
.content-wrapper .panel .panel {
    box-shadow: none;
}


/* ==========================================================
   10. TABELLE

   Intestazioni pulite e separazioni delicate.
   Nessuna modifica a dimensioni o padding.
   ========================================================== */

/* Intestazioni */
.content-wrapper .table > thead > tr > th {
    background-color: #f3f6fa;
    border-bottom: 2px solid #dbe3ed;
    font-weight: 600;
}

/* Separazione delle celle */
.content-wrapper .table > tbody > tr > td {
    border-top-color: #e9edf2;
}


/* ==========================================================
   11. TABELLE - HOVER

   Sfondo azzurro chiaro e testo scuro.
   Non sovrascrive righe con stati semantici.
   ========================================================== */

/* Righe normali */
.content-wrapper .table-hover > tbody > tr:not(.active):not(.success):not(.warning):not(.danger):not(.info):not(.selected):hover > td,
.content-wrapper table.dataTable > tbody > tr:not(.active):not(.success):not(.warning):not(.danger):not(.info):not(.selected):hover > td {
    background-color: #edf4fb;
    color: #263445;
}

/*
   Testo interno:
   corregge gli elementi che ereditano il colore bianco
   dalla regola di hover originale di OSM.

   Esclusi:
   - link
   - pulsanti
   - badge
   - label
   - icone
*/
.content-wrapper .table-hover > tbody > tr:not(.active):not(.success):not(.warning):not(.danger):not(.info):not(.selected):hover > td :not(a):not(.btn):not(.badge):not(.label):not(.fa):not(.glyphicon),
.content-wrapper table.dataTable > tbody > tr:not(.active):not(.success):not(.warning):not(.danger):not(.info):not(.selected):hover > td :not(a):not(.btn):not(.badge):not(.label):not(.fa):not(.glyphicon) {
    color: inherit;
}


/* ==========================================================
   12. NAV TABS

   Mantiene il design originale delle schede.
   Nessuna linea superiore aggiuntiva.
   ========================================================== */

/* Angoli superiori arrotondati */
.content-wrapper .nav-tabs > li > a {
    border-radius: 8px 8px 0 0;

    transition: background-color 0.18s ease;
}

/* Hover delle schede non attive */
.content-wrapper .nav-tabs > li:not(.active) > a:hover {
    background-color: #edf3f9;
}

/* Scheda attiva: mantiene bordo e colori originali */
.content-wrapper .nav-tabs > li.active > a,
.content-wrapper .nav-tabs > li.active > a:hover,
.content-wrapper .nav-tabs > li.active > a:focus {
    border-radius: 8px 8px 0 0;
}


/* ==========================================================
   FINE SPS MODERN 2027 - COMPONENTS.CSS
   ========================================================== */