/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-zbfdpxjgq4] {
	position: relative;
	display: flex;
	flex-direction: column;
}

main[b-zbfdpxjgq4] {
	flex: 1;
}


svg[b-zbfdpxjgq4] {
	fill: var(--text-primary);
	height: 32px;
	width: 32px;
}

.admin-menu svg[b-zbfdpxjgq4] {
	fill: #006bb7;
}

/* Sidebar is currently hidden in markup */
.sidebar[b-zbfdpxjgq4] {
	background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-zbfdpxjgq4] {
	background-color: #f7f7f7;
	border-bottom: 1px solid #d6d5d5;
	height: 3.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0rem;
	z-index: 500;
	font-family: 'Fredoka', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

/* Left logo and right account area (in RTL the logo is at start/right, account area at end/left) */
.site-logo[b-zbfdpxjgq4] {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	color: black;
}

	.site-logo img[b-zbfdpxjgq4] {
		height: 3.5rem; /* match header height so it centers perfectly */
		animation: armadillo-walk-in-b-zbfdpxjgq4 3.6s linear both;
	}

/* Armadillo strolls in from off-screen at a slow, steady walking pace - linear
   timing so the gif's own leg-cycle roughly reads as footsteps rather than a
   slide, with the deceleration/settle confined to the very last steps. */
@keyframes armadillo-walk-in-b-zbfdpxjgq4 {
	0% {
		transform: translateX(150px);
	}

	70% {
		transform: translateX(18px);
	}

	88% {
		transform: translateX(-4px);
	}

	96% {
		transform: translateX(2px);
	}

	100% {
		transform: translateX(0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.site-logo img[b-zbfdpxjgq4] {
		animation: none;
	}
}

/* Ensure title is vertically centered next to the logo */
.top-row h3[b-zbfdpxjgq4] {
	margin: 0.25rem 0 0 -.75rem; /* remove default margins and add spacing from logo */
	line-height: 1; /* tighter line height for better centering */
	/* Same duration/percentage stops as armadillo-walk-in so the two stay in lockstep */
	animation: title-push-in-b-zbfdpxjgq4 3.6s linear both;
}

/* The title waits out near the edge while the armadillo makes its long approach,
   then gets "shoved" left the moment he arrives - sharing the walk animation's
   70/88/96/100 stops so contact and the settle-bounce land in perfect sync. */
@keyframes title-push-in-b-zbfdpxjgq4 {
	0% {
		transform: translateX(56px);
	}

	55% {
		transform: translateX(56px);
	}

	88% {
		transform: translateX(-3px);
	}

	96% {
		transform: translateX(1px);
	}

	100% {
		transform: translateX(0);
	}
}

@media (prefers-reduced-motion: reduce) {
	.top-row h3[b-zbfdpxjgq4] {
		animation: none;
	}
}

.account-area[b-zbfdpxjgq4] {
	/* Push this block to the inline-end side (left in RTL, right in LTR) */
	margin-inline-end: auto;
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	margin-left: 3.5rem;
}

.status-area[b-zbfdpxjgq4] {
	/* Push this block to the inline-end side (left in RTL, right in LTR) */
	position: absolute;
	left: 50%;
	margin-inline: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	transform: translateX(-50%);
}

	.status-area h5[b-zbfdpxjgq4] {
		padding-top: 8px;
	}

.avatar[b-zbfdpxjgq4] {
	width: 32px;
	height: 32px;
	border-radius: 50%;
}


.username[b-zbfdpxjgq4] {
	margin-inline-start: .25rem;
	color: var(--text-primary);
	font-size: 1.2rem;
	letter-spacing: 0.2rem;
}

/*.login-btn {
    position: relative;
    overflow: visible;
}*/

.coming-soon-tag[b-zbfdpxjgq4] {
	position: absolute;
	top: 2px;
	left: -10px;
	background: var(--text-primary);
	color: #fff;
	font-size: 0.75rem;
	font-weight: bold;
	padding: 4px 6px;
	border-radius: 12px;
	box-shadow: 0 2px 6px rgba(0,0,0,0.12);
	transform: rotate(-35deg);
	z-index: 2;
	letter-spacing: 1px;
	pointer-events: none;
}

/* Facebook button styling */
/*.btn-facebook {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    background-color: var(--text-primary);
    color: #fff;
    border: none;
    padding: .175rem .25rem;
    border-radius: .375rem;
    font-weight: 600;
    font-size: 1.5rem;*/ /* control text size; icon scales with it */
/*line-height: 1.2;
}*/

/* Make icon match text size */
/*.btn-facebook .icon {
        width: 1.2em;
        height: 1.2em;
        flex: 0 0 auto;
    }

    .btn-facebook:hover {
        filter: brightness(0.95);
    }

    .btn-facebook:focus {
        outline: 2px solid #0b5ed7;
        outline-offset: 2px;
    }*/


.login-popup-backdrop[b-zbfdpxjgq4] {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,0.4);
	z-index: 1000;
}

.login-popup[b-zbfdpxjgq4] {
	position: fixed;
	top: 50%;
	left: 50%;
	direction: rtl;
	transform: translate(-50%, -50%);
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 2px 16px rgba(0,0,0,0.2);
	padding: 2rem 1.5rem 1.5rem 1.5rem;
	z-index: 1001;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	min-width: 260px;
	align-items: center;
}

.login-btn[b-zbfdpxjgq4] {
	display: flex;
	align-items: center;
	gap: 0.5em;
	padding: 0.5em 1.2em;
	border: none;
	border-radius: 4px;
	font-weight: bold;
	cursor: pointer;
	transition: background 0.2s;
	font-size: 1rem;
}

	.login-btn.facebook[b-zbfdpxjgq4] {
		background: #1877f3;
		color: #fff;
	}

	.login-btn.google[b-zbfdpxjgq4] {
		background: #fff;
		color: #444;
		border: 1px solid #ddd;
	}

.close-btn[b-zbfdpxjgq4] {
	background: none;
	border: none;
	font-size: 1.5rem;
	color: #888;
	cursor: pointer;
	position: absolute;
	top: 0.5rem;
	right: 1rem;
}

.login-activator-container[b-zbfdpxjgq4] {
	position: relative;
	display: inline-block;
}

.login-popup-absolute[b-zbfdpxjgq4] {
	position: absolute;
	left: 120px;
	top: 100%;
	direction: rtl;
	margin-top: 8px;
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 2px 16px rgba(0,0,0,0.2);
	padding: 1.5rem 1.5rem 1rem 1.5rem;
	z-index: 1001;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	min-width: 200px;
	align-items: center;
}

/* Animation for popup */
.login-popup-absolute[b-zbfdpxjgq4],
.login-popup[b-zbfdpxjgq4] {
	opacity: 0;
	transform: translateY(-16px) scale(0.98);
	transition: opacity 0.25s cubic-bezier(.4,0,.2,1), transform 0.25s cubic-bezier(.4,0,.2,1);
	pointer-events: none;
}

	.login-popup-absolute.show[b-zbfdpxjgq4],
	.login-popup.show[b-zbfdpxjgq4] {
		opacity: 1;
		transform: translateY(0) scale(1);
		pointer-events: auto;
	}


@media (max-width: 766.98px) {
	.top-row[b-zbfdpxjgq4] {
		justify-content: space-between;
		position: sticky;
		top: 0;
		z-index: 500;
	}

	h3[b-zbfdpxjgq4] {
		font-size: 1rem;
	}

	.username[b-zbfdpxjgq4] {
		display: none;
	}

	.total-count[b-zbfdpxjgq4] {
		padding-left: 8rem;
		font-size: 0.7rem;
		margin-top: 4px;
	}

	.status-area h5[b-zbfdpxjgq4] {
		display: none;
	}
}

@media (min-width: 767px) {
	.page[b-zbfdpxjgq4] {
		flex-direction: row;
	}

	.sidebar[b-zbfdpxjgq4] {
		width: 250px;
		height: 100vh;
		position: sticky;
		top: 0;
	}

	.top-row[b-zbfdpxjgq4] {
		position: sticky;
		top: 0;
		z-index: 500;
	}

	.top-row[b-zbfdpxjgq4], article[b-zbfdpxjgq4] {
		padding-left: 7rem !important;
		padding-right: 7rem !important;
	}
}


.total-count[b-zbfdpxjgq4] {
	position: relative;

	z-index: 1000;
	transform: translateX(-50%);
	display: flex;
	flex-direction: row;
	align-items: center; /* Vertically center children */
	height: 48px; /* Set a fixed height matching the avatar, or as needed */
	position: fixed;
	top: 10px;
	left: 100px;
	z-index: 1000;
	transform: translateX(-50%);
	
}

.xp[b-zbfdpxjgq4] {
	display: flex;
	align-items: center; /* Vertically center XP content */
	height: 32px; /* Set a fixed height for the XP counter itself */
	min-width: 70px;
	border: 1px solid black;
	border-radius: 12px;
	gap: 4px;
	background-color: var(--text-primary);
	padding-block: 0.25rem;
	padding-inline: 0.5rem;
	color: #1f1f1f;
	font-family: "Bungee", sans-serif;
}



	.xp span[b-zbfdpxjgq4] {
		padding-top: 3px;
	}

	.xp svg[b-zbfdpxjgq4] {
		fill: #1f1f1f;
		width: 16px !important;
		height: 16px !important;
	}


.armadil-avatar[b-zbfdpxjgq4] {
	position: absolute;
	bottom:0px;
	right:-40px;
}



.status-image[b-zbfdpxjgq4] {
	border-radius: 50%; /* Makes the image circular */
	box-shadow: 0 4px 16px rgba(0,0,0,0.18); /* Soft shadow */
	border: 2px solid #fff; /* Optional: white border for contrast */
	background: #f7f7f7; /* Optional: subtle background */
	width: 48px; /* Adjust size as needed */
	height: 48px;
	object-fit: cover; /* Ensures image covers the area */
	transition: box-shadow 0.2s, transform 0.2s;
}

.status-image:hover[b-zbfdpxjgq4] {
	box-shadow: 0 8px 24px rgba(0,0,0,0.28);
	transform: scale(1.05) rotate(-2deg);
}



/* Full-screen "loading rooms" cover used during navigation to the room list.
   The door itself (Home.razor) shows its own local peek of this same panel as
   it swings open - by the time this fades in, the two look identical, so the
   crossfade to full-screen reads as a seamless continuation rather than a swap.
   It's faded away once the destination page has mounted, revealing it beneath. */
.page-transition-overlay[b-zbfdpxjgq4] {
	position: fixed;
	inset: 0;
	z-index: 3000;
	pointer-events: none;
	opacity: 0;
	overflow: hidden;
	transition: opacity .3s ease;
}

	.page-transition-overlay.visible[b-zbfdpxjgq4] {
		opacity: 1;
	}

@media (prefers-reduced-motion: reduce) {
	.page-transition-overlay[b-zbfdpxjgq4] {
		transition: none;
	}
}

#blazor-error-ui[b-zbfdpxjgq4] {
	background: lightyellow;
	bottom: 0;
	box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
	display: none;
	left: 0;
	padding: 0.6rem 1.25rem 0.7rem 1.25rem;
	position: fixed;
	width: 100%;
	z-index: 1000;
}

	#blazor-error-ui .dismiss[b-zbfdpxjgq4] {
		cursor: pointer;
		position: absolute;
		right: 0.75rem;
		top: 0.5rem;
	}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-y5y3g5n65f] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-y5y3g5n65f] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-y5y3g5n65f] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-y5y3g5n65f] {
    font-size: 1.1rem;
}

