@import '_content/Blazored.Modal/Blazored.Modal.bundle.scp.css';
@import '_content/BootstrapBlazor/BootstrapBlazor.bundle.scp.css';

/* _content/BeautySalon.Web/Pages/Facebook.razor.rz.scp.css */
/* _content/BeautySalon.Web/Pages/Index.razor.rz.scp.css */

/* _content/BeautySalon.Web/Pages/Login.razor.rz.scp.css */
.login-container[b-9xdx6u3j2q] {
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}

/* _content/BeautySalon.Web/Pages/Order.razor.rz.scp.css */
/* _content/BeautySalon.Web/Shared/Components/AppointmentCard.razor.rz.scp.css */
.appointment-card-container[b-857ucn6i3d] {
    display: flex;
    width: 350px;
    font-family: Roboto;
    background-color: #FFF;
    border: 1px solid var(--dark-grey-color);
    padding: 15px;
    border-radius: 10px;
    box-shadow: 0px 0px 0.9px rgba(0, 0, 0, 0.003), 0px 0px 2.3px rgba(0, 0, 0, 0.004), 0px 0px 4.6px rgba(0, 0, 0, 0.006), 0px 0px 9.5px rgba(0, 0, 0, 0.007), 0px 0px 26px rgba(0, 0, 0, 0.01);
    cursor: pointer;
    transition: transform 0.3s ease-in-out;
    position: relative;
}

    .appointment-card-container:active[b-857ucn6i3d] {
        transform: scale(0.90);
    }

.appointment-card-image-wrapper[b-857ucn6i3d] {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .appointment-card-image-wrapper > img[b-857ucn6i3d] {
        width: 100px;
        height: 100px;
        border-radius: 7px;
        object-fit: cover;
    }

.appointment-card-content-wrapper[b-857ucn6i3d] {
    padding: 20px;
    position: relative;
}

.appointment-time[b-857ucn6i3d] {
    font-weight: bold;
}

.appointment-service-name-wrapper[b-857ucn6i3d] {
    font-size: 0.9rem;
    font-style: italic;
}

#selected-appointment[b-857ucn6i3d] {
    border: 2px solid var(--dark-brown-color);
}

.checkmark[b-857ucn6i3d] {
    color: white;
    background-color: var(--dark-brown-color);
    padding: 5px;
}

@media (max-width: 768px) {
    .appointment-card-container[b-857ucn6i3d] {
        width: unset;
    }
}
/* _content/BeautySalon.Web/Shared/Components/AppointmentManagerCard.razor.rz.scp.css */
.appointment-manager-card-header[b-3zwir708zy],
.appointment-card-row[b-3zwir708zy] {
    grid-template-columns: 0.2fr 0.6fr 0.4fr 0.4fr 0.4fr 0.8fr 0.6fr;
}

.appointment-manager-card[b-3zwir708zy] {
    margin-bottom: 10px;
}

.appointment-manager-card-header[b-3zwir708zy] {
    box-shadow: 0px -0px 8px rgba(3, 7, 18, 0.00), 0px -1px 31px rgba(3, 7, 18, 0.01), 0px -2px 71px rgba(3, 7, 18, 0.01), 0px -3px 125px rgba(3, 7, 18, 0.02), 0px -5px 196px rgba(3, 7, 18, 0.02);
    border-radius: 7px;
    padding: 10px;
    display: grid;
    align-items: center;
    gap: 10px;
    margin-bottom: 5px;
    background-color: var(--main-color);
    cursor: pointer;
}

.appointment-manager-card-header-content-wrapper[b-3zwir708zy] {
    font-weight: 600;
}

.appointment-manager-card-content[b-3zwir708zy] {
    display: grid;
    row-gap: 7px;
    margin-bottom: 10px;
}

.appointment-card-row[b-3zwir708zy] {
    display: grid;
    align-items: center;
    gap: 10px;
    background: #fff;
    border-radius: 7px;
    padding: 10px;
    box-shadow: 0px -0px 8px rgba(3, 7, 18, 0.00), 0px -1px 31px rgba(3, 7, 18, 0.01), 0px -2px 71px rgba(3, 7, 18, 0.01), 0px -3px 125px rgba(3, 7, 18, 0.02), 0px -5px 196px rgba(3, 7, 18, 0.02);
}

.appointment-editor-button-wrapper[b-3zwir708zy] {
    display: flex;
    flex-direction: row;
    height: 100%;
}

.view-appointment-button[b-3zwir708zy] {
    font-size: 0.8rem;
    font-weight: 600;
    margin-right: 7px;
}

.appointment-action-button[b-3zwir708zy] {
    width: 35px;
    height: 100%;
}

    .appointment-action-button > i[b-3zwir708zy] {
        margin-right: 0px;
        padding: 2px;
    }

.view-appointment-button[b-3zwir708zy], .appointment-action-button[b-3zwir708zy] {
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
    padding: 10px;
    border-radius: 7px;
    background-color: #F8F7F6;
}
/* _content/BeautySalon.Web/Shared/Components/BreadcrumbGrid.razor.rz.scp.css */
.breadcrumb-link[b-uv2vh0mu2l] {
    border: none;
    background: none;
    font-size: 1.2rem;
    margin-bottom: 1vh;
    color: rgb(192, 190, 187);
    font-weight: revert;
}

    .breadcrumb-link:hover[b-uv2vh0mu2l] {
        text-decoration: underline;
        cursor: pointer;
    }
    .breadcrumb-link.not-clickable:hover[b-uv2vh0mu2l]{
        text-decoration: none;
        cursor: default;
    }

.breadcrumb-item.active > button[b-uv2vh0mu2l] {
    font-weight: 600;
    color: var(--dark-brown-color);
}

.breadcrumb-container .breadcrumb-item:first-child .breadcrumb-link[b-uv2vh0mu2l] {
    padding-left: 0;
}

@media(max-width: 768px) {
    .breadcrumb-link[b-uv2vh0mu2l] {
        font-size: 1.1rem;
    }
}
/* _content/BeautySalon.Web/Shared/Components/Containers/AdminContainer.razor.rz.scp.css */
.appointment-manager-section[b-1eu740cugr] {
    display: flex;
    flex-direction: column;
    width: 100%;
    background-color: #F8F7F6;
    padding: 40px;
    border-radius: 10px;
    font-family: Roboto;
    box-shadow: 0px 0px 8.3px rgba(0, 0, 0, 0.014), 0px 0px 20px rgba(0, 0, 0, 0.02), 0px 0px 37.7px rgba(0, 0, 0, 0.025), 0px 0px 67.2px rgba(0, 0, 0, 0.03), 0px 0px 125.8px rgba(0, 0, 0, 0.036), 0px 0px 301px rgba(0, 0, 0, 0.05);
}

.appointment-manager-header[b-1eu740cugr] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

.appointment-manager-header-content> h3[b-1eu740cugr]{
    font-weight: 600;
}

.add-appointment-button[b-1eu740cugr], .action-button[b-1eu740cugr] {
    border-radius: 7px;
    font-size: 0.9rem;
    border: none;
    width: fit-content;
    box-shadow: 0px -0px 8px rgba(3, 7, 18, 0.00), 0px -1px 31px rgba(3, 7, 18, 0.01), 0px -2px 71px rgba(3, 7, 18, 0.01), 0px -3px 125px rgba(3, 7, 18, 0.02), 0px -5px 196px rgba(3, 7, 18, 0.02);
}

i[b-1eu740cugr] {
    margin-right: 5px;
}

.add-appointment-button[b-1eu740cugr] {
    padding: 5px 20px 5px 20px;
    margin-left: 5px;
    background: var(--dark-brown-color);
    color: #fff;
}

