/* =================================================
   DUCKDUCK STREAMING - MODERN DARK PLATFORM
================================================= */

/* ===== GENERAL ===== */
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: radial-gradient(1200px 600px at 50% 0%, rgba(37,99,235,.25), transparent 60%),
              #0b1220;
  color: rgba(255,255,255,.88);
}

/* ===== SIDEBAR ===== */
.sidebar{
  background: linear-gradient(180deg,#0f172a,#1e293b) !important;
  border-right: 1px solid rgba(255,255,255,.08);
}

.sidebar .nav-link{
  color: rgba(255,255,255,.85) !important;
  font-weight: 600;
}

.sidebar .nav-link:hover{
  background: rgba(255,255,255,.08);
  border-radius: 12px;
}

.sidebar .nav-item.active .nav-link{
  background: linear-gradient(90deg,#2563eb,#1d4ed8);
  border-radius: 12px;
}

/* ===== TOPBAR ===== */
.topbar{
  background: rgba(255,255,255,.06) !important;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,255,255,.08);
}

/* ===== CARDS ===== */
.card{
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 18px !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.35);
  transition: .2s ease;
}

.card:hover{
  transform: translateY(-2px);
}

.card-header{
  background: rgba(255,255,255,.04) !important;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

/* ===== BUTTONS ===== */
.btn{
  border-radius: 14px !important;
  font-weight: 800 !important;
  padding: .5rem 1rem;
}

.btn-primary{
  background: linear-gradient(180deg,#22c55e,#16a34a) !important;
  border: none !important;
  box-shadow: 0 10px 25px rgba(34,197,94,.25);
}

.btn-primary:hover{
  transform: translateY(-1px);
  filter: brightness(1.05);
}

.btn-danger{
  background: linear-gradient(180deg,#ef4444,#dc2626) !important;
  border: none !important;
}

/* ===== INPUTS ===== */
.form-control{
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  border-radius: 14px !important;
  color: #fff !important;
}

.form-control:focus{
  border-color: #22c55e !important;
  box-shadow: 0 0 0 4px rgba(34,197,94,.2) !important;
}

/* ===== TABLES ===== */
.table{
  background: rgba(255,255,255,.04) !important;
  color: rgba(255,255,255,.85) !important;
  border-radius: 14px;
  overflow: hidden;
}

.table th{
  background: rgba(255,255,255,.05) !important;
  border-color: rgba(255,255,255,.08) !important;
}

.table td{
  border-color: rgba(255,255,255,.08) !important;
}

/* ===== BADGES ===== */
.badge{
  border-radius: 999px !important;
  padding: .45rem .75rem !important;
  font-weight: 900 !important;
}

.badge-success{
  background: linear-gradient(180deg,#22c55e,#16a34a) !important;
}

.badge-danger{
  background: linear-gradient(180deg,#ef4444,#dc2626) !important;
}

.badge-secondary{
  background: rgba(255,255,255,.15) !important;
}

/* ===== DATATABLE TEXT FIX ===== */
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate{
  color: rgba(255,255,255,.7) !important;
}

.dataTables_wrapper input,
.dataTables_wrapper select{
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  border-radius: 10px;
}

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar{
  width: 8px;
}

::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,.2);
  border-radius: 10px;
}
/* =========================================
   FORCE OVERRIDE SB ADMIN
========================================= */

body{
  background: #0b1220 !important;
  color: #ffffff !important;
}

#wrapper{
  background: transparent !important;
}

#content-wrapper{
  background: transparent !important;
}

.sidebar{
  background: linear-gradient(180deg,#0f172a,#1e293b) !important;
}

.topbar{
  background: rgba(20,25,40,.85) !important;
}

.card{
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.15) !important;
}

.table{
  background: rgba(255,255,255,.05) !important;
  color: #ffffff !important;
}

.table th{
  background: rgba(255,255,255,.08) !important;
}

.form-control{
  background: rgba(255,255,255,.08) !important;
  color: #ffffff !important;
}
/* ================================
   FIX: SB ADMIN CONTENT BACKGROUND
   (evita letras blancas en fondo claro)
================================== */

html, body, #page-top {
  background: #0b1220 !important;
  color: rgba(255,255,255,.88) !important;
}

