.aside-menu {
    border-left: 1px solid #dee2e6;
    background: #f8f9fa;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 400px;
    z-index: 10000; /* Aumentado para estar por encima de dropdowns (9999) */
    overflow-y: auto;
    overflow-x: hidden;
    transform: translateX(100%);
    transition: transform 0.3s ease-in-out;
    box-shadow: -2px 0 8px rgba(0, 0, 0, 0.1);
  }

  /* Panel visible */
  body:not(.aside-menu-hidden) .aside-menu {
    transform: translateX(0);
  }

  /* Overlay oscuro cuando está abierto */
  body:not(.aside-menu-hidden)::after {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9999; /* Justo por encima de dropdowns pero debajo del aside-menu */
    animation: fadeIn 0.3s ease-in-out;
  }

  @keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
  }
  
  .aside-menu .nav-pills {
    padding: 1rem 1rem 0;
    background: white;
    border-bottom: 1px solid #dee2e6;
  }
  
  .aside-menu .nav-pills .nav-link {
    border-radius: 4px;
    padding: 0.75rem;
    color: #495057;
    transition: all 0.2s ease;
  }
  
  .aside-menu .nav-pills .nav-link:hover {
    background-color: #e9ecef;
  }
  
  .aside-menu .nav-pills .nav-link.active {
    background-color: #007bff;
    color: white;
  }
  
  .aside-menu .input-group {
    margin-bottom: 1rem;
  }
  
  .search-section {
    background: white;
    padding: 1.5rem;
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
  }
  
  .search-section label {
    color: #495057;
    margin-bottom: 0.5rem;
  }
  
  .search-section .form-control {
    border: 1px solid #ced4da;
  }
  
  .search-section .btn-light {
    border: 1px solid #ced4da;
    background: #f8f9fa;
  }
  
  .search-section .btn-light:hover {
    background: #e9ecef;
  }

  /* ============================================
     RESPONSIVE - MÓVILES (menos de 768px)
     ============================================ */
  @media (max-width: 767px) {
    .aside-menu {
      width: 100%;
      max-width: 100vw;
      border-left: none;
      padding-top: 60px;
    }

    /* Evitar scroll del body cuando el panel está abierto */
    body:not(.aside-menu-hidden) {
      overflow: hidden;
    }

    /* Ajustar padding del contenido */
    .search-section {
      padding: 1rem;
      margin-bottom: 1rem;
    }

    /* Tabs más compactos */
    .aside-menu .nav-pills .nav-link {
      padding: 0.6rem;
      font-size: 0.9rem;
    }

    /* Header del panel */
    .search-panel-header {
      padding: 0.75rem !important;
    }

    .search-panel-header h6 {
      font-size: 1rem !important;
    }
  }