h1{
	font-family: "Inter", Sans-serif;
    font-weight: 300 !important;
	padding-bottom: 40px !important;
}

.product-select-item,
.specialist-select-item,
.salon-select-item {
    cursor: pointer;
	border: none !important;
	    font-size: 16px !important;
}
.hidden{
	display:none !important;
}
.product-select-item:hover,
.specialist-select-item:hover,
.salon-select-item:hover {
    background-color: #f5f5f5;
    transition: background-color 0.2s ease;
}

/* Global text color */
body, .accordion, .accordion * {
    color: #1B1918 !important;
}


/* Base Font */
.accordion {
    font-family: "Inter", Sans-serif;
    font-weight: 300;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
}

/* Accordion Item Reset */
.accordion .accordion-item {
    border: none;
    background-color: transparent;
    margin-bottom: 0;
    border-radius: 0;
}

/* Accordion Header */
.accordion-button {
    background-color: #EDE9E3 !important;
    color: #A38F85;
    font-size: 18px !important;
    font-weight: 300 !important;
    padding: 0.75rem 1rem;
    border: none;
    border-radius: 0;
    text-decoration: none !important;
    transition: background-color 0.2s ease;
    box-shadow: none !important;
	height: 48px;
}

.accordion-button:hover {
    background-color: #dcd7cf !important;
}

/* Accordion Body */
.accordion-body {
    background-color: #F9F7F5 !important;
    padding: 0 !important;
    border-radius: 0;
}

/* Subcategory (nested) Header */
.accordion .accordion .accordion-item .accordion-button {
    background-color: #D9D9D959 !important;
    font-size: 16px;
    font-weight: 300;
    padding: 0.75rem 1rem;
    color: #000;
}
.accordion .accordion .accordion-item .accordion-button:hover{
	 background-color: #f5f5f5 !important;
}

/* Item Styling (Products, Specialists, Salonai) */
.product-select-item,
.specialist-select-item,
.salon-select-item {
    background-color: #fff;
    padding: 0.5rem 1rem;
    margin: 0;
    border: none;
    border-bottom: 1px solid #eee;
    font-size: 16px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.product-select-item:hover,
.specialist-select-item:hover,
.salon-select-item:hover {
    background-color: #f5f5f5;
}

/* Checkmark Icon */
.checkmark {
    font-size: 1rem;
    color: #7D9A86;
}

/* List Cleanup */
.list-group,
.list-group-item {
    border: none;
    margin: 0;
}
.list-group-item {
	height:48px;
}

/* Optional: Fix last item spacing */
.accordion .accordion-item:last-child {
    margin-bottom: 0;
}


input[type="text"]#product-search-input,
input[type="text"]#specialist-search-input {
    width: 100%;
	box-shadow: 0 2px 8px rgba(163, 143, 133, 0.1) !important;
	border: none;
    padding: 12px 16px;
    font-family: "Inter", sans-serif;
    font-size: 16px;
    font-weight: 300;
    color: #1B1918;
    transition: border 0.2s ease, box-shadow 0.2s ease;
    outline: none;
}

input[type="text"]#product-search-input::placeholder,
input[type="text"]#specialist-search-input::placeholder {
    color: #1B1918;
    font-weight: 300;
}

input[type="text"]#product-search-input:focus,
input[type="text"]#specialist-search-input:focus {
    box-shadow: 0 2px 8px rgba(163, 143, 133, 0.1);
}
 
//The GAP

/* Base (xs: <576px) */
.left-side {
	margin-right: 0%;
}
.right-side {
	margin-left: 0%;
}
/* lg: ≥992px */
@media (min-width: 992px) {
	.left-side {
		margin-right: 5%;
	}
	.right-side {
		margin-left: 5%;
	}
}

/* xl: ≥1200px */
@media (min-width: 1200px) {
	.left-side {
		margin-right: 6%;
	}
	.right-side {
		margin-left: 6%;
	}
}

/* xxl: ≥1400px */
@media (min-width: 1400px) {
	.left-side {
		margin-right: 7%;
	}
	.right-side {
		margin-left: 7%;
	}
}

/* ultra wide: ≥1600px */
@media (min-width: 1600px) {
	.left-side {
		margin-right: 8%;
	}
	.right-side {
		margin-left: 8%;
	}
}

/*right side*/

.styled-preview {
    overflow: hidden;
    font-family: "Inter", sans-serif;
    color: #1B1918;
}
@media (max-width: 768px) {
	
	.styled-preview {
		margin-top: 20px;
	}
}

.salon-preview-img {
    width: 100%;
    height: 400px;
    display: block;
    object-fit: cover;
}

.preview-info-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 2rem;
    background-color: #EDE9E3;
}

.preview-logo img {
    max-height: 48px;
	
    width: auto;
}

.preview-address {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    max-width: 65%;
}

.address-icon {
    width: 12px;
    height: auto;
    margin-top: auto;
	margin-bottom: auto;
}

.address-text {
    font-size: 14px;
    line-height: 1.4;
}

.preview-calendar {
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
	margin-top: 20px;
    padding: 1.25rem;
    font-size: 15px;
	background-color: #F9F7F5;
}
.address-text p{
	margin: 0;
}





.slot .time, .slot .price{
	font-size:16px;
}
.slot:hover{
	background:#EDE9E3;
	cursor:pointer;
}


