/* ==========================================================
 * _custom-styles.css — Tema progetto "IlMioRimessaggio" su Dhonu.
 * Caricato DOPO il CSS Dhonu (vince sugli override).
 * Stile target: flat, a blocchi, blu corporate + accento verde, sidebar scura.
 * ========================================================== */

:root {
    /* Palette blocchi (indipendente dal theme-primary, per match col riferimento) */
    --imr-blue: #1c6aa6;
    --imr-blue-dark: #15527f;
    --imr-green: #57a64a;
    --imr-danger: #c0392b;
    --imr-ink: #2b2f33;        /* sidebar scura */
    --imr-radius: 4px;
}

/* ---------- Sidebar scura — FORZATA via CSS ----------
 * NB: Dhonu salva il colore-menu in localStorage (__THEME_CONFIG__) e config.js
 * lo riapplica, ignorando data-menu-color nell'HTML. Quindi forziamo lo stile
 * sugli elementi (con !important), indipendente dall'attributo. */
.sidenav-menu { background: var(--imr-ink) !important; }
.sidenav-menu .logo .logo-lg { color: #fff !important; }
.sidenav-menu .scrollbar,
.sidenav-menu #sidenav-menu { background: transparent; }
.side-nav .side-nav-title { color: #8a929b !important; }
.side-nav .side-nav-link { color: #c3c8ce !important; }
.side-nav .side-nav-link .menu-icon i { color: inherit !important; }
.side-nav .side-nav-link:hover { color: #fff !important; background: rgba(255,255,255,.06) !important; }
.side-nav .side-nav-item .side-nav-link.active,
.side-nav .side-nav-item.active > .side-nav-link {
    color: #fff !important; background: var(--imr-blue) !important;
}
.sidenav-menu .button-close-offcanvas i { color: #c3c8ce; }

/* ---------- Flat look globale ---------- */
.card {
    border-radius: var(--imr-radius);
    border: 1px solid #e6e9ee;
    box-shadow: none;
}
.btn, .form-control, .form-select, .input-group-text, .badge {
    border-radius: var(--imr-radius);
}
.nav-tabs .nav-link { border-radius: var(--imr-radius) var(--imr-radius) 0 0; }

/* Sfondo contenuto grigio chiaro per contrasto coi blocchi */
.body-wrapper { background: #eef1f4; }

/* ---------- Riquadri grandi di scelta rapida (dashboard) ---------- */
.imr-tile {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding: 1.1rem 1.25rem; min-height: 86px;
    background: var(--imr-blue); color: #fff; text-decoration: none;
    border-radius: var(--imr-radius); transition: filter .15s ease;
}
.imr-tile:hover { filter: brightness(1.09); color: #fff; }
.imr-tile .imr-tile-ico { font-size: 1.9rem; line-height: 1; opacity: .95; flex: 0 0 auto; }
.imr-tile .imr-tile-txt { text-align: right; line-height: 1.15; min-width: 0; }   /* min-width:0 → il testo può andare a capo invece di uscire */
.imr-tile .imr-tile-sub { font-size: .76rem; opacity: .8; }
.imr-tile .imr-tile-name { font-size: 1.1rem; font-weight: 700; white-space: nowrap; }
.imr-tile--dark { background: var(--imr-blue-dark); }
.imr-tile--green { background: var(--imr-green); }

/* ---------- Blocchi KPI pieni ("Il tuo riepilogo") ---------- */
.imr-kpi {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding: 1.1rem 1.25rem; min-height: 86px;
    background: var(--imr-blue); color: #fff; border-radius: var(--imr-radius);
}
.imr-kpi .imr-kpi-ico { font-size: 2.1rem; opacity: .9; flex: 0 0 auto; }
.imr-kpi .imr-kpi-txt { text-align: right; line-height: 1.15; min-width: 0; }
.imr-kpi .imr-kpi-label { font-size: .8rem; opacity: .85; }
.imr-kpi .imr-kpi-val { font-size: 1.5rem; font-weight: 700; }
.imr-kpi--dark { background: var(--imr-blue-dark); }
.imr-kpi--green { background: var(--imr-green); }
.imr-kpi--danger { background: var(--imr-danger); }
a.imr-kpi, a.imr-kpi:visited, a.imr-kpi:focus { color: #fff; transition: filter .15s ease; }
a.imr-kpi:hover { filter: brightness(1.09); color: #fff; }
.imr-kpi .imr-kpi-label { opacity: .92; }   /* leggibilità testo su sfondo colorato */
/* Variante compatta per le intestazioni delle schede */
.imr-kpi-sm { min-height: 62px; padding: .55rem .85rem; }
.imr-kpi-sm .imr-kpi-ico { font-size: 1.5rem; }
.imr-kpi-sm .imr-kpi-val { font-size: 1.15rem; }
.imr-kpi-sm .imr-kpi-label { font-size: .72rem; }

/* Titolo sezione tipo "IL TUO RIEPILOGO" */
.imr-section-title {
    font-size: .8rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
    color: #7b8794; margin: 1.4rem 0 .7rem;
}

/* ---------- Liste / tabelle moderne ---------- */
.card .table { margin-bottom: 0; --bs-table-hover-bg: #eff5fb; }
.card .table > thead > tr > th {
    text-transform: uppercase; font-size: .72rem; letter-spacing: .04em; font-weight: 700;
    color: #6b7682; background: #f7f9fb; border-bottom: 2px solid #e6e9ee;
    padding: .7rem .85rem; white-space: nowrap;
}
.card .table > tbody > tr > td { padding: .72rem .85rem; vertical-align: middle; border-color: #eef1f4; }
.card .table > tbody > tr:last-child > td { border-bottom: 0; }
.card .table-hover > tbody > tr:hover > * { background: #eff5fb; }

/* Barra filtri: controlli con altezza coerente */
.card-body form .form-control, .card-body form .form-select { min-height: 40px; }

/* Paginazione in palette */
.pagination {
    --bs-pagination-color: var(--imr-blue);
    --bs-pagination-hover-color: #fff; --bs-pagination-hover-bg: var(--imr-blue);
    --bs-pagination-active-bg: var(--imr-blue); --bs-pagination-active-border-color: var(--imr-blue);
    gap: 3px; flex-wrap: wrap;
}
.pagination .page-link { border-radius: var(--imr-radius); }

/* Bottoni un filo più ariosi (look moderno) */
.btn { --bs-btn-padding-y: .45rem; --bs-btn-padding-x: .9rem; }
.btn-sm { --bs-btn-padding-y: .3rem; --bs-btn-padding-x: .6rem; }

/* Righe tabella cliccabili */
tr.row-link { cursor: pointer; }

/* Ricerca globale in topbar: riquadro marcato e riconoscibile (desktop + mobile) */
#globalSearch {
    border: 1.5px solid var(--imr-blue);
    background: #f3f8fc;
    border-radius: 999px;
    height: 44px;
    padding-left: 2.4rem;
    font-size: .95rem;
}
#globalSearch::placeholder { color: #7089a0; }
#globalSearch:focus {
    background: #fff;
    border-color: var(--imr-blue);
    box-shadow: 0 0 0 .2rem rgba(28, 106, 166, .22);
}
#globalSearchBox .ri-search-line { color: var(--imr-blue); font-size: 1.1rem; }
#globalSearchResults { border-radius: 12px; }

/* Gruppo menu "Avanzate" a scomparsa (toggle JS, indipendente dal tema) */
.imr-adv-toggle { cursor: pointer; pointer-events: auto; }   /* il tema mette pointer-events:none su .side-nav-title */
.imr-adv-caret { transition: transform .15s ease; }
.imr-adv-toggle.open .imr-adv-caret { transform: rotate(180deg); }
.imr-adv-menu { display: none; }
.imr-adv-menu.open { display: block; }

/* ---------- Utility ereditate (ancora valide) ---------- */
.form-inline { display: flex; flex-flow: row wrap; align-items: center; gap: .5rem; }
.form-inline > .form-control, .form-inline > .form-select { width: auto; flex: 0 0 auto; }
.form-inline > .btn { flex: 0 0 auto; }
#toast-container > div { opacity: .96; }

/* ---------- Leggibilità form (pagine add/edit) ---------- */
.card-body form label,
.card-body form .form-label { font-weight: 600; color: #2a2f45; margin-bottom: .35rem; }
.card-body form .form-control,
.card-body form .form-select {
    border: 1px solid #c4ccd4;
    padding: .6rem .85rem;
    font-size: 1rem;
    background: #fff;
    border-radius: var(--imr-radius);
}
.card-body form .form-control::placeholder { color: #98a2ad; }
.card-body form .form-control:focus,
.card-body form .form-select:focus {
    border-color: var(--imr-blue);
    box-shadow: 0 0 0 .2rem rgba(28, 106, 166, .18);
}
.card-body form .form-group { margin-bottom: 1.1rem; }
.card-body form h5 {
    font-size: 1.05rem; font-weight: 700; color: var(--imr-blue-dark);
    margin-top: .75rem; margin-bottom: 1rem; padding-bottom: .45rem;
    border-bottom: 2px solid #eceff3;
}
.card-body form hr { margin: 1.25rem 0; opacity: .12; }
.card-body form .form-check-label { font-weight: 500; color: #2a2f45; }
.card-body form .form-text { font-size: .8rem; }

/* Campi EAV su 2 colonne (scheda più corta) */
.cf-2col { display: grid; grid-template-columns: 1fr; gap: 0 1.5rem; }
@media (min-width: 768px) { .cf-2col { grid-template-columns: 1fr 1fr; } }

/* Barra azioni "Salva" sempre raggiungibile in fondo al form */
.imr-form-actions {
    position: sticky; bottom: 0; z-index: 5;
    background: #fff; margin-top: 1rem; padding: .75rem 0;
    border-top: 1px solid #eef1f4;
    display: flex; flex-wrap: wrap; gap: .5rem;
}

/* ==========================================================
 * Responsive — uso da telefono / tablet
 * ========================================================== */
@media (max-width: 767.98px) {
    .container-fluid { padding-left: .75rem; padding-right: .75rem; }
    .card-body { padding: 1rem; }
    /* Scorrimento tabelle fluido su touch */
    .table-responsive { -webkit-overflow-scrolling: touch; }
    /* Intestazioni card con titolo + pulsante: vanno a capo ordinatamente */
    .card-header.d-flex { flex-wrap: wrap; gap: .5rem; }
    /* Breadcrumb più compatto */
    .page-title-box, .breadcrumb { font-size: .9rem; }
}

@media (max-width: 575.98px) {
    /* Azioni rapide (Home) e pulsanti grandi: a tutta larghezza, impilati */
    .btn-lg { width: 100%; }
    /* Celle tabella più compatte per starci nello schermo */
    table.table td, table.table th { padding: .5rem; }
    /* Blocchi KPI: su telefono impilati in colonna (testo a tutta larghezza, non si rompe) */
    .imr-kpi { flex-direction: column; align-items: flex-start; gap: .35rem; padding: .85rem 1rem; min-height: 0; text-align: left; }
    .imr-kpi .imr-kpi-txt { text-align: left; }
    .imr-kpi .imr-kpi-val { font-size: 1.25rem; }
    .imr-kpi .imr-kpi-ico { font-size: 1.6rem; }
    /* Riquadri "Vai a…" più compatti (testo non esce più) */
    .imr-tile { padding: .8rem .8rem; min-height: 66px; gap: .45rem; }
    .imr-tile .imr-tile-ico { font-size: 1.45rem; }
    .imr-tile .imr-tile-name { font-size: .95rem; }
    .imr-tile .imr-tile-sub { font-size: .7rem; }
    /* Nella barra azioni sticky, il pulsante Salva prende tutta la riga in alto */
    .imr-form-actions .btn { flex: 1 1 auto; }
}