@import url("/css/theme.css");

body {
	color: var(--crabby-default-color) !important;
}

#ratingModal .rating-stars, #promptCustomerForReviewModal .rating-stars {
	color: #ccc;
}

#ratingModal .rating-stars .star, #promptCustomerForReviewModal .rating-stars .star {
	cursor: pointer;
}

#review-comment {
	resize: none;
}

.rating-star-container {
	width: 27px;
	height: 27px;
	line-height: 4px;
}

.rating-value {
	height: 27px;
	font-size: 21px;
	line-height: 21px;
	color: var(--crabby-average-rating-value-color);
}

.rating-star-container > i {
	color: #fdcc0d;
}

.review-quote {
	font-size: 2rem;
}

.review-comments {
	max-width: 350px;
	min-width: 250px;
	height: 175px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.prompt-customer-for-review-store-name {
	font-weight: bold;
	font-size: 1.2rem;
	text-align: center;
}

.prompt-customer-for-review-store-logo {
	display: flex;
	justify-content: center;
}

.prompt-customer-for-review-store-logo img {
	width: 60px;
	height: 60px;
	border: 2px solid #d7d7d7;
	border-radius: 1rem;
}

.review-comment {
	display: none;
}

.ellipsis-3-lines {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  text-overflow: ellipsis;
  /* Optional for cross-browser support */
  max-height: 4.5em; /* 3 lines * line-height (adjust as needed) */
  line-height: 1.2em;
}

.rating-modal-trigger-container {
	cursor: pointer;
}

#reviewsModal .modal-body {
	max-height: 400px;
}

#reviewsModal .modal-body {
	overflow-y: auto;
}

#reviewsModal .modal-body .review-item {
	border: 1px solid #eee;
	border-radius: 0.375rem;
	padding: 10px;
}

#reviewsModal .modal-body .review-item-response {
	border: 1px solid #eee;
	border-radius: 0.375rem;
	padding: 10px;
}

.review-response-store-logo {
	width: 35px;
	height: 35px;
	border: 1px solid #d7d7d7;
	border-radius: 0.375rem;
	overflow: hidden;
}

.review-response-store-logo img{
	width: 100%;
	height: 100%;
}

.review-item-response-container {
	padding-left: 40px;
}

.review-writer-avatar {
	border-radius: 50%;
	height: 35px;
	width: 35px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 17px;
	border: 1px solid #d7d7d7;
	line-height: 16px;
	font-weight: 700;
	background-color: #ff6398;
	color: #fff;
}

.customer-review-star {
	height: 15px;
	width: 15px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.customer-review-star i {
	line-height: 4px;
	font-size: 14px;
}

.customer-review-star i.yellow-star {
	color: #fdcc0d;
}

i.yellow-star {
	color: #fdcc0d;
}

.star i.yellow-star {
	color: #fdcc0d !important;
}

.customer-review-star i.gray-star {
	color: rgb(187, 187, 187);
}

i.gray-star {
	color: rgb(187, 187, 187);
}

.review-writer-name {
	line-height: 18px;
	font-weight: bold;
}

#notification-menu-container .navbar-badge {
	padding: 0px;
}

#reviewsModal .modal-body .customer-name {
	line-height: 18px;
}

.review-created-at {
	color: #bbb;
}

.reviews-number {
	font-size: 1rem;
	line-height: 1.14rem;
	color: #999;
}

.no-rating-container {
	font-size: 1rem;
}

#main-navbar {
	z-index: 1001;
}

.crabby-text-color {
	color: var(--crabby-text-color) !important;
}

#notifications-dropdown-menu {
	width: 280px;
	border-radius: 0.375rem;
}

#notification-menu-container {
	width: 44px;
}

.google-icon-svg svg{
	height: 18px;
	width: 18px;
}

#notifications-dropdown-menu .notification-item {
	color: var(--crabby-default-color);
}

#date-picker-container #datepicker .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current{
	float: none;
}

#date-picker-container #datepicker .ui-widget.ui-widget-content {
	margin: auto;
	box-shadow: 0 0rem 0rem !important;
}

#date-picker-container #datepicker .ui-datepicker .ui-datepicker-buttonpane button {
	margin: 0px;
	margin-top: 10px;
}

#footer-bottom .text-container{
	border-top: 1px solid;
}

#owner-offer {
	margin: auto;
	font-size: 1.1rem;
}

#about-crabby {
	font-size: 1.2rem;
}

.notifications-container {
	max-height: 300px;
	overflow: scroll;
}

#home-main-container {
	background-color: var(--crabby-main-container-background-color);
}

#home-favorite-stores-container {
	margin-bottom: -70px;
}

#notifications-dropdown-menu .dropdown-header {
	text-align: center;
}

.notification-secondary-image {
	margin-left: -40px;
	margin-top: 27px;
	border: 2px solid #fff;
}

.notification-secondary-no-image {
	margin-left: -40px;
	margin-top: 27px;
	background-image: radial-gradient(circle at 10% 20%, rgb(69, 86, 102) 0%, rgb(34, 34, 34) 90%);
	border: 2px solid #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 40px;
	width: 40px;
	color: #fff;
}

.notification-main-no-image {
	background-image: radial-gradient(circle at 10% 20%, rgb(69, 86, 102) 0%, rgb(34, 34, 34) 90%);
	border: 2px solid #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 40px;
	width: 40px;
	color: #fff;
}

.notification-item {
	padding: 8px 16px;
}

.notification-main-image {
	border: 2px solid #fff;
}

.notification-action {
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 4px;
	width: 35px;
	height: 35px;
}

#main-svg {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: -1;
}

.reservation-action {
	height: 38px;
	width: 38px;
	line-height: 4px;
}

#main-svg .in-top, #main-svg .in-bottom{
	fill: var(--crabby-background-color);
}

#main-svg .out-top, #main-svg .out-bottom{
	fill: var(--crabby-csv-background-color);
}

.swiper {
	max-width: 800px;
	min-height: 120px;
	padding-bottom: 25px !important;
}

.favorite-store-home {
	max-width: 200px;
	min-width: 180px;
	position: relative;
	margin-right: 10px;
	margin-bottom: 10px;
}

.home-section-title {
	font-size: 1.8rem;
}

.home-section-subtitle {
	font-size: 1.2rem;
}

.favorite-store-home > .store-container {
	border-radius: 0.5rem;
	position: relevant;
	background-color: var(--crabby-favorite-store-home-background-color);
	border: 1px solid var(--crabby-favorite-store-home-border-color);
}

.store-day-hours-for-reservation .staff-image {
	height: 35px;
	width: 35px;
	border: 1px solid #d7d7d7;
	color: #d7d7d7;
	padding: 2px;
}

.favorite-store-button {
	position: absolute;
	top: 5px;
	right: 5px;
}

.favorite-store-button > .store-profile-preference{
	height: 26px;
	width: 26px;
	font-size: 0.8rem;
}

.favorite-store-home > .store-container > .store-image > img{
	width: 60px;
	border-radius: 0.4rem;
	border-top-right-radius: 0rem;
	border-bottom-right-radius: 0rem;
}

.favorite-store-home > .store-container .favorite-store-category {
	color: #aaa;
	font-size: 0.9rem;
}

.favorite-store-home > .store-container .store-name {
	font-size: 1.1rem;
	color: var(--crabby-favorite-store-name-color);
}

.favorite-store-home > .store-container > .store-image {
	width: 60px;
}

#footer-container {
	background-color: var(--crabby-footer-background-color);
	min-height: 200px;
	color: #c4c5c7;
}

#footer-bottom {
	background-color: var(--crabby-footer-bottom-background-color);
	color: #c4c5c7;
}

.footer-social-item {
	font-size: 1.2rem;
	height: 32px;
	width: 32px;
	margin-right: 3px;
	color: var(--crabby-footer-social-item);
}

