/* ==========================================================================
 * Travel · Rides
 * ========================================================================== */
/* Travel · Rides ------------------------------------------------------------ */

.-rides-map-surface {
	inset: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	display: flex;
	position: absolute;
	overflow: hidden;
	background: #121212;
	clip-path: var(--squircle);
}

.-rides-map {
	inset: 0;
	width: 100%;
	height: 100%;
	position: absolute;
}

.-rides-map-fallback {
	inset: 0;
	display: flex;
	position: absolute;
	align-items: center;
	flex-flow: column;
	justify-content: center;
	gap: 3.125vw;
	padding: 9.375vw;
	text-align: center;
	background: linear-gradient(90deg, rgb(255 255 255 / 4%) 0.3125vw, transparent 0.3125vw) 0 0 / 12.5vw 12.5vw,
    linear-gradient(rgb(255 255 255 / 4%) 0.3125vw, transparent 0.3125vw) 0 0 / 12.5vw 12.5vw,
    radial-gradient(circle at 50% 40%, rgb(130 193 255 / 20%), transparent 50%),
    #121212;
}

.-rides-map-fallback-icon {
	width: 15.625vw;
	height: 15.625vw;
	display: flex;
	align-items: center;
	border-radius: 50%;
	justify-content: center;
	background: rgb(255 255 255 / 8%);
}

.-rides-map-fallback-icon .material-symbols-rounded {
	color: #82c1ff;
	font-size: 8.75vw;
}

.-rides-map-fallback-title {
	color: #fff;
	font-size: 5vw;
	font-family: "Fredoka";
}

.-rides-map-fallback-copy {
	color: #ffffff99;
	font-size: 3.4375vw;
	line-height: 5vw;
	font-family: "Nunito";
}

.-rides-location-chip {
	top: 4.6875vw;
	left: 4.6875vw;
	z-index: 8;
	display: flex;
	min-height: 10vw;
	position: absolute;
	align-items: center;
	gap: 2.1875vw;
	padding: 0 3.75vw;
	font-size: 3.4375vw;
	font-family: "Delius";
	clip-path: var(--squircle-small);
	background: rgb(18 18 18 / 76%);
	backdrop-filter: blur(3.125vw);
}

.-rides-location-chip .material-symbols-rounded {
	color: #82c1ff;
	font-size: 5vw;
}

.-rides-menu {
	left: 3.125vw;
	z-index: 8100;
	bottom: 18.75vw;
	width: 50vw;
	display: none;
	position: fixed;
	flex-flow: column;
	padding: 2.1875vw;
	gap: 1.5625vw;
	clip-path: var(--squircle);
	background: var(--surface);
	backdrop-filter: blur(3.125vw);
}

.-rides-menu.---show-rides-menu {
	display: flex;
}

.-rides-menu-item {
	min-height: 11.25vw;
	display: flex;
	gap: 3.125vw;
	align-items: center;
	padding: 0 3.125vw;
	font-size: 3.75vw;
	font-family: "Delius";
	clip-path: var(--squircle-small);
	background: rgb(0 0 0 / 16%);
}

.-rides-menu-item.---active {
	color: #82c1ff;
	background: rgb(130 193 255 / 14%);
}

.-rides-menu-item .material-symbols-rounded {
	font-size: 5.625vw;
}

.-foot.---rides-mode .-foot-go-circle {
	background: #ff8128;
}

.-foot.---rides-mode .-foot-go-circle.---hiver-identity {
	background-image: none !important;
}

.-foot.---rides-mode .-foot-go-circle > .material-symbols-rounded {
	display: flex;
}

.-foot.---rides-mode .-foot-plus.---rides-remove-waypoint {
	background: #ff806f;
}

/* Rides Tray --------------------------------------------------------------- */

.-rides-tray {
	width: 93.75vw;
	display: flex;
	gap: 3.125vw;
	padding: 3.125vw 0 12.5vw;
	flex-flow: column;
}

.-rides-tray-head {
	min-height: 25vw;
	display: flex;
	position: relative;
	align-items: center;
	padding: 3.125vw 4.6875vw;
	clip-path: var(--squircle);
	background: var(--surface);
	flex-flow: column;
	gap: 3.125vw;
}

.-rides-tray-avatars {
	width: 28.125vw;
	height: 15.625vw;
	position: relative;
}

.-rides-tray-avatar {
	top: 0;
	left: 6.25vw;
	width: 15.625vw;
	height: 15.625vw;
	position: absolute;
	border-radius: 50%;
	background-size: cover;
	background-position: center;
	border: 1.25vw solid var(--app-theme);
	background-color: var(--dimmer);
	transition: left 0.3s cubic-bezier(.2,.85,.2,1), transform 0.3s cubic-bezier(.2,.85,.2,1), opacity 0.3s;
}

.-rides-tray-type {
	flex: 1;
	width: 100%;
	min-width: 0;
	padding-left: 0;
	text-align: center;
}

.-rides-tray-type-title {
	color: #fff;
	font-size: 5vw;
	font-family: "Fredoka";
}

.-rides-tray-type-copy {
	color: #ffffff88;
	margin-top: 0.9375vw;
	font-size: 3.125vw;
	font-family: "Delius";
}

.-rides-tray-price {
	min-width: 31.25vw;
	min-height: 12.5vw;
	display: flex;
	align-items: center;
	flex-flow: column;
	justify-content: center;
	clip-path: var(--squircle-small);
	background: rgb(255 255 255 / 8%);
}

.-rides-tray-price strong {
	font-size: 4.0625vw;
	font-family: "Delius";
}

