/* MIIA – tema ricavato dalla demo (sidebar nera, viola/blu MI-IA, font Inter/Outfit) */
:root {
    --viola-miia: #4B548F;
    --blu-miia: #252D61;
    --hover-miia: #4B548F66;
    --primary-miia: #262A43;
    --title-bg: #E5E7EB;
    --title-border: rgba(0, 0, 0, .23);
    --content-bg: #F3F4F6;
    --riga-hover: #E3ECFF;
    --link-attivo: #3774FF;
    --sidebar-w: 250px;
    --sidebar-w-collapsed: 70px;
    --header-h: 84px;
}
body { font-family: "Inter", sans-serif; font-size: 14px; color: #212529; background: var(--content-bg); }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4 { font-family: "Outfit", sans-serif; }
h2, h3 { font-weight: 500; }
.material-symbols-outlined { font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24; vertical-align: middle; }

/* Header */
.miia-header { position: fixed; top: 0; left: 0; right: 0; height: var(--header-h); background: #fff; border-bottom: 1px solid #e5e7eb; z-index: 1040; display: flex; align-items: center; justify-content: space-between; padding: 0 1rem 0 2.2rem; }
.miia-header .logo img { height: 36px; }
.btn-admin { border: 1px solid var(--primary-miia); color: var(--primary-miia); background: #fff; font-weight: 500; padding: .7rem 1.1rem; border-radius: 4px; display: inline-flex; align-items: center; gap: .6rem; }
.btn-admin:hover { background: var(--riga-hover); color: var(--primary-miia); }
.btn-avatar { width: 46px; height: 46px; border-radius: 50%; border: 1px solid #e5e7eb; background: #fff; display: inline-flex; align-items: center; justify-content: center; }

/* Sidebar */
.miia-sidebar { position: fixed; top: var(--header-h); left: 0; bottom: 0; width: var(--sidebar-w); background: #000; z-index: 1035; display: flex; flex-direction: column; justify-content: space-between; padding: 1.2rem 0 1rem; transition: width .3s; overflow-y: auto; overflow-x: hidden; box-shadow: 0 0 10px rgba(0,0,0,.2); }
.miia-sidebar .nav-link { color: #fff; display: flex; align-items: center; gap: 1rem; padding: 1rem 1.3rem 1rem 2.6rem; border-left: 3px solid transparent; font-size: 16px; white-space: nowrap; }
.miia-sidebar .nav-link .material-symbols-outlined { font-size: 26px; color: #fff; }
.miia-sidebar .nav-link:hover, .miia-sidebar .nav-link.active { background: var(--hover-miia); border-left-color: var(--viola-miia); color: #fff; }
.miia-sidebar .nav-link.small-text { font-size: 14px; }
.miia-sidebar .chevron { margin-left: auto; font-size: 20px !important; transition: transform .2s; }
.miia-sidebar .nav-link[aria-expanded="true"] .chevron { transform: rotate(-90deg); }
.miia-sidebar .submenu .nav-link { padding-left: 4.4rem; font-size: 13px; }
.miia-sidebar .separatore { border-top: 1px solid #555; margin: .3rem 1.8rem; }
.miia-sidebar .sidebar-toggle { color: #fff; background: none; border: 0; align-self: flex-end; margin-right: 1.4rem; }
body.sidebar-collapsed .miia-sidebar { width: var(--sidebar-w-collapsed); }
body.sidebar-collapsed .miia-sidebar .nav-link { padding-left: 1.3rem; }
body.sidebar-collapsed .miia-sidebar .nav-label, body.sidebar-collapsed .miia-sidebar .chevron, body.sidebar-collapsed .miia-sidebar .submenu { display: none !important; }
body.sidebar-collapsed .miia-sidebar .separatore { margin: .3rem .8rem; }
body.sidebar-collapsed .miia-sidebar .sidebar-toggle { align-self: center; margin: 0; }

/* Contenuto */
.miia-content { margin-left: var(--sidebar-w); padding-top: var(--header-h); min-height: 100vh; transition: margin-left .3s; }
body.sidebar-collapsed .miia-content { margin-left: var(--sidebar-w-collapsed); }
.miia-title { background: var(--title-bg); border-bottom: 1px solid var(--title-border); padding: 1.3rem 1rem 1.3rem 2.2rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.miia-title h1 { font-size: 34px; margin: 0; display: flex; align-items: center; gap: .7rem; font-weight: 500; }
.miia-title h1 .material-symbols-outlined { font-size: 34px; color: var(--blu-miia); }
.miia-body { padding: 1.5rem 1rem 2rem 2.2rem; }
.miia-intro { font-size: 15px; margin-bottom: 1.2rem; }
.card-miia { background: #fff; border-radius: 8px; border: 1px solid rgba(151,151,151,.3); padding: 1.3rem; margin-bottom: 1.5rem; }
.card-miia > h3 { font-size: 24px; margin-bottom: 1rem; }

/* Pulsanti */
.btn-miia { background: var(--blu-miia); color: #fff; border: 0; border-radius: 4px; padding: .75rem 1.2rem; text-transform: uppercase; font-weight: 500; letter-spacing: .01em; display: inline-flex; align-items: center; gap: .5rem; }
.btn-miia:hover, .btn-miia:focus { background: var(--viola-miia); color: #fff; }
.btn-miia-outline { background: #fff; color: var(--primary-miia); border: 1px solid var(--primary-miia); border-radius: 4px; padding: .7rem 1.1rem; text-transform: uppercase; font-weight: 500; display: inline-flex; align-items: center; gap: .5rem; }
.btn-miia-outline:hover { background: var(--riga-hover); color: var(--primary-miia); }
.btn-esporta { border: 2px solid #bdbdbd; color: #9e9e9e; background: #fff; border-radius: 4px; padding: .55rem 1rem; display: inline-flex; align-items: center; gap: .4rem; }
.btn-esporta:hover { color: var(--primary-miia); border-color: var(--primary-miia); }
.btn-salva { background: #198754; color: #fff; border: 0; padding: .6rem 1.1rem; border-radius: 4px; }
.btn-salva:hover { background: #157347; color: #fff; }
.btn-annulla { background: none; border: 0; color: #555; padding: .6rem 1rem; }
.btn-help { background: #fff; border: 1px solid var(--viola-miia); color: var(--viola-miia); border-radius: 20px; padding: .45rem .9rem; display: inline-flex; align-items: center; gap: .3rem; font-weight: 500; }
.btn-help:hover { background: var(--viola-miia); color: #fff; }

/* Tabelle */
.miia-search { border: 1px solid #555; border-radius: 6px; padding: .6rem 1rem; width: 310px; max-width: 100%; background: #f8f9fb; }
.miia-table { width: 100%; margin-top: 1.5rem; border-collapse: collapse; }
.miia-table thead th { text-transform: uppercase; font-weight: 600; font-size: 14px; padding: 1rem 1.2rem; border-right: 1px solid #e5e7eb; border-bottom: 1px solid #e5e7eb; white-space: nowrap; }
.miia-table thead th:last-child { border-right: 0; }
.miia-table thead th a { color: inherit; text-decoration: none; }
.miia-table tbody td { padding: .9rem 1.2rem; border-right: 1px solid #e5e7eb; border-bottom: 1px solid #f0f0f0; vertical-align: middle; }
.miia-table tbody td:last-child { border-right: 0; }
.miia-table tbody tr:hover { background: var(--riga-hover); }
.miia-table .azioni { text-align: center; width: 90px; }
.btn-azioni { width: 26px; height: 26px; border-radius: 50%; background: #000; color: #fff; border: 0; display: inline-flex; align-items: center; justify-content: center; padding: 0; }
.btn-azioni .material-symbols-outlined { font-size: 20px; }
.miia-footer-table { display: flex; align-items: center; justify-content: space-between; margin-top: 1.4rem; color: #555; flex-wrap: wrap; gap: 1rem; }
.miia-footer-table select { border-radius: 6px; padding: .5rem .8rem; background: #eee; }
.miia-pagination a, .miia-pagination span { display: inline-flex; width: 40px; height: 40px; align-items: center; justify-content: center; color: #000; text-decoration: none; border-radius: 6px; }
.miia-pagination .attiva { border: 1px solid var(--link-attivo); color: var(--link-attivo); }
.miia-pagination .disabilitata { color: #bbb; }
.logo-mini { width: 40px; height: 40px; border-radius: 50%; object-fit: contain; vertical-align: middle; margin-right: .5rem; background: #fff; }
.logo-iniziale { width: 40px; height: 40px; border-radius: 50%; background: var(--blu-miia); color: #fff; display: inline-flex; align-items: center; justify-content: center; margin-right: .5rem; font-weight: 600; }

/* Form */
.breadcrumb-miia { display: flex; align-items: center; gap: .6rem; color: #555; margin-bottom: 1rem; }
.breadcrumb-miia a { color: #555; text-decoration: none; }
.breadcrumb-miia .material-symbols-outlined { font-variation-settings: "FILL" 1; color: #555; }
.nav-tabs-miia { border-bottom: 1px solid #ddd; margin-bottom: 1.5rem; gap: .5rem; }
.nav-tabs-miia .nav-link { border: 0; color: #333; font-family: "Outfit", sans-serif; font-size: 18px; padding: .7rem 1.4rem; border-bottom: 3px solid transparent; }
.nav-tabs-miia .nav-link.active { color: var(--blu-miia); border-bottom-color: var(--blu-miia); font-weight: 500; background: none; }
.campo { position: relative; margin-bottom: 1.3rem; }
.campo label { position: absolute; top: -.6rem; left: .6rem; background: #fff; padding: 0 .3rem; font-size: 13px; color: #444; z-index: 2; max-width: calc(100% - 1.2rem); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.campo .form-control, .campo .form-select { border: 1px solid #c4c4c4; border-radius: 4px; padding: .8rem .8rem .6rem; }
.campo .form-check { padding-top: .8rem; }
.campo .errore { color: #c62828; font-size: 12px; margin-top: .2rem; }
.campo .aiuto { color: #777; font-size: 12px; margin-top: .2rem; }
.campo-obbligatorio label::after { content: " *"; color: #c62828; }

/* Badge stato */
.badge-stato { white-space: nowrap; border-radius: 12px; padding: .25rem .65rem; font-size: 12px; font-weight: 500; }
.badge-ok { background: #d4f7d4; color: #1b5e20; }
.badge-avvisi { background: #fff3cd; color: #8a6100; }
.badge-errore { background: #ffd6d6; color: #b71c1c; }
.badge-info { background: #e3ecff; color: #1d3f9b; }
.badge-grigio { background: #eceff1; color: #455a64; }

/* Drag & drop */
.dropzone-miia { border: 2px dashed var(--viola-miia); border-radius: 8px; background: #f7f8fd; padding: 2.5rem 1rem; text-align: center; color: var(--viola-miia); cursor: pointer; transition: background .2s; }
.dropzone-miia.over { background: var(--riga-hover); }
.dropzone-miia .material-symbols-outlined { font-size: 48px; }

/* Alert */
.messages { position: fixed; top: calc(var(--header-h) + 12px); right: 16px; z-index: 1060; width: 440px; max-width: calc(100% - 32px); }
.messages .alert { box-shadow: 0 4px 14px rgba(0,0,0,.15); border-left-width: 5px; }

/* Help */
.offcanvas-help { width: 460px !important; }
.offcanvas-help .offcanvas-header { background: var(--blu-miia); color: #fff; }
.offcanvas-help h2 { font-size: 20px; margin-top: 1.2rem; color: var(--blu-miia); }
.offcanvas-help h3 { font-size: 17px; margin-top: 1rem; }
.offcanvas-help table { width: 100%; font-size: 13px; }
.offcanvas-help td, .offcanvas-help th { border: 1px solid #ddd; padding: .3rem .5rem; }

/* Home */
.kpi { display: flex; align-items: center; gap: 1rem; }
.kpi .icona { width: 56px; height: 56px; border-radius: 50%; background: linear-gradient(45deg, #000000, #48D2F0); color: #fff; display: flex; align-items: center; justify-content: center; }
.kpi .valore { font-family: "Outfit", sans-serif; font-size: 30px; font-weight: 500; line-height: 1; }
.kpi a { color: inherit; text-decoration: none; }

/* Login */
.login-page { min-height: 100vh; display: flex; background: var(--content-bg); }
.login-side { flex: 1; background: #000; display: flex; align-items: center; justify-content: center; }
.login-side img { width: 55%; max-width: 320px; filter: brightness(0) invert(1); }
.login-box { flex: 1; display: flex; align-items: center; justify-content: center; padding: 2rem; }
.login-card { width: 100%; max-width: 420px; }
.login-card h1 { font-size: 30px; margin-bottom: .5rem; }
@media (max-width: 900px) { .login-side { display: none; } }

.in-sviluppo { text-align: center; padding: 3rem 1rem; color: #666; }
.in-sviluppo .material-symbols-outlined { font-size: 64px; color: var(--viola-miia); }