.footer-title {
	font-size: 1.5rem;
}

.footer-link a{
	font-size: 1.1rem;
	color: #c4c5c7;
}

/* START navbar user-menu */
.navbar-nav > .user-menu > .nav-link::after {
	content: none;
}
.navbar-nav > #language-picker > .dropdown-menu {
	border-radius: 0.7rem;
}
.navbar-nav > .user-menu > .dropdown-menu {
	width: 280px;
	padding: 0;
	border-radius: 0.375rem;
}
.navbar-nav > .user-menu > .dropdown-menu,
.navbar-nav > .user-menu > .dropdown-menu > .user-body {

}
.navbar-nav > .user-menu > .dropdown-menu > li.user-header {
	padding: 10px;
	text-align: center;
}
.navbar-nav > .user-menu > .dropdown-menu > li.user-header > img {
	z-index: 5;
	width: 90px;
	height: 90px;
	border: 3px solid;
	border-color: transparent;
	border-color: var(--bs-border-color-translucent);
}
.navbar-nav > .user-menu > .dropdown-menu > li.user-header > p {
	z-index: 5;
	margin-top: 10px;
	font-size: 17px;
	word-wrap: break-word;
}
.navbar-nav > .user-menu > .dropdown-menu > li.user-header > p > small, .navbar-nav > .user-menu > .dropdown-menu > li.user-header > p > .small {
	display: block;
	font-size: 12px;
}
.navbar-nav > .user-menu > .dropdown-menu > .user-body {
	padding: 7px 15px;
	border-top: 1px solid var(--bs-border-color);
	border-bottom: 1px solid var(--bs-border-color-translucent);
}
.navbar-nav > .user-menu > .dropdown-menu > .user-body::after {
	display: block;
	clear: both;
	content: "";
}

@media (min-width: 576px) {
	.navbar-nav > .user-menu > .dropdown-menu > .user-body a {
		color: var(--bs-body-color) !important;
		background-color: var(--bs-body-bg) !important;
	}
}
.navbar-nav > .user-menu > .dropdown-menu > .user-footer {
	padding: 7px 15px;
	background-color: var(--bs-light-bg);
}
.navbar-nav > .user-menu > .dropdown-menu > .user-footer::after {
	display: block;
	clear: both;
	content: "";
}
.navbar-nav > .user-menu > .dropdown-menu > .user-footer .btn-default {
	color: var(--bs-body-color);
}
@media (min-width: 576px) {
	.navbar-nav > .user-menu > .dropdown-menu > .user-footer .btn-default:hover {
		background-color: var(--bs-body-bg);
	}
}
.navbar-nav > .user-menu .user-image {
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
}
@media (min-width: 576px) {
	.navbar-nav > .user-menu .user-image {
		float: none;
		margin-top: -8px;
		line-height: 10px;
	}
}

.dropdown-menu {
	border-radius: 25px;
}
/* END navbar user-menu */

#registerSuccessfulModal .modal-header, #formReadyModal .modal-header {
	border-bottom: 0px;
	padding-bottom: 0px;
}

#registerSuccessfulModal .modal-footer, #formReadyModal .modal-footer {
	border-top: 0px;
	padding-top: 0px;
}

.input-error, .input-error-email {
	border: 1px solid red !important;
}

h3 {
	color: var(--crabby-default-color) !important;
}

.new-template h3 {
	color: var(--crabby-heading-color) !important;
}

.card-body .card-title {
	font-weight: bold;
	font-size: 1.3rem;
	color: var(--crabby-brand-color);
}

.card-body .card-subtitle {
	color: var(--crabby-title-color) !important;
}

.card-title {
	float: left;
	margin: 0;
	font-size: 1.1rem;
	font-weight: 400;
}

.app-sidebar {
	background-color: var(--crabby-second-background-color) !important;
	border-right: 1px solid var(--crabby-border-color);
}

.sidebar-brand .brand-text {
	color: var(--crabby-brand-color);
}

body {
	background-color: var(--crabby-body-background-color);
}

#dropdown-menu-image-container img {
	height: 100%;
}

.nav-item .nav-link i {
	font-size: 20px;
}

.nav-item .nav-link {
	line-height: 30px;
}

.nav-item .nav-link:focus {
	outline: none;
	box-shadow: none;
}

.navbar-badge {
	position: absolute;
	top: 2px;
	right: 5px;
	font-size: 0.75rem;
	border-radius: 50%;
	width: 20px;
	height: 20px;
	align-content: center;
}

.navbar-nav > .user-menu .user-image {
	border: 1px solid var(--crabby-border-color);
	height: 45px;
	width: 45px;
}

.navbar-brand {
	padding-right: 16px;
	margin-right: 0px;
}

.navbar-brand h1 {
	margin-bottom: 0px;
}

.custom-shadow {
	box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
}

.user-footer a, .user-body a {
	text-decoration: none;
	color: rgb(71, 71, 71);
	font-size: 17px;
	padding: 5px;
	line-height: 39px;
}

.user-footer button i, .user-body a i {
	font-size: 20px;
	margin-right: 5px;
}

.navbar-expand .navbar-nav .nav-link {
	width: auto;
	margin-left: 0px;
}

.category-image {
	width: 60px;
	min-width: 60px;
	height: 60px;
	margin-right: 10px;
}

.category-image img {
	width: 100%;
	height: 100%;
	border-radius: 0.5rem;
}

.catalogue-category {
	padding-top: 8px;
}

.product-image img {
	aspect-ratio: 1 / 1;
	width: 69px; /* Or any desired width */
	border-radius: 0.5rem;
}

.toast-header {
	background-color: transparent;
	color: #fefefe;
}

#update-profile-form .input-group label, #missing-mobile-form .input-group label {
	margin-left: 47px;
	z-index: 10;
}

.category-badge-item:not(.active) {
	cursor: pointer;
	--bs-bg-opacity: 1;
	background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
	color: var(--crabby-category-badge-item);
}

.category-badge-item.active {
	background: var(--crabby-btn-grad-black);
}

#services-container .product-item {
	cursor: pointer;
	position: relative;
}

#services-container .product-item .check-icon{
	position: absolute;
	top: -14px;
	left: -10px;
	font-size: 21px;
}

#services-container .product-item.active {
	background-color: #ccc;
}

#pick-service > #catalogue > #categories-container {
	margin-bottom: 20px;
	padding-bottom: 4px;
	box-shadow: inset 0 -2px 0 0 var(--crabby-table-filter-border);
}

#store-history {
	margin-top: 35px;
}

#toast-container {
	--bs-toast-zindex: 1090;
	position: absolute;
	z-index: var(--bs-toast-zindex);
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	max-width: 100%;
	pointer-events: none;
}

#toast-container > :not(:last-child) {
	margin-bottom: var(--bs-toast-spacing);
}

.text-green {
	color: green;
}

.text-gray {
	color: rgb(91, 97, 102);
}

.auth-basic-wrapper {
	height: 100vh;
}

.store-status {
	font-size: 14px;
}

.btn-100 {
	width: 100%;
}

.btn-grad-black {
	background: var(--crabby-btn-grad-black);
	color: white !important;
}

.btn-grad {
	background: var(--crabby-grad-button-background-color);
	background-size: 200% 100%;
	background-position: left center;
	color: white !important;
	transition: background-position 0.5s ease-in-out;
	border: 0px;
}

.btn-grad:hover {
	background-position: right center;
}

.btn-grad-google {
	background: var(--crabby-google-button-background-color);
	background-size: 200% 100%;
	background-position: left center;
	color: #000 !important;
	transition: background-position 0.5s ease-in-out;
	border: 0px;
	border: 1px solid #ddd;
}

.btn-grad-google:hover {
	background-position: right center;
	border: 1px solid #ddd;
}