.bi[b-y5y3g5n65f] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill[b-y5y3g5n65f] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill[b-y5y3g5n65f] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested[b-y5y3g5n65f] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-y5y3g5n65f] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-y5y3g5n65f] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-y5y3g5n65f] {
        padding-bottom: 1rem;
    }

    .nav-item[b-y5y3g5n65f]  a {
        color: #d7d7d7;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
    }

.nav-item[b-y5y3g5n65f]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-y5y3g5n65f]  a:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-y5y3g5n65f] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-y5y3g5n65f] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-y5y3g5n65f] {
        display: none;
    }

    .nav-scrollable[b-y5y3g5n65f] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* /Components/Pages/Admin/Admin.razor.rz.scp.css */
.avatar[b-fvn0vdpxcm] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
}


.avatar-big[b-fvn0vdpxcm] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
}


.roles svg[b-fvn0vdpxcm] {
    width:24px;
    height:24px;

}


@media (orientation: portrait) {

    div[b-fvn0vdpxcm] {
        flex-direction: column;
    }
}
/* /Components/Pages/Admin/EscapeRoomEditor.razor.rz.scp.css */
.form-section[b-6273irgvru] {
  display: flex;
  justify-content: center;   /* center horizontally */
  align-items: stretch;        /* allow children to stretch to equal height */
  gap: 1rem;                  /* space between the fields */
  flex-wrap: wrap;            /* stack on small screens */
  padding-block: .75rem;
}



svg[b-6273irgvru] {
    fill: var(--text-primary);
    height: 32px;
    width: 32px;
    padding-inline-end:12px;
}

