:root {
    --bg-main: #070913;
    --bg-alt: #0b1022;
    --surface: #111935;
    --surface-2: #172347;
    --border: #2a3f79;
    --text-main: #ecf6ff;
    --text-muted: #a9bddd;
    --accent: #00f5d4;
    --accent-2: #ff2bd6;
    --accent-soft: rgba(0, 245, 212, 0.28);
}

body {
    background:
        radial-gradient(circle at 15% 10%, rgba(255, 43, 214, 0.18) 0%, transparent 36%),
        radial-gradient(circle at 85% 0%, rgba(0, 245, 212, 0.14) 0%, transparent 34%),
        linear-gradient(145deg, #05070f 0%, var(--bg-main) 46%, #090d1d 100%);
    color: var(--text-main);
}

a {
    color: #79ffe8;
    text-decoration-color: rgba(121, 255, 232, 0.6);
}

a:hover {
    color: #c6fff5;
}

.navbar {
    background-color: var(--surface) !important;
    border-bottom: 1px solid var(--border);
    box-shadow: 0 0 22px rgba(0, 245, 212, 0.16);
}

.card {
    background-color: var(--surface);
    border: 1px solid var(--border);
    color: var(--text-main);
    box-shadow: 0 0 0 1px rgba(255, 43, 214, 0.1), 0 16px 40px rgba(2, 8, 24, 0.72);
}

.card-title,
.form-label,
.dataTables_wrapper .dataTables_filter label,
.dataTables_wrapper .dataTables_length label {
    color: var(--text-main);
}

.card-body p,
.card-body .text-muted,
.footer-info,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
    color: var(--text-muted) !important;
}

code {
    color: #7cfcea;
    background-color: #131f3f;
    border: 1px solid rgba(0, 245, 212, 0.35);
    padding: 1px 5px;
    border-radius: 3px;
}

.upload-area {
    border: 2px dashed var(--accent-2);
    border-radius: 8px;
    padding: 40px;
    text-align: center;
    cursor: pointer;
    transition: background-color 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.upload-area:hover {
    background-color: rgba(255, 43, 214, 0.08);
    border-color: var(--accent);
    box-shadow: 0 0 24px rgba(255, 43, 214, 0.26);
}

.upload-area .icon {
    font-size: 3rem;
}

.form-control,
.form-select,
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
    background-color: var(--surface-2);
    color: var(--text-main);
    border: 1px solid var(--border);
    border-radius: 4px;
    padding: 4px 8px;
}

.form-control:focus,
.form-select:focus,
.dataTables_wrapper .dataTables_filter input:focus,
.dataTables_wrapper .dataTables_length select:focus {
    background-color: var(--surface-2);
    color: var(--text-main);
    border-color: var(--accent);
    box-shadow: 0 0 0 0.25rem var(--accent-soft), 0 0 18px rgba(0, 245, 212, 0.22);
}

table.dataTable {
    color: var(--text-main);
}

table.table.dataTable {
    --bs-table-bg: transparent;
    --bs-table-striped-bg: transparent;
    --bs-table-hover-bg: transparent;
}

table.table.dataTable > :not(caption) > * > * {
    background-color: transparent !important;
    color: var(--text-main) !important;
}

table.dataTable thead th {
    background-color: var(--surface-2);
    color: var(--text-main);
    border-color: var(--border);
    text-shadow: 0 0 10px rgba(0, 245, 212, 0.3);
}

table.table.dataTable thead > tr > * {
    background-color: var(--surface-2) !important;
}

table.dataTable tbody tr.odd,
table.dataTable tbody tr {
    background-color: var(--surface);
    color: var(--text-main);
}

table.table.dataTable tbody tr.odd > * {
    background-color: var(--surface) !important;
}

table.dataTable tbody tr.even {
    background-color: #16213a;
}

table.table.dataTable tbody tr.even > * {
    background-color: #16213a !important;
}

table.dataTable tbody tr:hover {
    background-color: #223769 !important;
    box-shadow: inset 3px 0 0 var(--accent);
}

table.table.dataTable tbody tr:hover > * {
    background-color: #223769 !important;
}

table.dataTable td,
table.dataTable th {
    border-color: var(--border) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    color: var(--text-muted) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background-color: var(--accent) !important;
    border-color: var(--accent) !important;
    color: #062b26 !important;
    box-shadow: 0 0 18px rgba(0, 245, 212, 0.45);
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background-color: var(--surface-2) !important;
    border-color: var(--accent-2) !important;
    color: #fff !important;
}

.btn-danger {
    background: linear-gradient(135deg, #ff2bd6 0%, #ff4a7a 100%);
    border-color: #ff2bd6;
    box-shadow: 0 0 14px rgba(255, 43, 214, 0.32);
}

.btn-danger:hover,
.btn-danger:focus {
    background: linear-gradient(135deg, #ff53e0 0%, #ff6d92 100%);
    border-color: #ff53e0;
    box-shadow: 0 0 20px rgba(255, 83, 224, 0.45);
}

.btn-success {
    background: linear-gradient(135deg, #00d6b8 0%, #00f5d4 100%);
    border-color: #00e9c9;
    color: #03231f;
    box-shadow: 0 0 16px rgba(0, 245, 212, 0.36);
}

.btn-success:hover,
.btn-success:focus {
    background: linear-gradient(135deg, #27edd1 0%, #6effea 100%);
    border-color: #59ffe5;
    color: #03231f;
}

.badge-fuente {
    font-size: 0.75rem;
}

.nota-badge {
    min-width: 36px;
    display: inline-block;
    text-align: center;
}