.carousel-inner {
  height: 400px;
}


/* SOBREADO DE LAS LETRAS DEL NAVBAR */
.navbar .nav-link:hover {
  color: #beb6b6 !important;
}

/* REMARCAR BORDE INFERIOR DEL NAVBAR */
.navbar {
  border-bottom: 1px solid #c1c1c1;
}

    /* Asegura que las imágenes no se deformen y se vean bien en todos los tamaños */
    .carousel-item img {
      object-fit: cover;
      height: 400px; /* Puedes ajustar según tu preferencia */
      width: 100%;
    }

    @media (max-width: 768px) {
      .carousel-item img {
        height: 250px;
      }
    }

    .card-hover {
      transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .card-hover:hover {
      transform: scale(1.03);
      box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.2);
    }

  .carousel-control-prev-icon,
  .carousel-control-next-icon {
    background-image: none;
    color: black;
    font-size: 2rem;
  }

.btn-mi-color {
  background-color: #ff6600; /* Color de fondo */
  color: white;              /* Texto blanco */
  border: none;               /* Sin borde */
}

.btn-mi-color:hover {
  background-color: #e65c00; /* Color más oscuro al pasar el mouse */
}



    .sidebar a {
      color: #ddd;
      padding: 10px 15px;
      display: block;
      text-decoration: none;
    }
    .sidebar a:hover {
      background-color: #495057;
      color: #fff;
    }

    body {
      padding-top: 56px;
      overflow-x: hidden;
    }

    .sidebar {
      position: fixed;
      top: 86px;
      left: 0;
      width: 250px;
      height: calc(100vh - 56px);
      background-color: #470128;
      transition: width 0.3s ease;
      overflow: hidden;
    }

    .navbar {
      position: fixed;
      top: 0;
      width: 100%;
      z-index: 2000;
    }

    .sidebar.oculto {
      transform: translateX(-100%);
    }

    .content {
      margin-left: 250px;
      padding: 20px;
      transition: margin-left 0.3s ease;
    }

    .content.expandido {
     margin-left: 60px;
    }

    /*-------------------*/
    .sidebar.colapsada {
      width: 60px; /* solo suficiente para el icono */
    }

    .sidebar h4 {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    /* Texto que se oculta cuando colapsa */
    .sidebar.colapsada .text {
      display: none;
    }

    .sidebar a {
      display: flex;
      align-items: center;
      padding: 10px 15px;
      color: #ddd;
      text-decoration: none;
    }

    .sidebar a:hover {
      background-color: #6f0140;
      color: #fff;
    }

    .sidebar .icon {
      margin-right: 10px;
      font-size: 18px;
    }

    /* ===== MOBILE ===== */
    @media (max-width: 768px) {
      .sidebar {
        width: 250px; /* ancho completo del sidebar */
      }

      .sidebar.colapsada {
        width: 60px; /* colapsado igual que escritorio */
      }

      .content {
        margin-left: 250px; /* contenido también se ajusta */
      }

      .content.expandido {
        margin-left: 60px;
      }
    }