.action-button[b-1eu740cugr] {
    background: #fff;
    padding: 5px 20px 5px 20px;
}

.appointment-manager-filter-wrapper[b-1eu740cugr] {
    display: flex;
    padding: 5px;
    border-radius: 7px;
    box-shadow: 0px 0px 0.9px rgba(0, 0, 0, 0.022), 0px 0px 2.1px rgba(0, 0, 0, 0.032), 0px 0px 3.9px rgba(0, 0, 0, 0.04), 0px 0px 6.9px rgba(0, 0, 0, 0.048), 0px 0px 13px rgba(0, 0, 0, 0.058), 0px 0px 31px rgba(0, 0, 0, 0.08);
}

.appointment-manager-filter-wrapper > *:not(:last-child)[b-1eu740cugr] {
    margin-right: 5px;
}

.search-input-wrapper[b-1eu740cugr] {
    background: #fff;
    border-radius: 7px;
    align-content: center;
    padding: 5px 5px 5px 10px;
    flex: 1;
}

.search-input-wrapper > input[b-1eu740cugr]{
    border: none;
    font-size: 0.8rem;
}

.appointment-manager-table-container[b-1eu740cugr] {
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 10px;
    margin-top: 30px;
}

.appointment-manager-table-header[b-1eu740cugr],
.appointment-card-row[b-1eu740cugr] {
    grid-template-columns: 0.2fr 0.6fr 0.4fr 0.4fr 0.4fr 0.8fr 0.6fr;
}

.appointment-manager-table-header[b-1eu740cugr] {
    display: grid;
    align-items: center;
    gap: 10px;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 10px;
}




/* _content/BeautySalon.Web/Shared/Components/Containers/AppointmentsContainer.razor.rz.scp.css */
.appointments-container[b-rkyrogn8bj] {
    display: flex;
    justify-content: center;
    padding: 20px;
    width: 100%;
}

.appointment-dates[b-rkyrogn8bj] {
    display: flex;
    flex-direction: column;
    gap: 2vh;
    margin-right: 100px;
}

    .appointment-dates > h3[b-rkyrogn8bj] {
        font-size: var(--main-font-size);
        font-weight: 600;
    }

.appointment-details[b-rkyrogn8bj] {
    display: flex;
    width: fit-content;
    height: fit-content;
}


@media (max-width: 768px) {
    .appointments-container[b-rkyrogn8bj] {
        display: flex;
        flex-direction: column-reverse;
        padding: unset;
    }

    .appointment-details[b-rkyrogn8bj] {
        margin-bottom: var(--main-margin-bottom);
    }

    .appointment-dates[b-rkyrogn8bj] {
        margin-right: unset;
    }
}
/* _content/BeautySalon.Web/Shared/Components/Containers/ForgetPasswordContainer.razor.rz.scp.css */
.forgetpassword-section[b-fep3g9ppy2] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    font-family: Roboto;
    align-items: center;
    text-align: center;
    width: 450px;
}

.forgetpassword-container > *[b-fep3g9ppy2] {
    margin-bottom: 20px;
}

.input[b-fep3g9ppy2] {
    width: 100%;
    height: 4vh;
    border: none;
    border-radius: 5px;
    background: #ebe3df;
    margin-top: 10px;
    padding: 20px;
}

.password[b-fep3g9ppy2] {
    align-self: flex-end;
    font-weight: bold;
}

.button-wrapper > button[b-fep3g9ppy2] {
    width: 100%;
    height: 5vh;
    border-radius: 5px;
    border: 1px solid var(--dark-grey-color);
    background: var(--dark-brown-color);
    color: white;
    font-weight: bold;
    font-size: 1.2rem;
}

@media(max-width: 768px) {
    .forgetpassword-section[b-fep3g9ppy2] {
        width: 100%;
        padding: 20px;
    }

    .button-wrapper > button[b-fep3g9ppy2] {
        height: 50px;
    }
}
/* _content/BeautySalon.Web/Shared/Components/Containers/HeaderContainer.razor.rz.scp.css */
.header-section[b-533fjt8gwo] {
	height: 100vh;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.header-container[b-533fjt8gwo] {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	position: relative;
}

.header-container-content[b-533fjt8gwo] {
	position: absolute;
	left: 30%;
	transform: translateX(-40%);
	font-size: clamp(3rem, 13vw, 9rem);
	width: 60vw;
	max-width: 700px;
	z-index: 999;
	text-align: left;
}

	.header-container-content > p[b-533fjt8gwo] {
		margin: 0;
		line-height: 0.8em;
	}

.header-section-img-container[b-533fjt8gwo] {
	position: relative;
	left: 20%;
}

	.header-section-img-container[b-533fjt8gwo]::before {
		content: "";
		position: absolute;
		top: -2px;
		right: 0;
		bottom: 0;
		outline: 1px solid var(--dark-grey-color);
		outline-offset: 1px;
		border-radius: 67% 33% 65% 34% / 60% 33% 67% 40%;
		left: 10px;
		transform: rotate(-5deg);
		box-sizing: border-box;
		z-index: 1;
	}

.hero-image[b-533fjt8gwo] {
	height: 60vw;
	min-height: 200px;
	max-height: 650px;
	border-radius: 67% 33% 65% 34% / 60% 33% 67% 40%;
	position: relative;
	z-index: 0;
	box-shadow: 0px 0px 1px -8px rgba(0, 0, 0, 0.02), 0px 0px 2.3px -8px rgba(0, 0, 0, 0.028), 0px 0px 4.4px -8px rgba(0, 0, 0, 0.035), 0px 0px 7.8px -8px rgba(0, 0, 0, 0.042), 0px 0px 14.6px -8px rgba(0, 0, 0, 0.05), 0px 0px 35px -8px rgba(0, 0, 0, 0.07);
}

.scroll-down-wrapper[b-533fjt8gwo] {
	display: flex;
	align-items: center;
	width: fit-content;
	padding: 20px 5px;
	border-radius: 10px;
	transition: color 0.3s ease-in-out;
}

	.scroll-down-wrapper:hover[b-533fjt8gwo] {
		cursor: pointer;
		color: var(--hover-color);
		filter: brightness(0) saturate(100%) invert(67%) sepia(11%) saturate(2000%) hue-rotate(340deg) brightness(90%) contrast(90%);
	}

	.scroll-down-wrapper > p[b-533fjt8gwo] {
		font-family: Roboto;
		font-size: 20px;
		margin-right: -15px;
		transform: rotate(-90deg) translate(0, 0);
		backface-visibility: hidden;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}


.scroll-down-icon-wrapper[b-533fjt8gwo] {
	display: flex;
	align-items: flex-end;
}

	.scroll-down-icon-wrapper > img[b-533fjt8gwo] {
		animation: bounce-b-533fjt8gwo 4s ease-in-out infinite;
		transition: transform 0.5s ease-in-out;
	}


@keyframes bounce-b-533fjt8gwo {
	0%, 20%, 100% {
		transform: translateY(0) rotate(90deg);
	}

	10% {
		transform: translateY(20px) rotate(90deg);
	}
}

.welcome-section[b-533fjt8gwo] {
	position: relative;
	margin-bottom: var(--container-margin-bottom);
}

	.welcome-section > img[b-533fjt8gwo] {
		width: 100%;
		height: 30vw;
		min-height: 500px;
		border-radius: 35px;
		object-fit: cover;
		object-position: top;
		opacity: 0.9;
	}

.welcome-container[b-533fjt8gwo] {
	position: absolute;
	top: 40%;
	left: 75%;
	transform: translate(-50%, -50%);
}

.welcome-header-wrapper > p[b-533fjt8gwo] {
	font-size: var(--main-font-size);
	margin-bottom: 2vh;
	line-height: initial;
}

.welcome-content-wrapper[b-533fjt8gwo] {
	font-family: Roboto;
	min-width: 35vh;
	position: relative;
}

	.welcome-content-wrapper[b-533fjt8gwo]::after {
		content: "";
		display: block;
		width: 250px;
		height: 4px;
		background-color: var(--dark-grey-color);
		position: absolute;
		bottom: -8vh;
		left: 0;
		border-radius: 7px;
	}

@media (max-width: 768px) {
	.header-section[b-533fjt8gwo] {
		height: 30vh;
	}

		.header-section-img-container > img[b-533fjt8gwo] {
			height: 200px;
		}

	.scroll-down-wrapper[b-533fjt8gwo] {
		display: none;
	}


	.welcome-section[b-533fjt8gwo] {
		display: none;
	}
}
/* _content/BeautySalon.Web/Shared/Components/Containers/InfoContainer.razor.rz.scp.css */
/*--------------------Info------------------------------------------*/

.info-section[b-1hnrarxbj8] {
    display: flex;
    margin-bottom: var(--container-margin-bottom);
}

.info-details-wrapper[b-1hnrarxbj8] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    flex: 1;
    justify-content: center;
}

