/*<!-- Estilos para colapsar sidebar y submenús -->
/* Estilos para submenús desplegables */

.collapse {
    display: none;
    padding-left: 1.5rem;
  }
  .collapse.show {
    display: block;
  }
  
  /* Estilos para hacer responsive el sidebar */
  @media (max-width: 1200px) {
    .left-sidebar {
      position: fixed;
      left: -260px;
      top: 0;
      width: 260px;
      height: 100%;
      background-color: #fff;
      z-index: 999;
      transition: all 0.3s ease;
    }
  
    .show-sidebar .left-sidebar {
      left: 0 !important;
    }
  }

  
  /*Fileinput*/
  .file-input {
    text-align: right; /* Alinea los botones a la derecha */
  }
/* Estilos para el sidebar */
  
  .left-sidebar {
    position: relative;
  }
  .sidebar-scroll-wrapper {
    max-height: calc(100vh - 70px); /* ajusta 70px al alto de tu logo+toggle */
    overflow-y: auto;
    padding-bottom: 3rem; /* espacio para el footer */
  }
  .sidebar-footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: center;
    padding: .5rem 0;
    font-size: .75rem;
    color: #666;
    background: #fff;  /* o transparente */
    border-top: 1px solid #eee;
  }
  
  
/* Estilos para el calendario */
:root {
  --brand-red:    #e30613;   /* Rojo del anillo */
  --brand-blue:   #002f6c;   /* Azul oscuro */
  --brand-yellow: #ffc72c;   /* Amarillo de la antorcha */
  --bg-light:     #f7f7f7;   /* Gris muy claro */
  --hover-red:    #F94144;   /* Hover de filas */
}

/* 1) Fondo general */
.calendario-bg {
  background: var(--bg-light);
}

/* 2) Cabecera “Fecha n” */
.fixture-header {
  background: var(--brand-blue);
  color: #fff;
  border-left: .5rem solid var(--brand-red);
  border-radius: .5rem .5rem 0 0;
  padding: .75rem 1.25rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-shadow: 0 2px 4px rgba(0,0,0,.1);
}

/* 3) Contenedor de la tabla */
.table-responsive {
  background: var(--card-light);
  border: none;
  border-radius: 1rem;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  margin-bottom: 1.5rem;
  padding: 1rem;
}

/* 4) Tabla limpia y “flotante” */
.table-calendar {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 10px;
}
.table-calendar thead th {
  background: var(--header-dark);
  color: #fff;
  font-weight: 600;
  border: none;
  padding: .75rem 1rem;
}
.table-calendar tbody tr {
  background: white;
  border-radius: .75rem;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);
  transition: background .2s, color .2s;
}
.table-calendar tbody tr:hover {
  background: var(--hover-red);
  color: #fff;
}

/* 5) Fila de descanso */
.table-calendar .table-warning {
  background: #ffe8d6 !important;
  font-weight: 700;
  color: var(--brand-blue);
}

/* 6) Botones “solid” dentro de fixture-header */
.fixture-header .btn {
  font-weight: 600;
  min-width: 130px;
  transition: background .2s, color .2s;
}
.fixture-header .btn-outline-success {
  background: var(--brand-yellow) !important;
  color: var(--brand-blue)   !important;
  border-color: var(--brand-yellow) !important;
}
.fixture-header .btn-outline-success:hover {
  background: var(--brand-yellow) !important;
  color: #fff             !important;
  border-color: var(--brand-yellow) !important;
}
.fixture-header .btn-outline-primary {
  background: #fff                !important;
  color: var(--brand-blue)       !important;
  border-color: #fff             !important;
}
.fixture-header .btn-outline-primary:hover {
  background: #fff !important;
  color:green                  !important;
  border-color: #fff             !important;
}

/* 7) Iconos y escalado de imágenes */
.fixture-header i,
.table-calendar img {
  width: 28px;
  height: 28px;
}

/* 8) Adaptaciones responsive */
@media (max-width: 768px) {
  .fixture-header {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: center !important;
  }
  .fixture-header .btn {
    flex: 0 0 auto !important;
    width: auto    !important;
    margin-bottom: 0 !important;
  }
  .table-calendar thead {
    display: none; /* opcional en móvil */
  }
  .table-calendar tbody tr {
    display: block;
    margin-bottom: 1rem;
  }
  .table-calendar tbody td {
    display: flex;
    justify-content: space-between;
    padding: .5rem;
    border: none;
  }
  .table-calendar tbody td::before {
    content: attr(data-label);
    font-weight: 600;
  }
}

/* 9) Fecha y Hora más visibles */
.table-calendar td .small.text-muted,
.table-calendar td span.small.text-muted {
  color: var(--brand-blue) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  background: #fff !important;
  border: 1px solid var(--brand-blue) !important;
  padding: .25rem .5rem !important;
  border-radius: .25rem !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.1) !important;
  display: inline-block;
  min-width: 6rem;
  text-align: center;
}

/* 10) “Sin asignar” destacado */
.table-calendar td .fst-italic {
  color: var(--brand-red) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  font-style: normal !important;
  background: #fff3cd !important;
  border: 1px dashed var(--brand-red) !important;
  padding: .25rem .5rem !important;
  border-radius: .25rem !important;
  display: inline-block;
  min-width: 6rem;
  text-align: center;
}

/*campo amarilla de jugador*/
@keyframes parpadeo {
  0%,100% { background-color: transparent; }
  50%     { background-color: rgba(255,235,59,0.6); }
}
.alerta-amarillas {
  animation: parpadeo 1s infinite;
  font-weight: bold;
}