/* ======== FONDO GENERAL ======== */
body {
    background: radial-gradient(circle at top, #1a1a1d 0%, #0b0b0d 100%) !important;
    color: #e6e6e6 !important;
    font-family: "Inter", sans-serif;
}

/* ======== CONTENEDORES ======== */
.card, .modal-content {
    background-color: #141416 !important;
    border: 1px solid #2a2a2d !important;
    border-radius: 14px !important;
    padding: 18px !important;
    box-shadow: 0 0 25px rgba(0,0,0,0.45);
}

/* ======== TABLA ======== */
.table {
    background-color: #141416 !important;
    border-radius: 12px !important;
    overflow: hidden;
}

.table thead th {
    background: linear-gradient(90deg, #202024, #2a2a2f) !important;
    color: #ffffff !important;
    font-weight: 600;
    border-bottom: 2px solid #3a3a3d !important;
}

.table tbody tr {
    transition: background 0.25s ease, transform 0.15s ease;
}

.table tbody tr:hover {
    background-color: #1f1f23 !important;
    transform: scale(1.01);
}

/* ======== INPUTS ======== */
input, select, textarea {
    background-color: #1c1c20 !important;
    color: #ffffff !important;
    border: 1px solid #3a3a3d !important;
    border-radius: 8px !important;
    transition: 0.2s ease;
}

input:focus, select:focus, textarea:focus {
    border-color: #7b6df0 !important;
    box-shadow: 0 0 8px #7b6df0 !important;
}

/* ======== BOTONES ======== */
.btn {
    border-radius: 10px !important;
    font-weight: 600 !important;
    padding: 8px 14px !important;
    transition: 0.2s ease;
}

/* Botón principal */
.btn-primary {
    background: linear-gradient(135deg, #6a5acd, #8a7df5) !important;
    border: none !important;
    box-shadow: 0 0 10px rgba(106, 90, 205, 0.4);
}

.btn-primary:hover {
    background: linear-gradient(135deg, #7b6df0, #9b8dff) !important;
    box-shadow: 0 0 14px rgba(123, 109, 240, 0.6);
}

/* Botón peligro */
.btn-danger {
    background: linear-gradient(135deg, #d9534f, #ff6b66) !important;
    border: none !important;
    box-shadow: 0 0 10px rgba(217, 83, 79, 0.4);
}

.btn-danger:hover {
    background: linear-gradient(135deg, #e46a66, #ff7f7a) !important;
}

/* Botón secundario */
.btn-secondary {
    background: linear-gradient(135deg, #2d2d32, #3a3a40) !important;
    border: none !important;
}

.btn-secondary:hover {
    background: linear-gradient(135deg, #3a3a40, #4a4a50) !important;
}

/* ======== BADGES ======== */
.badge {
    padding: 6px 12px !important;
    border-radius: 8px !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
}

.badge-success {
    background: linear-gradient(135deg, #2ecc71, #48e68f) !important;
}

.badge-warning {
    background: linear-gradient(135deg, #f1c40f, #ffd84d) !important;
    color: #000 !important;
}

.badge-danger {
    background: linear-gradient(135deg, #e74c3c, #ff6a55) !important;
}