/* Custom styles for the app search dropdown */

/* Ensure dropdown container doesn't scroll to hide search */
.apps-dropdown-container .md-select-menu-container {
    max-height: 400px !important;
    overflow-y: auto !important;
}

/* Keep search header always visible at top */
.app-search-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 3000 !important;
    background: white !important;
    border-bottom: 1px solid #e0e0e0 !important;
    margin: 0 !important;
    padding: 12px !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
}

/* Improve search input styling */
.app-search-input {
    width: 100% !important;
    padding: 12px 16px !important;
    border: 1px solid #ddd !important;
    /*border-radius: 6px !important;*/
    font-size: 14px !important;
    height: auto !important;
    outline: none !important;
    box-sizing: border-box !important;
    background: white !important;
    transition: all 0.2s ease !important;
}

.app-search-input:focus {
    border-color: #999 !important;
    box-shadow: 0 0 0 2px rgba(0,120,255,0.2) !important;
}

.app-search-input:hover {
    border-color: #999 !important;
}

/* Ensure dropdown options container has proper spacing */
.app-search-dropdown md-content {
    padding-top: 0 !important;
}

/* Fix option styling */
.app-search-dropdown md-option {
    padding: 12px 16px !important;
    border-bottom: 1px solid #f0f0f0 !important;
    min-height: 60px !important;
}

.app-search-dropdown md-option:hover {
    background-color: #f5f8ff !important;
}

.app-search-dropdown md-option:last-child {
    border-bottom: none !important;
}

/* Prevent dropdown from auto-scrolling when opened */
.app-search-dropdown {
    scroll-behavior: auto !important;
}

.app-search-dropdown md-select-menu {
    min-width: 100% !important;
    max-height: 400px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

/* Improve visibility of dropdown when opened */
.app-search-dropdown md-backdrop {
    background-color: rgba(0,0,0,0.2) !important;
}

/* Force the dropdown menu to start from top */
.app-search-dropdown md-select-menu-container {
    transform-origin: top left !important;
}

/* Ensure proper positioning of dropdown content */
.app-search-dropdown md-select-menu md-content {
    max-height: none !important;
    overflow: visible !important;
}

/* Additional fix to prevent scrolling to search input */
.app-search-dropdown .md-select-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 999 !important;
    background: white !important;
}

/* Fix for Angular Material select menu positioning */
md-select-menu[multiple] .md-select-header + md-content,
md-select-menu .md-select-header + md-content {
    padding-top: 0 !important;
}

/* Override Angular Material default scrolling behavior */
.app-search-dropdown md-select-menu {
    scroll-padding-top: 0 !important;
    scroll-margin-top: 0 !important;
}

/* Fix transparent background issue when scrolling */
.app-search-dropdown md-select-menu-container {
    background-color: white !important;
    background: white !important;
}

.app-search-dropdown md-select-menu {
    background-color: white !important;
    background: white !important;
}

.app-search-dropdown md-content {
    background-color: white !important;
    background: white !important;
}

/* Ensure background remains solid during scroll animations */
.app-search-dropdown md-select-menu-container,
.app-search-dropdown md-select-menu,
.app-search-dropdown md-content {
    -webkit-transform: translateZ(0) !important;
    transform: translateZ(0) !important;
    will-change: transform !important;
    backface-visibility: hidden !important;
}

/* Force hardware acceleration to prevent transparency glitches */
.app-search-dropdown {
    -webkit-transform: translateZ(0) !important;
    transform: translateZ(0) !important;
    will-change: auto !important;
}

/* Additional background enforcement for scrollable content */
.app-search-dropdown md-virtual-repeat-container {
    background-color: white !important;
    background: white !important;
}

/* Ensure no transparency on any child elements during scroll */
.app-search-dropdown * {
    background-color: inherit !important;
}

/* Override any potential transparency effects */
.app-search-dropdown md-option {
    background-color: white !important;
    opacity: 1 !important;
}

.app-search-dropdown md-option:hover {
    background-color: #f5f8ff !important;
    opacity: 1 !important;
}