/* Estilos personalizados */
:root {
  --bg-primary: #0F1A2B;
  --text-primary: #FFFFFF;
  --text-secondary: #D0D9E0;
  --accent-color: #03A9F4;
  --card-bg: #1A2940;
  --input-bg: #263450;
}

body {
  background-color: var(--bg-primary);
  color: var(--text-primary);
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* Navbar */
.navbar-dark.bg-primary {
  background-color: var(--bg-primary) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* Cards */
.card {
  background-color: var(--card-bg);
  border: none;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}

.card-header {
  background-color: rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* Botones */
.btn-primary {
  background-color: var(--accent-color);
  border-color: var(--accent-color);
}

.btn-primary:hover {
  background-color: #0288D1;
  border-color: #0288D1;
}

.btn-secondary {
  background-color: #37474F;
  border-color: #37474F;
}

.btn-secondary:hover {
  background-color: #455A64;
  border-color: #455A64;
}

/* Botones outline con texto blanco */
.btn-outline-primary,
.btn-outline-secondary,
.btn-outline-success,
.btn-outline-danger,
.btn-outline-warning,
.btn-outline-info,
.btn-outline-dark {
  color: white !important;
}

.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.btn-outline-success:hover,
.btn-outline-danger:hover,
.btn-outline-warning:hover,
.btn-outline-info:hover,
.btn-outline-dark:hover {
  color: white !important;
}

/* Tablas */
.table {
  color: var(--text-primary) !important;
  background-color: var(--card-bg) !important;
}

table, th, td {
  background-color: var(--card-bg) !important;
  color: var(--text-primary) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

thead {
  background-color: rgba(0, 0, 0, 0.2) !important;
}

.table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(255, 255, 255, 0.05) !important;
}

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

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

/* Inputs */
.form-control, .form-select {
  background-color: var(--input-bg);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--text-primary);
}

/* Labels y textos de formularios */
.form-label, .form-check-label {
  color: var(--text-primary) !important;
}

.card-header h5, .card-title, .card-text, label, p, h1, h2, h3, h4, h5, h6, span:not(.badge) {
  color: var(--text-primary) !important;
}

.form-control:focus, .form-select:focus {
  background-color: var(--input-bg);
  color: var(--text-primary);
  border-color: var(--accent-color);
  box-shadow: 0 0 0 0.25rem rgba(3, 169, 244, 0.25);
}

/* Footer */
.footer {
  background-color: rgba(0, 0, 0, 0.3) !important;
  color: var(--text-secondary);
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

/* Mejorar visibilidad de textos */
.text-muted, .text-secondary {
  color: var(--text-secondary) !important;
}

.card-text, .card-title, h1, h2, h3, h4, h5, h6, p {
  color: var(--text-primary) !important;
}

.list-group-item {
  background-color: var(--card-bg);
  color: var(--text-primary);
  border-color: rgba(255, 255, 255, 0.1);
}

/* Badges */
.badge.bg-primary {
  background-color: var(--accent-color) !important;
}

.badge.bg-info {
  background-color: #00BCD4 !important;
}

.badge.bg-success {
  background-color: #009688 !important;
}

/* Flotantes */
.floating-button {
  position: fixed;
  bottom: 30px;
  right: 30px;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background-color: var(--accent-color);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
  z-index: 100;
  transition: all 0.3s ease;
}

.floating-button:hover {
  transform: translateY(-5px);
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.4);
}