.calendar-wrapper {
  border:1px solid #D9D9D9;
  padding: 15px 10px;
	margin-top:30px;
  font-family: sans-serif;
}
.navigations {
	position:relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom:15px;
}
.month {
  font-size:20px;
  margin-bottom: 10px;
}
.days-wrapper {
  display: flex;
  justify-content: space-between;
  gap: 6px;
}
.table-wrapper{
	max-height:500px;
	overflow-y:scroll;
}
.day {
  text-align: center;
  cursor: pointer;
  display:flex;
  flex-flow:column;
  gap:8px;
  padding:0px 5px;
  border-radius: 50%;
}
.days{
	z-index:9;
}
.weekday{
	font-size: 16px;
	line-height:1em;
	font-weight: 300;
}
.prev-week,.next-week{
	padding:10px;
	background:none;
	color: #1B1918;
}
.day-number{
	color: #1B1918;
	font-size: 20px;
	line-height:1em;
	font-weight: 300;
	display:flex;
	align-items:center;
	justify-content:center;
	width:40px;
	height:40px;
	border-radius:99px;
}
.day.active .day-number {
  background-color: #d44;
  color: white;
}
.slot {
  display: flex;
  justify-content: space-between;
  padding: 10px 10px;
  border-bottom: 1px solid #eee;
}
.arrows {
	position:absolute;
	width:100%;
	display:flex;
	justify-content:space-between;
	bottom:0;
	left:0;
    margin-top: 10px;
}
.slot-separator {
    height: 40px;
    line-height: 10px;
    border: none;
	background-color:rgba(245,245,245,1);
}
.slot.busy {
    opacity: 0.35;
    pointer-events: none;
    background: #f5f5f5;
}
.no-slots{
	font-size: 16px;
    text-align: center;
    padding: 20px 0px;
}
.slot .time, .slot .price {
    font-size: 16px;
}
.slot:hover {
    background: #EDE9E3;
    cursor: pointer;
}

/* selected slot styling */
.slot.selected {
    background: #d3e6d1;          /* light green */
    border: 1px solid #7d9a86;
}

/* wrapper around the two buttons */
.slot-buttons {
    margin-top: 4px;
    display: flex;
    gap: 6px;
}

/* basic button look – tweak to match your theme */
.slot-buttons button {
    font-size: 12px;
    padding: 2px 6px;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}
.slot-buttons .btn-add   { background: #7d9a86; color:#fff; }
.slot-buttons .btn-next  { background: #a38f85; color:#fff; }
.slot-buttons button:hover { opacity: 0.85; }

@media (max-width:1200px){
	.day-number{
		font-size:18px;
		width:30px;
		height:30px;
	}
}
@media (max-width:768px){
	.weekday{
		font-size:12px;
	}
		.day-number{
		font-size:14px;
		width:28px;
		height:28px;
	}
	.day{
		padding:0px 2px;
	}
	.table-wrapper{
		max-height:300px;
	}
}

.clear-filer{
    color: #EDE9E3 !important;
    font-size: 18px !important;
    padding: 10px 20px !important;
    font-weight: 400 !important;
    background: #000 !important;
    text-transform: none !important;
    transition: all 0.2s linear !important;
	border-radius: 0 !important;
	text-decoration: none !important;
}
.clear-filer:hover{
	opacity: 0.7;
}
.list-group-item.empty-state {
  font-size: 16px;
  font-weight: 300;
  color: #1B1918;
  opacity: 1; /* remove Bootstrap's gray/fade */
}


/* Dienos, kuriose yra bent vienas laisvas laikas */
.day.has-free .day-number {
  background: #DDEFFF;      /* švelniai mėlyna */
  color: #1B1918;
}

/* Jei diena aktyvi – paliekame tavo raudoną indikatorių */
.day.active .day-number {
  background-color: #d44;
  color: #fff;
}

/* Nuoroda į artimiausią laiką */
.next-available-link {
  display: inline-block;
  margin-top: 8px;
  font-size: 14px;
  text-decoration: underline;
  cursor: pointer;
}

/* Let list items grow to fit multi-line titles */
.list-group-item {
  height: auto !important;     /* was 48px */
  min-height: 48px;            /* keep the nice minimum */
  align-items: flex-start;      /* because titles can be multi-line */
}

/* Ensure the text area wraps and takes available width */
.product-select-item > span:first-child,
.specialist-select-item > span:first-child,
.salon-select-item > span:first-child {
  flex: 1 1 auto;
  white-space: normal;          /* allow wrapping */
  word-break: break-word;       /* safety for very long words */
}

/* Keep the checkmark nicely aligned on multi-line rows */
.product-select-item .checkmark,
.specialist-select-item .checkmark,
.salon-select-item .checkmark {
  margin-left: 8px;
  align-self: center;
}

/* Accordion headers shouldn’t be hard-fixed either */
.accordion-button {
  height: auto !important;      /* was 48px */
  min-height: 48px;
  align-items: center;
  white-space: normal;          /* allow wrapping if needed */
  line-height: 1.2;
}

/* Nested accordion headers too */
.accordion .accordion .accordion-item .accordion-button {
  height: auto !important;
  min-height: 44px;
  white-space: normal;
}

/* Make sure collapsed bodies don't visually bleed */
.accordion-collapse { overflow: hidden; }