/* ── SaaSify - Styles personnalisés ────────────────────── */

/* Scrollbar */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb { background: #888; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #555; }

/* Cards */
.card { transition: box-shadow 0.2s; }
.card:hover { box-shadow: 0 0.3rem 1rem rgba(0,0,0,0.08) !important; }

/* Table rows */
.table-hover tbody tr { transition: background-color 0.15s; }

/* Form focus */
.form-control:focus, .form-select:focus {
    box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.15);
}

/* Animations */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}

.card { animation: fadeIn 0.3s ease-out; }

/* Navbar brand */
.navbar-brand { letter-spacing: -0.5px; }

/* Badge improvements */
.badge { font-weight: 500; font-size: 0.75rem; padding: 0.4em 0.65em; }

/* Border accent cards */
.border-start { border-left-width: 4px !important; }

/* Alerts animation */
.alert { animation: fadeIn 0.3s ease-out; }

/* Responsive tables */
.table-responsive { -webkit-overflow-scrolling: touch; }

/* Button transitions */
.btn { transition: all 0.2s ease; }
.btn:active { transform: scale(0.98); }

/* Small screens adjustments */
@media (max-width: 768px) {
    .container { padding-left: 1rem; padding-right: 1rem; }
    .display-5 { font-size: 2rem !important; }
}