#rounded-circle-shadow-1 {
	top: 45px;
	right: 20%;
}

#rounded-circle-shadow-2 {
	top: -145px;
	right: 80%;
}

#rounded-circle-shadow-3 {
	top: 145px;
	right: 49%;
}

#rounded-circle-shadow-4 {
	top: 235px;
	right: 78%;
}

#rounded-circle-shadow-5 {
	right: 0%;
	bottom: -10%;
}

#rounded-circle-shadow-6 {
	right: 60%;
}

#rounded-circle-shadow-7 {
	left: 55%;
	top: 303px;
}

#rounded-circle-shadow-8 {
	left: 7%;
	bottom: -20%;
}

.rounded-circle-shadow {
	background-color: rgba(248, 249, 251, 1);
	position: absolute;
	z-index: -1;
}

.rounded-circle-shadow-xs {
	height: 100px;
	width: 100px;
}

.rounded-circle-shadow-sm {
	height: 150px;
	width: 150px;
}

.rounded-circle-shadow-md {
	height: 200px;
	width: 200px;
}

.rounded-circle-shadow-lg {
	height: 300px;
	width: 300px;
}

#main-section-container {
	position: relative;
}

.search-result-item.active {
	background-color: var(--crabby-background-color-hover);
}

.navbar-expand .navbar-nav > .user-menu > .nav-link {
	width: auto;
}

#store-categories-container {
	box-shadow: inset 0 -2px 0 0 var(--crabby-table-filter-border);
}

.catalogue-category-item {
	padding-bottom: 5px;
	margin-right: 10px;
	text-decoration: none;
	color: var(--crabby-default-color);
	font-size: 1.2rem;
}

.catalogue-category-item.active {
	border-bottom: 2px solid var(--crabby-default-color);
}

.catalogue-category-image img{
	width: 50px;
	height: 50px;
	border-radius: 0.5rem;
}

#typewriter-container {
	font-size: 1.3rem;
	color: var(--crabby-hero-subtitle-color);
}

#typewriter-container #storeCategory {
	color: #40c2cb;
}

.store-item-data i {
	color: #999;
	font-size: 17px;
}

.search-logo {
	border-radius: 0.7rem;
	height: 60px;
	width: 60px;
}

.search-no-logo {
	border-radius: 0.7rem;
	height: 60px;
	width: 60px;
	background-color: #eee;
}

.store-item-description {

}

#cancel-picked-date {
	border: 1px solid #eee;
}

#picked-date-container {
	font-size: 1.1rem;
}

.store-day-hours-for-reservation {
	border: 1px solid var(--crabby-border-color);
	padding: 15px;
	border-radius: 0.375rem;
}

.my-status-reservations-size {
	display: none;
}

.store-page-functions-menu-item.active > .my-status-reservations-size {
	display: inline-block;
	margin: 3px;
}

.store-item-subtitle {
	line-height: 1rem;
	font-size: 1rem;
}

#home-image {
	position: absolute;
	bottom: -136px;
	left: -19px;
	width: 91%;
	height: auto;
}

#my-reservations-status-menu .store-page-functions-menu-item {
	margin-right: 11px;
}

.store-page-functions-menu-item {
	text-decoration: none;
	color: var(--crabby-menu-item);
	margin-left: 0px;
	margin-right: 8px;
	font-size: 1.2rem;
	display: flex;
	align-items: end;
	padding-bottom: 2px;
}

#reservation-datepicker-container #date-picker-container > #datepicker > .ui-widget-content {
	border: 0px solid var(--crabby-border-color);
}

#reservation-datepicker-container .ui-widget.ui-widget-content {
	padding: 0px;
}

.progress-step-container.active > .progress-step-title{
	color: var(--crabby-default-color);
}

.progress-step-container > .progress-step-title{
	color: #ccc;
	height: 26px;
}

.progresses > .line {
	background-color: #ccc;
}

.progress-step-container.active > .steps{
	background-color: #41c2cb;
}

.progress-step-container.completed > .steps{
	background-color: #41c2cb;
}

.line.completed {
	background-color: #41c2cb;
}

#reservation-datepicker-container #date-picker-container > #datepicker .ui-state-default,
#reservation-datepicker-container #date-picker-container > #datepicker .ui-widget-content .ui-state-default,
#reservation-datepicker-container #date-picker-container > #datepicker .ui-widget-header .ui-state-default,
#reservation-datepicker-container #date-picker-container > #datepicker .ui-button,
#reservation-datepicker-container #date-picker-container > #datepicker html .ui-button.ui-state-disabled:hover,
#reservation-datepicker-container #date-picker-container > #datepicker html .ui-button.ui-state-disabled:active {
	width: 100%;
}

#reservation-datepicker-container #date-picker-container > #datepicker .ui-corner-all,
#reservation-datepicker-container #date-picker-container > #datepicker .ui-corner-bottom,
#reservation-datepicker-container #date-picker-container > #datepicker .ui-corner-right,
#reservation-datepicker-container #date-picker-container > #datepicker .ui-corner-br {
	border-radius: 0.375rem;
}

#reservation-datepicker-container #date-picker-container > #datepicker .ui-datepicker-today {
	border: 2px solid rgb(65, 194, 203) !important;
	border-radius: 0.5rem;
}

#reservation-datepicker-container #date-picker-container > #datepicker .ui-state-default,
#reservation-datepicker-container #date-picker-container > #datepicker .ui-widget-content .ui-state-default,
#reservation-datepicker-container #date-picker-container > #datepicker .ui-widget-header .ui-state-default,
#reservation-datepicker-container #date-picker-container > #datepicker .ui-button,
#reservation-datepicker-container #date-picker-container > #datepicker html .ui-button.ui-state-disabled:hover,
#reservation-datepicker-container #date-picker-container > #datepicker html .ui-button.ui-state-disabled:active {
	border-radius: 0.3rem;
}

#reservation-datepicker-container #date-picker-container > #datepicker .ui-datepicker-today {
	width: auto;
}

#reservation-datepicker-container #date-picker-container > #datepicker > .ui-datepicker {
	width: 100%;
}

.favorite-store .category {
	line-height: 10px;
	font-size: 1rem;
	color: #aaa;
}

.favorite-store .name {
	font-size: 1.2rem;
	line-height: 1.5rem;
}

#user-profile-container {
	margin-top: 60px;
}

#user-profile-container #profile-name {
	font-size: 3.5rem;
	line-height: 4.4rem;
	color: var(--crabby-default-color);
	font-weight: 900;
	padding-right: 125px;
}

.my-reservations-store-logo {
	height: 45px;
	width: 45px;
	border: 2px solid var(--crabby-border-color);
	border-radius: 1rem;
}

#my-reservations-status-menu .store-page-functions-menu-item.active {
	margin-top: 0px;
}

.store-page-functions-menu-item.active {
	box-shadow: 0 2px 0 0 var(--crabby-store-page-menu-box-shadow-color);
	font-weight: 500;
	margin-top: 60px;
}

.store-profile-description-box, .profile-page-profile-box {
	background-color: rgba(23, 162, 184, 0.1);
}

.store-profile-box {
	border-radius: 1.25rem;
	min-height: 300px;
	color: var(--crabby-store-page-text-color);
}

.store-profile-contact-info-box, .profile-change-password-box {
	background-color: rgba(235, 175, 65, 0.1);
}

.profile-page-profile-box .form-control, .profile-page-profile-box .form-floating>.form-control-plaintext~label::after, .form-floating>.form-control:focus~label::after, .form-floating>.form-control:not(:placeholder-shown)~label::after, .form-floating>.form-select~label::after {
	background-color: transparent;
}

