/* ── SIDEBAR COLLASSABILE ─────────────────────────────────── */
.sidebar { transition: width .22s ease; overflow: hidden; }
.sidebar.collapsed { width: 60px !important; }
.sidebar.collapsed .nav-label { display: none; }
.sidebar.collapsed .nav-section { display: none; }
.sidebar.collapsed .user-info { display: none; }
.sidebar.collapsed .sidebar-footer { display: none; }
.sidebar.collapsed .sidebar-logo { justify-content: center; padding: 14px 0; gap: 0; }
.sidebar.collapsed .sidebar-logo img { height: 28px; max-width: 36px; object-fit: contain; }
.sidebar.collapsed #sidebarToggle { display: none; }
.sidebar.collapsed .nav-item { justify-content: center; padding: 10px; }
.sidebar.collapsed .nav-item svg { margin: 0; }
.sidebar.collapsed .sidebar-user { justify-content: center; padding: 10px 0; flex-wrap: wrap; }
.sidebar.collapsed .sidebar-user .user-avatar { margin: 0; }
.sidebar.collapsed .logout-btn { margin: 0; }
.app-shell.sidebar-collapsed .main-content { margin-left: 60px; }

/* ── SIDEBAR LOGO con immagine ────────────────────────────── */
.sidebar-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 20px;
    border-bottom: 1px solid rgba(255,255,255,.1);
    min-height: 60px;
}

/* ── SIDEBAR FOOTER (loghi) ───────────────────────────────── */
.sidebar-footer {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 20px;
    border-top: 1px solid rgba(255,255,255,.08);
}

/* ── ALERT ─────────────────────────────────────────────────── */
.alert { padding: 10px 16px; border-radius: 6px; margin-bottom: 16px; font-size: 14px; }
.alert-success { background: #d1fae5; color: #065f46; border: 1px solid #a7f3d0; }
.alert-error   { background: #fee2e2; color: #991b1b; border: 1px solid #fca5a5; }

/* ── BADGE ─────────────────────────────────────────────────── */
.badge { display:inline-flex; align-items:center; gap:4px; padding:2px 8px; border-radius:12px; font-size:12px; font-weight:600; }
.badge-dark    { background:#555; color:#fff; }
.badge-blue    { background:#dbeafe; color:#1d4ed8; }
.badge-green   { background:#d1fae5; color:#065f46; }
.badge-orange  { background:#ffedd5; color:#9a3412; }
.badge-gray    { background:#f3f4f6; color:#6b7280; }

/* ── PAGINAZIONE ───────────────────────────────────────────── */
.pagination { display:flex; gap:4px; align-items:center; padding:16px 0; flex-wrap:wrap; }
.page-btn {
    min-width:34px; height:34px; padding:0 8px;
    border:1px solid #e5e7eb; border-radius:6px;
    background:#fff; color:#374151; font-size:13px;
    cursor:pointer; display:inline-flex; align-items:center; justify-content:center;
    text-decoration:none;
}
.page-btn:hover { background:#f9fafb; border-color:#9ca3af; }
.page-btn.active { background:#2563eb; color:#fff; border-color:#2563eb; }
.page-btn.disabled { opacity:.4; pointer-events:none; }
.page-btn.ellipsis { border:none; background:none; color:#9ca3af; cursor:default; }
.pagination-info { font-size:13px; color:#6b7280; margin-left:8px; }

/* ── FORM CONTROLS ─────────────────────────────────────────── */
.form-control {
    width:100%; padding:7px 10px; border:1px solid #d1d5db;
    border-radius:6px; font-size:14px; color:#111827;
}
.form-control:focus { outline:none; border-color:#2563eb; box-shadow:0 0 0 3px rgba(37,99,235,.15); }
label { display:block; font-size:13px; font-weight:500; color:#374151; margin-bottom:4px; }
.form-row { display:grid; gap:12px; margin-bottom:12px; }
.form-row-2 { grid-template-columns:1fr 1fr; }
.form-row-3 { grid-template-columns:1fr 1fr 1fr; }

/* ── MODAL ─────────────────────────────────────────────────── */
.modal-overlay {
    display:none; position:fixed; inset:0; background:rgba(0,0,0,.45);
    z-index:1000; align-items:center; justify-content:center;
}
.modal-overlay.open { display:flex; }
.modal {
    background:#fff; border-radius:12px; width:560px; max-width:95vw;
    max-height:90vh; overflow-y:auto; box-shadow:0 20px 60px rgba(0,0,0,.2);
}
.modal-header {
    display:flex; align-items:center; justify-content:space-between;
    padding:18px 24px; border-bottom:1px solid #e5e7eb;
}
.modal-title { font-size:16px; font-weight:600; color:#111827; }
.modal-close { background:none; border:none; cursor:pointer; color:#6b7280; font-size:20px; line-height:1; }
.modal-body { padding:20px 24px; }
.modal-footer { padding:16px 24px; border-top:1px solid #e5e7eb; display:flex; justify-content:flex-end; gap:8px; }

/* ── TABS ──────────────────────────────────────────────────── */
.tabs { display:flex; gap:0; border-bottom:2px solid #e5e7eb; margin-bottom:20px; }
.tab-btn {
    padding:10px 18px; border:none; background:none; cursor:pointer;
    font-size:14px; color:#6b7280; border-bottom:2px solid transparent;
    margin-bottom:-2px; font-weight:500;
}
.tab-btn.active { color:#2563eb; border-bottom-color:#2563eb; }
.tab-panel { display:none; }
.tab-panel.active { display:block; }

/* ── TABELLA ───────────────────────────────────────────────── */
.data-table { width:100%; border-collapse:collapse; font-size:14px; }
.data-table th { padding:10px 12px; text-align:left; font-weight:600; color:#6b7280; background:#f9fafb; font-size:12px; text-transform:uppercase; letter-spacing:.05em; border-bottom:1px solid #e5e7eb; }
.data-table td { padding:10px 12px; border-bottom:1px solid #f3f4f6; color:#111827; vertical-align:middle; }
.data-table tr:hover td { background:#f9fafb; }

/* ── LICENZA ONLINE/FILE badge ─────────────────────────────── */
.badge-online { background:#dbeafe; color:#1d4ed8; }
.badge-file   { background:#fef9c3; color:#854d0e; }

/* ── Modal backdrop (usato in Detail, Potenziali, Impostazioni) ── */
.modal-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.45);
    z-index: 1000;
    align-items: center;
    justify-content: center;
}
.modal-backdrop.open {
    display: flex !important;
}
.modal-box {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 8px 40px rgba(0,0,0,.18);
    width: 90%;
    max-width: 560px;
    max-height: 90vh;
    overflow-y: auto;
}

/* Pulsante hamburger per riaprire sidebar quando collassata */
#sidebarReopen { display: none; }
.app-shell.sidebar-collapsed #sidebarReopen { display: inline-flex !important; align-items: center; }

/* Stat icon gialla per potenziali */
.stat-icon.yellow { background: #fef9c3; color: #854d0e; }

/* ── Bottone elimina ──────────────────────────── */
.btn-danger { background:#DC2626; color:white; border:none; cursor:pointer; }
.btn-danger:hover { background:#B91C1C; }