/* ============================================================
   REDISEÑO ESTILO HARD ROCK / DRAFTKINGS
   Fondo claro, tipografía moderna, odds en azul
   ============================================================ */

/* Variables de color modo claro */
body {
  background: #f3f4f6 !important;
  color: #111827 !important;
}

/* Header claro */
.dashboard__header {
  background: #ffffff !important;
  border-bottom: 1px solid #e5e7eb !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.06) !important;
}
.dashboard__header .main-menu li a {
  color: #374151 !important;
}
.dashboard__header .main-menu li a.active,
.dashboard__header .main-menu li a:hover {
  color: #1652F0 !important;
}
.dashboard__header .main-menu li a::before {
  background: #1652F0 !important;
}
.mc-balance-pill {
  background: #f3f4f6 !important;
  border-radius: 8px !important;
  padding: 4px 12px !important;
}
.mc-balance-pill h6 {
  color: #111827 !important;
}
.mc-balance-pill .small {
  color: #6b7280 !important;
}
.mc-user-dropdown__btn {
  background: #f3f4f6 !important;
  border: 1px solid #e5e7eb !important;
}
.mc-user-dropdown__btn i {
  color: #374151 !important;
}
.mc-user-dropdown__menu {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.1) !important;
}
.mc-user-dropdown__menu a {
  color: #374151 !important;
}
.mc-user-dropdown__menu a:hover {
  background: #f3f4f6 !important;
}

/* Sidebar izquierdo */
.popular__events__left {
  background: #ffffff !important;
  border-right: 1px solid #e5e7eb !important;
}
.popular__events__head h5 {
  color: #111827 !important;
}
.popular__events__head ul li {
  color: #374151 !important;
}
.popular__events__head ul li:hover {
  color: #1652F0 !important;
}
.prematch__wrap {
  background: #ffffff !important;
}
.prematch__wrap .nav-link {
  color: #6b7280 !important;
}
.prematch__wrap .nav-link.active {
  color: #1652F0 !important;
  border-bottom-color: #1652F0 !important;
}
.prematch__scopre {
  border-bottom: 1px solid #f3f4f6 !important;
}
.prematch__scopre:hover {
  background: #f9fafb !important;
}

/* Sidebar derecho */
.right__site__section {
  background: #ffffff !important;
  border-left: 1px solid #e5e7eb !important;
}
.betslip__wrap {
  background: #ffffff !important;
}
.multiple__items {
  background: #f9fafb !important;
  border: 1px solid #e5e7eb !important;
}

/* Contenido principal */
.left__site__section {
  background: #f3f4f6 !important;
}
.tab-content {
  background: #f3f4f6 !important;
}