.profile-change-password-box .form-control, .profile-change-password-box .form-floating>.form-control-plaintext~label::after, .form-floating>.form-control:focus~label::after, .form-floating>.form-control:not(:placeholder-shown)~label::after, .form-floating>.form-select~label::after {
	background-color: transparent;
}

.store-profile-working-hours-box {

}

.store-profile-icon {
	height: 56px;
	width: 56px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1.3rem;
	color: #fff;
	margin-bottom: 23px;
}

.store-profile-description-box .h3 {
	margin-bottom: 0px;
}

#store-profile-description-icon-container {
	background-color: rgb(23, 162, 184);
}

#store-profile-contact-info-icon-container {
	background-color: rgb(235, 175, 65);
}

#laptop-screen {
	-webkit-backdrop-filter: blur(5px);
	backdrop-filter: blur(5px);
	-webkit-box-shadow: 0 0.3rem 0.7rem rgba(var(--bs-primary-rgb), 0.2);
	box-shadow: 0 0.3rem 0.7rem rgba(var(--bs-primary-rgb), 0.2);
	border-radius: 1.25rem;
	--bs-bg-opacity: 1;
	background-color: rgba(255, 255, 255, 0.1) !important;
	padding: 2rem 1.4rem 1.4rem 1.4rem !important;
	--bs-border-opacity: 0.25;
	--bs-border-opacity: 1;
	border-color: rgba(255, 255, 255, 0.25) !important;
	border: 1px solid #D3D8E9 !important;
	position: relative;
}

#laptop-screen > img{
	width: 100%;
	border-radius: 0.625rem;
}

#laptop-screen > #close-window {
	width: 10px;
	height: 10px;
	position: absolute;
	top: 13px;
	left: 25px;
	border-radius: 50%;
	background-color: #dc3545;
}

#laptop-screen > #minimize-window {
	width: 10px;
	height: 10px;
	position: absolute;
	top: 13px;
	left: 40px;
	border-radius: 50%;
	background-color: rgba(255, 193, 7, 1);
}

#laptop-screen > #maximize-window {
	width: 10px;
	height: 10px;
	position: absolute;
	top: 13px;
	left: 55px;
	border-radius: 50%;
	background-color: rgba(25, 135, 84, 1);
}

.btn-light {
	border-color: var(--crabby-btn-border-color) !important;
	background-color: var(--crabby-btn-bg) !important;
}

.btn-light:hover {
	border-color: var(--crabby-btn-hover-border-color) !important;
	background-color: var(--crabby-btn-hover-bg) !important;
}

#store-page-logo-container {
	height: 110px;
	max-width: 110px;
	min-width: 110px;
/*	border: 1px solid var(--crabby-footer-background-color); */
	border-radius: 19px;
	padding: 3px;
	background-color: var(--crabby-background-color-hover);
}

#reservations-table {
	font-size: 1.1rem;
}

#reservations-table thead tr th{
	font-size: 1.2rem;
}

.reservations-table-confirmed {
	font-size: 20px;
}

#reservations-table tbody tr {
	border-bottom: 1px dashed var(--crabby-border-color);
}

#reservations-table tbody tr td{
	vertical-align: middle;
	border: 0px;
	background-color: transparent;
}

#reservation-table-menu {
	background-color: var(--crabby-table-checkbox-menu-bg);
	color: var(--crabby-table-checkbox-menu-color);
	border-top: 1px solid var(--crabby-table-checkbox-menu-bg-hover);
	position: fixed;
	width: 100%;
	padding: 10px;
	bottom: 0px;
	left: 0px;
	z-index: 1038;
	height: 80px;
	box-shadow: 4px -6px 6px 0 rgba(0, 0, 0, 0.044), 0 2px 6px 0 rgba(0, 0, 0, 0.049);
}

.reservation-table-menu-item {
	cursor: pointer;
	padding: 10px;
	font-size: 17px;
	display: flex;
	justify-content: center;
	align-items: center;
	text-decoration: none;
	color: var(--crabby-table-checkbox-menu-color);
}

.reservation-table-menu-item-icon {
	line-height: 4px;
	height: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.reservation-table-menu-item:hover {
	background-color: var(--crabby-table-checkbox-menu-bg-hover);
}

#main-store-logo {
	width: 100%;
	height: 100%;
	border-radius: 16px;
}

.checkout-service-name, .checkout-service-option {
	line-height: 17px;
}

.checkout-service-option {
	text-align: right;
}

.remove-service {
	cursor: pointer;
}

#employees-container > .employee-item {
	border: 1px solid #d7d7d7;
	border-radius: 0.375rem;
	padding: 1rem;
}

#store-reservation-new-reservation {
	width: 300px;
}

#employees-container > .employee-item > .employee-item-image {
	height: 80px;
	width: 80px;
	border: 1px solid #d7d7d7;
	border-radius: 50%;
	padding: 5px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 40px;
	color: #d7d7d7;
}

.employee-item {
	cursor: pointer;
}

.employee-item.active {
	background-color: #ddd;
}

.checkout-employee > .employee-item {
	display: flex;
	align-items: center;
	margin-bottom: 10px !important;
}

.checkout-employee > .employee-item > .employee-item-image {
	height: 35px;
	width: 35px;
	border: 1px solid #d7d7d7;
	border-radius: 50%;
	margin-right: 4px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	color: #d7d7d7;
}

.checkout-date-title {
	border-bottom: 1px solid #d7d7d7;
	margin-bottom: 5px;
}

.checkout-date-container {
	border: 1px solid #d7d7d7;
	border-radius: 0.375rem;
	padding: 10px;
	margin-bottom: 10px;
	max-height: 300px;
	overflow-y: scroll;
	position: relative;
	min-height: 117px;
}

.checkout-close-date-container {
	position: absolute;
	width: 30px;
	height: 30px;
	top: 5px;
	right: 5px;
	line-height: 4px;
	font-size: 20px;
	cursor: pointer;
}

.checkout-employee > .employee-item > .employee-item-image > img {
	height: 100%;
	width: 100%;
	padding: 2px;
}

.employee-item.active > .employee-item-image {
	color: var(--crabby-default-color) !important;
	border-color: var(--crabby-default-color) !important;
}

#employees-container > .employee-item > .employee-item-image img {
	height: 100%;
	width: 100%;
}

.checkout-date-title {
	font-size: 17px;
}

.text-default {
	color: var(--crabby-text-default-color);
}

#main-section-rounded-picture-1 {
	height: 500px;
	width: 500px;
	position: absolute;
	top: 185px;
	left: 0px;
	border: 15px solid #fff;
}

#main-section-rounded-picture-1 img {
	width: 100%;
	height: 100%;
}

#main-section-rounded-picture-2 {
	height: 318px;
	width: 318px;
	position: absolute;
	top: 151px;
	right: -79px;
	border: 15px solid #fff;
}

#main-section-rounded-picture-2 img {
	width: 100%;
	height: 100%;
}

#main-section-rounded-picture-3 {
	height: 180px;
	width: 180px;
	position: absolute;
	top: 0px;
	right: 155px;
	border: 10px solid #fff;
}

#main-section-rounded-picture-3 img {
	width: 100%;
	height: 100%;
}

#main-section-search-container {
	padding-bottom: 40px;
}

#main-search {
	height: 50px;
	font-size: 1.2rem;
	border-top-right-radius: 0rem;
	border-bottom-right-radius: 0rem;
	padding-left: 20px;
	padding-right: 20px;
	max-width: 580px;
}

#main-search-button {
	height: 50px;
	border-top-left-radius: 0rem;
	border-bottom-left-radius: 0rem;
	min-width: 55px;
	max-width: 55px;
	font-size: 19px;
	padding-left: 15px;
	padding-right: 17px;
	border: 1px solid var(--crabby-grad-button-border-color);
	margin-left: -1px;
}