/* Contenedores principales de SB Admin */
#wrapper,
#content-wrapper,
#content,
.container-fluid,
.container,
.row {
  background: transparent !important;
}

/* El área grande donde se ve blanco/gris */
.bg-white,
.bg-light,
.content-wrapper,
.content,
.card-body {
  background: transparent !important;
}

/* Cards bien oscuras */
.card {
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
}

/* Títulos y texto general */
h1,h2,h3,h4,h5,h6,
p, span, small, label, strong,
.text-gray-600, .text-gray-700, .text-gray-800, .text-dark {
  color: rgba(255,255,255,.88) !important;
}

/* Links */
a, a:hover {
  color: #93c5fd !important;
}

/* ================================
   FIX: TABLAS + DATATABLES
================================== */

.table,
.table thead,
.table tbody,
.table tr,
.table td,
.table th {
  background: rgba(255,255,255,.04) !important;
  color: rgba(255,255,255,.90) !important;
  border-color: rgba(255,255,255,.08) !important;
}

.table thead th {
  background: rgba(255,255,255,.08) !important;
}

/* Datatables wrapper textos */
.dataTables_wrapper,
.dataTables_wrapper label,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate,
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter {
  color: rgba(255,255,255,.75) !important;
}

/* Inputs Datatables */
.dataTables_wrapper input,
.dataTables_wrapper select {
  background: rgba(255,255,255,.08) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.15) !important;
}