/* Radzen SelectBar: add spacing between icon and text */
.rz-selectbar .rz-button .rz-button-icon-left[b-6273irgvru] { margin-inline-end: .35rem; }
.rz-selectbar .rz-button .rz-button-icon-right[b-6273irgvru] { margin-inline-start: .35rem; }
.rz-selectbar .rz-button .rz-icon[b-6273irgvru] { vertical-align: middle; }
/* /Components/Pages/CompaniesView.razor.rz.scp.css */


svg[b-jpru2v4m78] {
    fill: var(--text-primary);
    height: 24px;
    width: 24px;
    min-width: 24px;
    min-height: 24px;
}
/* /Components/Pages/Contact.razor.rz.scp.css */
.contact-wrapper[b-4uqtfeiecs] {
    direction: rtl; /* Hebrew layout */
}

.contact-wrapper .card-header[b-4uqtfeiecs] {
    border-bottom: 1px solid rgba(0,0,0,.05);
}

.contact-wrapper .form-label[b-4uqtfeiecs] {
    font-weight: 600;
}

.contact-wrapper .form-control[b-4uqtfeiecs] {
    border-radius: .5rem;
}

.contact-wrapper .btn-dark[b-4uqtfeiecs] {
    border-radius: 2rem;
    padding-inline: 1.25rem;
}

/* Validation styles align with Bootstrap */
.validation-message[b-4uqtfeiecs],
.validation-message > *[b-4uqtfeiecs] {
    color: #dc3545 !important;
}
/* /Components/Pages/Home.razor.rz.scp.css */
.hero[b-x176q9eve7] {
    position: relative;
    min-height: 85vh;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: #1a1a1a; /* shows briefly before the video paints */
    font-family: 'Playpen Sans Hebrew', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    overflow: hidden;
}

    .hero[b-x176q9eve7]::before {
        content: '';
        position: absolute;
        inset: 0;
        background: rgba(0,0,0,0.4); /* black overlay, adjust alpha for strength */
        z-index: 1;
    }

.hero-video[b-x176q9eve7] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-content[b-x176q9eve7] {
    position: relative; /* required for the z-index below to take effect above the video */
    text-align: center;
    padding: 2rem;
    z-index: 1;
    justify-content: center;
    align-items: center;
}

h1[b-x176q9eve7] {
    font-size: 4rem;
    text-shadow: -2px -2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, 2px 2px 0 #000;
}

/* Each word bounces in with a staggered delay (set inline per-word) - solid white
   fill with the h1's own drop-shadow outline for contrast against the video. */
.hero-title-word[b-x176q9eve7] {
    display: inline-block;
    margin-inline-end: 0.4em; /* explicit gap between words - don't rely on a space char inside an inline-block */
    opacity: 0;
    color: #fff;
    animation: hero-word-in-b-x176q9eve7 .65s cubic-bezier(.34,1.56,.64,1) both;
}

    .hero-title-word:last-child[b-x176q9eve7] {
        margin-inline-end: 0;
    }

@keyframes hero-word-in-b-x176q9eve7 {
    0% {
        opacity: 0;
        transform: scale(.4) translateY(14px);
    }

    60% {
        opacity: 1;
        transform: scale(1.12) translateY(-4px);
    }

    80% {
        transform: scale(.96) translateY(1px);
    }

    100% {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .hero-title-word[b-x176q9eve7] {
        animation: none;
        opacity: 1;
        transform: none;
    }
}

svg[b-x176q9eve7] {
    fill: var(--text-primary);
    height: 24px;
    width: 24px;
    min-width: 24px;
    min-height: 24px;
}


.btn-outline-info:hover[b-x176q9eve7] {
    box-shadow: 0 12px 28px rgba(0,0,0,.28), inset 0 -3px 0 rgba(0,0,0,.15);
    background: white;
}

.disclaimer-backdrop[b-x176q9eve7] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.65);
    backdrop-filter: blur(2px);
    z-index: 1050;
    opacity: 0;
    animation: disclaimer-fade-in-b-x176q9eve7 .22s ease-out forwards;
}

.disclaimer-modal[b-x176q9eve7] {
    position: fixed;
    inset: 0;
    display: grid;
    place-items: center;
    z-index: 1051;
    direction: rtl;
    font-family: 'Lunasima', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

.disclaimer-content[b-x176q9eve7] {
    position: relative;
    width: min(92vw, 720px);
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: 0 1rem 2rem rgba(0,0,0,.35);
    opacity: 0;
    transform: translateY(8px) scale(.96);
    transform-origin: center;
    will-change: transform, opacity;
    animation: disclaimer-pop-in-b-x176q9eve7 .28s cubic-bezier(.2,.8,.2,1) .05s forwards;
}

.disclaimer-image[b-x176q9eve7] {
    display: block;
    width: 100%;
    height: auto;
    filter: brightness(0.5);
}

.disclaimer-overlay[b-x176q9eve7] {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 1.25rem;
    background: linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.65) 75%);
    color: #fff;
    text-shadow: 0 1px 1px rgba(0,0,0,.6);
}