#main-search:focus {
	box-shadow: none;
	border-color: var(--crabby-border-color);
}

#initialize-navbar .navbar-nav > .user-menu .user-image, #main-navbar .navbar-nav > .user-menu .user-image{
	margin-top: 0px;
}

#create-store-later {
	color: blue;
	font-size: 16px;
	cursor: pointer;
}

.auth-divider {
	text-align: center;
	border-top: 1px solid var(--crabby-border-color);
}

.auth-divider div {
	margin-top: -13px;
	width: 100px;
	background-color: var(--crabby-second-background-color);
}

.form-title {
	line-height: 40px;
}

.bg-gold {
	background-color: #d4af37;
}

.text-bg-gold {
	background-color: #d4af3730;
	color: #d4af37;
}

.table>:not(caption)>*>* {
	background-color: transparent;
}

.profile-logo-container{
	color: white;
	font-size: 40px;
	height: 125px;
	width: 125px;
	background-color: rgb(222, 226, 230);
	padding: 4px;
	top: 25px;
	right: 0px;
	position: absolute;
}

.profile-logo-container > img{
	height: 100%;
	width: 100%;
}

.store-logo-container{
	color: white;
	font-size: 40px;
	height: 170px;
	width: 170px;
	// background: linear-gradient(310deg, #ee0979, #ff6a00) !important;
	background-color: rgb(222, 226, 230);
	padding: 5px;
	margin: auto;
	margin-top: -60px;
	position: relative;
	border-radius: 15%;
	position: relative;
}

.store-logo-container > .store-logo {
	height: 100%;
	width: 100%;
	border-radius: 14%;
}

#choose-store-button {
	border: 1px solid var(--crabby-border-color);
	border-radius: 25px;
	padding-left: 35px;
	padding-right: 35px;
	padding-top: 4px;
	padding-bottom: 4px;
}

.step-button {
	border-radius: 25px;
	padding-left: 35px;
	padding-right: 35px;
	padding-top: 4px;
	padding-bottom: 4px;
}

.step-to-start {
	border: 1px solid var(--crabby-border-color);
	padding: 20px;
	border-radius: 1rem;
}

.step-to-start.completed h5, .step-to-start.completed .step-number, .step-to-start.completed .step-title {
	color: var(--crabby-border-color);
}

.step-to-start.pending h5, .step-to-start.pending .step-number, .step-to-start.pending .step-title {
	color: var(--crabby-border-color);
}

.step-to-start.active {
	border-color: var(--crabby-title-color);
}

.step-title {
	font-weight: bold;
}

.btn-store {
	height: 42px;
	width: 42px;
}

.btn-store-logo {
	height: 32px;
	padding: 0px;
	padding-top: 0px;
	position: absolute;
	bottom: -12px;
	right: -12px;
	padding-left: 10px;
	padding-right: 10px;
	border-radius: 25px;
	font-weight: 100;
}

.btn-user-image {
	padding: 0px;
	padding-top: 0px;
	padding-left: 10px;
	padding-right: 10px;
	background-color: #00000020;
	font-size: 1.15rem;
	height: 30.5px;
	margin-top: 5px;
	font-weight: 600;
	color: #000;
}

.btn-user-image:hover {
	background-color: #00000040;
	color: #000;
}

.store-actions, .user-actions {
	position: absolute;
	top: 16px;
	left: 12px;
	width: 100%;
}

.step-to-start .step-number {
	border-radius: 50%;
	height: 50px;
	width: 50px;
	border: 1px solid;
	font-size: 16px;
}

.step-to-start .step-action {
	height: 35px;
}

.card .card-body .card-profile-title {
	font-size: 1.4rem;
}

.card-profile-subtitle i {
	font-size: 22px;
	margin-right: 16px;
}

.profile-name {
	font-size: 1.75rem;
}

.store-name {
	font-size: 16px;
	line-height: 16px;
}

.store-address {
	font-size: 1.10rem;
	color: var(--crabby-small-text-color);
}

.profile-email {
	font-size: 1rem;
}

.profile-creation-date {
	font-size: 1rem;
}

#user-header-greetings {
	font-size: 1.1rem;
	font-weight: normal !important;
	line-height: 1.1rem;
}

#logout-button {
	background: none;
	border: none;
	color: var(--crabby-default-color) !important;
	cursor: pointer;
	width: 100%;
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 1rem;
}

.profile-logo-container .profile-logo {
	height: 100%;
	width: 100%;
	background-color: #8549a7;
}

.navbar-nav > .user-menu > .dropdown-menu > .user-body a {
	background: rgb(220, 220, 220, 0) !important;
	text-decoration: none;
	color: var(--crabby-default-color) !important;
	padding-top: 2px;
	padding-bottom: 2px;
}

.user-body .user-menu-item:hover, .user-footer .user-menu-item:hover {
	background-color: var(--crabby-user-menu-item-hover);
	border-radius: 5px;
}

.progresses{
	display: flex;
	align-items: center;
}

.line{
	width: 200px;
	height: 6px;
	background: #41c2cb;
}

.progress-step-title {
	width: 150px;
	text-align: center;
	left: -59px;
	top: 35px;
	font-weight: bold;
	font-size: 1.2rem;
}

.steps {
	display: flex;
	background-color: #ccc;
	color: #fff;
	font-size: 17px;
	line-height: 4px;
	width: 30px;
	height: 30px;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
}

#checkout-data-container {
	background-color: var(--crabby-body-background-color);
	z-index: 1000;
}

#store-reservation-navigate-buttons-container {
	display: flex;
	justify-content: start;
	height: 38px;
}

#store-reservation-steps-container {
	height: 120px;
}

.user-menu-item a {
	font-size: 1rem;
}

.text-white {
	color: #fff;
}

.text-red {
	color: red;
}

.text-yellow {
	color: #FFC72C;
}

.text-14 {
	font-size: 14px;
}

.wh-42 {
	width: 42px;
	height: 42px;
}

.bg-grd-facebook {
	background: radial-gradient(circle at 10% 20%, rgb(7, 121, 222) 0%, rgb(20, 72, 140) 90%);
}

.bg-grd-google {
	background: linear-gradient(107.2deg, rgb(150, 15, 15) 10.6%, rgb(247, 0, 0) 91.1%);
}

.bg-grd-blue {
	background-image: linear-gradient(to right, #6a11cb 0%, #2575fc 100%) !important;
}

.bg-grd-red {
	background: linear-gradient(-225deg, #eec0c8 0%, #eec0c8 32%, #FFF 100%) !important;
}

.bg-grd-green {
	background: linear-gradient(-225deg, #D0F0C0 0%, #D0F0C0 32%, #FFF 100%) !important;
}

.bg-grd-yellow {
	background: linear-gradient(-225deg, #FFFACD 0%, #FFFACD 32%, #FFF 100%) !important;
}

.store-hour-for-reservation.disabled {
	opacity: 1;
}

.store-hour-for-reservation.active {
	background-color: #888 !important;
	border-color: #666 !important;
}

.store-hour-for-reservation {
	justify-content: center;
	align-items: center;
	position: relative;
	padding: 5px 10px;
	margin: 1px;
	width: 55px;
}

.store-hour-for-reservation .hours, .store-hour-for-reservation .capacity{
	font-size: 0.95rem;
}

.store-hour-for-reservation .capacity i{
	font-size: 8px;
}

.status > .badge.daily-tool-status-badge {
	padding: 3px !important;
	padding-left: 5px !important;
	padding-right: 5px !important;
	font-size: 0.7rem;
	display: inline !important;
	line-height: 0.5rem;
}

.store-class-hours-for-reservation {
	width: 89px !important;
}

.auth-social {
	margin: 3px;
	line-height: 4px;
	text-decoration: none;
	padding: 10px 12px;
	border-radius: 0.375rem;
	color: #3c4043;
}

#google-login-text{
	font-size: 1.05rem;
	margin-left: 7px;
}

#google-auth-login-link {
	border: 1px solid #dadce0;
}

#google-auth-login-link:hover {
	border-color: rgb(210, 227, 252);
	background-color: rgba(210, 227, 252, 0.1);
}

#login-form a, #register-form a {
	text-decoration: none;
}

