/* ==========================================
   ESTILOS CALCULADORA ODDSHQ
   ========================================== */
.bg-slate-800 { background-color: #1e293b !important; }
.bg-slate-900 { background-color: #0f172a !important; }
.border-slate-700 { border-color: #334155 !important; }
.text-slate-300 { color: #cbd5e1 !important; }
.text-slate-400 { color: #94a3b8 !important; }
.text-slate-500  { color:#525151  !important; } 
.text-emerald { color: #10b981 !important; }
.text-cyan { color: #0ea5e9 !important; }

.font-mono { font-family: 'Roboto Mono', monospace, sans-serif; }
.font-heading { font-family: 'Poppins', sans-serif; }

.btn-emerald-outline {
  color: #10b981;
  border: 1px solid #10b981;
  background: transparent;
  transition: all 0.3s ease;
}

.btn-emerald-outline:hover {
  background-color: #10b981;
  color: #0f172a;
}

.form-control:focus, .form-select:focus {
  border-color: #10b981 !important;
  box-shadow: 0 0 0 0.25rem rgba(16, 185, 129, 0.25) !important;
}



/* ==========================================
   CORRECCIÓN DE SOLAPAMIENTO DE SECCIONES
   ========================================== */

@media (max-width: 991.98px) {
  .calculator-section {
    display: block !important;
    height: auto !important;
    min-height: auto !important;
    overflow: visible !important;
    margin-bottom: 2rem !important;
    position: relative !important;
  }

  .calculator-section .card {
    position: relative !important;
    top: auto !important;
    float: none !important;
    height: auto !important;
  }

  .faq-section {
    display: block !important;
    clear: both !important;
    position: relative !important;
    float: none !important;
    z-index: 2;
    margin-top: 2rem !important;
  }

/* Asegura visibilidad y contraste del título de página */
.page-title {
  padding: 40px 0 20px 0;
  color: #444444;
  opacity: 1 !important;
  visibility: visible !important;
}

.page-title h1 {
  color: #444444 !important;
  font-size: 2.25rem;
  font-weight: 700;
}

.page-title .breadcrumbs ol {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0 0 10px 0;
}

.page-title .breadcrumbs li + li::before {
  content: "/";
  padding: 0 8px;
  color: #94a3b8;
}

.page-title .breadcrumbs a {
  color: #00d26a;
  text-decoration: none;
}

.page-title .breadcrumbs .current {
  color: #94a3b8;
}

/* Color visible para placeholders en inputs oscuros */
.custom-placeholder::placeholder {
  color: #94a3b8 !important;
  opacity: 0.7;
}

/* Compatibilidad con navegadores */
.custom-placeholder::-webkit-input-placeholder {
  color: #94a3b8 !important;
  opacity: 0.7;
}
.custom-placeholder::-moz-placeholder {
  color: #94a3b8 !important;
  opacity: 0.7;
}




}