.info-details-header[b-1hnrarxbj8] {
    font-size: var(--main-font-size);
    margin-bottom: var(--main-margin-bottom);
}

.info-details-content[b-1hnrarxbj8] {
    width: 400px;
    line-height: 1.8;
    font-family: Roboto;
    margin-bottom: 3vh;
}

.info-details-button-wrapper[b-1hnrarxbj8] {
    display: flex;
    align-items: center;
    font-family: Roboto;
}

    .info-details-button-wrapper > img[b-1hnrarxbj8] {
        margin-left: 10px;
    }

.info-details-img-wrapper[b-1hnrarxbj8] {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    margin-right: 2vw;
}

    .info-details-img-wrapper img[b-1hnrarxbj8] {
        max-width: 100%;
        box-shadow: 0px 0px 1px -8px rgba(0, 0, 0, 0.02), 0px 0px 2.3px -8px rgba(0, 0, 0, 0.028), 0px 0px 4.4px -8px rgba(0, 0, 0, 0.035), 0px 0px 7.8px -8px rgba(0, 0, 0, 0.042), 0px 0px 14.6px -8px rgba(0, 0, 0, 0.05), 0px 0px 35px -8px rgba(0, 0, 0, 0.07);
    }

.info-details-img-wrapper[b-1hnrarxbj8] {
    position: relative;
    width: 350px;
    height: 600px;
}

    .info-details-img-wrapper[b-1hnrarxbj8]::before {
        content: "";
        position: absolute;
        top: -40px;
        left: -40px;
        right: 0;
        bottom: 0px;
        border: 1px solid var(--dark-grey-color);
        transform: rotate(15deg);
        box-sizing: border-box;
        border-radius: 50% 50% 20% 20% / 30% 30% 0% 0%;
        z-index: 1;
    }


    .info-details-img-wrapper > img[b-1hnrarxbj8] {
        width: 350px;
        height: 550px;
        object-fit: cover;
        border-radius: 50% 50% 20% 20% / 30% 30% 0% 0%;
    }


@media (max-width: 768px) {
    .info-section[b-1hnrarxbj8] {
        margin-bottom: var(--container-mobil-margin-bottom);
    }

    .info-details-img-wrapper[b-1hnrarxbj8] {
        display: none;
    }

    .info-details-content[b-1hnrarxbj8], .info-details-button-wrapper[b-1hnrarxbj8] {
        font-size: var(--mobil-p-size);
    }

    .info-details-content[b-1hnrarxbj8] {
        width: 90%;
    }
}
/* _content/BeautySalon.Web/Shared/Components/Containers/LoginContainer.razor.rz.scp.css */
.login-section[b-atxvqcywpt] {
    font-family: Roboto;
    width: 450px;
    display: flex;
    flex-direction: column;
}

    .login-section > *[b-atxvqcywpt] {
        margin-bottom: 20px;
    }

.login-welcome-message[b-atxvqcywpt] {
    font-weight: bold;
    font-size: 1.6rem;
    margin-bottom: 10px;
}

.open-auth-button-wrapper[b-atxvqcywpt] {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
}

.open-auth-button[b-atxvqcywpt] {
    flex-grow: 1;
    margin-right: 20px;
}

    .open-auth-button:last-child[b-atxvqcywpt] {
        margin-right: 0;
    }

    .open-auth-button > button[b-atxvqcywpt] {
        display: flex;
        background: none;
        padding: 20px;
        border-radius: 5px;
        border: 1px solid var(--dark-grey-color);
        color: var(--dark-brown-color);
        width: 100%;
        height: 100%;
        font-size: 1.1rem;
        display: flex;
        justify-content: center;
        align-items: center;
        transition: background-color 0.3s;
    }

        .open-auth-button > button:hover[b-atxvqcywpt] {
            background-color: var(--grey-color);
        }

        .open-auth-button > button > i[b-atxvqcywpt] {
            margin-right: 10px;
        }

.login-content-wrapper > *[b-atxvqcywpt] {
    margin-bottom: 20px;
}

.login-input[b-atxvqcywpt] {
    width: 100%;
    border: none;
    border-radius: 5px;
    background: #f5f1ef;
    border: 1px solid var(--dark-grey-color);
    margin-top: 10px;
    padding: 12px;
}

.login-password-header[b-atxvqcywpt] {
    display: flex;
    justify-content: space-between;
}

.forgot-password[b-atxvqcywpt] {
    align-self: flex-end;
    font-weight: bold;
    cursor: pointer;
}

.login-button-wrapper > button[b-atxvqcywpt] {
    width: 100%;
    min-height: 50px;
    border-radius: 5px;
    border: 1px solid var(--dark-grey-color);
    background: var(--dark-brown-color);
    color: #FFF;
    font-weight: bold;
    font-size: 1.2rem;
    transition: background-color 0.3s;
}

    .login-button-wrapper > button:hover[b-atxvqcywpt] {
        background-color: var(--hover-color);
    }

.login-registration-wrapper[b-atxvqcywpt] {
    display: flex;
}

.login-registration[b-atxvqcywpt] {
    font-weight: bold;
    color: var(--dark-brown-color);
    text-decoration: none;
    margin-left: 10px;
}

.separator[b-atxvqcywpt] {
    background-color: #FFF;
    padding: 0 10px;
}


@media (max-width: 768px) {
    .login-section[b-atxvqcywpt] {
        width: 100%;
        background-color: unset;
        border: unset;
        box-shadow: unset;
    }

    .open-auth-button[b-atxvqcywpt], .login-section[b-atxvqcywpt] {
        font-size: 0.8rem;
    }

    .separator[b-atxvqcywpt] {
        background-color: var(--main-color);
    }
}
/* _content/BeautySalon.Web/Shared/Components/Containers/OrderContainer.razor.rz.scp.css */
.order-section[b-0z4al3gljs] {
	display: flex;
	justify-content: center;
	width: 100%;
	height: 100vh;

}

.full-width-bar[b-0z4al3gljs] {
	display: none;
}

.service-selector-wrapper[b-0z4al3gljs] {
	width: 100%;
	transition: width 0.7s ease-in-out;
	box-sizing: border-box;
	overflow: hidden;
}