.no-image {
	display: flex;
	justify-content: center;
	align-items: center;
}

.nav-link .no-image {
	width: 100%;
	height: 100%;
	background-color: #8549a7;
	color: white !important;
}

.password-cheater-container {
	position: relative;
}

.password-cheater {
	position: absolute;
	width: 58px;
	height: 58px;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 1000;
	right: 0px;
	top: 0px;
	line-height: 4px;
	cursor: pointer;
}

.user-header .no-image {
	height: 45px;
	width: 45px;
	border: 3px solid;
	border-color: rgba(0, 0, 0, 0.175);
	margin: auto;
	background-color: #8549a7;
	color: white !important;
	font-size: 20px !important;
}

.logo-text {
	font-weight: bold;
	font-size: 1.7rem;
	margin-left: 4px;
	color: var(--crabby-logo-color);
}

#footer-container .logo-text {
	color: #c4c5c7;
}

#main-container {
	//margin-top: 100px;
}

.store {
	border: 1px solid var(--crabby-border-color);
	border-radius: 0.5rem;
	padding: 5px;
	position: relative;
	cursor: pointer;
	background-color: var(--crabby-background-color);
	align-items: center;
}

.store-category {
	border: 1px solid var(--crabby-border-color);
	border-radius: 20px;
	padding: 5px;
	position: relative;
	cursor: pointer;
	background-color: #fff;
	display: flex;
	align-items: center;
}

.store-category-item {
	color: var(--crabby-text-default-color);
	text-decoration: none;
}

.store-category-item-filter .store-category-image {
	height: 49px;
}

.store-category-item-filter {
	color: var(--crabby-text-default-color);
	text-decoration: none;
}

.bg-crabby {
	background-color: var(--crabby-background-color);
}

.border-crabby {
	border: 1px solid var(--crabby-border-crabby-color);
}

.store-category-item-filter .store-category {
	padding: 3px;
}

.store-item {
	color: var(--crabby-text-default-color);
	text-decoration: none;
}

.store-category-image {
	height: 90px;
	border-radius: 16px;
}

.store-image {
	width: 100%;
	border-radius: 0.4rem;
}

.store-category-number {
	font-size: 15px;
	color: #aaa;
}

.store-category-categories-number {
	color: #aaa;
}

#category-page-container {
	margin-top: 10px;
	margin-bottom: 50px;
}

#store-page-functions-menu-container {
	position: absolute;
	width: 100%;
	height: 100px;
	top: 0px;
	left: 0px;
}

.store-page-functions-menu-container-part {
	width: 100%;
}

.store-profile-title {
	font-size: 1.2rem;
	font-weight: 500;
}

.store-profile-title i {
	font-size: 1.3rem;
	margin-right: 5px;
	color: #999;
}

.store-item-data .store-profile-value {
	font-size: 1rem;
}

.store-profile-subtitle {
	font-weight: 500;
}

.store-working-hours-day {
	font-weight: 500;
}

.store-item-data .store-working-hours-hours {
	font-size: 1rem;
}

.store-hour-for-reservation .title {
	font-size: 1.1rem;
}

.store-hour-for-reservation-container {
	display: inline-block;
	position: relative;
}

.deactivate-store-hour-for-reservation-item {
	position: absolute;
	top: -15px;
	left: -15px;
	width: 35px;
	height: 35px;
	border-radius: 50%;
	line-height: 8px;
	z-index: 100;
}

#store-profile-menu-container {
	width: 100%;
}

.height-0 {
	height: 0px;
}

.social-media-item {
	width: 38px;
	height: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 3px;
	font-size: 1.3rem;
	text-decoration: none;
	color: var(--crabby-store-page-text-color);
	line-height: 4px;
}

.btn-favorite {
	font-size: 1.2rem;
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 4px;
	background-color: #eeeeee70;
}

.btn-favorite.active {
	background-color: rgba(220, 53, 69, 0.1);
	color: rgb(220, 53, 69);
}

.btn-favorite.active:hover {
	background-color: rgba(220, 53, 69, 0.2);
}

.btn-favorite:hover {
	background-color: #eeeeee;
}

.btn-review {
	font-size: 1.2rem;
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 4px;
	background-color: #eeeeee70;
}

.btn-review.active {
	background-color: #fdcc0d10;
	color: #fdcc0d;
}

.btn-review.active:hover {
	background-color: #fdcc0d20;
}

.btn-review:hover {
	background-color: #eeeeee;
}

.store-profile-preference {
	line-height: 8px;
	font-size: 1.2rem;
	border: 0px;
}

.favorite-store .store-profile-preference {
	height: 30px;
	width: 30px;
	line-height: 8px;
	border: 0px;
}

#category-container {
	padding-top: 40px;
	padding-bottom: 60px;
}

.reenie-beanie-regular {
	font-family: "Reenie Beanie", cursive;
	font-weight: 400;
	font-style: normal;
}

.mynerve-regular {
	font-family: "Mynerve", cursive;
	font-weight: 400;
	font-style: normal;
}

body {
	font-family: "Sofia Sans Condensed", sans-serif;
	font-optical-sizing: auto;
	font-style: normal;
}

body.new-template {
	background-color: var(--crabby-body-background-color);
}

#main-section-search-container {
	margin-top: 5px;
}

#hero-title {
	margin-top: 15px;
	font-size: 4rem;
	color: var(--crabby-hero-title-color);
	line-height: 4.2rem;
	font-weight: 900;
}

.hero-subtitle {
	font-size: 1.8rem;
	color: var(--crabby-hero-subtitle-color);
}

.welcome {
	font-size: 2.1rem;
	color: var(--crabby-default-color);
}

.store-category-info {
	width: 100%;
	height: 100%;
	padding-left: 10px
}

.store-item-category {
	margin-top: 5px;
	font-size: 0.9rem;
	line-height: 1rem;
	color: #aaa;
}

#make-proposal, #choose-interval, #datepicker-button, #choose-when {
	border: 1px solid #eee;
	padding: 12px;
	padding-left: 25px;
	padding-right: 25px;
}

#reservation-hours-container {
	min-height: 50px;
}

.store-page-title {
	font-size: 1.65rem;
}

.category-title-image {
	height: 120px;
	width: 120px;
	border-radius: 16px;
}

#main-search-results {
	background-color: var(--crabby-body-background-color);
	width: 100%;
	border: 1px solid var(--crabby-border-color);
	margin-top: 5px;
	border-radius: 0.375rem;
	position: absolute;
	padding: 5px;
	padding-top: 10px;
	padding-bottom: 10px;
	z-index: 10000;
	color: var(--crabby-default-color) !important;
	max-height: 300px;
	overflow-y: scroll;
	max-width: 635px;
}

.search-result-item {
	padding: 15px;
	padding-top: 10px;
	padding-bottom: 8px;
	border-radius: 0.7rem;
}

.search-result-item:hover {
	background-color: var(--crabby-background-color-hover);
}

.bg-blur {
	-webkit-backdrop-filter: blur(5px);
	backdrop-filter: blur(5px);
}

.bg-secondary {
	background-color: rgba(var(--crabby-bs-secondary-rgb), 1) !important;
}

.search-result-category {
	color: #aaa;
	line-height: 13px;
}

.search-result-store {
	font-size: 1.15rem;
	line-height: 1.25rem;
	color: var(--crabby-input-color) !important;
}

.search-result-address {
	line-height: 0.9rem;
	color: var(--crabby-input-color) !important;
}

