/* =========================================================
   BITS Norte Theme (Option A: Branding + Contrast + Tables)
   ========================================================= */

/* Base */
:root{
  --bits-bg1:#07121f;
  --bits-bg2:#0b2138;
  --bits-card:rgba(255,255,255,.06);
  --bits-border:rgba(255,255,255,.12);
  --bits-text:#EAF2FF;
  --bits-muted:rgba(234,242,255,.72);
  --bits-accent:#35B6FF;
  --bits-accent2:#1E7FE6;
  --bits-success:#22c55e;
  --bits-danger:#ef4444;
  --bits-warning:#f59e0b;
}

body{
  background:
    radial-gradient(1100px 520px at 18% 0%, rgba(53,182,255,.18), transparent 60%),
    radial-gradient(900px 520px at 88% 12%, rgba(30,127,230,.14), transparent 55%),
    linear-gradient(180deg, var(--bits-bg1), var(--bits-bg2));
  color: var(--bits-text);
}

/* Generic text helpers */
.text-muted{ color: var(--bits-muted) !important; }
a{ color: rgba(207,232,255,.92); }
a:hover{ color: #fff; }

/* Navbar */
.navbar{
  background: linear-gradient(90deg, rgba(7,18,31,.92), rgba(10,34,58,.92)) !important;
  border-bottom: 1px solid rgba(53,182,255,.18);
  backdrop-filter: blur(10px);
}
.navbar .navbar-brand,
.navbar .nav-link{ color: rgba(234,242,255,.88) !important; }
.navbar .nav-link:hover{ color:#fff !important; }
.navbar .navbar-toggler{ filter: invert(1); opacity:.9; }

.bits-brand{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:800;
  letter-spacing:.2px;
}
.bits-brand img{ width:26px; height:26px; border-radius:6px; }
.bits-brand small{ display:block; font-weight:600; opacity:.78; margin-top:-2px; }

/* Cards */
.card{
  background: var(--bits-card);
  border: 1px solid var(--bits-border);
  border-radius: 18px;
  box-shadow: 0 18px 50px rgba(0,0,0,.25);
}
.card .card-title, .card h1, .card h2, .card h3, .card h4{ color:#fff; }

/* Buttons */
.btn-primary{
  background: linear-gradient(90deg, rgba(30,127,230,.95), rgba(53,182,255,.95));
  border: 1px solid rgba(53,182,255,.35);
}
.btn-primary:hover{
  filter: brightness(1.06);
}
.btn-outline-primary{
  color: var(--bits-accent);
  border-color: rgba(53,182,255,.4);
}
.btn-outline-primary:hover{
  background: rgba(53,182,255,.14);
  border-color: rgba(53,182,255,.55);
  color:#fff;
}

/* Dropdown menus */
.dropdown-menu{
  background-color: rgba(15,28,46,.98);
  border: 1px solid rgba(53,182,255,.25);
  border-radius: 14px;
  backdrop-filter: blur(10px);
}
.dropdown-item{ color: var(--bits-text); }
.dropdown-item:hover, .dropdown-item:focus{
  background-color: rgba(53,182,255,.14);
  color:#fff;
}
.dropdown-divider{ border-color: rgba(255,255,255,.10); }

/* Forms */
label, .form-label{ color: rgba(207,232,255,.92); font-weight:600; }
.form-control, .form-select{
  background-color: rgba(255,255,255,.06);
  color: #fff;
  border: 1px solid rgba(255,255,255,.22);
}
.form-control:focus, .form-select:focus{
  border-color: rgba(53,182,255,.55);
  box-shadow: 0 0 0 .2rem rgba(53,182,255,.18);
}
.form-control::placeholder{ color: rgba(234,242,255,.50); }

/* Tables (Bootstrap) */
.table{
  color: rgba(17,24,39,.98) !important; /* default to dark text */
}
.table thead th{
  color:#fff !important;
  background-color: #0f172a !important;
  border-color: #1e293b !important;
}
.table tbody tr{ background-color: #fff !important; }
.table tbody td{
  color: rgba(17,24,39,.98) !important;
  border-color: rgba(15,23,42,.12) !important;
}
.table-striped > tbody > tr:nth-of-type(odd){ background-color: #f3f4f6 !important; }
.table-hover tbody tr:hover{ background-color: #e5f2ff !important; }

/* DataTables */
table.dataTable tbody td,
table.dataTable tbody th,
.dataTables_wrapper table tbody td,
.dataTables_wrapper table tbody th{
  color: rgba(17,24,39,.98) !important;
}
table.dataTable tbody tr{ background-color:#fff !important; }
table.dataTable.stripe tbody tr.odd,
table.dataTable.display tbody tr.odd,
table.dataTable tbody tr:nth-of-type(odd){ background-color:#f3f4f6 !important; }
table.dataTable.hover tbody tr:hover,
table.dataTable.display tbody tr:hover{ background-color:#e5f2ff !important; }

.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_filter label,
.dataTables_wrapper .dataTables_length label{
  color: rgba(234,242,255,.80) !important;
}
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select{
  background-color: rgba(255,255,255,.06);
  color:#fff;
  border: 1px solid rgba(255,255,255,.22);
}

/* Pagination */
.dataTables_wrapper .dataTables_paginate .paginate_button{
  color: rgba(234,242,255,.84) !important;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 10px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current{
  background: rgba(53,182,255,.22) !important;
  border-color: rgba(53,182,255,.45) !important;
  color:#fff !important;
}

/* Footer */
footer.footer{
  background: transparent;
  border-top: 1px solid rgba(53,182,255,.14) !important;
}
footer.footer, footer.footer a{ color: rgba(234,242,255,.65) !important; }
footer.footer a:hover{ color:#fff !important; }

/* Login layout helpers */
.bits-login-wrap{ min-height: calc(100vh - 120px); display:flex; align-items:center; }
.bits-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  background: rgba(53,182,255,.12);
  border:1px solid rgba(53,182,255,.22);
  color:#fff;
  font-weight:700;
  font-size:12px;
}

/* ===== FIX SELECT / OPTION (combos) ===== */
select.form-select,
select.form-control,
.form-select,
.form-control select {
    color: #ffffff !important;
    background-color: rgba(255,255,255,.08) !important;
    border: 1px solid rgba(255,255,255,.25) !important;
}

/* IMPORTANTE: las opciones del dropdown nativo */
select option,
select optgroup {
    color: #111827 !important; /* texto oscuro */
    background: #ffffff !important; /* fondo blanco */
}

/* ===== FIX Serial (links / texto azul claro en filas claras) ===== */
table.dataTable tbody td,
.table tbody td {
    color: #111827 !important; /* texto oscuro legible */
}

    /* Si el serial es link (a) lo reforzamos */
    table.dataTable tbody td a,
    .table tbody td a {
        color: #0b5ed7 !important; /* azul visible */
        font-weight: 700;
        text-decoration: none;
    }

        table.dataTable tbody td a:hover,
        .table tbody td a:hover {
            text-decoration: underline;
        }

/* ===== FIX TITULOS ===== */

h1, h2, h3, h4, h5, h6 {
    color: #ffffff !important;
}

.card h2,
.card h3,
.card h4 {
    color: #ffffff !important;
}

.text-muted {
    color: #cbd5e1 !important; /* gris claro visible */
}