/* Animations */
@keyframes disclaimer-fade-in-b-x176q9eve7 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes disclaimer-pop-in-b-x176q9eve7 {
    from {
        opacity: 0;
        transform: translateY(8px) scale(.96);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
    .disclaimer-backdrop[b-x176q9eve7],
    .disclaimer-content[b-x176q9eve7] {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }
}
/* /Components/Pages/Privacy.razor.rz.scp.css */
body[b-hgk2qbyllx] {
    font-family: 'Segoe UI', Tahoma, Arial, sans-serif;
    line-height: 1.6;
    margin: 0 auto;
    padding: 20px;
    background-color: #f9f9f9;
    color: #333;
}

.container[b-hgk2qbyllx] {
    background: white;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

h1[b-hgk2qbyllx] {
    color: #2c3e50;
    text-align: center;
    border-bottom: 3px solid #3498db;
    padding-bottom: 10px;
    margin-bottom: 30px;
}

h2[b-hgk2qbyllx] {
    color: #34495e;
    margin-top: 25px;
    margin-bottom: 15px;
    padding-right: 10px;
    border-right: 4px solid #3498db;
}

.update-date[b-hgk2qbyllx] {
    text-align: center;
    color: #666;
    font-style: italic;
    margin-bottom: 30px;
}

ul[b-hgk2qbyllx] {
    margin: 10px 0;
    padding-right: 20px;
}

li[b-hgk2qbyllx] {
    margin-bottom: 8px;
}

.highlight[b-hgk2qbyllx] {
    background-color: #e8f6ff;
    padding: 15px;
    border-radius: 5px;
    border-right: 4px solid #3498db;
    margin: 15px 0;
}

.contact-info[b-hgk2qbyllx] {
    background-color: #f1f8e9;
    padding: 15px;
    border-radius: 5px;
    border-right: 4px solid #4caf50;
    margin-top: 20px;
    text-align: center;
}

.footer[b-hgk2qbyllx] {
    text-align: center;
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #ddd;
    color: #666;
    font-size: 0.9em;
}


.info-box[b-hgk2qbyllx] {
    background-color: #fff3cd;
    padding: 15px;
    border-radius: 5px;
    border-right: 4px solid #ffc107;
    margin: 15px 0;
}

.important-box[b-hgk2qbyllx] {
    background-color: #f8d7da;
    padding: 15px;
    border-radius: 5px;
    border-right: 4px solid #dc3545;
    margin: 15px 0;
}

.rights-box[b-hgk2qbyllx] {
    background-color: #d1ecf1;
    padding: 15px;
    border-radius: 5px;
    border-right: 4px solid #17a2b8;
    margin: 15px 0;
}

.contact-info[b-hgk2qbyllx] {
    background-color: #f1f8e9;
    padding: 15px;
    border-radius: 5px;
    border-right: 4px solid #4caf50;
    margin-top: 20px;
    text-align: center;
}
/* /Components/Pages/User.razor.rz.scp.css */
body[b-7jzwaabowk]{
    overflow:hidden;
}

/* Matches the height convention the sibling "חדרים ששיחקתי" grid tab already uses
   (calc(85vh - 113px)). The toolbar is a fixed-size flex child and the cards get their
   own independently-scrolling area below it - a guaranteed frozen header regardless of
   whether position:sticky would actually find the right scrolling ancestor through
   Radzen's internal tab-panel wrapper. */
.suggestions-panel[b-7jzwaabowk] {
    display: flex;
    flex-direction: column;
    height: calc(85vh - 113px);
    min-height: 0;
    /* .user-layout-grid's 2nd column is "2fr" - a bare fr track's implicit minimum is
       "auto", i.e. it floors at whichever tab is currently active's min-content width.
       RadzenTabs only lays out the active panel, so the column shrinks to fit THIS tab
       whenever it's selected, since the card grid below only demands ~250px (auto-fit
       collapses to one track for min-content purposes). This panel renders in every
       state (loading/empty/loaded), so pinning the floor here - matching roughly what a
       3-column x 250px card grid needs - keeps the column as wide as the data-grid tabs
       get it, without touching .user-layout-grid itself. */
    min-width: 830px;
}

.suggestions-toolbar[b-7jzwaabowk] {
    flex-shrink: 0;
    background: #fff;
    padding-block: .25rem;
    padding-bottom: .75rem;
    margin-bottom: .75rem;
    border-bottom: 1px solid #e0e0e0;
}

.suggestions-scroll-area[b-7jzwaabowk] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
}

.suggestion-cards-grid[b-7jzwaabowk] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr));
    gap: 1.75rem 1.5rem;
    padding: .5rem 1rem 1.5rem;
    box-sizing: border-box;
}

.suggestion-card[b-7jzwaabowk] {
    position: relative; /* so the ribbon/rating badge below anchor to the whole card, not just the clipped image */
    border-radius: .5rem;
    box-shadow: 0 1px 4px rgba(0,0,0,.12);
    background: #fff;
}

/* Thin, unclipped shell sized to the image's own 16:9 box - it exists purely so the
   ribbon/rating badge below can position themselves exactly against the image's real
   top/bottom edges (top:0/bottom:0 + a 50% transform), with no clipping in the way. */
.suggestion-card-bg[b-7jzwaabowk] {
    position: relative;
    aspect-ratio: 16 / 9;
}

/* The actual photo lives in its own clipped layer, one level in, so it can round its
   corners and clip its hover-zoom without also clipping the ribbon/rating badge. */
.suggestion-card-image[b-7jzwaabowk] {
    position: absolute;
    inset: 0;
    background-color: #1a1a1a;
    background-size: cover;
    background-position: center;
    overflow: hidden;
    border-top-left-radius: .5rem;
    border-top-right-radius: .5rem;
}

    .suggestion-card-image[b-7jzwaabowk]::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(180deg, rgba(0,0,0,0) 55%, rgba(0,0,0,.75) 100%);
        transition: transform .4s ease;
    }

.suggestion-card:hover .suggestion-card-image[b-7jzwaabowk]::after {
    transform: scale(1.05);
}

/* .room-ribbon-text is shared globally with View.razor's room card (app.css).
   CSS isolation scopes this override to elements User.razor itself renders, so it
   only shrinks the label on these smaller suggestion cards, not the main room list. */
.suggestion-card .room-ribbon-text[b-7jzwaabowk] {
    font-size: .85rem;
}

/* Straddle the image's top edge exactly (regardless of the ribbon's own height),
   same trick used below for the rating badge on the bottom edge. */
.suggestion-card .room-ribbon[b-7jzwaabowk] {
    top: 0;
    transform: translateY(-50%);
}

/* app.css's shared ribbon-shake keyframe only wiggles translate3d()/rotate() - applying
   it here would replace our translateY(-50%) baseline for the duration of the animation,
   making the ribbon visibly jump down to top:15px-equivalent and back. This local version
   keeps the same wiggle but folds the -50% offset into every step, so it shakes in place. */
@keyframes suggestion-ribbon-shake-b-7jzwaabowk {
    0% {
        transform: translateY(-50%) translate3d(0,0,0) rotate(0deg);
    }

    15% {
        transform: translateY(-50%) translate3d(-1px, 0, 0) rotate(-1deg);
    }

    30% {
        transform: translateY(-50%) translate3d(1px, 0, 0) rotate(1deg);
    }

    45% {
        transform: translateY(-50%) translate3d(-1px, 0, 0) rotate(-0.8deg);
    }

    60% {
        transform: translateY(-50%) translate3d(1px, 0, 0) rotate(0.8deg);
    }

    75% {
        transform: translateY(-50%) translate3d(-0.6px, 0, 0) rotate(-0.6deg);
    }

    100% {
        transform: translateY(-50%) translate3d(0,0,0) rotate(0deg);
    }
}

.suggestion-card:hover .room-ribbon[b-7jzwaabowk] {
    animation: suggestion-ribbon-shake-b-7jzwaabowk .6s ease-in-out both;
}

@media (prefers-reduced-motion: reduce) {
    .suggestion-card:hover .room-ribbon[b-7jzwaabowk] {
        animation: none;
    }
}