#catalogue .category {
	display: flex;
	align-items: center;
}

.product-details .product-name {
	font-weight: bold;
	font-size: 17px;
}

.product-details .product-duration {
	font-size: 15px;
	margin-bottom: 4px;
}

.product-info .product-creation-date {
	font-size: 0.75rem;
	color: #919eab;
	margin-top: 2px;
}

#catalogue .category-name {
	font-weight: 500;
	font-size: 1.3rem;
}

#catalogue .product-info {
	margin-left: 5px;
}

.catalogue-category-item {
	cursor: pointer;
}

#catalogue .product-description, #catalogue .category-description {
	color: #444;
	font-size: 0.95rem;
	height: 22px;
}

#catalogue .category-description {
	border-bottom: 1px solid var(--crabby-border-color);
}

.ellipsis-multi-line {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1; /* Number of lines */
	overflow: hidden;
	text-overflow: ellipsis;
}

#catalogue .product-price {
	font-size: 1.1rem;
}

.product-details {
	line-height: 17px;
}

.checkout-footer {
	border-top: 1px solid #d7d7d7;
	margin-top: 10px;
	padding-top: 10px;
}

#catalogue > .category-item:first-child {
	margin-top: 10px;
}

.product-header {
	position: relative;
}

#catalogue .product-item {
	align-items: center;
	border-radius: 0.375rem;
	padding: 7px;
	min-height: 85px;
	position: relative;
	border: 1px solid var(--crabby-border-color);
}

.app-feature-container {
	background-color: var(--crabby-app-feature-home-background-color);
	border-radius: 1.25rem;
	padding: 10px;
	padding-top: 20px;
	padding-bottom: 20px;
	margin-top: 50px;
	color: var(--crabby-default-color);
}

.app-feature-description {
	min-height: 220px;
	display: flex;
	align-items: center;
}

#navbarSupportedContent {
	height: 61px;
}

.app-feature-value {
	font-size: 1.5rem;
	font-weight: bold;
}

#dropdown-menu-image-container {
	position: relative;
	height: 50px;
}

.app-feature-container:hover .app-feature-icon {
	transform: translate(0%, 15%);
	transition: all 0.5s ease-in-out;
}

.app-feature-container:hover {
	box-shadow: 5px 5px 15px var(--crabby-box-shadow-color);
	transition: all 0.5s ease-in-out;
}

.hero-subtitle {
	font-weight: 300;
}

.badge.text-bg-secondary {
	color: var(--crabby-text-bg-secondary-color) !important;
	background-color: var(--crabby-text-bg-secondary-background-color) !important;
}

.delete-favorite-store {
	font-size: 1.2rem;
	padding: 5px 7px;
}

.badge.text-bg-warning {
	color: var(--crabby-badge-warning-color) !important;
	background-color: var(--crabby-badge-warning-bg-color) !important;
}

.badge.text-bg-success {
	color: var(--crabby-badge-success-color) !important;
	background-color: var(--crabby-badge-success-bg-color) !important;
}

.text-bg-warning {
	color: #fff !important;
}

.badge.text-bg-danger {
	color: var(--crabby-badge-danger-color) !important;
	background-color: var(--crabby-badge-danger-bg-color) !important;
}

.badge.text-bg-primary {
	color: #0d6efd !important;
	background-color: #0d6efd30 !important;
}

.catalogue-modal-product-item-price {
	color: var(--crabby-catalogue-price-color);
	background: #1c252e;
	height: 30px;
	border-radius: 0.5rem;
	padding: 0px 6px;
}

.catalogue-modal-product-item {
	padding: 5px;
	border-radius: 0.7rem;
	cursor: pointer;
	min-height: 62px;
	border: 1px solid var(--bs-modal-header-border-color);
}

.catalogue-modal-product-item.active {
	background-color: #eee;
}

.checkout-date-container.is-invalid {
	border-color: red !important;
}

.catalogue-modal-product-item-image {
	width: 50px;
	height: 50px;
	border-radius: 0.6rem;
	background-color: #ddd;
}

.catalogue-modal-product-item-info {
	width: 100%;
}

.catalogue-modal-category-item {
	font-size: 1.2rem;
}

.catalogue-modal-product-item-info-name {
	font-size: 1.1rem;
}

.catalogue-modal-product-item-info-description {
	color: #bbb;
}

.favorite-store .image {
	height: 60px;
	width: 60px;
	min-width: 60px;
	border-radius: 0.7rem;
	background-color: #eee;
}

.favorite-store .image img{
	height: 100%;
	width: 100%;
	border-radius: 0.5rem;
	border-top-right-radius: 0rem;
	border-bottom-right-radius: 0rem;
}

.favorite-store {
	border-radius: 0.7rem;
	border: 1px solid var(--crabby-theme-border-color);
	text-decoration: none;
	color: var(--crabby-favorite-store);
}

.favorite-store .favorite-button-container {
	width: 100%;
}

/* Ensure the body and html take full height */
html, body {
	height: 100%;
	margin: 0;
}

.home-service-container {
	border: 1px solid #ddd;
	padding: 10px;
	border-radius: 0.7rem;
}

.home-service-title {
	font-size: 1.1rem;
}

.unselectable {
	user-select: none; /* Standard property */
	-webkit-user-select: none; /* For Safari and older versions of Chrome */
	-moz-user-select: none; /* For Firefox */
	-ms-user-select: none; /* For Internet Explorer */
}

.home-services-number {
	font-size: 3rem;
}

/* Flexbox layout for the wrapper */
.wrapper {
	display: flex;
	flex-direction: column;
	min-height: 100%; /* Ensure the wrapper covers the full height of the page */
}

/* Allow the main content to grow, pushing the footer down if needed */
main {
	flex: 1;
}

.table-title {
	display: none;
}

.table-responsive-crabby > tbody > tr > td.store-info-container {
	font-size: 1.1rem;
}

.table-row.selected {
	background-color: var(--crabby-table-selected-background-color);
}

.table-row {
	cursor: pointer;
}

#my-reservations-status-menu {
	box-shadow: inset 0 -2px 0 0 var(--crabby-table-filter-border);
	overflow-y: auto;
	padding-bottom: 2px;
}

.successful-reservation .employee-avatar {
	border: 1px solid #d7d7d7;
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 4px;
	color: #d7d7d7;
	width: 25px;
	height: 25px;
}

.successful-reservation {
	border: 1px solid #d7d7d7;
	border-radius: 0.375rem;
	max-width: 300px;
	margin: auto;
}

.app-feature-icon-container {
	display: flex;
	justify-content: center;
	margin-top: -56px;
	margin-bottom: 35px;
}

.app-feature-icon {
	border-radius: 50%;
	height: 72px;
	width: 72px;
	font-size: 2rem;
	display: flex;
	justify-content: center;
	align-items: center;
	line-height: 4px;
	color: #fff;
}

.bg-pink {
	background-color: rgb(255, 99, 153);
}

.bg-purple {
	background-color: rgb(137, 62, 251);
}

#svg-background-top {
	fill: var(--crabby-body-background-color);
	width: 100%;
	height: 237px;
	margin-top: -8.5%;
}

.form-control {
	background-color: var(--crabby-input-background-color);
	color: var(--crabby-input-color);
}

#main-navbar-container {
	height: 77px;
}

.navbar {
	position: relative;
	width: 100%;
	z-index: 1000;
	background-color: var(--crabby-body-background-color);
	transform: translateY(0); /* Default position */
}

.store-page-store-name {
	font-size: 4rem;
	font-weight: 900;
	color: var(--crabby-store-page-text-color);
	line-height: 4rem;
}

.store-page-store-category {
	margin-top: 18px;
	font-size: 1.8rem;
}