@media(max-width: 768px) {
	.order-section[b-0z4al3gljs] {
		overflow-y: scroll;
	}
}
/* _content/BeautySalon.Web/Shared/Components/Containers/ProfilContainer.razor.rz.scp.css */
.profil-section[b-87a517hzd4] {
    display: flex;
    justify-content: center;
}

.profil-container[b-87a517hzd4] {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 20px;
    width: 100%;
}

.profil-info-content[b-87a517hzd4] {
    width: 300px;
}

.profil-info[b-87a517hzd4], .profil-notification-container[b-87a517hzd4], .profil-delete-container[b-87a517hzd4] {
    background-color: #fff;
    border: 1px solid var(--dark-grey-color);
    font-family: Roboto;
    display: flex;
    flex-direction: column;
    border-radius: 10px;
    height: fit-content;
    box-shadow: 0px -0px 8px rgba(3, 7, 18, 0.00), 0px -1px 31px rgba(3, 7, 18, 0.01), 0px -2px 71px rgba(3, 7, 18, 0.01), 0px -3px 125px rgba(3, 7, 18, 0.02), 0px -5px 196px rgba(3, 7, 18, 0.02);
}

.profil-header[b-87a517hzd4] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 20px;
    border-bottom: 1px solid var(--dark-grey-color);
}

    .profil-header > img[b-87a517hzd4] {
        width: 125px;
        object-fit: cover;
        border-radius: 50%;
        border: 1px solid var(--dark-grey-color);
    }

    .profil-header > a[b-87a517hzd4] {
        font-size: 0.9rem;
        color: var(--dark-brown-color);
    }

.profil-info-container[b-87a517hzd4] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 20px 0 10px 0;
    padding: 0px 20px 20px 20px;
    border-bottom: 1px solid var(--dark-grey-color);
}

.profil-info-content-wrapper p:first-child[b-87a517hzd4]{
    	font-weight: 600;

}

.profil-logout-wrapper[b-87a517hzd4] {
    padding: 10px 20px 20px 20px;
    display: flex;
    justify-content: center;
}

.logout-button[b-87a517hzd4], .delete-account-button[b-87a517hzd4] {
    color: var(--red-color);
    text-decoration: none;
}

    .logout-button:hover[b-87a517hzd4], .delete-account-button:hover[b-87a517hzd4], .edit-profil-button:hover[b-87a517hzd4] {
        text-decoration: underline;
        cursor: pointer;
    }

.form-check[b-87a517hzd4] {
    margin-bottom: 20px;
}

.form-check-input:checked[b-87a517hzd4] {
    border-color: var(--dark-brown-color);
    background-color: var(--dark-brown-color);
}

.form-check-input[b-87a517hzd4] {
    border-color: var(--dark-brown-color);
    color: var(--dark-brown-color);
}

    .form-check-input:focus[b-87a517hzd4] {
        box-shadow: none;
    }

.profil-actions[b-87a517hzd4] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    width: 50%;
}

.notification-title[b-87a517hzd4] {
    font-weight: 500;
}

.notification-description[b-87a517hzd4] {
    font-size: 0.8rem;
    color: var(--dark-grey-color);
}


@media (max-width: 768px) {
    .profil-container[b-87a517hzd4] {
        flex-direction: column;
        align-items: center;
        margin: unset;
    }

    .profil-actions[b-87a517hzd4]{
        width: 100%;
    }

    .profil-header > img[b-87a517hzd4] {
        width: 100px;
    }

    p[b-87a517hzd4] {
        font-size: var(--mobil-p-size)
    }

    .profil-info[b-87a517hzd4], .profil-info-content[b-87a517hzd4] {
        width: 100%;
        margin: unset;
    }
}
/* _content/BeautySalon.Web/Shared/Components/Containers/ReviewContainer.razor.rz.scp.css */
.review-section[b-1vqh7oeekn] {
	font-size: var(--main-font-size);
	margin-bottom: var(--container-margin-bottom);
	overflow-x: scroll
}

	.review-section.active[b-1vqh7oeekn] {
		cursor: grabbing;
	}

.reviews-content[b-1vqh7oeekn] {
	display: flex;
	flex-wrap: nowrap;
	width: fit-content;
	position: relative;
	overflow-x: auto;
	padding-top: 30px;
	padding-bottom: 30px;
}

.review-section > p[b-1vqh7oeekn] {
	margin-bottom: var(--main-margin-bottom);
}

.review-section[b-1vqh7oeekn]::-webkit-scrollbar-thumb {
	background-color: #888;
	border-radius: 4px;
	border: 2px solid transparent;

}
/* _content/BeautySalon.Web/Shared/Components/Containers/ServiceContainer.razor.rz.scp.css */
.service-section[b-j0mrhwdova] {
    margin-bottom: var(--container-margin-bottom);
}

.service-header[b-j0mrhwdova] {
    font-size: var(--main-font-size);
}
.service-header-details[b-j0mrhwdova] {
    font-family: Roboto;
    margin-bottom: 5vh;
}

.service-content[b-j0mrhwdova] {
    display: flex;
    justify-content: space-between;
    cursor: pointer;
}

@media (max-width: 768px) {
    .service-section[b-j0mrhwdova] {
        margin-bottom: var(--container-mobil-margin-bottom);
    }

    .services-container[b-j0mrhwdova] {
        overflow-x: scroll;
    }

    .service-content[b-j0mrhwdova] {
        display: flex;
        width: fit-content;
        overflow-x: auto;
        margin-bottom: 20px;
    }

    .service-header-details[b-j0mrhwdova] {
        font-size: var(--mobil-p-size);
        margin-bottom: var(--main-margin-bottom);
    }
}
/* _content/BeautySalon.Web/Shared/Components/DateSelectorGrid.razor.rz.scp.css */
.date-selector-container[b-o8fxm4dnot]{
    display: flex;
    gap: 7vw;
}

.order-container[b-o8fxm4dnot] {
    width: fit-content;
}

.appointment-container > h3[b-o8fxm4dnot] {
    font-size: 3rem;
    font-weight: 700;
    margin-bottom: 1vh;
}

.appointment-date-header[b-o8fxm4dnot] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1vh;
    margin-right: 10px;
    font-size: 1.2rem;
}

.appointment-date-header-button-wrapper[b-o8fxm4dnot] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 1vh;
}

.appointment-date-content[b-o8fxm4dnot] {
    display: flex;
}

.appointment-date-wrapper[b-o8fxm4dnot] {
    font-size: 1.2rem;
    font-family: Roboto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

    .appointment-date-wrapper:not(:first-child)[b-o8fxm4dnot] {
        margin-left: 15px;
    }

    .appointment-date-wrapper > button[b-o8fxm4dnot] {
        color: var(--dark-brown-color);
        font-weight: 600;
        background: #f7f7f7;
        padding: 20px;
        font-size: 1.2rem;
        border-radius: 100px;
        border: 1px solid var(--dark-grey-color);
        margin-bottom: 5px;
        transition: background-color 0.7s;
        width: 70px;
    }

        .appointment-date-wrapper > button:hover[b-o8fxm4dnot] {
            background-color: var(--dark-grey-color);
            cursor: pointer;
        }

#selected-date[b-o8fxm4dnot] {
    background-color: var(--dark-brown-color);
    color: var(--main-color);
}

#selected-time[b-o8fxm4dnot] {
    border: 2px solid var(--dark-brown-color);
}

#left-arrow[b-o8fxm4dnot] {
    margin-right: 2vw;
    transform: rotate(90deg);
}

#right-arrow[b-o8fxm4dnot] {
    transform: rotate(-90deg);
}

