body {
    font-family: 'Segoe UI', Tahoma, sans-serif;
}

.card {
    border-radius: 12px;
}

.btn {
    border-radius: 20px;
}

.table {
    border-radius: 10px;
    overflow: hidden;
}

textarea {
    resize: none;
}

.card,
table {
    animation: fadeIn 0.4s ease-in;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ---------- DARK MODE ---------- */

body.dark-mode {
    background-color: #121212 !important;
    color: #e0e0e0;
}

body.dark-mode .card,
body.dark-mode .table,
body.dark-mode .navbar {
    background-color: #1e1e1e !important;
    color: #e0e0e0;
}

body.dark-mode .table {
    border-color: #333;
}

body.dark-mode .table th,
body.dark-mode .table td {
    border-color: #333;
}

body.dark-mode .btn-outline-light {
    border-color: #ccc;
    color: #ccc;
}

body.dark-mode .btn-outline-light:hover {
    background-color: #ccc;
    color: #000;
}
.input-group input {
    border-radius: 20px 0 0 20px;
}

.input-group button {
    border-radius: 0 20px 20px 0;
}