/* Filtros de deporte */
.casa-sport-btn {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  color: #374151 !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}
.casa-sport-btn:hover {
  border-color: #1652F0 !important;
  color: #1652F0 !important;
}
.casa-sport-btn--activo {
  background: #1652F0 !important;
  border-color: #1652F0 !important;
  color: #ffffff !important;
}

/* Tabla de eventos DraftKings */
.dk-header-cols {
  background: transparent !important;
}
.dk-col-label {
  color: #9ca3af !important;
}
.dk-evento {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}
.dk-evento:hover {
  border-color: #1652F0 !important;
}
.dk-liga-row {
  background: #f9fafb !important;
  border-bottom: 1px solid #f3f4f6 !important;
}
.casa-liga {
  color: #1652F0 !important;
  font-weight: 700 !important;
}
.casa-hora {
  color: #9ca3af !important;
}
.dk-equipo-nombre {
  color: #111827 !important;
  font-weight: 600 !important;
}
.dk-equipo-row {
  border-bottom: 1px solid #f3f4f6 !important;
}
.dk-odd-cell {
  background: #f9fafb !important;
  border: 1px solid #e5e7eb !important;
}
.dk-odd-cell:hover {
  background: #eff6ff !important;
  border-color: #1652F0 !important;
}
.dk-odd-cell--activo {
  background: #1652F0 !important;
  border-color: #1652F0 !important;
}
.dk-odd-cell--activo .dk-odd-precio,
.dk-odd-cell--activo .dk-odd-linea {
  color: #ffffff !important;
}
.dk-odd-linea {
  color: #9ca3af !important;
}
.dk-odd-precio {
  color: #1652F0 !important;
  font-weight: 700 !important;
}

/* Buscador */
.casa-sports-bar ~ div input,
div[x-data*="busquedaApp"] input {
  color: #111827 !important;
}
div[x-data*="busquedaApp"] > div:first-child {
  background: #ffffff !important;
  border-color: #e5e7eb !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}

/* Footer menu mobile */
.footer__menu {
  background: #ffffff !important;
  border-top: 1px solid #e5e7eb !important;
  box-shadow: 0 -2px 10px rgba(0,0,0,0.06) !important;
}
.footer__menu li a {
  color: #9ca3af !important;
}
.footer__menu li a:hover {
  color: #1652F0 !important;
}

/* Sidebar live/prematch */
.prematch__head span {
  color: #6b7280 !important;
}

/* Colores de texto generales */
.text-white {
  color: #111827 !important;
}
.admin-subtext {
  color: #6b7280 !important;
}

/* Buscador dentro de eventos */
div[style*="background:var(--slidebox)"] {
  background: #ffffff !important;
  border-color: #e5e7eb !important;
}
div[style*="background:var(--slidebox)"] input {
  color: #111827 !important;
}
div[style*="background:var(--slidebox)"] i {
  color: #9ca3af !important;
}

/* Resultados de busqueda */
div[style*="background:var(--slidebox)"][style*="position:absolute"] {
  background: #ffffff !important;
  border-color: #e5e7eb !important;
  box-shadow: 0 8px 30px rgba(0,0,0,0.12) !important;
}
div[style*="background:var(--slidebox)"][style*="position:absolute"] a {
  color: #111827 !important;
}
div[style*="background:var(--slidebox)"][style*="position:absolute"] a:hover {
  background: #f9fafb !important;
}

/* Betslip flotante - mantener blanco */
.betslip-flotante {
  box-shadow: 0 -8px 40px rgba(0,0,0,0.15) !important;
}

/* Columna izquierda */
.popular__events__left .prematch__scopre * {
  color: #374151 !important;
}
.popular__events__left a {
  color: #374151 !important;
}
.popular__events__left a:hover {
  color: #1652F0 !important;
  text-decoration: none !important;
}

/* Status en vivo */
span[style*="color:#22c55e"] {
  color: #16a34a !important;
}

/* Menu mobile - letras visibles */
.footer__menu li a span.texta {
  color: #6b7280 !important;
}
.footer__menu li a:hover span.texta,
.footer__menu li a.active span.texta {
  color: #1652F0 !important;
}
.footer__menu li a i {
  color: #9ca3af !important;
}
.footer__menu li a:hover i {
  color: #1652F0 !important;
}

/* Eliminar cuadrado gris del balance */
.mc-balance-pill {
  background: transparent !important;
  border: none !important;
  padding: 0 8px !important;
  box-shadow: none !important;
}
.mc-balance-pill .small {
  color: #6b7280 !important;
  font-size: 11px !important;
}
.mc-balance-pill h6 {
  color: #111827 !important;
  font-weight: 700 !important;
}

/* ============================================================
   SIDEBAR MOBILE REDISEÑO 2026
   ============================================================ */

/* Fondo del sidebar cuando se abre en mobile */
.popular__events__left.display991,
.popular__events__left {
  background: #ffffff !important;
}

/* El overlay/drawer cuando se abre */
.leftscroll-side {
  background: #ffffff !important;
}

/* Header del sidebar */
.popular__events__head {
  background: #ffffff !important;
  border-bottom: 1px solid #e5e7eb !important;
  padding: 16px !important;
}
.popular__events__head h5 {
  color: #111827 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  margin: 0 0 12px !important;
}
.popular__events__head ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
.popular__events__head ul li {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 12px !important;
  border-radius: 8px !important;
  color: #374151 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  transition: all 0.15s !important;
  background: #f9fafb !important;
  border: 1px solid #f3f4f6 !important;
}
.popular__events__head ul li:hover {
  background: #eff6ff !important;
  border-color: #1652F0 !important;
  color: #1652F0 !important;
}
.popular__events__head ul li img {
  width: 20px !important;
  height: 20px !important;
  object-fit: contain !important;
}

/* Tabs Live/Prematch del sidebar */
.prematch__wrap {
  background: #ffffff !important;
  padding: 12px !important;
}
.prematch__wrap .nav {
  background: #f3f4f6 !important;
  border-radius: 8px !important;
  padding: 3px !important;
  gap: 3px !important;
  border: none !important;
  margin-bottom: 12px !important;
}
.prematch__wrap .nav-link {
  color: #6b7280 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  padding: 6px 16px !important;
  border: none !important;
  transition: all 0.15s !important;
}
.prematch__wrap .nav-link.active {
  background: #ffffff !important;
  color: #1652F0 !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.1) !important;
  border: none !important;
}

/* Items live/prematch */
.prematch__scopre {
  border-radius: 8px !important;
  margin-bottom: 6px !important;
  border: 1px solid #f3f4f6 !important;
  background: #f9fafb !important;
  overflow: hidden !important;
}
.prematch__scopre:hover {
  background: #eff6ff !important;
  border-color: #1652F0 !important;
}

/* Cabecera de cada item */
.prematch__head {
  display: flex !important;
  justify-content: space-between !important;
  padding: 8px 12px 4px !important;
}
.prematch__head span:first-child {
  font-size: 10px !important;
  font-weight: 700 !important;
  color: #1652F0 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}
.prematch__head span:last-child {
  font-size: 10px !important;
  color: #9ca3af !important;
}

/* Texto del partido */
.prematch__scopre > a > div:last-of-type,
.prematch__scopre div[style*="font-size:13px"] {
  color: #111827 !important;
  font-weight: 600 !important;
  padding: 0 12px 8px !important;
}

/* Bote */
.prematch__scopre div[style*="color:var(--active-color)"] {
  color: #1652F0 !important;
  font-size: 12px !important;
  padding: 0 12px 8px !important;
}

/* Boton del sidebar (las 3 barras) */
.header-bartwo {
  background: #f3f4f6 !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 8px !important;
  width: 36px !important;
  height: 36px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.header-bartwo .bars i,
.header-bartwo .cros i {
  color: #374151 !important;
  font-size: 16px !important;
}
.header-bartwo:hover {
  background: #eff6ff !important;
  border-color: #1652F0 !important;
}
.header-bartwo:hover .bars i,
.header-bartwo:hover .cros i {
  color: #1652F0 !important;
}

/* Sidebar derecho - proximas a cerrar */
.betslip__wrap {
  background: #ffffff !important;
  border-left: 1px solid #e5e7eb !important;
}
.multiple__items {
  background: #f9fafb !important;
  border: 1px solid #f3f4f6 !important;
  border-radius: 8px !important;
  padding: 12px !important;
  margin-bottom: 8px !important;
}
.multiple__head .multiple__left span {
  color: #374151 !important;
}
.multiple__head .multiple__left .icons {
  color: #1652F0 !important;
}

/* Sobreescribir variables CSS globales para modo claro */
:root {
  --header: #ffffff !important;
  --slidebox: #f9fafb !important;
  --subheader: #f3f4f6 !important;
  --signborder: #e5e7eb !important;
  --white: #111827 !important;
  --textcolor: #6b7280 !important;
  --active-color: #1652F0 !important;
  --body: #f3f4f6 !important;
}

/* Forzar fondo blanco en todos los contenedores del sidebar */
.popular__events__body,
.popular__events__left,
.popular__events__left *,
.leftscroll-side,
.prematch__wrap,
[class*="popular__events"] {
  background-color: #ffffff !important;
  color: #111827 !important;
}

/* Footer menu - forzar colores correctos en todas las paginas */
ul.footer__menu {
  background: #ffffff !important;
  border-top: 1px solid #e5e7eb !important;
}
ul.footer__menu li a {
  color: #6b7280 !important;
}
ul.footer__menu li a span.texta {
  color: #6b7280 !important;
  font-size: 10px !important;
}
ul.footer__menu li a i {
  color: #9ca3af !important;
  font-size: 20px !important;
}
ul.footer__menu li a:hover span.texta,
ul.footer__menu li a:hover i {
  color: #1652F0 !important;
}

/* ============================================================
   MI CUENTA — SIDEBAR MODERNO 2026
   ============================================================ */

/* Contenedor principal */
.dashboard__side__bar {
  background: transparent !important;
  padding: 0 !important;
}

/* Menú del sidebar */
.account__menu.admin-sidebar-menu {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding: 0 !important;
  list-style: none !important;
}

.account__menu.admin-sidebar-menu li {
  padding: 0 !important;
}

.account__menu.admin-sidebar-menu li a {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 14px 16px !important;
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  color: #374151 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: all 0.2s !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}

.account__menu.admin-sidebar-menu li a:hover {
  background: #eff6ff !important;
  border-color: #1652F0 !important;
  color: #1652F0 !important;
  transform: translateX(2px) !important;
}

.account__menu.admin-sidebar-menu li a.active {
  background: #1652F0 !important;
  border-color: #1652F0 !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(22,82,240,0.3) !important;
}

.account__menu.admin-sidebar-menu li a .icons {
  width: 36px !important;
  height: 36px !important;
  border-radius: 8px !important;
  background: #f3f4f6 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  flex-shrink: 0 !important;
  transition: all 0.2s !important;
}

.account__menu.admin-sidebar-menu li a:hover .icons {
  background: rgba(22,82,240,0.1) !important;
  color: #1652F0 !important;
}

.account__menu.admin-sidebar-menu li a.active .icons {
  background: rgba(255,255,255,0.2) !important;
  color: #ffffff !important;
}

/* Badge de notificacion */
.account__menu.admin-sidebar-menu .admin-badge {
  margin-left: auto !important;
  background: #ef4444 !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 2px 7px !important;
  border-radius: 10px !important;
}

/* Dashboard body */
.dashboard__body__wrap {
  background: transparent !important;
}

/* Cards del contenido */
.user__box.admin-card {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}

/* Titulos de seccion */
.account__head {
  color: #111827 !important;
  font-size: 22px !important;
  font-weight: 700 !important;
}

/* Inputs */
.admin-input {
  background: #f9fafb !important;
  border: 1.5px solid #e5e7eb !important;
  border-radius: 8px !important;
  color: #111827 !important;
}
.admin-input:focus {
  border-color: #1652F0 !important;
  background: #ffffff !important;
}

/* Labels */
.admin-label {
  color: #374151 !important;
  font-weight: 600 !important;
}

/* Stat boxes del dashboard */
.admin-stat-box {
  background: #ffffff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 12px !important;
}
.admin-stat-label {
  color: #6b7280 !important;
}
.admin-stat-value {
  color: #111827 !important;
}

/* Tabs de apuestas */
.casa-sport-btn {
  font-size: 13px !important;
}

/* Empty state */
.admin-empty {
  color: #9ca3af !important;
  text-align: center !important;
  padding: 40px 20px !important;
}

/* Botones */
.cmn--btn {
  background: #1652F0 !important;
  border-color: #1652F0 !important;
}
.admin-btn-secondary {
  background: #f3f4f6 !important;
  border: 1px solid #e5e7eb !important;
  color: #374151 !important;
}
.admin-btn-secondary:hover {
  background: #eff6ff !important;
  border-color: #1652F0 !important;
  color: #1652F0 !important;
}

/* Mostrar texto en el boton activo del sidebar */
.account__menu.admin-sidebar-menu li a.active {
  justify-content: flex-start !important;
}
.account__menu.admin-sidebar-menu li a span:not(.icons):not(.admin-badge) {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  color: inherit !important;
}

/* Eliminar barra gris entre header y contenido */
.main__tab__slide,
.header-section + .main__tab__slide,
section.main__tab__slide {
  display: none !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  border: none !important;
  background: transparent !important;
}

/* Eliminar cualquier borde gris residual bajo el header */
.dashboard__header {
  margin-bottom: 0 !important;
}
.dashboard__side__bar + * {
  margin-top: 0 !important;
}

/* Tabla de transacciones - fondo blanco */
.admin-table,
table.admin-table,
.table,
table {
  background: #ffffff !important;
  color: #111827 !important;
}
table thead,
table thead tr,
table thead th {
  background: #f9fafb !important;
  color: #374151 !important;
  border-color: #e5e7eb !important;
  font-weight: 600 !important;
}
table tbody tr {
  background: #ffffff !important;
  border-color: #e5e7eb !important;
}
table tbody tr:nth-child(even) {
  background: #f9fafb !important;
}
table tbody td {
  color: #374151 !important;
  border-color: #e5e7eb !important;
}
table tbody tr:hover {
  background: #eff6ff !important;
}

/* Eliminar barra gris - forzar */
.main__tab__slide {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  background: none !important;
  overflow: hidden !important;
  position: absolute !important;
  visibility: hidden !important;
}

/* Tabla casinoform - forzar fondo blanco */
.casinoform__tabe {
  background: #ffffff !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  border: 1px solid #e5e7eb !important;
}
.casinoform__tabe table {
  background: #ffffff !important;
  width: 100% !important;
}
.casinoform__tabe thead tr {
  background: #f9fafb !important;
}
.casinoform__tabe thead th {
  background: #f9fafb !important;
  color: #374151 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid #e5e7eb !important;
}
.casinoform__tabe tbody tr {
  background: #ffffff !important;
  border-bottom: 1px solid #f3f4f6 !important;
}
.casinoform__tabe tbody tr:hover {
  background: #f9fafb !important;
}
.casinoform__tabe tbody td {
  background: transparent !important;
  color: #374151 !important;
  font-size: 13px !important;
  padding: 12px 16px !important;
  border: none !important;
}

/* Betslip compacto - max altura con scroll */
@media (max-width: 991px) {
  .betslip-flotante {
    max-height: 60vh !important;
    overflow-y: auto !important;
  }
  .betslip-flotante .betslip-titulo {
    padding: 8px 14px !important;
    position: sticky !important;
    top: 0 !important;
    background: #fff !important;
    z-index: 1 !important;
  }
  .betslip-flotante .betslip-handle {
    margin: 6px auto 0 !important;
  }
  /* Selecciones del parlay mas compactas */
  .betslip-flotante [style*="padding:8px 0;border-bottom"] {
    padding: 6px 0 !important;
  }
  .betslip-flotante [style*="font-size:13px;font-weight:700"] {
    font-size: 12px !important;
  }
  .betslip-flotante [style*="font-size:11px;color:#9ca3af"] {
    font-size: 10px !important;
  }
  /* Wager mas compacto */
  .betslip-wager input {
    font-size: 18px !important;
    padding: 6px 0 !important;
  }
  /* Botones rapidos mas pequenos */
  .dk-quick-btn {
    padding: 5px 4px !important;
    font-size: 11px !important;
  }
  /* Resumen compacto */
  .betslip-resumen {
    padding: 6px 10px !important;
    margin: 8px 0 8px !important;
  }
  .betslip-resumen-valor {
    font-size: 12px !important;
  }
  .betslip-resumen-label {
    font-size: 9px !important;
  }
  /* Boton confirmar */
  .betslip-confirmar {
    padding: 12px !important;
    font-size: 14px !important;
    margin-bottom: 60px !important;
  }
}

/* ============================================================
   BETSLIP MINIMIZADO - pill en la parte inferior
   ============================================================ */
.betslip-pill {
  position: fixed !important;
  bottom: 65px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  background: #1652F0 !important;
  color: #fff !important;
  border-radius: 24px !important;
  padding: 10px 20px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  cursor: pointer !important;
  z-index: 9998 !important;
  box-shadow: 0 4px 20px rgba(22,82,240,0.4) !important;
  font-family: -apple-system, sans-serif !important;
  white-space: nowrap !important;
  transition: all 0.2s !important;
  border: none !important;
}
.betslip-pill:hover {
  background: #1248d1 !important;
  transform: translateX(-50%) scale(1.02) !important;
}
.betslip-pill-count {
  background: #fff !important;
  color: #1652F0 !important;
  border-radius: 50% !important;
  width: 24px !important;
  height: 24px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}
.betslip-pill-text {
  font-size: 14px !important;
  font-weight: 700 !important;
}
.betslip-pill-odd {
  font-size: 13px !important;
  font-weight: 600 !important;
  opacity: 0.85 !important;
}