#left-arrow[b-o8fxm4dnot], #right-arrow[b-o8fxm4dnot] {
    padding: 10px;
    border-radius: 10px;
    transition: background-color 0.3s ease-in-out;
}

    #left-arrow:hover[b-o8fxm4dnot], #right-arrow:hover[b-o8fxm4dnot] {
        cursor: pointer;
        background-color: #eeeeee;
    }

.appointment-free-hours-container[b-o8fxm4dnot] {
    margin-top: 3vh;
    font-size: 1.3rem;
    font-family: Roboto;
}

.appointment-free-hours-wrapper[b-o8fxm4dnot] {
    margin-bottom: 20px;
    padding: 20px;
    border: 1px solid var(--dark-grey-color);
    border-radius: 7px;
}

    .appointment-free-hours-wrapper:hover[b-o8fxm4dnot] {
        background-color: var(--grey-color);
        cursor: pointer;
    }

@media(max-width: 768px) {
    h3[b-o8fxm4dnot]{
        font-size: 2.5rem;
    }
    .appointment-date-wrapper[b-o8fxm4dnot], .appointment-date-wrapper > button[b-o8fxm4dnot], .appointment-free-hours-wrapper[b-o8fxm4dnot] {
        font-size: 1rem;
    }

        .appointment-date-wrapper:not(:first-child)[b-o8fxm4dnot] {
            margin-left: 3vw;
        }

        .appointment-date-wrapper > button[b-o8fxm4dnot] {
            padding: 15px;
            width: 60px;
        }

    .appointment-free-hours-wrapper[b-o8fxm4dnot] {
        padding: 15px;
        margin-bottom: 15px;
    }
}
/* _content/BeautySalon.Web/Shared/Components/Display/ToastMessage.razor.rz.scp.css */
.toast-wrapper[b-vvld7f0koq] {
    position: fixed;
    bottom: 20px;
    left: 40%;
    background-color: white;
    padding: 10px;
    border-radius: 10px;
    box-shadow: 0.7px 1.8px 2.2px rgba(0, 0, 0, 0.028), 1.7px 4.3px 5.3px rgba(0, 0, 0, 0.04), 3.1px 8.1px 10px rgba(0, 0, 0, 0.05), 5.6px 14.5px 17.9px rgba(0, 0, 0, 0.06), 10.4px 27.2px 33.4px rgba(0, 0, 0, 0.072), 25px 65px 80px rgba(0, 0, 0, 0.1);
    max-width: 300px;
    width: auto;
    font-family: Roboto;
    z-index: 9999;
    animation: slideIn-b-vvld7f0koq 0.5s ease forwards;
}

.toast-header[b-vvld7f0koq] {
    font-weight: bold;
    margin-bottom: 5px;
}

.toast-body[b-vvld7f0koq] {
    font-size: 14px;
}

@keyframes slideIn-b-vvld7f0koq {
    from {
        bottom: -100px;
        opacity: 0;
    }

    to {
        bottom: 20px;
        opacity: 1;
    }
}
/* _content/BeautySalon.Web/Shared/Components/FinalizeOrderGrid.razor.rz.scp.css */
.finalize-order-section[b-vcppz75dty] {
    display: flex;
    justify-content: center;
}

.finalize-order-container[b-vcppz75dty] {
    display: flex;
    flex-direction: column;
    width: 35vw;
    max-width: 600px;
    padding: 0 20px 0 20px;
}

    .finalize-order-container > *[b-vcppz75dty] {
        margin-bottom: 10px;
    }

    .finalize-order-container > h3[b-vcppz75dty] {
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 2.5rem;
        font-weight: 600;
        margin-bottom: 2vh;
    }

.location-details[b-vcppz75dty] {
    display: flex;
    margin-bottom: 20px;
}

.location-details-info-wrapper[b-vcppz75dty] {
    width: 100%;
}

.location-details-image-wrapper > img[b-vcppz75dty] {
    width: 150px;
    height: auto;
    border-radius: 7px;
    border: 1px solid var(--dark-grey-color);
}

button[b-vcppz75dty] {
    background: none;
    padding: 20px;
    border-radius: 5px;
    border: 1px solid var(--dark-brown-color);
    width: 100%;
    font-size: 1.1rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 600;
}

.action-button[b-vcppz75dty] {
    color: var(--dark-brown-color);
}

.finalize-service-list[b-vcppz75dty] {
    border-top: 1px solid var(--dark-grey-color);
    border-bottom: 1px solid var(--dark-grey-color);
    margin-top: 10px;
}

.finalize-service-header[b-vcppz75dty] {
    font-weight: 600;
    font-size: 1.4rem;
    margin: 10px 0 10px 0;
}

.finalize-service-wrapper[b-vcppz75dty] {
    font-family: Roboto;
    font-style: italic;
    width: 100%;
    padding: 10px 0 10px 0;
}

.services-sum-price-wrapper[b-vcppz75dty], .finalize-service-wrapper[b-vcppz75dty] {
    display: flex;
}

.service-price[b-vcppz75dty], .service-sum-price[b-vcppz75dty] {
    display: flex;
    justify-content: flex-end;
    width: 100%;
}

.service-name[b-vcppz75dty] {
    width: 100%;
}

.services-sum-price-wrapper[b-vcppz75dty] {
    font-weight: 600;
    font-size: 1.4rem;
    border-top: 1px solid var(--dark-grey-color);
    padding: 10px 0 10px 0;
}

.finalize-order-button[b-vcppz75dty] {
    border: 1px solid var(--dark-grey-color);
    background: var(--dark-brown-color);
    color: white;
    margin-top: 20px;
    transition: background-color 0.3s;
    letter-spacing: 0.05rem;
}

    .finalize-order-button:hover[b-vcppz75dty] {
        background-color: var(--hover-color);
    }


.delete-button[b-vcppz75dty] {
    color: var(--red-color);
    border: 1px solid var(--red-color);
}

.action-button[b-vcppz75dty], .delete-button[b-vcppz75dty] {
    transition: background-color 0.3s;
}

    .action-button:hover[b-vcppz75dty], .delete-button:hover[b-vcppz75dty] {
        background-color: var(--grey-color);
    }

@media(max-width: 768px) {
    .finalize-order-container[b-vcppz75dty] {
        width: 90vw;
        padding: unset;
    }

    .finalize-service-list[b-vcppz75dty] {
        font-size: var(--mobil-p-size);
    }

    .location-details-info-wrapper[b-vcppz75dty] {
        margin-right: 15px;
    }

    .location-details-image-wrapper > img[b-vcppz75dty] {
        width: 100px;
    }

    .finalize-order-button[b-vcppz75dty] {
        margin-top: 10px;
    }

    .action-button[b-vcppz75dty]{
        background-color: #FFF;
    }
}
/* _content/BeautySalon.Web/Shared/Components/Forms/Card.razor.rz.scp.css */
.content-card[b-o5wui6aou4] {
    height: fit-content;
    background-color: #FFF;
    padding: 40px;
    border-radius: 10px;
    border: 1px solid rgb(0 0 0 / 6%);
    box-shadow: 0px 0px 0.9px rgba(0, 0, 0, 0.003), 0px 0px 2.3px rgba(0, 0, 0, 0.004), 0px 0px 4.6px rgba(0, 0, 0, 0.006), 0px 0px 9.5px rgba(0, 0, 0, 0.007), 0px 0px 26px rgba(0, 0, 0, 0.01);
}

@media(max-width: 768px) {
    .content-card[b-o5wui6aou4] {
        padding: 0px;
        background-color: unset;
        box-shadow: unset;
        border: unset;
    }
}
/* _content/BeautySalon.Web/Shared/Components/Forms/DropdownList.razor.rz.scp.css */
.dropdown[b-09vn9r2nfd] {
    border-radius: 7px;
    position: relative;
    display: inline-block;
}

