/* ==== MarelliRacers | sTracker Theme (pulido v1) ==== */
/* Reversible: vacía este archivo para volver a “fábrica”. */

:root{
  --bg0:#050911;
  --bg1:#07101f;

  --panel: rgba(12,29,58,.62);
  --panel2: rgba(10,23,48,.92);

  --marelli-blue:#0b5fff;
  --marelli-cyan:#19c2ff;
  --marelli-glow: rgba(25,194,255,.35);

  --text:#eaf2ff;
  --muted:#b9c7dc;

  --line: rgba(255,255,255,.10);
  --radius: 14px;
  --shadow: 0 14px 40px rgba(0,0,0,.45);

  /* Tabla */
  --tbl-bg: rgba(7,16,31,.62);
  --tbl-bg2: rgba(7,16,31,.42);
  --tbl-head: rgba(7,16,31,.78);
  --tbl-line: rgba(255,255,255,.07);
  --tbl-hover: rgba(11,95,255,.18);
}

/* ===== Base ===== */
html, body{
  background:
    radial-gradient(1100px 650px at 18% -10%, rgba(25,194,255,.14), transparent 55%),
    radial-gradient(900px 600px at 85% 5%, rgba(11,95,255,.16), transparent 55%),
    linear-gradient(180deg, var(--bg1), var(--bg0) 55%) !important;

  color: var(--text) !important;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Noto Sans", Arial, sans-serif !important;
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Links */
a, a:visited{
  color: var(--marelli-cyan) !important;
  text-decoration: none !important;
}
a:hover{
  text-decoration: underline !important;
  filter: brightness(1.08);
}

/* ===== Navbar ===== */
.navbar, .navbar-default{
  background: rgba(10,16,26,.86) !important;
  border: 1px solid var(--line) !important;
  backdrop-filter: blur(10px);
  box-shadow: var(--shadow);
}
.navbar a{ color: var(--text) !important; }
.navbar .active a, .navbar-nav>.active>a{
  background: rgba(11,95,255,.20) !important;
  border-radius: 10px;
}

/* ===== Contenedores ===== */
.panel, .well, .container, .container-fluid, .jumbotron{
  background: var(--panel) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow);
}
.panel-heading{
  background: linear-gradient(90deg, rgba(11,95,255,.26), rgba(25,194,255,.16)) !important;
  border-bottom: 1px solid var(--line) !important;
  color: var(--text) !important;
  border-top-left-radius: var(--radius) !important;
  border-top-right-radius: var(--radius) !important;
}

/* ===== Formularios ===== */
input, select, textarea, .form-control{
  background: var(--panel2) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: var(--text) !important;
  border-radius: 12px !important;
}
input::placeholder, textarea::placeholder{
  color: rgba(185,199,220,.65) !important;
}
.form-control:focus, input:focus, select:focus, textarea:focus{
  outline: none !important;
  border-color: rgba(25,194,255,.55) !important;
  box-shadow: 0 0 0 3px rgba(25,194,255,.18) !important;
}

/* ===== Botones ===== */
.btn, .btn-default{
  border-radius: 12px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.06) !important;
  color: var(--text) !important;
  transition: transform .08s ease, filter .12s ease, background .12s ease;
}
.btn:hover{
  background: rgba(11,95,255,.18) !important;
  filter: brightness(1.03);
}
.btn:active{ transform: translateY(1px); }
.btn-primary{
  background: linear-gradient(90deg, rgba(11,95,255,.38), rgba(25,194,255,.26)) !important;
  border: 1px solid rgba(25,194,255,.35) !important;
}

/* ===== TABLAS (clave) ===== */

/* Evita que sTracker “lave” filas con opacity o colores inline */
.table tr, .table td, .table th{
  opacity: 1 !important;
  filter: none !important;
}

/* Cabecera */
body .table>thead>tr>th{
  background: var(--tbl-head) !important;
  color: rgba(234,242,255,.88) !important;
  border-bottom: 1px solid rgba(255,255,255,.12) !important;
  font-weight: 800 !important;
  letter-spacing: .3px;
}

/* Celdas: fondo oscuro consistente */
body .table>tbody>tr>td{
  background: var(--tbl-bg) !important;
  color: var(--text) !important;
  border-top: 1px solid var(--tbl-line) !important;
}

/* Zebra suave */
body .table-striped>tbody>tr:nth-of-type(odd)>td{
  background: var(--tbl-bg2) !important;
}

/* Hover Marelli */
body .table-hover>tbody>tr:hover>td{
  background: var(--tbl-hover) !important;
}

/* Links dentro de tabla (nombres, coches, etc.) */
body .table td a,
body .table td a:visited{
  color: #eaf2ff !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
body .table td a:hover{
  color: var(--marelli-cyan) !important;
  text-decoration: underline !important;
}

/* Textos “muted” de Bootstrap dentro de tablas */
body .table .text-muted,
body .table .muted,
body .table small,
body .table .small{
  color: rgba(234,242,255,.78) !important;
  opacity: 1 !important;
}

/* Líneas de tabla: que no sean blancas a saco */
body .table, body .table-bordered{
  border-color: rgba(255,255,255,.10) !important;
}
body .table-bordered>tbody>tr>td,
body .table-bordered>thead>tr>th{
  border-color: rgba(255,255,255,.10) !important;
}

/* ===== Imágenes / Canvas ===== */
img, canvas{ border-radius: 12px; }

/* ===== Footer ===== */
footer, .footer{
  color: var(--muted) !important;
  border-top: 1px solid var(--line) !important;
}

/* ===== Espaciado ===== */
.container, .container-fluid{
  padding-top: 18px !important;
  padding-bottom: 18px !important;
}

/* ===== Logo MarelliRacers (navbar) ===== */

/* Oculta el logo original de Assetto Corsa */
.navbar-brand img{
  opacity: 0 !important;
}

/* Reserva espacio para el logo Marelli */
.navbar-brand{
  position: relative;
  padding-left: 190px;
}

/* Logo Marelli (imagen ya adaptada por ti) */
.navbar-brand::before{
  content: "";
  display: block;
  pointer-events: none;
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 170px;
  height: 44px;
  background: url("/img/logo_marelli.png") no-repeat center left;
  background-size: contain;
  /* sin filtros: se usa el color real del logo */
}

/* Responsive móvil */
@media (max-width: 480px){
  .navbar-brand{
    padding-left: 150px;
  }
  .navbar-brand::before{
    width: 130px;
    height: 38px;
  }
}