/* --- STILI GLOBALI E VARIABILI --- */
:root {
    --primary-color: #1A85D6;
    --primary-hover: #0056b3;
    --sidebar-bg: #1e293b;
    --sidebar-link-hover: #ffffff;
    --page-bg: #f1f5f9;
    --card-bg: #ffffff;
    --text-dark: #1e293b;
    --text-light: #64748b;
    --border-color: #e2e8f0;
    --error-bg: #f8d7da;
    --error-text: #842029;
    --image-panel-bg: #1e293b;
    --font-family: 'Poppins', sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

body, html { height: 100%; margin: 0; font-family: var(--font-family); background-color: var(--page-bg); color: var(--text-dark); }

/* --- LAYOUT LOGIN E REGISTRAZIONE (Mobile First) --- */
.login-body { background-color: var(--page-bg); }
.login-page { display: flex; min-height: 100vh; width: 100%; }
.login-image-panel { display: none; }
.login-form-panel {
    display: flex; align-items: center; justify-content: center;
    flex-basis: 100%; padding: 1.5rem;
    background-image: linear-gradient(rgba(30, 41, 59, 0.7), rgba(30, 41, 59, 0.7)), url('https://images.unsplash.com/photo-1556740738-b6a63e27c4df?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&q=80&w=1080');
    background-size: cover; background-position: center;
}
.login-card {
    background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2); padding: 2.5rem;
    border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    width: 100%; max-width: 480px;
}
.logo-container { text-align: center; margin-bottom: 1.5rem; }
.logo-container img { max-width: 180px; height: auto; filter: brightness(0) invert(1); }
.login-card h2, .registration-header h2 { text-align: center; color: #ffffff; margin-bottom: 0.5rem; font-weight: 600; }
.login-card .subtitle, .registration-header p { text-align: center; color: rgba(255, 255, 255, 0.8); margin-bottom: 2rem; }
.login-footer { text-align: center; margin-top: 2rem; font-size: 0.9rem; }
.login-footer a { color: #ffffff; text-decoration: none; font-weight: 600; }
.form-group { margin-bottom: 1.5rem; position: relative; }
.form-group label { display: block; font-weight: 500; margin-bottom: 0.5rem; font-size: 0.9rem; color: #ffffff; text-align: left; }
.form-group .icon { position: absolute; left: 15px; top: 50%; transform: translateY(-50%); color: rgba(255, 255, 255, 0.7); }
.form-group input { width: 100%; padding: 0.8rem 0.8rem 0.8rem 2.5rem; border: 1px solid rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.15); border-radius: 8px; font-size: 1rem; color: #ffffff; }
.form-group input:focus { outline: none; border-color: var(--primary-color); box-shadow: 0 0 0 3px rgba(26, 133, 214, 0.3); }
.password-wrapper { position: relative; }
.toggle-password { position: absolute; right: 15px; top: 50%; transform: translateY(-50%); cursor: pointer; color: rgba(255, 255, 255, 0.8); }
.btn-login { width: 100%; padding: 0.9rem; background: var(--primary-color); color: #fff; border: none; border-radius: 8px; cursor: pointer; font-size: 1.1rem; font-weight: 600; transition: background-color 0.2s, transform 0.2s; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;}
.btn-login:hover { background-color: var(--primary-hover); transform: translateY(-2px); }
.error-message { color: #ffffff; background: rgba(220, 53, 69, 0.7); backdrop-filter: blur(5px); padding: 0.8rem; border-radius: 8px; margin-bottom: 1.5rem; text-align: center; font-size: 0.9rem; }
.info-box { background-color: rgba(238, 247, 255, 0.85); border: 1px solid #b8d9f7; border-radius: 8px; padding: 1.5rem; margin-bottom: 2rem; text-align: left; }
.info-box h3 { color: var(--primary-color); }
.info-box p { color: var(--text-dark); }
.registration-header { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; text-align: left; border-bottom: 1px solid rgba(255,255,255,0.2); padding-bottom: 1.5rem;}
.header-icon-wrapper { flex-shrink: 0; width: 50px; height: 50px; background-color: rgba(255, 255, 255, 0.1); border-radius: 12px; display: flex; align-items: center; justify-content: center; }
.header-icon-wrapper i { font-size: 1.5rem; color: #ffffff; }

/* Stili Tablet e Desktop per Login/Registrazione */
@media (min-width: 992px) {
    .login-image-panel { display: flex; flex-basis: 50%; background-color: var(--image-panel-bg); color: white; padding: 3rem; text-align: center; justify-content: center; align-items: center; flex-direction: column; }
    .image-panel-content h1 { font-size: 2.5rem; } .image-panel-content p { font-size: 1.1rem; max-width: 450px; opacity: 0.9; }
    .login-form-panel { flex-basis: 50%; background-image: none; background-color: var(--page-bg); }
    .login-card { background: var(--card-bg); backdrop-filter: none; border: none; box-shadow: 0 10px 30px rgba(0,0,0,0.1); }
    .logo-container img { filter: none; }
    .login-card h2, .registration-header h2 { color: var(--text-dark); }
    .login-card .subtitle, .registration-header p { color: var(--text-light); }
    .login-footer a { color: var(--primary-color); }
    .form-group label { color: var(--text-dark); }
    .form-group .icon, .toggle-password { color: var(--text-light); }
    .form-group input { background: #ffffff; border-color: var(--border-color); color: var(--text-dark); }
    .error-message { color: var(--error-text); background: var(--error-bg); backdrop-filter: none; }
    .info-box { background-color: #eef7ff; }
    .registration-header { border-bottom-color: var(--border-color); }
    .header-icon-wrapper { background-color: #eef7ff; } .header-icon-wrapper i { color: var(--primary-color); }
}

/* --- STILI DASHBOARD --- */
.dashboard-layout { display: flex; min-height: 100vh; }
.main-content { flex-grow: 1; display: flex; flex-direction: column; }
.page-content { flex-grow: 1; padding: 1rem; }
.card { background-color: var(--card-bg); border-radius: 12px; box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05); margin-bottom: 1.5rem; }
.card-header { padding: 1rem 1.5rem; border-bottom: 1px solid var(--border-color); font-weight: 600; font-size: 1.1rem; }
.card-body { padding: 1.5rem; }
.table-responsive { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th { background-color: var(--sidebar-bg); color: var(--sidebar-link-hover); font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; text-align: left; padding: 1rem; }
td { padding: 1rem; border-bottom: 1px solid var(--border-color); vertical-align: middle; }
tbody tr:last-child td { border-bottom: none; }
tbody tr:hover { background-color: #f8fafc; }
.badge { padding: 0.4em 0.7em; font-size: 0.8em; font-weight: 600; border-radius: 50px; }
.bg-success { background-color: #dcfce7 !important; color: #166534 !important; }
.bg-danger { background-color: #fee2e2 !important; color: #991b1b !important; }
.bg-warning { background-color: #fef9c3 !important; color: #854d0e !important; }
.bg-info { background-color: #cffafe !important; color: #155e75 !important; }
.btn-view-icon { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; background-color: var(--primary-color); color: white !important; border-radius: 50%; text-decoration: none; transition: all 0.2s ease; }
.btn-view-icon:hover { background-color: var(--primary-hover); transform: scale(1.1); }
td[data-label] { display: table-cell; }

@media (max-width: 768px) {
    .table-responsive thead { display: none; }
    .table-responsive tr { display: block; margin-bottom: 1.5rem; border: 1px solid var(--border-color); border-radius: 8px; padding: 1rem; }
    .table-responsive td { display: flex; justify-content: space-between; align-items: center; text-align: right; padding: 0.75rem 0; border-bottom: 1px dotted var(--border-color); font-size: 0.9rem; }
    .table-responsive td:last-child { border-bottom: none; }
    .table-responsive td::before { content: attr(data-label); font-weight: 600; text-align: left; padding-right: 1rem; color: var(--text-light); }
}