.discovery-flex-container {

    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

    display: flex !important;

    flex-direction: row !important;

    align-items: flex-start !important;

    gap: 30px !important;

    margin-top: 20px !important;

    width: 100% !important;

    box-sizing: border-box !important;

  }



  /* Left-side Sidebar containing all controls */

  .filter-sidebar-panel {

    width: 300px !important;

    min-width: 300px !important;

    display: flex !important;

    flex-direction: column !important;

    gap: 20px !important;

    box-sizing: border-box !important;

  }



  /* Right-side main content panel */

  .main-table-panel {

    flex: 1 !important;

    display: flex !important;

    flex-direction: column !important;

    gap: 15px !important;

    min-width: 0 !important; /* Prevents table blowout */

    box-sizing: border-box !important;

  }



  /* Filter sections designed as compact cards stacked vertically */

  .filter-section-card {

    background-color: #fafbfc !important;

    border: 1px solid #e5e7eb !important;

    border-radius: 12px !important;

    padding: 18px !important;

    box-shadow: 0 1px 3px rgba(0,0,0,0.02) !important;

    box-sizing: border-box !important;

  }



  .section-title-label {

    display: block !important;

    font-size: 14px !important;

    font-weight: 700 !important;

    color: #1f2937 !important;

    margin-bottom: 12px !important;

    text-transform: uppercase !important;

    letter-spacing: 0.5px !important;

    border-bottom: 2px solid #e5e7eb !important;

    padding-bottom: 6px !important;

  }



  .pills-container {

    display: flex !important;

    flex-wrap: wrap !important;

    gap: 8px !important;

  }



  /* Pill Buttons styling */

  .filter-pill {

    background-color: #ffffff !important;

    color: #4b5563 !important;

    padding: 8px 16px !important;

    border-radius: 50px !important;

    font-size: 13px !important;

    font-weight: 500 !important;

    cursor: pointer !important;

    border: 1px solid #d1d5db !important;

    transition: all 0.2s ease-in-out !important;

    user-select: none !important;

    display: inline-block !important;

  }



  .filter-pill:hover,
.filter-pill:focus {
  background-color: #f3f4f6 !important;
  border-color: #9ca3af !important;
  outline: 2px solid #861f41 !important; /* Focus ring for keyboard accessibility */
  outline-offset: 2px !important;
}



  /* Crimson Brand Active State */

  .filter-pill.active {

    background-color: #861f41 !important; 

    color: #ffffff !important;

    border-color: #861f41 !important;

    box-shadow: 0 2px 6px rgba(134, 31, 65, 0.25) !important;

  }



  /* Dropdown Styling */

  .filter-select-element {

    width: 100% !important;

    padding: 10px !important;

    border: 1px solid #ccc !important;

    border-radius: 6px !important;

    background-color: #fff !important;

    font-size: 14px !important;

  }



  /* Mobile Fallback: Stack panels when viewport is narrow */

  @media(max-width: 900px) {

    .discovery-flex-container {

      flex-direction: column !important;

    }

    .filter-sidebar-panel {

      width: 100% !important;

      min-width: 100% !important;

    }

  }