.dropdown-button[b-09vn9r2nfd] {
    border: none;
    border-radius: 7px;
    cursor: pointer;
    background-color: #F8F7F6;
}

.dropdown-button-content[b-09vn9r2nfd] {
    display: flex;
    justify-content: space-between;
    padding: 5px;
    width: 100%;
}

.dropdown-left[b-09vn9r2nfd] {
    margin-right: 20px;
}


.dropdown-content[b-09vn9r2nfd] {
    display: none;
    position: absolute;
    background-color: #F8F7F6;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    border-radius: 7px;
    z-index: 1;
}

    .dropdown-content a[b-09vn9r2nfd] {
        color: black;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
    }

        .dropdown-content a:hover[b-09vn9r2nfd] {
            background-color: #F8F7F6;
        }

.dropdown:hover .dropdown-content[b-09vn9r2nfd] {
    display: block;
}

.fa-regular.fa-circle[b-09vn9r2nfd] {
    margin-right: 8px;
}
/* _content/BeautySalon.Web/Shared/Components/Forms/LoadingIndicator.razor.rz.scp.css */
.loader-container[b-7ajsehrvpw] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 70vh;
}

.loader[b-7ajsehrvpw] {
    width: 48px;
    height: 48px;
    border: 5px solid #FFF;
    border-bottom-color: var(--dark-brown-color);
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation-b-7ajsehrvpw 1s linear infinite;
}

@keyframes rotation-b-7ajsehrvpw {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
/* _content/BeautySalon.Web/Shared/Components/OrderDetailsGrid.razor.rz.scp.css */
.order-details-container[b-7v7u0hwjxh] {
    min-width: 350px;
    max-height: 60vh;
    position: sticky;
    padding: 30px;
    border: 1px solid var(--dark-grey-color);
    border-radius: 7px;
}

.order-location-container[b-7v7u0hwjxh] {
    display: flex;
    margin-bottom: 30px;
}

    .order-location-container > img[b-7v7u0hwjxh] {
        width: 100px;
        height: 100px;
        border-radius: 7px;
        margin-right: 10px;
        border: 1px solid var(--dark-grey-color);
    }

.selected-services-container[b-7v7u0hwjxh] {
    display: flex;
    flex-direction: column;
    font-family: Roboto;
}

.selected-services-wrapper[b-7v7u0hwjxh] {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
}

.selected-service-info[b-7v7u0hwjxh] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.service-time[b-7v7u0hwjxh] {
    color: var(--dark-grey-color);
    font-size: 0.9rem;
}

.selected-service-cost[b-7v7u0hwjxh] {
    align-items: flex-end;
}

.selected-services-sum-cost-container[b-7v7u0hwjxh] {
    margin-top: 30px;
    padding-top: 10px;
    border-top: 1px solid var(--dark-grey-color);
    display: flex;
    justify-content: space-between;
    font-weight: bold;
    font-size: 1.6rem;
}



.next-button-wrapper[b-7v7u0hwjxh] {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
}

.next-button[b-7v7u0hwjxh] {
    width: 100%;
    height: 5vh;
    min-height: 50px;
    border-radius: 5px;
    border: 1px solid var(--dark-grey-color);
    background: var(--dark-brown-color);
    color: white;
    font-weight: bold;
    font-size: 1.2rem;
    transition: background-color 0.3s;
}

    .next-button:hover[b-7v7u0hwjxh] {
        background: var(--hover-color);
    }

    .next-button:disabled[b-7v7u0hwjxh] {
        background-color: #dedede;
        cursor: not-allowed;
        opacity: 0.6;
    }

        .next-button.disabled:hover[b-7v7u0hwjxh],
        .next-button:disabled:hover[b-7v7u0hwjxh] {
            background-color: #dedede;
            cursor: not-allowed;
        }

.full-width-bar[b-7v7u0hwjxh] {
    display: none;
}

@media (max-width: 768px) {
    .order-details-container[b-7v7u0hwjxh] {
        display: none;
    }

    .full-width-bar[b-7v7u0hwjxh] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        background-color: #fff;
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 1000;
        padding: 10px;
        font-family: Roboto;
        border-top: 1px solid var(--dark-grey-color);
        box-shadow: 0px 0px 1px rgba(3, 7, 18, 0.00), 0px 0px 5px rgba(3, 7, 18, 0.01), 0px 0px 12px rgba(3, 7, 18, 0.01), 0px 0px 20px rgba(3, 7, 18, 0.01), 0px 0px 32px rgba(3, 7, 18, 0.02), 0px 0px 46px rgba(3, 7, 18, 0.02);
    }

    .next-button[b-7v7u0hwjxh] {
        width: 30vw;
        height: 100%;
        margin: 5px;
        padding: 10px 20px;
        font-size: 16px;
        color: var(--dark-brown-color);
        background: unset;
    }

    .next-button:hover[b-7v7u0hwjxh] {
        background: var(--grey-color) !important;
    }

    .appointment-details[b-7v7u0hwjxh] {
        flex-grow: 1;
        margin-left: 20px;
    }

    .appointment-date[b-7v7u0hwjxh] {
        font-weight: bold;
        font-size: 0.9rem;
    }

    .appointment-service[b-7v7u0hwjxh] {
        font-size: 0.8rem;
        color: rgb(192, 190, 187);
    }

    .close-button[b-7v7u0hwjxh] {
        background: none;
        border: none;
        cursor: pointer;
        padding: 10px;
        width: fit-content;
    }

        .close-button img[b-7v7u0hwjxh] {
            width: 24px;
            height: 24px;
        }
}
/* _content/BeautySalon.Web/Shared/Components/ProfilSettingsCard.razor.rz.scp.css */
.settings-card-container[b-3ppxl5ryil] {
    width: 100%;
    height: fit-content;
    background-color: #fff;
    border: 1px solid var(--dark-grey-color);
    display: flex;
    flex-direction: column;
    border-radius: 10px;
    box-shadow: 0px -0px 8px rgba(3, 7, 18, 0.00), 0px -1px 31px rgba(3, 7, 18, 0.01), 0px -2px 71px rgba(3, 7, 18, 0.01), 0px -3px 125px rgba(3, 7, 18, 0.02), 0px -5px 196px rgba(3, 7, 18, 0.02);
}

.settings-card-header[b-3ppxl5ryil] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-bottom: 1px solid var(--dark-grey-color);
}

.settings-card-header-wrapper[b-3ppxl5ryil], .settings-card-content-wrapper[b-3ppxl5ryil] {
    margin: 20px;
}

    .settings-card-header-wrapper > h3[b-3ppxl5ryil] {
        font-weight: 600;
    }

    .settings-card-header-wrapper > p[b-3ppxl5ryil] {
        font-size: 0.9rem;
        font-style: italic;
    }

    .settings-card-content-wrapper[b-3ppxl5ryil], .settings-card-header-wrapper > p[b-3ppxl5ryil] {
        font-family: Roboto;
    }



@media (max-width: 768px) {
    .settings-card-container[b-3ppxl5ryil] {
        width: 100%;
    }
}
/* _content/BeautySalon.Web/Shared/Components/ReviewGrid.razor.rz.scp.css */
.review-container[b-k05mxo3ixs] {
    font-size: 1rem;
    font-family: Roboto;
    text-shadow: 0px 0px 0px rgba(0, 0, 0, 0.3);
    background-color: #f7f2f2;
    width: 300px;
    height: 200px;
    padding: 20px;
    border-radius: 25px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    margin-right: 30px;
    box-sizing: content-box;
}