/* Now a plain footer icon-button (was a floating circle over the image). */
.suggestion-card-bookmark[b-7jzwaabowk] {
    border: none;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
    background: #eee;
    color: #555;
    display: grid;
    place-items: center;
    cursor: pointer;
    transition: background .2s, color .2s, transform .15s;
}

    .suggestion-card-bookmark:hover[b-7jzwaabowk] {
        transform: scale(1.08);
    }

    .suggestion-card-bookmark.active[b-7jzwaabowk] {
        background: var(--text-primary);
        color: #fff;
    }

.suggestion-card-rating[b-7jzwaabowk] {
    position: absolute;
    bottom: 0;
    left: .5rem;
    transform: translateY(25%); /* only a quarter of its own height pokes below the image edge */
    z-index: 150; /* above the .room-ribbon (z-index:100) so it's never tucked behind it */
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #f7f7f7;
    display: grid;
    place-items: center;
    box-shadow: 0 1px 4px rgba(0,0,0,.25);
}

/* Two columns: the info block (column 1 - right side in RTL) holds the two stacked
   lines; the toggle button (column 2 - left side) is the only other grid item, so it
   automatically centers across the row's full height via align-items:center, without
   needing an explicit row-span. */
.suggestion-card-footer[b-7jzwaabowk] {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: .25rem .5rem;
    padding: .6rem .25rem;
    font-size: .9rem;
    color: #444;
}

.suggestion-footer-info[b-7jzwaabowk] {
    display: flex;
    flex-direction: column;
    gap: .2rem;
    min-width: 0; /* allow the city/date text to ellipsis instead of stretching the column */
}

    .suggestion-footer-info > div[b-7jzwaabowk] {
        justify-content: flex-start;
    }

@media (prefers-reduced-motion: reduce) {
    .suggestion-card-image[b-7jzwaabowk]::after {
        transition: none;
    }
}
.profile-image-container[b-7jzwaabowk] {
    position: relative;
    display: inline-block;
    margin-inline: 30px;
    margin-bottom: 30px;
}

.fab-btn-edit-image[b-7jzwaabowk] {
    position: absolute;
    bottom: -9px;
    right: -9px;
    background: #1976d2;
    color: white;
    border: none;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    cursor: pointer;
    z-index: 2;
    transition: background 0.2s;
}



.fab-btn-approve-user[b-7jzwaabowk] {
    position: absolute;
    top: -9px;
    left: -9px;
    background: white;
    color: gold;
    border: none;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    cursor: pointer;
    z-index: 2;
    transition: background 0.2s;
}

    .fab-btn-approve-user:not(.approved):hover[b-7jzwaabowk] {
        background: black;
    }

.fab-btn-edit-image:hover[b-7jzwaabowk] {
    background: #1565c0;
}


.approved[b-7jzwaabowk] {
    background: gold;
    color: black;
    cursor: pointer;
}



.user-layout-grid[b-7jzwaabowk] {
    padding-block: 1rem;
    display: grid;
    grid-template-columns: auto 2fr; /* Left wider than right, adjust as needed */
    grid-template-rows: auto 1fr; /* Card takes needed height, tabs fill rest */
    gap: 2rem;
    height: 85vh;

}

.left-column[b-7jzwaabowk], .right-tabs[b-7jzwaabowk] {
    min-height: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.left-column[b-7jzwaabowk] {
    grid-row: 1 / span 2; /* Spans both rows */
    grid-column: 2 / 3;
    overflow: auto;
    display:flex;
    align-items:stretch; /* was "start", which on a column flex container constrains the
        cross-axis (width) - shrinking RadzenTabs (and the suggestion cards inside) to their
        own content width instead of filling the column, like the other tabs do. */
}

.right-card[b-7jzwaabowk] {
    grid-row: 1 / 2;
    grid-column: 1 / 2;
}

.right-tabs[b-7jzwaabowk] {
    grid-row: 2 / 3;
    grid-column: 1 / 2;
    min-height: 0;
    overflow: auto;
    display: flex;
    flex-direction: column;
}

.right-card .rz-card[b-7jzwaabowk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}



.save-changes[b-7jzwaabowk] {
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%) translateY(-40px); /* Center horizontally, slide up a bit */
    opacity: 0;
    pointer-events: none;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 1000;
}

    .save-changes.slide-in[b-7jzwaabowk] {
        transform: translateX(-50%) translateY(0);
        opacity: 1;
        pointer-events: auto;
        transition-delay: 0.25s;
    }


.rz-form-field[b-7jzwaabowk], .rz-form-field > .rz-form-field-content[b-7jzwaabowk] {
    width: 100% !important;
}


.armadil-avatar[b-7jzwaabowk] {
   
    position: absolute;
    left: -10px;
    bottom: -12px;
    z-index: 2;
    padding: 12px;
}

.speech-bubble[b-7jzwaabowk] {
    position: absolute;
    left: 110px;
    top: -10px;
    min-width: 120px;
    max-width: 180px;
    background: #fff;
    color: #1976d2; /* Vibrant blue */
    border-radius: 16px;
    padding: 8px 16px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    font-size: 1.1rem;
    font-family: 'bungee-regular', 'Fredoka', 'Segoe UI', Arial, sans-serif;
    font-weight: 700;
    border: 1px solid #eee;
    text-align: center;
    cursor: pointer;
    z-index: 3;
    transition: box-shadow 0.2s, transform 0.2s;
    text-shadow: 0 1px 2px rgba(25, 118, 210, 0.15), 0 0 1px #fff;
    letter-spacing: 0.5px;
    animation: bubble-pop-b-7jzwaabowk 1.2s cubic-bezier(0.4,0,0.2,1) 1;
    transition: opacity 0.4s cubic-bezier(0.4,0,0.2,1);
    opacity: 1;
    user-select: none;
    -webkit-user-select: none; /* For Safari */
    -ms-user-select: none; /* For IE/Edge */
}

    .speech-bubble.fade[b-7jzwaabowk] {
        opacity: 0;
    }

    .speech-bubble[b-7jzwaabowk]::after {
        content: "";
        position: absolute;
        left: -16px;
        bottom: 16px;
        width: 0;
        height: 0;
        border: 8px solid transparent;
        border-right: 16px solid #fff;
    }


    .speech-bubble:hover[b-7jzwaabowk] {
        box-shadow: 0 4px 16px rgba(0,0,0,0.15);
        background: #f5f5f5;
        color: #1565c0;
        transform: scale(1.05) rotate(-2deg);
    }