/* Botones paginación */
.page-link {
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: #fff !important;
}
.page-item.active .page-link {
  background: linear-gradient(90deg,#2563eb,#1d4ed8) !important;
  border-color: transparent !important;
}

/* Badge (Aceptado/Rechazado) ok */
.badge {
  color: #fff !important;
}

/* Aviso rojo que tienes arriba (text-danger) */
.text-danger {
  color: #ff6b6b !important;
}
/* =========================================
   FORCE DARK MODE AFTER DATATABLE INIT
========================================= */

table.dataTable.table,
table.dataTable.table-bordered,
table.dataTable.no-footer {
  background-color: #0f172a !important;
}

table.dataTable thead th {
  background-color: #111827 !important;
  color: #ffffff !important;
}

table.dataTable tbody td {
  background-color: #0f172a !important;
  color: #ffffff !important;
}

table.dataTable tbody tr {
  background-color: #0f172a !important;
}

.dataTables_wrapper .row {
  background: transparent !important;
}

.table-bordered td,
.table-bordered th {
  border: 1px solid rgba(255,255,255,.08) !important;
}
/* =========================================
   FIX WHITE AREA IN REPORTES (AND ANY PAGE)
========================================= */

/* Card body y contenedores dentro del contenido */
#content,
#content-wrapper,
.container-fluid,
.table-responsive,
.card-body {
  background: transparent !important;
}

/* Si la tabla NO trae clase .table */
table.dataTable,
table.dataTable tbody,
table.dataTable tbody tr,
table.dataTable tbody td {
  background-color: #0f172a !important;
  color: #ffffff !important;
}

/* Por si DataTables mete "stripe" o "hover" */
table.dataTable.stripe tbody tr.odd,
table.dataTable.display tbody tr.odd,
table.dataTable.hover tbody tr:hover,
table.dataTable.display tbody tr:hover {
  background-color: rgba(255,255,255,.06) !important;
}

/* Encabezado */
table.dataTable thead th,
table.dataTable thead td {
  background-color: #111827 !important;
  color: #ffffff !important;
  border-color: rgba(255,255,255,.10) !important;
}
/* =========================================
   DUCK DARK FIX DEFINITIVO INVENTARIO
========================================= */

.card {
  background: linear-gradient(180deg, #0f1b2f, #0b1626) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
}

.card-header {
  background: transparent !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
}

.table {
  background-color: transparent !important;
  color: #e2e8f0 !important;
}

.table thead th {
  background: #111c2e !important;
  color: #93c5fd !important;
  border-color: rgba(255,255,255,.05) !important;
}

.table tbody tr {
  background: rgba(255,255,255,.02) !important;
}

.table tbody tr:hover {
  background: rgba(59,130,246,.08) !important;
}

.dataTables_wrapper,
.dataTables_scroll,
.dataTables_scrollBody,
.dataTables_scrollHead {
  background: transparent !important;
}

.table td,
.table th {
  color: #e2e8f0 !important;
}
/* =====================================
   FIX GLOBAL FONDOS BLANCOS
   ===================================== */

/* Fondo general */
body,
#wrapper,
#content-wrapper,
#content,
.container-fluid{
    background:#071225 !important;
}

/* Navbar */
.topbar,
.navbar,
.navbar.bg-white{
    background:rgba(0,0,0,0.35) !important;
    border-bottom:1px solid rgba(255,255,255,0.08);
}

/* Cards y contenedores */
.card,
.card-body,
.bg-white,
.bg-light{
    background:rgba(255,255,255,0.04) !important;
    border:1px solid rgba(255,255,255,0.08);
    border-radius:18px;
}

/* Tablas */
.table{
    color:#e9f2ff !important;
    background:transparent !important;
}

.table thead th{
    background:rgba(0,0,0,0.25) !important;
    color:#8ecaff !important;
    border-bottom:1px solid rgba(255,255,255,0.08);
}

.table td{
    border-top:1px solid rgba(255,255,255,0.06);
}

/* Hover filas */
.table tbody tr:hover{
    background:rgba(255,255,255,0.06);
}

/* Inputs */
.form-control,
.form-control-user,
input,
textarea,
select{
    background:rgba(255,255,255,0.06) !important;
    border:1px solid rgba(255,255,255,0.16) !important;
    color:#fff !important;
}

::placeholder{
    color:rgba(255,255,255,0.55) !important;
}

/* Botones */
.btn{
    border-radius:999px !important;
}

/* Badges */
.badge{
    border-radius:999px;
}
/* =========================================================
   FIX DEFINITIVO: PANEL/CONTENEDORES BLANCOS (INVENTARIO)
   SB-ADMIN + DATATABLES
   ========================================================= */

/* Fondo general */
html, body {
  background: #071225 !important;
}

/* Contenedores principales del admin */
body #wrapper,
body #content-wrapper,
body #content,
body .container,
body .container-fluid {
  background: #071225 !important;
}

/* Cards (incluye header y footer, que a veces quedan blancos) */
body .card,
body .card-header,
body .card-footer,
body .card-body {
  background-color: rgba(255, 255, 255, 0.04) !important;
  color: #e9f2ff !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

/* Clases bootstrap que suelen forzar blanco */
body .bg-white,
body .bg-light,
body .bg-gray-100,
body .bg-gray-200,
body .shadow,
body .shadow-sm,
body .shadow-lg {
  background-color: transparent !important;
}

/* Caja que envuelve tablas (muy común que sea blanca) */
body .table-responsive,
body .dataTables_wrapper,
body .dataTables_scroll,
body .dataTables_scrollBody,
body .dataTables_scrollHead,
body .dataTables_length,
body .dataTables_filter,
body .dataTables_info,
body .dataTables_paginate {
  background-color: transparent !important;
  color: #e9f2ff !important;
}

/* Tabla y celdas (por si el blanco viene desde tr/td) */
body table,
body thead,
body tbody,
body tfoot,
body tr,
body th,
body td {
  background-color: transparent !important;
}

body .table {
  color: #e9f2ff !important;
  background-color: transparent !important;
}

body .table thead th {
  background-color: rgba(0, 0, 0, 0.25) !important;
  color: #8ecaff !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Filas */
body .table tbody tr {
  background-color: rgba(255, 255, 255, 0.03) !important;
}

body .table tbody tr:hover {
  background-color: rgba(255, 255, 255, 0.07) !important;
}

/* Texto gris oscuro de SB Admin */
body .text-gray-800,
body .text-gray-600,
body .text-dark {
  color: #e9f2ff !important;
}

/* Inputs */
body .form-control,
body .form-control-user,
body input,
body textarea,
body select {
  background-color: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  color: #ffffff !important;
}

/* Placeholder */
body ::placeholder {
  color: rgba(255, 255, 255, 0.55) !important;
}