.review-header-wrapper[b-k05mxo3ixs] {
    display: flex;
    justify-content: center;
}

    .review-header-wrapper > img[b-k05mxo3ixs] {
        width: 75px;
        height: 75px;
        border-radius: 50px;
        position: absolute;
        top: -25px;
        left: 15px;
        object-fit: cover;
    }

.review-button-wrapper[b-k05mxo3ixs] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

    .review-button-wrapper > p[b-k05mxo3ixs] {
        margin-right: 10px;
    }

    .review-button-wrapper > img[b-k05mxo3ixs] {
        margin-left: auto;
    }

#selected-time[b-k05mxo3ixs] {
    border: 2px solid var(--dark-brown-color);
}

@media (max-width: 768px) {
    .review-container[b-k05mxo3ixs] {
        font-size: var(--mobil-p-size);
        width: 250px;
        height: 150px;
    }

    .review-header-wrapper > img[b-k05mxo3ixs] {
        width: 65px;
        height: 65px;
        top: -20px;
    }
}
/* _content/BeautySalon.Web/Shared/Components/ServiceCard.razor.rz.scp.css */
.service-wrapper[b-ds6sidqhhq] {
    font-family: Roboto;
    display: flex;
    border: 1px solid var(--dark-grey-color);
    border-radius: 7px;
    margin-bottom: 20px;
    padding: 20px;
    transition: border 0.3s;
    cursor: pointer;
}

    .service-wrapper:hover[b-ds6sidqhhq] {
        background-color: #f9f9f9;
    }

.service-content-left[b-ds6sidqhhq] {
    flex-grow: 1;
}

    .service-content-left > *[b-ds6sidqhhq] {
        padding-bottom: 5px;
    }

.service-time[b-ds6sidqhhq] {
    font-size: 0.9rem;
    padding-bottom: 10px;
    color: var(--dark-grey-color);
}

.service-content-right[b-ds6sidqhhq] {
    display: flex;
    align-items: center;
}

    .service-content-right > i[b-ds6sidqhhq] {
        padding: 5px;
        background-color: #dfdedd;
        border-radius: 5px;
    }

        .service-content-right > i:hover[b-ds6sidqhhq] {
            background-color: var(--dark-grey-color);
        }

#selected-service[b-ds6sidqhhq] {
    border: 2px solid var(--dark-brown-color);
}

    #selected-service .service-content-right > i[b-ds6sidqhhq] {
        background-color: var(--dark-brown-color);
        color: var(--main-color);
    }

@media(max-width: 768px) {
    .service-wrapper[b-ds6sidqhhq] {
        padding: 15px;
        font-size: 0.9rem;
        margin-bottom: 15px;
    }
}
/* _content/BeautySalon.Web/Shared/Components/ServiceGrid.razor.rz.scp.css */
.service-content[b-465f0f73g6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-right: 10px !important;
}

    .service-content:last-child[b-465f0f73g6] {
        margin-right: 0;
    }

.service-image-wrapper[b-465f0f73g6] {
    overflow: hidden;
    border-radius: 125px;
}

.service-image[b-465f0f73g6] {
    width: 250px;
    height: 300px;
    border-radius: 125px;
    object-fit: cover;
    box-shadow: 0px 0px 1px -8px rgba(0, 0, 0, 0.02), 0px 0px 2.3px -8px rgba(0, 0, 0, 0.028), 0px 0px 4.4px -8px rgba(0, 0, 0, 0.035), 0px 0px 7.8px -8px rgba(0, 0, 0, 0.042), 0px 0px 14.6px -8px rgba(0, 0, 0, 0.05), 0px 0px 35px -8px rgba(0, 0, 0, 0.07);
    transition: transform 0.3s ease-in-out;
}

    .service-image:hover[b-465f0f73g6] {
        transform: scale(1.1);
        object-position: center;
    }

.service-details-wrapper[b-465f0f73g6] {
    display: flex;
    align-items: center;
    margin-top: 10px;
}

    .service-details-wrapper > p[b-465f0f73g6] {
        font-family: Roboto;
        position: relative
    }

    .service-details-wrapper > img[b-465f0f73g6] {
        margin-left: 10px;
    }


@media (max-width: 768px) {
    .service-content[b-465f0f73g6] {
        margin-right: 3vh !important;
    }

    .service-image[b-465f0f73g6] {
        width: 150px;
        height: 175px;
    }

    .service-details-wrapper > p[b-465f0f73g6] {
        font-size: var(--mobil-p-size);
    }
}
/* _content/BeautySalon.Web/Shared/Components/ServiceSelectorGrid.razor.rz.scp.css */
.service-selector-container[b-rqukgqrasp] {
	overflow: hidden;
}

	.service-selector-container > h3[b-rqukgqrasp] {
		font-size: 3rem;
		font-weight: 700;
		margin-bottom: 1vh;
	}

.service-selector-content[b-rqukgqrasp] {
	display: flex;
	gap: 7vw;
}

.service-selector[b-rqukgqrasp] {
	width: 40vw;
	max-width: 500px;
}

.service-category[b-rqukgqrasp] {
	font-size: 1.5rem;
}

.service-card-wrapper[b-rqukgqrasp] {
	margin-bottom: 40px;
}

@media (max-width: 768px) {
	.service-selector-container[b-rqukgqrasp] {
		min-width: unset;
		max-height: unset;
	}

		.service-selector-container.expanded[b-rqukgqrasp] {
			max-height: unset;
		}

		.service-selector-container > h3[b-rqukgqrasp] {
			font-size: 2.5rem;
		}

	.service-selector[b-rqukgqrasp] {
		width: 100%;
	}

	.service-category[b-rqukgqrasp] {
		font-size: 1.2rem;
	}
}
/* _content/BeautySalon.Web/Shared/Dialogs/ConfirmActionModal.razor.rz.scp.css */
.confirm-modal-body[b-q1co5i5fpn] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.icon-wrapper[b-q1co5i5fpn] {
    position: relative;
    margin-top: -40px;
    display: inline-block;
    width: 80px;
    height: 80px;
    background-color: #fdf4f4;
    border-radius: 50%;
}

.alert-icon[b-q1co5i5fpn] {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 50%;
    height: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}

.icon-wrapper[b-q1co5i5fpn]::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 60px;
    height: 60px;
    background-color: #fceeee;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    z-index: 0;
}

.confirm-modal-body > h3[b-q1co5i5fpn] {
    margin-top: 1.5rem;
    font-size: 1.8rem;
    font-weight: 600;
}

.confirm-modal-body > p[b-q1co5i5fpn] {
    margin: 1rem;
    font-weight: 400;
    text-align: center;
    font-family: Roboto;
}


.confirm-modal-footer[b-q1co5i5fpn] {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem;
    margin-top: 2vh;
/*    background-color: var(--grey-color);*/
}

.confirm-button[b-q1co5i5fpn], .cancel-button[b-q1co5i5fpn] {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.5rem 1rem;
    width: 40%;
    margin: 0 0.5rem;
    border-radius: 5px;
    border: none;
    font-family: Roboto;
    cursor: pointer;
}

.confirm-button[b-q1co5i5fpn] {
    background-color: var(--dark-brown-color);
    color: #FFF;
    transition: background-color 0.3s;
}

    .confirm-button:hover[b-q1co5i5fpn] {
        background-color: var(--hover-color);
    }

.cancel-button[b-q1co5i5fpn] {
    background-color: #FFF;
    border: 1px solid var(--dark-brown-color);
    color: var(--dark-brown-color);
}

    .cancel-button:hover[b-q1co5i5fpn] {
        background-color: var(--grey-color);
    }

