/* --------------------------------------------------------------------------
   jQuery UI
-------------------------------------------------------------------------- */

	.ui-helper-hidden-accessible {
		display: none;
	}


/* --------------------------------------------------------------------------
   UI Accordion
-------------------------------------------------------------------------- */

	.ui-accordion-header {

		background: var(--green-color);
		padding: var(--space-base);
		margin: 0;
		border-bottom: 1px solid #FFF;

		a {
			font-size: 1.25rem !important;
			font-weight: 500 !important;
			color: #FFF !important;
			border-radius: .25rem;
		}

	}


/* --------------------------------------------------------------------------
   UI Tabs
-------------------------------------------------------------------------- */

	.ui-tabs {

		margin: var(--space-base) var(--space-base) 0 var(--space-base);

		ul.ui-tabs-nav {

			padding: 0;
			margin: 0;
			display: flex;
			gap: .5rem;
			border-bottom: 1px solid var(--grey-dc-color);

			li {

				list-style: none;
				font-weight: 500;
				padding: .75rem 1rem;
				border-top-left-radius: .5rem;
				border-top-right-radius: .5rem;

				&.ui-state-default {

					background: var(--grey-dc-color);
					border: 1px solid var(--grey-dc-color);
					border-bottom: none;

					a {
						color: #000;
					}

				}

				&.ui-state-active {

					background: var(--blue-color);
					border: 1px solid var(--blue-color);
					border-bottom: none;

					a {
						color: #FFF;
					}

				}

			}

		}

	}


/* --------------------------------------------------------------------------
   UI Autocomplete
-------------------------------------------------------------------------- */

	.ui-autocomplete {

		position: absolute;
		box-sizing: border-box;
		border-radius: .375rem;
		border: 1px solid var(--grey-e6-color);
		background: #FFF;
		z-index: 10;
		max-height: 30svh;
		overflow: auto;
		list-style: none;
		top: .625rem !important;
		width: 100%;
		outline: none;
		padding: .625rem;
		display: flex;
		flex-direction: column;
		margin: 0;

		.ui-menu-item {

			a {

				text-decoration: none;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
				display: grid;
				grid-template-columns: 1fr auto;
				gap: 1rem;
				align-items: center;
				background: none;
				font-weight: normal;
				box-sizing: border-box;
				border-radius: .25rem;
				padding: .625rem;
				cursor: pointer;
				border: none;

				/* Selected */
				&:hover, &.ui-state-active {
					color: #000;
					background: var(--grey-f0-color);
					font-family: inherit !important;
				}

				/* Empty */
				&:has(.empty-list) {

					cursor: default;
					padding: 0;
					align-items: center;
					justify-content: center;
					display: flex;
					flex-direction: column;

					.empty-list {

						align-items: center;
						justify-content: center;
						display: flex;
						flex-direction: column;
						width: 100%;
						padding-block: 1rem;
						background: var(--grey-fa-color) !important;
						color: var(--grey-80-color);

						svg {
							width: 3rem;
							height: 3rem;
							padding: 0;
						}

					}

				}

			}

		}

	}

	.ui-autocomplete-loader {
		position: absolute;
		top: 50%;
		right: 1.125rem;
		transform: translateY(-50%);
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
		z-index: 1;
	}


/* --------------------------------------------------------------------------
   UI Slider
-------------------------------------------------------------------------- */

	.ui-slider {

		position: relative;
		width: 90%;
		height: .4rem;
		background: var(--grey-dc-color);
		border-radius: .5rem;
		margin: 0 auto;
		cursor: grabbing;

		.ui-slider-range {
			position: absolute;
			z-index: 1;
			display: block;
			border: 0;
			height: .4rem;
			border-top-left-radius: .4rem;
			border-bottom-left-radius: .4rem;
			background: #00AEA3;
		}

		.ui-slider-handle {
			position: absolute;
			z-index: 2;
			touch-action: none;
			width: 1.2rem;
			height: 1.2rem;
			box-sizing: border-box;
			border-radius: 50%;
			top: 50%;
			transform: translateY(-50%);
			left: 0;
			background: #FFF;
			border: .21rem solid var(--green-color);
			cursor: grabbing;
		}

	}