@keyframes bubble-pop-b-7jzwaabowk {
    0% {
        transform: scale(0.8);
        opacity: 0;
    }

    60% {
        transform: scale(1.1);
        opacity: 1;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}
/* /Components/Pages/View.razor.rz.scp.css */


body[b-9dp2gr0h53] {
}




.status-btn:hover[b-9dp2gr0h53] {
	text-decoration: underline;
}

/* Room cards pop in staggered by position (delay set inline per-card) when the
   list first renders or a filter reveals cards that weren't there before. */
.card-enter[b-9dp2gr0h53] {
	animation: card-pop-in-b-9dp2gr0h53 .5s cubic-bezier(.22,.85,.32,1) both;
}

@keyframes card-pop-in-b-9dp2gr0h53 {
	from {
		opacity: 0;
		transform: translateY(16px) scale(.96);
	}

	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@media (prefers-reduced-motion: reduce) {
	.card-enter[b-9dp2gr0h53] {
		animation: none;
	}
}

/* Filter count badge "ticks" - a quick scale+color pop - every time the
   filtered/total counts change. The @key on the span forces Blazor to mount a
   fresh element whenever the count changes, which is what replays this. */
.count-tick[b-9dp2gr0h53] {
	display: inline-block;
	animation: count-tick-b-9dp2gr0h53 .45s ease-out;
}

@keyframes count-tick-b-9dp2gr0h53 {
	0%, 100% {
		transform: scale(1);
	}

	35% {
		transform: scale(1.3);
		color: var(--text-primary);
	}

	70% {
		transform: scale(.94);
	}
}

@media (prefers-reduced-motion: reduce) {
	.count-tick[b-9dp2gr0h53] {
		animation: none;
	}
}

/* Room card layout: fixed height so background is visible */
.room-card[b-9dp2gr0h53] {
	display: flex;
	flex-direction: column;
	position: relative;
	height: 230px;
	overflow: hidden; /* clip background/overlay to corners below */
	/* Rounded only at the top, square at the bottom */
	border-top-left-radius: var(--bs-border-radius, .375rem);
	border-top-right-radius: var(--bs-border-radius, .375rem);
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}



	.room-card .card-body[b-9dp2gr0h53] {
		margin-top: auto;
		position: relative;
		z-index: 1;
	}

	/* Room card background image styling */
	.room-card.has-bg[b-9dp2gr0h53] {
		background-size: contain; /* show the whole image */
		background-position: center;
		background-repeat: no-repeat;
		background-color: #1a1a1a; /* letterbox area color */
		color: #fff;
		aspect-ratio: 16/9;
		background-size: contain;
	}


		/* zoomable image layer (inherits background from parent) */
		.room-card.has-bg[b-9dp2gr0h53]::after {
			content: "";
			position: absolute;
			inset: 0;
			background-image: inherit;
			background-position: inherit;
			background-repeat: inherit;
			background-size: inherit;
			transform-origin: center;
			transition: transform .4s ease, filter .4s ease;
			z-index: 0;
			pointer-events: none;
		}
		/* subtle gradient overlay above the image */
		.room-card.has-bg[b-9dp2gr0h53]::before {
			content: "";
			position: absolute;
			inset: 0;
			/*  background: linear-gradient(180deg, rgba(0,0,0,.1), rgba(0,0,0,.33));*/
			z-index: 1;
			pointer-events: none;
		}
		/* hover zoom/impact */
		.room-card.has-bg:hover[b-9dp2gr0h53]::after {
			transform: scale(1.08);
			filter: brightness(1.06) contrast(1.05);
		}

/* Top-left ribbon that exceeds the image bounds slightly */
.paper-clip[b-9dp2gr0h53] {
	position: absolute;
	top: 5px;
	right: -13px; /* exceed a bit outside */
	z-index: 100;
}

	.paper-clip.flipped[b-9dp2gr0h53] {
		display: none;
	}

	.paper-clip svg[b-9dp2gr0h53] {
		width: 48px;
		height: 48px;
		transform: rotate(-10deg);
		fill: rgba(0,0,0,0.15);
	}



.room-ribbon.flipped[b-9dp2gr0h53] {
	top: auto;
	bottom: 16px !important;
}

/* Actions area pinned to bottom inside the room-card */
.room-card-actions[b-9dp2gr0h53] {
	margin-top: auto; /* push to bottom */
	position: relative;
	z-index: 2; /* above overlay */
	padding: .5rem;
	background: rgba(0,0,0,.15);
	display: flex;
	flex-direction: column;
}

/* Tighten spacing in the card body to reduce bottom empty space */
.card .card-body[b-9dp2gr0h53] {
	padding: .5rem .75rem .5rem;
}

.card .card-title[b-9dp2gr0h53] {
	margin-bottom: .25rem;
}

.card .card-body p[b-9dp2gr0h53] {
	margin-bottom: .25rem;
}

.card .card-body > :last-child[b-9dp2gr0h53] {
	margin-bottom: 0;
}



svg[b-9dp2gr0h53] {
	fill: var(--text-primary);
	height: 24px;
	width: 24px;
	min-width: 24px;
	min-height: 24px;
}

a[b-9dp2gr0h53] {
	text-decoration: none;
	font-family: 'Lunasima', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

.radzen-file-input-preview[b-9dp2gr0h53],
.radzen-file-input-remove[b-9dp2gr0h53] {
	display: none !important;
}

.card-title[b-9dp2gr0h53] {
	font-family: 'Fredoka', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

.address[b-9dp2gr0h53] {
	font-size: 12px;
	margin: 0; /* remove extra paragraph margin to tighten bottom space */
}


.info svg[b-9dp2gr0h53] {
	fill: black;
}

.rz-panel-titlebar[b-9dp2gr0h53] {
	flex-direction: row-reverse;
	justify-content: right;
}


.region-children[disabled][b-9dp2gr0h53] {
	opacity: .4;
	pointer-events: none;
}


.city-room-count[b-9dp2gr0h53] {
	padding-inline-end: 75px;
}

/* Room tags bar sits over the image; no backdrop so domes stand alone */
.room-tags[b-9dp2gr0h53] {
	position: absolute;
	left: .25rem;
	bottom: .25rem;
	display: inline-flex;
	align-items: end;
	gap: .35rem;
	padding: .2rem .25rem;
	background: transparent;
	z-index: 3;
	flex-direction: row;
}

.ratings[b-9dp2gr0h53] {
	position: absolute;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	top: 0;
	display: flex;
	flex-direction: column;
	align-items: end;
	gap: .35rem;
	padding: .3rem .3rem;
	background: #f7f7f7;
	border-radius: 8px;
	z-index: 5;
	outline: 2px solid transparent;
	transition: outline-color 0.3s, outline-width 0.3s;
}

	.ratings svg[b-9dp2gr0h53] {
		height: 32px;
		width: 32px;
	}


	.ratings:hover[b-9dp2gr0h53] {
		outline-color: black;
	}

	.ratings.SuperLike svg[b-9dp2gr0h53] {
		animation: bubble-breath-b-9dp2gr0h53 1.2s infinite cubic-bezier(.4,0,.2,1);
		transition: filter 0.3s;
		border-radius: 8px;
		border: solid 2px darkgreen;
	}

@keyframes bubble-breath-b-9dp2gr0h53 {
	0% {
		transform: scale(1);
	}

	40% {
		transform: scale(1.14);
	}

	60% {
		transform: scale(1.06);
	}

	100% {
		transform: scale(1);
	}
}


.card-user-overlay[b-9dp2gr0h53] {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
	border-radius: inherit;
	background-color: rgba(130,130,130,0.25);
}

	.card-user-overlay svg[b-9dp2gr0h53] {
		width: 250px;
		height: 250px;
		fill: var(--bg-min-players);
		opacity: 0.45;
		filter: drop-shadow(0 2px 8px rgba(0,0,0,0.25));
	}

.done[b-9dp2gr0h53] {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(40, 40, 40, 0.15); /* semi-opaque overlay */
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
	border-radius: inherit;
}

.card-user-rating-overlap[b-9dp2gr0h53] {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
}

	.card-user-rating-overlap .avatar[b-9dp2gr0h53] {
		width: 64px;
		height: 64px;
		border-radius: 50%;
		object-fit: cover;
		opacity: 0.5;
		box-shadow: 0 2px 8px rgba(0,0,0,0.15);
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
	}

.rating-svg-overlap[b-9dp2gr0h53] {
	position: absolute;
	top: 8px;
	left: 8px;
	width: 48px;
	height: 48px;
	z-index: 2;
	opacity: 0.85;
	fill: white;
	filter: drop-shadow(0 2px 8px rgba(0,0,0,0.25));
}

	.rating-svg-overlap.like[b-9dp2gr0h53] {
		fill: var(--rz-success-darker) !important;
	}

	.rating-svg-overlap.dislike[b-9dp2gr0h53] {
		fill: var(--rz-danger-darker) !important;
	}

	.rating-svg-overlap.neutral[b-9dp2gr0h53] {
		fill: var(--rz-secondary-darker) !important;
	}

	.rating-svg-overlap.none[b-9dp2gr0h53] {
		fill: black !important;
	}


.room-tags-min[b-9dp2gr0h53] {
	position: absolute;
	right: .25rem;
	bottom: .25rem;
	display: inline-flex;
	align-items: end;
	gap: .35rem;
	padding: .2rem .25rem;
	background: transparent;
	z-index: 3;
	flex-direction: column;
}

.room-tags-fear[b-9dp2gr0h53] {
	position: absolute;
	left: .25rem;
	top: .25rem;
	display: inline-flex;
	align-items: end;
	gap: .35rem;
	padding: .2rem .25rem;
	background: transparent;
	z-index: 3;
	flex-direction: column;
}

.fear[b-9dp2gr0h53] {
	color: var(--bg-fear);
}

.min-players[b-9dp2gr0h53] {
	color: var(--bg-min-players);
}


/* “Dome” icon holder: almost full circle with a flat bottom */
.tag-container[b-9dp2gr0h53] {
	/* Tweak these to control size/flatness */
	--tag-diameter: 46px; /* circle diameter */
	--tag-height: 32px; /* visible height (smaller -> flatter bottom) */

	position: relative;
	width: var(--tag-diameter);
	height: var(--tag-height);
	overflow: hidden; /* clip the bottom to a straight line */
	display: grid;
	place-items: center;
	align-items: center;
	justify-content: center;
}






.room-tags .tag-container[b-9dp2gr0h53]::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	z-index: 5;
	margin: 0 auto;
	width: var(--tag-diameter);
	height: var(--tag-diameter);
	background: var(--text-primary);
	border-radius: 50%; /* full circle */
	top: calc(-0.5 * (var(--tag-diameter) - var(--tag-height))); /* raise circle so bottom is cut */
	filter: drop-shadow(0 2px 4px rgba(0,0,0,.35));
	transition: background-color .25s ease;
}

.room-tags .gold[b-9dp2gr0h53]::before {
	background: gold !important;
}

.room-tags-min .tag-container[b-9dp2gr0h53]::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: var(--tag-diameter);
	height: var(--tag-diameter);
	background: var(--bg-min-players);
	border-radius: 50%; /* full circle */
	top: calc(-0.5 * (var(--tag-diameter) - var(--tag-height))); /* raise circle so bottom is cut */
	filter: drop-shadow(0 2px 4px rgba(0,0,0,.35));
	transition: background-color .25s ease;
}

.room-tags-fear .tag-container[b-9dp2gr0h53]::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: var(--tag-diameter);
	height: var(--tag-diameter);
	background: var(--bg-fear);
	border-radius: 50%; /* full circle */
	top: calc(-0.5 * (var(--tag-diameter) - var(--tag-height))); /* raise circle so bottom is cut */
	filter: drop-shadow(0 2px 4px rgba(0,0,0,.35));
	transition: background-color .25s ease;
}

/* Icon inside the dome */
.tag-container svg[b-9dp2gr0h53] {
	position: relative; /* above the pseudo-circle */
	z-index: 5;
	width: 25px;
	height: 25px;
	fill: white;
}

.room-tags svg[b-9dp2gr0h53] {
	fill: black;
}

.tag-container span[b-9dp2gr0h53] {
	position: relative; /* above the pseudo-circle */
	z-index: 5;
	width: 25px;
	height: 25px;
	color: black;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: bold;
	font-family: 'Lunasima', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}



/* Optional: hover pop */
.tag-container:hover[b-9dp2gr0h53]::before {
	background-color: color-mix(in srgb, var(--text-primary) 85%, white 15%);
}



.tag-toggle svg[b-9dp2gr0h53] {
	fill: black;
}

.rz-button-md[b-9dp2gr0h53] {
	padding: 4px !important;
}










.card-flip-container[b-9dp2gr0h53] {
	position: relative;
	height: 230px;
}

	.card-flip-container.close[b-9dp2gr0h53] {
		height: 120px;
	}


.card-flip[b-9dp2gr0h53] {
	transition: transform 0.6s cubic-bezier(.4,0,.2,1);
	transform-style: preserve-3d;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	backface-visibility: hidden;
}

.card-flip-front[b-9dp2gr0h53] {
	z-index: 2;
	background: inherit;
}

.card-flip-back[b-9dp2gr0h53] {
	transform: rotateY(180deg);
	z-index: 1;
	background: #fff;
	/* .room-card is a column flex container with no align-items of its own, so its
	   children stretch to fill the full width by default - that's right for the front
	   face's image, but on the back face it forced the ratings editor to stretch edge
	   to edge too. Center instead, so the editor sizes to its own content. */
	align-items: center;
	justify-content: center;
}

.room-card.card-flip-back[b-9dp2gr0h53]::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,.6);
	z-index: 1;
	pointer-events: none;
}