.fa-solid[b-q1co5i5fpn]{
    margin-right: 12px;
}
/* _content/BeautySalon.Web/Shared/Dialogs/EditProfilDialog.razor.rz.scp.css */
.editprofil-modal-body[b-68iylkj7kq] {
	display: flex;
	flex-direction: column;
	gap: 15px;
	padding: 2vh;
	font-family: Roboto;
}

	.edit-input-wrapper > p[b-68iylkj7kq] {
		font-weight: 500;
	}

.edit-input[b-68iylkj7kq] {
	width: 100%;
	border: none;
	border-radius: 5px;
	background: #f4f1f0;
	border: 1px solid var(--dark-grey-color);
	box-shadow: 0px -0px 8px rgba(3, 7, 18, 0.00), 0px -1px 31px rgba(3, 7, 18, 0.01), 0px -2px 71px rgba(3, 7, 18, 0.01), 0px -3px 125px rgba(3, 7, 18, 0.02), 0px -5px 196px rgba(3, 7, 18, 0.02) ;
	padding: 10px;
}


.confirm-modal-footer[b-68iylkj7kq] {
	display: flex;
	justify-content: space-around;
	align-items: center;
	padding: 1rem;
}

.confirm-button[b-68iylkj7kq], .cancel-button[b-68iylkj7kq] {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 0.5rem 1rem;
	width: 40%;
	height: 4vh;
	min-height: 40px;
	border-radius: 5px;
	border: none;
	cursor: pointer;
	font-family: Roboto;
}

.confirm-button[b-68iylkj7kq] {
	background-color: var(--dark-brown-color);
	color: #FFF;
	transition: background-color 0.3s;
}

	.confirm-button:hover[b-68iylkj7kq] {
		background-color: var(--hover-color);
	}

.cancel-button[b-68iylkj7kq] {
	background-color: #FFF;
	border: 1px solid var(--dark-brown-color);
	color: var(--dark-brown-color);
}

	.cancel-button:hover[b-68iylkj7kq] {
		background-color: var(--grey-color);
	}

.fa-solid[b-68iylkj7kq] {
	margin-right: 12px;
}

@media(max-width: 768px) {
	.confirm-button[b-68iylkj7kq], .cancel-button[b-68iylkj7kq] {
		height: 7vh;
	}
}
/* _content/BeautySalon.Web/Shared/MainLayout.razor.rz.scp.css */
main[b-kftqr2nila] {

}


.order-container[b-kftqr2nila] {
	background-size: cover;
}

.content[b-kftqr2nila] {
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-top: 4vh;
	width: 100%;
}

.container[b-kftqr2nila] {
	padding: unset;
	width: 100vw;
	height: 100vh;
	background-image: url('rose.png');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
	animation: backgroundFloatDown-b-kftqr2nila 1s ease-in-out;
}

@keyframes backgroundFloatDown-b-kftqr2nila {
	0% {
		transform: translateY(-15px);
		opacity: 0;
	}

	100% {
		transform: translateY(0);
		opacity: 1;
	}
}

@keyframes rotation-b-kftqr2nila {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

@media (max-width: 768px) {
	main[b-kftqr2nila] {
		margin-bottom: unset;
		height: 100vh;
	}

	.container[b-kftqr2nila] {
		padding: 0px 12px;
		height: unset !important;
		background-image: none;
	}

	.content[b-kftqr2nila] {
		margin-top: 2vh;
	}
}
/* _content/BeautySalon.Web/Shared/NavMenu.razor.rz.scp.css */
nav[b-3420dcxf14] {
	display: flex;
	align-items: center;
	border-bottom: 1px solid var(--dark-grey-color);
	cursor: pointer;
	padding: 0 1vh;
}


.logo-container > p[b-3420dcxf14] {
	margin: 1vh 1vh 1vh 0vh;
	font-size: 2rem;
	font-weight: bolder;
	transition: color 0.3s ease-in-out;
}

	.logo-container > p:hover[b-3420dcxf14] {
		color: var(--hover-color);
	}


.nav-buttons-container[b-3420dcxf14] {
	flex-grow: 1;
}

.nav-buttons-wrapper[b-3420dcxf14] {
	display: flex;
	align-items: center;
	justify-content: center;
}

	.nav-buttons-wrapper > p[b-3420dcxf14], i[b-3420dcxf14] {
		transition: color 0.3s;
	}

		.nav-buttons-wrapper > p:hover[b-3420dcxf14], i:hover[b-3420dcxf14] {
			color: var(--hover-color);
		}

.nav-button[b-3420dcxf14] {
	margin-left: 20px;
	font-family: Roboto;
	text-transform: uppercase;
}

	.nav-button > p[b-3420dcxf14] {
		font-weight: bolder;
	}

i[b-3420dcxf14] {
	margin-left: 30px;
}



/*--------------------User-menu-list------------------------------------------*/
.user-icon-container[b-3420dcxf14] {
	position: relative;
	display: inline-block;
	font-family: Roboto;
}

.user-menu[b-3420dcxf14] {
	display: none;
	position: absolute;
	left: -265px;
	top: 30px;
	background-color: white;
	box-shadow: 0px 0px 2.2px rgba(0, 0, 0, 0.02), 0px 0px 5.3px rgba(0, 0, 0, 0.028), 0px 0px 10px rgba(0, 0, 0, 0.035), 0px 0px 17.9px rgba(0, 0, 0, 0.042), 0px 0px 33.4px rgba(0, 0, 0, 0.05), 0px 0px 80px rgba(0, 0, 0, 0.07);
	z-index: 1000;
	border: 1px solid var(--dark-grey-color);
	border-radius: 7px;
	margin: 5px 15px;
	opacity: 0;
}

	.user-menu.visible[b-3420dcxf14] {
		display: unset;
		opacity: 1;
		transition: opacity 0.6s ease-in-out;
	}

	.user-menu > *[b-3420dcxf14] {
		margin: 5px 15px;
	}

.user-menu-header-wrapper[b-3420dcxf14] {
	display: flex;
	margin-top: 10px;
	padding: 15px 0px;
	border-bottom: 1px solid var(--dark-grey-color);
}

	.user-menu-header-wrapper > img[b-3420dcxf14] {
		border-radius: 50%;
		width: 50px;
		height: 50px;
		border: 0.5px solid var(--dark-grey-color);
	}

.user-menu-header-content-wrapper[b-3420dcxf14] {
	display: flex;
	flex-direction: column;
}

.user-menu-name[b-3420dcxf14], .user-menu-email[b-3420dcxf14] {
	padding: 0px 16px 0px 16px;
}

.user-icon-container:hover .user-menu[b-3420dcxf14] {
	display: block;
}

.user-menu-name[b-3420dcxf14] {
	font-weight: 600
}

.user-menu-data > p[b-3420dcxf14], .logout-button[b-3420dcxf14] {
	padding: 12px 16px;
	cursor: pointer;
}

	.user-menu-data > p:hover[b-3420dcxf14] {
		background-color: #f1f1f1;
		border-radius: 7px;
	}

.logout-button[b-3420dcxf14] {
	border-top: 1px solid var(--dark-grey-color);
}

	.logout-button:hover[b-3420dcxf14] {
		text-decoration: underline
	}


@media (max-width: 768px) {
	.nav-buttons-wrapper[b-3420dcxf14] {
		display: none;
	}

	.logo-container[b-3420dcxf14] {
		align-items: flex-start;
	}

		.logo-container > p[b-3420dcxf14] {
			font-size: 1.5rem;
		}

	.order-page-nav[b-3420dcxf14] {
		display: none;
	}

	.order-container[b-3420dcxf14] {
		margin-top: 0px;
	}
}
