/* ── Base ─────────────────────────────────────────── */
body {
    background-color: #F0F2F5;
    font-family: 'Segoe UI', sans-serif;
}

.navbar-brand {
    font-size: 1.1rem;
}

/* ── Cards ────────────────────────────────────────── */
.card {
    border: none;
    border-radius: 10px;
}

.card-header {
    border-radius: 10px 10px 0 0 !important;
}

/* ── Buttons ─────────────────────────────────────── */
.btn {
    border-radius: 6px;
}

/* Menu buttons — subtle hover */
.btn.py-3:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

/* ── Tables ──────────────────────────────────────── */
.table th {
    font-size: 0.85rem;
    white-space: nowrap;
}

.table td {
    font-size: 0.85rem;
    vertical-align: middle;
}

/* ── Badges ──────────────────────────────────────── */
.badge {
    font-weight: 500;
}

/* Pulse animation for notification badges */
.badge.rounded-pill.bg-danger {
    /* subtle pulse only for notification count */
}

/* ── Toast Notifications ─────────────────────────── */
.toast-container {
    position: fixed;
    top: 70px;
    right: 20px;
    z-index: 9999;
}

.toast-custom {
    min-width: 300px;
    border-radius: 10px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.15);
    animation: slideIn 0.3s ease;
}

@keyframes slideIn {
    from { transform: translateX(100%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
}

/* ── Loading Spinner ─────────────────────────────── */
.spinner-overlay {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(255,255,255,0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9998;
}

/* ── Login Page ──────────────────────────────────── */
.login-bg {
    min-height: 100vh;
    background: linear-gradient(135deg, #1F497D 0%, #4472C4 50%, #00B0F0 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-card {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
    animation: fadeUp 0.5s ease;
}

@keyframes fadeUp {
    from { transform: translateY(30px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

.login-card .card-header {
    border-radius: 0 !important;
    padding: 2rem;
}

/* ── Status Colors ───────────────────────────────── */
.status-noua { color: #E36C09; font-weight: 600; }
.status-aprobata { color: #00B050; font-weight: 600; }
.status-respinsa { color: #C00000; font-weight: 600; }
.status-partial { color: #4472C4; font-weight: 600; }

/* ── Stat Cards (dashboard) ──────────────────────── */
.stat-card {
    border-radius: 12px;
    cursor: default;
}

/* ── Fade in animation ───────────────────────────── */
.fade-in {
    /* removed to prevent page jank */
}

/* ── Session expiry warning ──────────────────────── */
#sessionWarning {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 9999;
    display: none;
}

/* ── Responsive ──────────────────────────────────── */
@media (max-width: 768px) {
    .btn { font-size: 0.85rem; }
    h5 { font-size: 1rem; }
    .navbar-brand { font-size: 0.95rem; }
    .badge { font-size: 0.7rem; }
}

/* ── Print styles ────────────────────────────────── */
@media print {
    .navbar, footer, .btn, .no-print { display: none !important; }
    .card { box-shadow: none !important; border: 1px solid #ddd; }
    body { background: white; }
}


/* ── Dark Mode ───────────────────────────────────── */
[data-theme="dark"] {
    --bg: #1a1a2e;
    --bg-card: #16213e;
    --text: #e0e0e0;
    --border: #2a2a4a;
}

[data-theme="dark"] body { background-color: var(--bg); color: var(--text); }
[data-theme="dark"] .card { background-color: var(--bg-card); border-color: var(--border); }
[data-theme="dark"] .table { color: var(--text); }
[data-theme="dark"] .form-control, [data-theme="dark"] .form-select {
    background-color: #1a1a3e; color: var(--text); border-color: var(--border);
}
[data-theme="dark"] .alert-info { background-color: #1a2a4e; border-color: #2a3a5e; color: #8ab4f8; }
[data-theme="dark"] .alert-warning { background-color: #3a2a0e; border-color: #4a3a1e; color: #ffd54f; }
[data-theme="dark"] .alert-danger { background-color: #3a1a1a; border-color: #4a2a2a; color: #ef9a9a; }
[data-theme="dark"] .table-secondary { background-color: #2a2a4a !important; }
[data-theme="dark"] .table-hover tbody tr:hover { background-color: #2a2a4a; }
[data-theme="dark"] footer { border-color: var(--border) !important; color: #666; }
[data-theme="dark"] .modal-content { background-color: var(--bg-card); color: var(--text); }


/* ── Mobile Responsive ────────────────────────────── */
@media (max-width: 768px) {
    .navbar-brand {
        font-size: 0.9rem;
    }

    .container-fluid {
        padding-left: 8px;
        padding-right: 8px;
    }

    /* Dropdown notificari pe mobil */
    .dropdown-menu {
        max-width: 85vw !important;
        font-size: 0.85rem;
    }

    #notifDropdown {
        position: fixed !important;
        top: 55px !important;
        right: 8px !important;
        left: auto !important;
        width: 90vw !important;
        max-width: 350px !important;
        transform: none !important;
    }

    /* Butoane mai mari pe mobil */
    .btn {
        padding: 10px 16px;
        font-size: 0.95rem;
    }

    .btn-sm {
        padding: 8px 12px;
        font-size: 0.85rem;
    }

    /* Meniu butoane pe mobil — full width */
    .d-flex.gap-2.flex-wrap .btn {
        flex: 1 1 45%;
        text-align: center;
    }

    /* Tabele scrollabile */
    .table {
        font-size: 0.8rem;
    }

    .table th, .table td {
        padding: 6px 4px;
        white-space: nowrap;
    }

    /* Cards pe mobil */
    .card-body {
        padding: 12px;
    }

    /* Stat cards */
    .stat-card .card-body {
        padding: 8px;
    }

    .stat-card .fs-3 {
        font-size: 1.5rem !important;
    }

    /* Form inputs mai mari pe touch */
    .form-control, .form-select {
        min-height: 44px;
        font-size: 1rem;
    }

    /* Badge-uri */
    .badge {
        font-size: 0.75rem;
        padding: 5px 8px;
    }

    /* Modal pe mobil */
    .modal-dialog {
        margin: 10px;
    }

    /* Hide some columns on mobile */
    .hide-mobile {
        display: none !important;
    }

    /* Inspector dashboard buttons */
    .d-flex.gap-2.flex-wrap {
        gap: 8px !important;
    }

    .d-flex.gap-2.flex-wrap .btn {
        min-width: 120px;
        padding: 12px 8px;
        font-size: 0.85rem;
    }

    .d-flex.gap-2.flex-wrap .btn i {
        display: block;
        font-size: 1.3rem;
        margin-bottom: 4px;
    }
}

/* ── Touch-friendly ──────────────────────────────── */
@media (pointer: coarse) {
    .btn {
        min-height: 44px;
    }

    .form-check-input {
        width: 1.3em;
        height: 1.3em;
    }

    .table td, .table th {
        padding: 8px 6px;
    }
}