.rate-toggle[b-9dp2gr0h53] {
	width: 100px !important;
}

.ratings-group[b-9dp2gr0h53] {
	display: grid;
	grid-template-columns: 1fr 1fr;
}


.ratings-editor[b-9dp2gr0h53] {
	z-index: 100;
	padding-block: 0.5rem;
	padding-inline: 1rem;
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
	position: relative;
	justify-content: center;
	align-items: center;
}

/* Card back-face rows (played/hide/add-to-list): each row is its own flex line so the
   icon, label and switch always align to a common vertical center - the previous
   3-parallel-column layout relied on matching heights across separate stacks, which
   drifted out of alignment whenever icon/label/switch sizes didn't line up exactly. */
.rating-switch-list[b-9dp2gr0h53] {
	display: flex;
	flex-direction: column;
	gap: .5rem;
}

.rating-switch-row[b-9dp2gr0h53] {
	display: flex;
	align-items: center;
	gap: .5rem;
}

.rating-switch-icon[b-9dp2gr0h53] {
	display: inline-flex;
	align-items: center;
	flex-shrink: 0;
}

	.rating-switch-icon svg[b-9dp2gr0h53] {
		width: 22px;
		height: 22px;
	}

.rating-switch-label[b-9dp2gr0h53] {
	flex: 1;
	font-size: .85rem;
	text-align: right;
}