#store-page-store-logo-container {
	top: 0px;
	right: 0px;
}

#initialize-navbar {
	position: fixed;
}

.bg-opacity-15 {
	--bs-bg-opacity: 0.15 !important;
}

#store-page-store-logo {
	height: 120px;
	width: 120px;
	display: block;
	border: 3px solid var(--crabby-background-color-hover);
	border-radius: 15%;
}

/* START PAGINATION */

.pagination-container {
	display: flex;
	justify-content: right;
}

.pagination-container .active>.page-link, .pagination-container .page-link.active {
	color: #fff;
	background-color: #40c2cb;
	border-color: #41b4bc
}

.pagination-container .page-link {
	color: var(--crabby-text-default-color);
}

.pagination-pages {
	margin-left: 5px;
	margin-right: 5px;
}

.pagination-prev .page-link, .pagination-next .page-link {
	padding-left: 10px;
	padding-right: 10px;
}

/* END PAGINATION */

@keyframes slideDown {
	from {
		transform: translateY(-100%);
	}
	to {
		transform: translateY(0);
	}
}

@keyframes slideUp {
	from {
		transform: translateY(0);
	}
	to {
		transform: translateY(-100%);
	}
}

.main-navbar-hidden {
	animation: slideUp 0.5s ease-in-out forwards;
}

.main-navbar-fixed {
	position: fixed;
	top: 0;
	width: 100%;
	box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
	animation: slideDown 0.5s ease-in-out forwards;
}

.h2 {
	color: var(--crabby-text-color);
}

#main-container p {
	color: var(--crabby-text-color);
}

.pagination-container .paging-info {
	display: flex;
	align-items: center;
	margin-right: 10px;
	margin-bottom: 1rem;
}

@media (max-width: 1400px) {
	#user-profile-container #profile-name {
		font-size: 3.5rem;
		line-height: 4.4rem;
	}

	.line{
		width: 165px;
	}

	#svg-background-top {
		margin-top: -6.5%;
		height: 167px;
	}

	#home-image {
		bottom: -78px;
	}
}

@media (min-width: 1200px) {
	#user-profile-container #profile-name {
		font-size: 3rem;
		line-height: 4.4rem;
	}

	h3, .h3 {
		font-size: 1.50rem;
	}

	.h1 {
		font-size: 1.75rem;
	}
}

@media (max-width: 1199px) {
	h3, .h3 {
		font-size: 1.50rem;
	}

	#home-image {
		bottom: -4px;
		left: 20px;
	}

	.line {
		width: 135px;
	}

	.progress-step-title {
		left: -58px;
		font-size: 1.1rem;
		text-align: center;
		text-wrap: wrap !important;
	}
}

@media (max-width: 991px) {
	#checkout-container {
		max-height: 190px;
		overflow-y: scroll;
	}

	.store-exclusions-container {
		margin-top: 1.25rem !important;
	}

	.profile-logo-container{
		height: 95px;
		width: 95px;
		position: static;
	}

	.store-profile-box {
		min-height: auto;
	}

	#store-reservation-navigate-buttons-container {
		justify-content: end;
	}

	.checkout-date-container {
		min-height: auto;
	}

	#store-reservation-navigate-buttons-container {
		padding-bottom: 20px;
	}

	.checkout-date-container {
		border: 0px;
		padding: 20px;
	}

	#store-reservation-navigate-buttons-container {
		padding-top: 0rem;
	}

	#checkout-box {
		border: 1px solid var(--crabby-table-filter-border);
		padding: 5px 10px;
	}

	#home-image {
		position: unset;
		display: block;
		margin: auto;
		margin-top: 40px;
		width: 250px;
	}

	#checkout-data-container .h5 {
		margin-bottom: 0px;
	}

	#checkout-services-container {
		padding-bottom: 5px !important;
		max-height: 250px;
		overflow-y: scroll;
	}

	.checkout-footer > div {
		font-size: 1rem !important;
	}

	.checkout-date-container {
		margin-bottom: 5px;
	}

	#checkout-data-container > div {
		margin-top: 0px !important;
	}

	#checkout-data-container {
		position: fixed;
		bottom: 0px;
		left: 0px;
		right: 0px;
		padding-left: 0px;
		padding-right: 0px;
	}

	#checkout-data-container .custom-shadow {
		box-shadow: 0rem -0.1rem 1rem rgba(0, 0, 0, .15) !important;
	}

	.checkout-services-number {
		display: block !important;
	}

	.checkout-services {
		display: none;
	}

	.checkout-footer {
		border-top: 1px solid #d7d7d7;
		margin-top: 5px;
		padding-top: 5px;
	}

	.line {
		width: 150px;
	}

	.progress-step-title {
		left: -60px;
		font-size: 1.1rem;
		text-align: center;
	}
}

@media (max-width: 768px) {
	#hero-title {
		font-size: 4rem;
		line-height: 4rem;
	}

	.progress-step-title {
		width: 77px;
	}

	.table-responsive-crabby > tbody > tr > td.reservation-image-container {
		display: inline-block;
		width: 47px;
		text-align: right;
		padding: 0px !important;
		padding-right: 3px !important;
		padding-bottom: 5px !important;
	}

	.table-responsive-crabby > tbody > tr > td.store-info-container {
		display: inline-block;
		width: 50%;
		text-align: left;
		padding: 0px !important;
		padding-bottom: 5px !important;
	}

	.table-title {
		display: inline-block;
	}

	#svg-background-top {
		margin-top: -2%;
		height: 92px;
	}

	.line {
		width: 110px;
	}

	.progress-step-title {
		left: -24px;
		font-size: 1.1rem;
		text-align: center;
		text-wrap: wrap !important;
	}
}

@media (max-width: 576px) {
	#user-profile-container #profile-name {
		font-size: 2.5rem;
		line-height: 3rem;
	}

	#home-favorite-stores-container {
		margin-bottom: -40px;
	}

	#toast-container .toast {
		width: 100% !important;
	}

	.reservation-table-menu-item {
		display: block;
		text-align: center;
	}

	#hero-title {
		font-size: 2.7rem;
		line-height: 2.7rem;
	}

	.store-page-store-name {
		font-size: 2.2rem;
		line-height: 2.2rem;
	}

	#svg-background-top {
		margin-top: -3%;
		height: 70px;
	}

	#home-image {
		width: 60%;
		display: none;
	}

	.line {
		width: 75px;
	}

	.progress-step-title {
		left: -21px;
		font-size: 1rem;
		text-align: center;
		text-wrap: wrap !important;
	}
}

@media (max-width: 410px) {
	#svg-background-top {
		margin-top: -5%;
		height: 50px;
	}

	.line {
		width: 65px;
	}

	.progress-step-title {
		left: -21px;
		font-size: 1rem;
		text-align: center;
		text-wrap: wrap !important;
	}
}

@media (max-width: 360px) {
	#user-profile-container #profile-name {
		font-size: 2.2rem;
		line-height: 2.2rem;
	}

	.store-page-store-category {
		font-size: 1.5rem;
		line-height: 1.5rem;
	}

	.social-media-item {
		font-size: 1.1rem;
		width: 31px;
		height: 31px;
	}

	.store-profile-preference {
		font-size: 1rem;
	}

	#store-page-store-logo {
		height: 100px;
		width: 100px;
	}

	.btn-favorite {
		margin-left: 5px;
	}

	.store-page-store-name {
		font-size: 2.2rem;
		line-height: 2.2rem;
	}

	#hero-title {
		font-size: 2.4rem;
		line-height: 2.4rem;
	}

	.hero-subtitle {
		font-size: 1.6rem;
	}

	.line {
		width: 49px;
	}

	.progress-step-title {
		left: -21px;
		font-size: 0.9rem;
		text-align: center;
		text-wrap: wrap !important;
		width: 72px;
	}
}