/* Base styles for filter containers */
.custom-media-filters,
.media-library-filters {
	display: inline-flex;
	align-items: center;
	vertical-align: middle;
	margin-right: 5px;
}

/* Select element base styles */
.custom-media-filters select,
.media-library-filters select {
	min-width: 150px;
	height: 28px;
	margin-right: 5px;
	vertical-align: middle;
}

/* Media toolbar (grid view) specific alignment */
.media-toolbar-secondary .custom-media-filters {
	display: inline-flex;
	vertical-align: baseline;
	margin: 0 6px 0 0;
	height: 28px;
}

/* Match WordPress native selects */
.media-toolbar-secondary .custom-media-filters select {
	height: 28px;
	margin-top: 0;
	margin-bottom: 0;
	vertical-align: baseline;
}

.media-toolbar-secondary {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
}

.upload-php .media-toolbar-secondary {
	display: block;
}

/* Media modal specific styles */
.media-toolbar-secondary .custom-media-filters {
	float: none;
}

.upload-php .media-toolbar-secondary .custom-media-filters {
	margin: 12px 10px 0 0;
}

/* List view specific styles */
.wp-filter .actions {
	display: inline-flex;
	align-items: center;
	gap: 0px;
}

/* Align list view filter elements */
.wp-filter .actions select,
.wp-filter .actions .media-library-filters {
	margin-right: 9px;
}

/* Set consistent height for all selects */
.wp-filter select,
.wp-filter .select2-container {
	height: 28px;
	vertical-align: middle;
}

/* Add spacing before the Filter button */
.wp-filter #post-query-submit {
	margin-left: 5px;
}

/* Filter notice styles */
.custom-filter-notice {
	color: #2271b1;
	font-weight: 500;
}

/* Select2 specific adjustments for grid view */
.media-toolbar-secondary .custom-media-filters .select2-container {
	margin-top: 0;
	vertical-align: baseline;
	height: 28px;
}

/* Select2 base styles */
.media-library-filters .select2-container,
.custom-media-filters .select2-container {
	min-width: 150px;
	margin-right: 0px;
	height: 28px;
}

/* Select2 dropdown styles */
.select2-container--default .select2-selection--single {
	height: 28px !important;
	border-color: #8c8f94 !important;
}

.select2-container--default
	.select2-selection--single
	.select2-selection__rendered {
	line-height: 26px !important;
}

.select2-container--default
	.select2-selection--single
	.select2-selection__arrow {
	height: 26px !important;
}

/* Select2 search field styles */
.select2-search__field {
	width: 100% !important;
	padding: 4px !important;
}

/* Match height with WordPress attachment filters */
.custom-media-filters .select2-container--default .select2-selection--single,
.media-library-filters .select2-container--default .select2-selection--single {
	border-radius: 3px;
	line-height: 26px;
}

/* Select2 results styles */
.select2-container--default .select2-results > .select2-results__options {
	max-height: 400px;
	overflow-y: auto;
}

.select2-container--default .select2-results__option {
	padding: 6px;
	font-size: 14px;
}

.select2-container--default
	.select2-results__option--highlighted[aria-selected] {
	background-color: #0073aa;
}

/* Select2 dropdown container */
.select2-dropdown {
	border-color: #8c8f94;
	z-index: 999999;
}

/* Select2 when opened */
.select2-container--open {
	z-index: 999999;
}

/* Button alignment */
.media-toolbar-secondary .button.select-mode-toggle-button {
	margin-left: 0;
}

/* Media query for smaller screens */
@media (max-width: 580px) {
	.wp-filter .actions {
		flex-direction: column;
		align-items: flex-start;
		gap: 6px;
	}
}