.-rides-tray-price span {
	color: #ffffff77;
	font-size: 3.125vw;
}

.-rides-switches {
	display: flex;
	gap: 1.5625vw;
	flex-flow: column;
}

.-rides-switch {
	min-height: 12.5vw;
	display: flex;
	align-items: center;
	padding: 0 4.6875vw;
	clip-path: var(--squircle);
	background: var(--surface);
}

.-rides-switch-label {
	flex: 1;
	font-size: 3.75vw;
	font-family: "Delius";
}

.-rides-switch-control {
	width: 12.5vw;
	height: 7.5vw;
	padding: 0.9375vw;
	display: flex;
	border-radius: 6.25vw;
	align-items: center;
	background: rgb(0 0 0 / 25%);
	justify-content: flex-start;
}

.-rides-switch-control::before {
	content: "";
	width: 5.625vw;
	height: 5.625vw;
	border-radius: 50%;
	background: #ffffff88;
	transition: transform .25s, background .25s;
}

.-rides-switch.---on .-rides-switch-control {
	background: rgb(145 201 128 / 25%);
}

.-rides-switch.---on .-rides-switch-control::before {
	background: #91c980;
	transform: translateX(4.6875vw);
}

.-rides-date-slab {
	min-height: 15.625vw;
	display: flex;
	gap: 3.125vw;
	align-items: center;
	padding: 0 4.6875vw;
	clip-path: var(--squircle);
	background: var(--surface);
}

.-rides-date-slab .material-symbols-rounded {
	color: #82c1ff;
	font-size: 6.25vw;
}

.-rides-date-copy {
	display: flex;
	gap: 0.625vw;
	flex-flow: column;
}

.-rides-date-copy strong {
	font-size: 3.75vw;
	font-family: "Delius";
}

.-rides-date-copy span {
	color: #ffffff88;
	font-size: 3.125vw;
}

.-rides-tray .-widget {
	width: 100%;
}

.-rides-tray .-widget-body {
	padding: 0 3.125vw;
}

.-rides-tray .-widget.---open > .-widget-body {
	height: auto;
}

.-rides-widget-options {
	display: flex;
	gap: 1.5625vw;
	padding: 3.125vw 0;
	flex-flow: column;
}

.-rides-option {
	min-height: 11.25vw;
	display: flex;
	align-items: center;
	padding: 0 3.125vw;
	font-size: 3.4375vw;
	font-family: "Delius";
	clip-path: var(--squircle-small);
	background: rgb(255 255 255 / 6%);
}

.-rides-option.---active {
	color: #91c980;
	background: rgb(145 201 128 / 12%);
}

.-rides-passenger-slider {
	padding: 3.125vw 0 4.6875vw;
}

.-rides-passenger-value {
	margin-top: 1.5625vw;
	text-align: center;
	font-size: 3.4375vw;
	font-family: "Delius";
}

.-rides-note-area {
	display: none;
	margin: 0;
	min-height: 31.25vw;
	padding: 4.6875vw;
	outline: 0;
	color: #fff;
	font-size: 3.75vw;
	line-height: 5vw;
	font-family: "Nunito";
	clip-path: var(--squircle);
	background: var(--surface);
}

.-rides-note-area:empty::before {
	content: "Note for the Driver ...";
	color: #ffffff55;
}

.-rides-tray-avatars .-rides-tray-avatar:nth-child(1),
.-rides-tray-avatars .-rides-tray-avatar:nth-child(3) {
	opacity: 0;
}

.-rides-tray-avatars.---seat-enabled .-rides-tray-avatar:nth-child(1) {
	left: 0;
	opacity: 1;
}

.-rides-tray-avatars.---seat-enabled .-rides-tray-avatar:nth-child(2) {
	left: 6.25vw;
}

.-rides-tray-avatars.---seat-enabled .-rides-tray-avatar:nth-child(3) {
	left: 12.5vw;
	opacity: 1;
}

.-rides-tray-avatars:not(.---seat-enabled) .-rides-tray-avatar:nth-child(1),
.-rides-tray-avatars:not(.---seat-enabled) .-rides-tray-avatar:nth-child(3) {
	transform: scale(.82);
}

.-rides-tray-tools {
	display: flex;
	gap: 3.125vw;
	flex-flow: column;
}

.-rides-tray .-widget-switch-slab {
	margin: 0;
}

.-rides-tray .-widget-body-divider {
	margin: 0 4.6875vw;
}

.-rides-pickup-item,
.-rides-notes-item {
	margin: 0;
}

.-rides-pickup-item {
	overflow: hidden;
}

.-rides-pickup-input {
	inset: 0;
	opacity: 0;
	z-index: 3;
	width: 100%;
	height: 100%;
	position: absolute;
}

.-rides-pickup-item .-widget-label,
.-rides-notes-item .-widget-label {
	flex: 1;
}

.-rides-widget-slider {
	display: flex;
	gap: 3.125vw;
	padding: 3.125vw;
	flex-flow: column;
}

.-rides-widget-slider-copy {
	display: flex;
	align-items: center;
	font-size: 3.4375vw;
	font-family: "Delius";
	justify-content: space-between;
}

.-rides-note-area.---show-rides-notes {
	display: block;
}

.-rides-live-contact-list {
	display: flex;
	gap: 1.5625vw;
	flex-flow: column;
}

.-rides-live-contact {
	margin: 0;
}

.-rides-live-contact.---active {
	color: #91c980;
	background: rgb(145 201 128 / 12%);
}

.-rides-map-surface.---map-pass-through .-rides-map {
	pointer-events: none;
}