.rating-editor-na[b-9dp2gr0h53] {
	z-index: 100;
	padding-block: 0.5rem;
	padding-inline: 1rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 1rem;
}

.editor-save[b-9dp2gr0h53] {
	padding-top: 1rem;
	align-self: center;
}

.card-flip-container.flipped .card-flip-front[b-9dp2gr0h53] {
	transform: rotateY(180deg);
}

.card-flip-container.flipped .card-flip-back[b-9dp2gr0h53] {
	transform: rotateY(0deg);
}

.card-flip-back.card.room-card.has-bg[b-9dp2gr0h53] {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-content: space-between;
	min-height: 100%; /* Ensure it fills the available space */
}


.personal-switches-grid[b-9dp2gr0h53] {
	display: grid;
	grid-template-columns: 24px max-content max-content 1fr;
	grid-template-rows: repeat(3, auto);
	align-items: center;
	justify-content: center;
}

.switch-svg[b-9dp2gr0h53], .switch-label[b-9dp2gr0h53], .switch-control[b-9dp2gr0h53] {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 12px;
}


	.switch-svg svg[b-9dp2gr0h53] {
		height: 24px;
		width: 24px;
		margin-bottom: 0;
	}

.switch-label[b-9dp2gr0h53] {
	font-size: 0.85rem;
}

	.switch-label span[b-9dp2gr0h53] {
		text-align: right;
		padding-inline-end: 2px;
	}

.switch-control[b-9dp2gr0h53] {
	align-items: flex-end;
}


.user-tag-ribbon[b-9dp2gr0h53] {
	position: absolute;
	top: 56px; /* adjust to place under room name ribbon */
	right: -16px;
	display: flex;
	align-items: center;
	gap: 8px;
	height: 40px;
	background: #fff;
	border-radius: 28px;
	border: 3px solid #2d5cae;
	box-shadow: 0 2px 8px rgba(0,0,0,0.08);
	padding: 0 18px 0 12px;
	z-index: 5;
}

	.user-tag-ribbon.close[b-9dp2gr0h53] {
		padding: 0 18px 0 0px;
	}


.user-tag-img[b-9dp2gr0h53] {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid #2d5cae;
	background: #fff;
	margin-right: -18px;
	box-shadow: 0 1px 4px rgba(0,0,0,0.07);
}

.user-tag-svg[b-9dp2gr0h53] {
	width: 30px;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
}

	.user-tag-svg.like[b-9dp2gr0h53] {
		fill: var(--rz-success-darker) !important;
	}

	.user-tag-svg.dislike[b-9dp2gr0h53] {
		fill: var(--rz-danger-darker) !important;
	}

	.user-tag-svg.neutral[b-9dp2gr0h53] {
		fill: var(--rz-secondary-darker) !important;
	}

	.user-tag-svg.none[b-9dp2gr0h53] {
		fill: var(--rz-dark) !important;
	}


/*.filters-panel {*/
/* Adjust top to match your sticky offset (e.g., 2.65rem) */
/*top: 2.65rem;*/
/* Ensure the panel never exceeds the viewport height */
/*max-height: calc(85vh - 2.65rem - 1rem);*/ /* 1rem for margin/padding if needed */
/*overflow-y: auto;*/
/* Optional: for smoother scrolling on touch devices */
/*-webkit-overflow-scrolling: touch;
}*/


@media (max-width: 767px) {

	.filters-panel[b-9dp2gr0h53] {
		z-index: 0;
	}
}


.tag-popup-overlay[b-9dp2gr0h53] {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,0.08);
	z-index: 2999;
	display: flex;
	align-items: center;
	justify-content: center;
}

.tag-popup[b-9dp2gr0h53] {
	background: linear-gradient(135deg, #eceff1 0%, #d3d6db 100%);
	color: #222;
	border-radius: 16px;
	box-shadow: 0 8px 32px rgba(0,0,0,0.18), 0 1.5px 6px rgba(0,0,0,0.10);
	padding: 1.5rem 2.2rem;
	min-width: 220px;
	max-width: 45vw;
	max-height: 60vh;
	overflow: auto;
	font-size: 1.1rem;
	position: relative;
	border: 1px solid #e0e0e0;
}

.tag-popup-title[b-9dp2gr0h53] {
	font-size: 1.25rem;
	font-weight: 700;
	margin-bottom: 0.5rem;
	color: #222;
	letter-spacing: 0.01em;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.tag-popup-tooltip[b-9dp2gr0h53] {
	font-size: 1rem;
	color: #555;
	opacity: 0.92;
	line-height: 1.5;
	font-weight: 400;
	align-items: center;
	justify-content: center;
	text-align: center;
}


.company-branch-filters[b-9dp2gr0h53] {
	position: absolute;
	left: 50%;
	top: 73px;
	transform: translateX(-50%);
	font-family: 'Fredoka', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}


.ratings-filter[b-9dp2gr0h53] {
	border-radius: 25%;
	border: 1px solid black;
	padding: 2px;
}



	.ratings-filter.SuperLike[b-9dp2gr0h53] {
		animation: bubble-breath-b-9dp2gr0h53 1.2s infinite cubic-bezier(.4,0,.2,1);
		transition: filter 0.3s;
		border-radius: 8px;
		border: solid 2px darkgreen;
	}
