<style>	
	/* === ΓΕΝΙΚΗ ΓΡΑΜΜΑΤΟΣΕΙΡΑ ΣΕ ΟΛΟ ΤΟ DASHBOARD === */
	.barbershop-dashboard,
	.barbershop-dashboard * {
		font-family: Arial, Helvetica, "Segoe UI", sans-serif !important;
		color: #222 !important;
	}

	/* Επικεφαλίδες (όχι τα έντονα κόκκινα του θέματος) */
	.barbershop-dashboard h1,
	.barbershop-dashboard h2,
	.barbershop-dashboard h3,
	.barbershop-dashboard h4,
	.barbershop-dashboard h5 {
	  color: #000 !important;
	  font-weight: 700 !important;
	  margin: 0 0 8px 0;
	  line-height: 1.25;
	}
	.barbershop-dashboard h1 {
		font-size: 34px !important;
	}
	.barbershop-dashboard h2 {
		font-size: 32px !important;
	}
	.barbershop-dashboard h3 {
		font-size: 22px !important;
	}
	.barbershop-dashboard h4 {
		font-size: 20px !important;
	}

	/* Βασικό μέγεθος κειμένου */
	.barbershop-dashboard { font-size: 16px; }

	/* Πίνακας ραντεβού (λίγο πιο “καθαρός”) */
	.barbershop-dashboard .appointments-table {
	  width: 100%;
	  border-collapse: collapse;
	  margin: 12px 0 16px;
	  font-size: 15px;
	}
	.barbershop-dashboard .appointments-table th,
	.barbershop-dashboard .appointments-table td {
	  border: 1px solid #ddd;
	  padding: 10px;
	  vertical-align: top;
	  text-align: left;
	}
	.barbershop-dashboard .appointments-table th { background: #faf4f4 !important; font-weight: 600 !important; }
	.barbershop-dashboard .appointments-table tr:hover { background: #fff9f4 !important; }
	.barbershop-dashboard .appointments-table .services { white-space: normal; line-height: 1.35; }

	/* Κουμπί "Κράτηση νέου ραντεβού" (μαύρο → σκούρο γκρι στο hover) */
	.btn-dark {
	  background: #000  !important; color: #fff  !important; border: none;
	  padding: 10px 16px; border-radius: 6px; cursor: pointer;
	  transition: background-color .2s ease;
	}
	.barbershop-dashboard .btn-dark:hover { background: #333  !important; }
	.barbershop-dashboard .btn-dark:disabled { opacity: .6; cursor: default; }

	/* Δευτερεύον κουμπί (Λίστα ραντεβού) */
	.barbershop-dashboard .btn-outline-dark {
	  background: #fff; color: #000; border: 1px solid #000;
	  padding: 9px 16px; border-radius: 6px; cursor: pointer;
	  transition: all .2s ease;
	}
	.barbershop-dashboard .btn-outline-dark:hover { background: #000; color: #fff; }

	/* Fade εναλλαγής views */
	.barbershop-dashboard .fade { opacity: 0; transition: opacity .3s ease; }
	.barbershop-dashboard .fade.show { opacity: 1; }
	.barbershop-dashboard .hidden { display: none !important; }

	/* Προσαρμογές υπαρχόντων στοιχείων σου */
	#timeslots-container { margin-top: 20px; margin-bottom: 20px; }
	#timeslots-container button { color: #0d6efd !important; border-color: #0d6efd !important; }
	#timeslots-container button.active { background-color: #0d6efd !important; color: #fff !important; border-color: #0d6efd !important; }
	#timeslots-container button:hover { color: #fff !important; background-color: #0b5ed7 !important; }
	/* Back buttons */
	.btn-outline-secondary { color: #fff !important; background-color: #5b74cd !important; border-color: #5b74cd !important; }
	.btn-outline-secondary:hover { color: #fff !important; background-color: #39405a !important; border-color: #39405a !important; }
	
	.barbershop-dashboard .btn-primary { color: #fff !important; }
	.barbershop-dashboard .btn-success { color: #fff !important; }
	
	.barbershop-dashboard .form-check { padding-bottom: 5px !important; }
	
	.bs-toolbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin:10px 0 16px}
	.bs-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:10px;text-decoration:none;font-weight:600;line-height:1;border:1px solid transparent;cursor:pointer}
	.bs-btn-dark{background:#000;color:#fff;border-color:#000}
	.bs-btn-dark:hover{background:#222}
	.bs-btn-outline{background:transparent;color:#111;border-color:#ddd}
	.bs-btn-outline:hover{border-color:#bbb}
	
	/* flesha style */
	/* --- Header ημερομηνιών τύπου Fresha --- */
	.bs-date-header {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 12px;
	}

	.bs-month-label {
		font-size: 18px;
		font-weight: 600;
	}

	/* --- Λωρίδα 7 ημερών --- */
	.bs-date-strip {
	  display: flex;
	  gap: 0;
	  justify-content: space-between;
	  padding: 4px 0 8px;
	}

	/* κάθε “ημερομηνία” (pill) */
	.bs-date-pill {
	  display: flex;
	  flex-direction: column;
	  align-items: center;
	  gap: 4px;
	  flex: 1 1 calc(100% / 7);
	  cursor: pointer;
	}

	/* κυκλός με αριθμό ημέρας */
	.bs-date-pill .day-circle {
	  width: 52px;
	  height: 52px;
	  margin: 0 auto;
	  border-radius: 50%;
	  border: 1px solid #ddd;
	  background: #fff;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  font-size: 18px;
	  font-weight: 600;
	  transition: background-color .2s ease, border-color .2s ease, color .2s ease;
	}

	/* ονομασία ημέρας κάτω από τον κύκλο (π.χ. Δευ) */
	.bs-date-pill .day-name {
	  font-size: 12px;
	  font-weight: 500;
	}

	/* ενεργό (επιλεγμένο) */
	.bs-date-pill.active .day-circle {
	  background: #0d6efd;
	  border-color: #0d6efd;
	  color: #fff;
	}

	/* disabled μέρες (εκτός range ή αργότερα θα βάλουμε "χωρίς διαθεσιμότητα") */
	.bs-date-pill.disabled {
	  cursor: default;
	}
	
	.bs-date-pill.disabled .day-circle {
	  background: #e4e4e4;
	  border-color: #c5c5c5;
	  color: #9a9a9a;
	  opacity: 0.7;
	}
	.bs-date-pill.disabled .day-name {
	  color: #9a9a9a;
	}
	
	/* 2-Column layout με καλύτερες αναλογίες */
	.bs-step3-grid{
	  display:flex;
	  gap:32px;
	  align-items:flex-start;
	}

	/* Αριστερή στήλη: ημερομηνία / barbers / timeslots */
	.bs-step3-main{
	  flex:0 0 62%;
	}

	/* Δεξιά στήλη: σύνοψη */
	.bs-step3-summary{
	  flex:0 0 38%;
	}

	/* Mobile responsive */
	@media (max-width: 768px){
	  .bs-step3-grid{
		flex-direction:column;
	  }
	  .bs-step3-main,
	  .bs-step3-summary{
		flex:1 1 100%;
	  }
	}

	.bs-step3-summary{
	  flex:1;
	  background:#fff;
	  border:1px solid #eee;
	  border-radius:10px;
	  padding:16px 18px;
	  font-size:14px;
	}
	/* Summary rows με τίτλο αριστερά & τιμή δεξιά */
	.bs-summary-row{
	  display:flex;
	  justify-content:space-between;
	  align-items:flex-start;
	  gap:8px;
	  margin-bottom:4px;
	  font-size:14px;
	}
	.bs-summary-title{flex:1;}
	.bs-summary-price{flex-shrink:0;}

	.bs-summary-total{
	  margin-top:8px;
	  padding-top:8px;
	  border-top:1px solid #eee;
	  font-weight:700;
	  display:flex;
	  justify-content:space-between;
	}
	.bs-summary-total span{
	  font-weight:700;
	}

	/* Responsive: σε μικρές οθόνες κάν’ το stack */
	@media (max-width: 768px){
	  .bs-step3-grid{
		flex-direction:column;
	  }
	}

	/* Header σειρά: avatar barber + datepicker δεξιά */
	.bs-step3-header-row{
	  display:flex;
	  align-items:center;
	  justify-content:space-between;
	  gap:12px;
	  margin-bottom:10px;
	}

	/* Barber header με avatar */
	.bs-barber-header{
	  display:flex;
	  align-items:center;
	  gap:8px;	  
	}

	.bs-barber-avatar{
	  width:64px;
	  height:64px;
	  border-radius:50%;
	  overflow:hidden;
	  background:#eee;
	  flex-shrink:0;
	  display:flex;
	  align-items:center;
	  justify-content:center;
	  font-weight:600;
	  font-size:22px;
	}

	.bs-barber-avatar img{
	  width:100%;
	  height:100%;
	  object-fit:cover;
	}

	.bs-barber-name{
	  font-weight:600;
	}

	/* Date icon (όπως είχαμε) */
	.bs-date-input-wrap{
	  position:relative;
	  width:40px;
	  height:40px;
	}
	.bs-date-input-wrap input.bs-date-icon-input{
	  position:absolute;
	  inset:0;
	  width:100%;
	  height:100%;
	  opacity:0;
	  cursor:pointer;
	  z-index:2;
	}
	.bs-date-input-wrap input.bs-date-icon-input::-webkit-calendar-picker-indicator{
	  opacity:0;
	}
	.bs-date-input-wrap::before{
	  content:"📅";
	  position:absolute;
	  inset:0;
	  display:flex;
	  align-items:center;
	  justify-content:center;
	  border:1px solid #ddd;
	  border-radius:8px;
	  font-size:20px;
	  background:#fff;
	  pointer-events:none;
	}

	/* Μήνας + βελάκια */
	.bs-month-row{
	  display:flex;
	  align-items:center;
	  justify-content:space-between;
	  gap:12px;
	  margin-bottom: 10px;
	}
	.bs-month-label{
	  font-size:18px;
	  font-weight:600;
	}
	.bs-month-nav{
	  display:flex;
	  gap:4px;
	}
	
	.bs-nav-btn {
		border: 1px solid #ddd;
		background: #fff;
		border-radius: 8px;
		width: 32px;
		height: 32px;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 18px;
		font-weight: 600;
		color: #555 !important;
		padding: 0;
		cursor: pointer;
	}

	.bs-nav-btn:hover {
		background: #f5f5f5;
	}

	/* Sidebar σύνοψης */
	#booking-summary-sidebar .bs-summary-section{
	  margin-bottom:10px;
	}
	#booking-summary-sidebar .bs-summary-label, 
	#booking-summary-sidebar-step2 .bs-summary-label,
	#booking-summary-sidebar-step1 .bs-summary-label{
	  font-weight:600;
	  margin-bottom:10px;
	}
	#booking-summary-sidebar ul{
	  padding-left:18px;
	  margin:0;
	}
	#booking-summary-sidebar .bs-summary-total{
	  margin-top:8px;
	  padding-top:8px;
	  border-top:1px solid #eee;
	  font-weight:700;
	}
	#booking-summary-sidebar .bs-service-row{
	  display:flex;
	  justify-content:space-between;
	  gap:8px;
	  margin-bottom:6px;
	}

	#booking-summary-sidebar .bs-service-title{
	  flex:1;
	}

	#booking-summary-sidebar .bs-service-price{
	  white-space:nowrap;
	  font-weight:600;
	}
	#timeslots-container button {
		margin-bottom: 6px !important; /* ή 5px */
		margin-left: 2px;
		margin-right: 2px;
	}
	/* Mobile adjustments για την λωρίδα ημερών */
	@media (max-width: 480px) {

		.bs-date-strip {
			gap: 4px; /* μικρότερο κενό μεταξύ pills */
		}

		.bs-date-pill .day-circle {
			width: 35px;
			height: 35px;
			font-size: 16px;
		}

		.bs-date-pill .day-name {
			font-size: 12px;
		}
	}
	
	/* Λίστα barbers σε κάρτες, τύπου Fresha */
	.bs-barber-list{
	  display:flex;
	  flex-direction:column;
	  gap:10px;
	}

	.bs-barber-wrapper{
	  position:relative;
	}

	.bs-barber-radio{
	  position:absolute;
	  opacity:0;
	  pointer-events:none;
	}

	.bs-barber-card{
	  display:flex;
	  align-items:center;
	  justify-content:space-between;
	  padding:10px 14px;
	  border-radius:10px;
	  border:1px solid #ddd;
	  background:#fff;
	  cursor:pointer;
	  transition:border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
	}

	.bs-barber-card-left{
	  display:flex;
	  align-items:center;
	  gap:10px;
	}

	.bs-barber-card .bs-barber-avatar{
	  width:48px;
	  height:48px;
	  border-radius:50%;
	  overflow:hidden;
	  background:#eee;
	  display:flex;
	  align-items:center;
	  justify-content:center;
	  font-size:20px;
	  flex-shrink:0;
	}
	.bs-barber-card .bs-barber-avatar img{
	  width:100%;
	  height:100%;
	  object-fit:cover;
	}

	.bs-barber-info{
	  display:flex;
	  flex-direction:column;
	}
	.bs-barber-nickname{
	  font-weight:600;
	}
	.bs-barber-role{
	  font-size:12px;
	  color:#777;
	}

	/* Δεξιά “checkbox” ένδειξη */
	.bs-barber-select-indicator{
	  width:22px;
	  height:22px;
	  border-radius:50%;
	  border:1.5px solid #bbb;
	  display:flex;
	  align-items:center;
	  justify-content:center;
	  font-size:14px;
	  color:#fff;
	}

	/* Επιλεγμένη κάρτα */
	.bs-barber-radio:checked + .bs-barber-card{
	  border-color:#5b74cd;
	  box-shadow:0 0 0 2px rgba(91,116,205,.15);
	  background:#f7f8ff;
	}
	.bs-barber-radio:checked + .bs-barber-card .bs-barber-select-indicator{
	  background:#5b74cd;
	  border-color:#5b74cd;
	}
	.bs-barber-radio:checked + .bs-barber-card .bs-barber-select-indicator::before{
	  content:"✓";
	  color:#fff;
	  font-size:14px;
	}
	/* Κουμπιά στη δεξιά στήλη του Step 2 */
	.bs-step2-actions{
	  margin-top:50px;
	  display:flex;
	  flex-direction:column;
	  gap:16px;
	}

	/* Δύο κουμπιά στην ίδια γραμμή */
	.bs-step2-row{
	  display:flex;
	  gap:12px;
	}

	.bs-step2-row .btn{
	  flex:1 1 50%;
	  padding:10px 0;
	}

	.bs-step2-actions .btn-dark{
	  padding:12px 0;
	}

	.bs-step2-actions .btn{
	  width:100%;              /* να πιάνουν όλο το πλάτος του sidebar */
	}
	/* end flesha style */
	
	/* === SUMMARY IMPROVEMENTS === */
	/* Γενική γραμματοσειρά Arial στο sidebar */
	.bs-step3-summary,
	.bs-step3-summary * {
		font-family: Arial, sans-serif !important;
	}

	/* Μεγαλύτερο κενό μεταξύ των sections */
	.bs-summary-section {
		margin-bottom: 18px !important;
	}

	/* Κενό ανάμεσα στην ημερομηνία και την ώρα */
	.bs-summary-datetime-block {
		margin-bottom: 16px;
	}

	/* Υπηρεσίες: μεγαλύτερη απόσταση και καθαρό layout */
	.bs-summary-services-list {
		margin-top: 8px;
		margin-bottom: 12px;
	}

	.bs-summary-services-list div {
		display: flex;
		justify-content: space-between;
		padding: 4px 0;
		border-bottom: 1px solid #f0f0f0;
		font-size: 15px;
	}

	.bs-summary-services-list div:last-child {
		border-bottom: none;
	}

	/* Σύνολο (bold + μεγαλύτερο κενό) */
	.bs-summary-total {
		margin-top: 20px !important;
		padding-top: 10px !important;
		border-top: 2px solid #ccc !important;
		font-weight: bold !important;
		font-size: 16px !important;
	}

	/* Κενό πάνω από τα κουμπιά */
	.bs-summary-buttons {
		margin-top: 35px;
	}
	
	/* Λίστα υπηρεσιών στο Βήμα 1 – layout τύπου κάρτας */
	.bs-service-row{
	  display:flex;
	  align-items:center;
	  justify-content:space-between;
	  gap:12px;
	  padding:8px 0;
	  border-bottom:1px solid #eee;
	}

	.bs-service-row:last-child{
	  border-bottom:none;
	}

	.bs-service-info{
	  flex:1;
	}

	.bs-service-title{
	  font-weight:600;
	  margin-bottom:2px;
	}

	.bs-service-meta{
	  font-size:13px;
	  color:#666;
	}

	.bs-service-check input[type="checkbox"]{
	  width:20px;
	  height:20px;
	  cursor:pointer;
	}

	/* Λίγο hover για καλύτερο UX */
	.bs-service-row:hover{
	  background:#f9f9f9;
	}
	
	/* Λίστα υπηρεσιών στο Βήμα 1 */
	.bs-service-list{
	  display:flex;
	  flex-direction:column;
	  gap:8px;
	}

	/* Κάθε κάρτα υπηρεσίας (όπως οι barbers) */
	.bs-service-item{
	  display:flex;
	  align-items:center;
	  justify-content:space-between;
	  padding:10px 14px;
	  border-radius:10px;
	  border:1px solid #e0e0e0;
	  background:#fff;
	  cursor:pointer;
	  transition:border-color .2s ease,
				 box-shadow .2s ease,
				 background-color .2s ease;
	}

	.bs-service-item:hover{
	  border-color:#b6c7ff;
	  box-shadow:0 0 0 1px rgba(0,0,0,0.02);
	}

	/* Όταν είναι επιλεγμένη υπηρεσία */
	.bs-service-item.selected{
	  border-color:#4e7fff;
	  box-shadow:0 0 0 2px rgba(78,127,255,.25);
	  background:#f7f9ff;
	}

	/* Αριστερό μέρος (τίτλος + διάρκεια/περιγραφή) */
	.bs-service-main{
	  display:flex;
	  flex-direction:column;
	  gap:3px;
	}

	.bs-service-title{
	  font-weight:600;
	}

	.bs-service-meta{
	  font-size:13px;
	  color:#555;
	}

	/* Δεξιά: τιμή + checkbox στην ίδια γραμμή */
	.bs-service-right{
	  display:flex;
	  align-items:center;
	  gap:10px;
	}

	.bs-service-price{
	  font-weight:600;
	  white-space:nowrap;
	  font-size:14px;
	}

	/* Το checkbox λίγο πιο “γεμάτο” */
	.bs-service-checkbox{
	  width:18px;
	  height:18px;
	}

	.bs-service-checkbox {
		/* κρύβουμε το default checkbox */
		appearance: none;
		-webkit-appearance: none;
		width: 20px;
		height: 20px;
		border: 2px solid #c5c5c5;
		border-radius: 50%;   /* ΣΤΡΟΓΓΥΛΟ */
		cursor: pointer;
		position: relative;
		transition: all .2s ease;
		background-color: #fff;
	}

	/* Hover effect */
	.bs-service-item:hover .bs-service-checkbox {
		border-color: #9bb4ff;
	}

	/* Όταν είναι επιλεγμένο */
	.bs-service-checkbox:checked {
		border-color: #4e7fff;
		background-color: #4e7fff;
	}

	/* Το ✓ μέσα */
	.bs-service-checkbox:checked::after {
		content: "✓";
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -55%);
		font-size: 14px;
		color: #fff;
		font-weight: 600;
	}

	/* ============================
	   STEP 0 – Branch selection
	   ============================ */

	.bs-branch-grid {
	  display: grid;
	  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	  gap: 20px;
	  margin-bottom: 24px;
	}

	.bs-branch-card {
	  border: 1px solid #e4e4e4;
	  border-radius: 16px;
	  background: #fff;
	  padding: 12px;
	  display: flex;
	  flex-direction: column;
	  text-align: left;
	  cursor: pointer;
	  transition: box-shadow 0.18s ease, transform 0.18s ease, border-color 0.18s ease;
	  outline: none;
	}

	.bs-branch-card:hover {
	  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.08);
	  transform: translateY(-2px);
	  border-color: #000;
	}

	.bs-branch-card.selected {
	  border-color: #000;
	  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
	}

	.bs-branch-image-wrap {
	  width: 100%;
	  border-radius: 12px;
	  overflow: hidden;
	  margin-bottom: 10px;
	}

	.bs-branch-image {
	  width: 100%;
	  height: auto;
	  display: block;
	}

	.bs-branch-content {
	  display: flex;
	  flex-direction: column;
	  gap: 4px;
	}

	.bs-branch-title {
	  font-size: 15px;
	  font-weight: 600;
	  color: #111;
	}

	.bs-branch-subtitle {
	  font-size: 13px;
	  color: #666;
	}
	
	/* Κουμπί "Χ" */
	.wizard-topbar{
	  position: sticky;
	  top: 0;
	  z-index: 50;
	  display: flex;
	  justify-content: flex-end;
	  align-items: center;
	  padding: 10px 0;
	  background: #fff; /* να μη φαίνονται τα elements από κάτω όταν κολλάει */
	}

	#reset-booking-btn{
	  width: 34px;
	  height: 34px;
	  border-radius: 999px;
	  border: 1px solid #d0d0d0;
	  background: #fff;
	  cursor: pointer;
	  font-size: 20px;
	  line-height: 32px;
	  text-align: center;
	  padding: 0;
	  color: #000;
	}

	#reset-booking-btn:hover{
	  background: #f6f6f6;
	}
	
	.group-hub-list{
	  display:flex;
	  flex-direction:column;
	  gap:10px;
	  margin: 10px 0 14px;
	}

	.group-hub-card{
	  border:1px solid #e5e7eb;
	  border-radius:10px;
	  padding:10px 12px;
	  display:flex;
	  justify-content:space-between;
	  align-items:center;
	  gap:10px;
	  background:#fff;
	}

	.group-hub-card .meta{
	  display:flex;
	  flex-direction:column;
	  gap:4px;
	}

	.group-hub-card .name{
	  font-weight:600;
	}

	.group-hub-card .services{
	  color:#555;
	  font-size: 13px;
	}

	.group-hub-card .actions{
	  display:flex;
	  gap:8px;
	}

	.group-hub-card .actions button{
	  border:1px solid #ddd;
	  background:#fff;
	  border-radius:8px;
	  padding:6px 10px;
	  cursor:pointer;
	}

	.group-hub-actions{
	  display:flex;
	  justify-content:space-between;
	  gap:10px;
	}
	
	.group-member-switcher{
	  display:flex;
	  gap:8px;
	  flex-wrap:wrap;
	  margin-bottom:10px;
	}

	.group-member-pill{
	  border:1px solid #e5e7eb;
	  border-radius:999px;
	  padding:6px 10px;
	  cursor:pointer;
	  background:#fff;
	  font-size:13px;
	}

	.group-member-pill.active{
	  border-color:#111827;
	  background:#f3f4f6;
	  font-weight:600;
	}
	
	/* ============ Group Hub Fresha-like Layout ============ */
	.bs-group-hub-grid{
	  display:grid;
	  grid-template-columns: 1.3fr 0.7fr;
	  gap:18px;
	  align-items:start;
	}

	@media (max-width: 900px){
	  .bs-group-hub-grid{ grid-template-columns: 1fr; }
	}

	.bs-hub-left{ min-width:0; }
	.bs-hub-right{
	  position: sticky;
	  top: 70px; /* κάτω από το sticky topbar */
	  background:#fff;
	  border:1px solid #e5e7eb;
	  border-radius:12px;
	  padding:12px;
	}

	.bs-hub-right .hint{
	  font-size:13px;
	  color:#555 !important;
	  line-height:1.35;
	  margin-top:10px;
	}

	.group-hub-card{
	  border:1px solid #e5e7eb;
	  border-radius:12px;
	  padding:12px;
	  display:flex;
	  justify-content:space-between;
	  align-items:flex-start;
	  gap:12px;
	  background:#fff;
	}

	.group-hub-card .name{
	  display:flex;
	  align-items:center;
	  gap:8px;
	  font-weight:700;
	}

	.group-hub-badge{
	  font-size:12px;
	  padding:2px 8px;
	  border-radius:999px;
	  border:1px solid #e5e7eb;
	  background:#f9fafb;
	}

	.group-hub-card .services{
	  color:#555 !important;
	  font-size:13px;
	  margin-top:4px;
	}

	.group-hub-card .barber{
	  color:#111 !important;
	  font-size:13px;
	  margin-top:6px;
	}

	.group-hub-actions{
	  display:flex;
	  gap:8px;
	  justify-content:flex-end;
	  flex-wrap:wrap;
	}

	.group-hub-actions button{
	  border:1px solid #ddd;
	  background:#fff;
	  border-radius:10px;
	  padding:8px 10px;
	  cursor:pointer;
	  font-weight:600;
	}
	
	.summary-member-title{
	  font-weight:700;
	  margin:6px 0 4px;
	}
	.summary-services{
	  margin:0 0 8px 16px;
	}
	.summary-services li{
	  margin:2px 0;
	}
	.summary-divider{
	  border:none;
	  border-top:1px solid #e5e7eb;
	  margin:10px 0;
	}
	.muted{ color:#9ca3af; }
	
	/* Step 1 (Group) - μικρότερα titles μελών στο summary */
	#booking-summary-sidebar-step1 .summary-member-title{
	  font-size: 14px;
	  font-weight: 600;
	  margin: 6px 0 2px;
	  line-height: 1.15;
	}
	#booking-summary-sidebar-step1 .summary-services{
	  margin-top: 2px;
	}
	/* ===== Group Hub – Right panel buttons ===== */
	#step-group-hub .group-hub-actions{
	  display:flex;
	  gap:10px;
	  justify-content:flex-end;
	}

	#group-hub-add-btn{
	  background:#fff;
	  color:#111;
	  border:1px solid #d1d5db;
	  padding:10px 14px;
	  border-radius:8px;
	  font-weight:600;
	  cursor:pointer;
	}

	#group-hub-add-btn:hover{
	  background:#f3f4f6;
	}

	#group-hub-continue-btn{
	  background:#2563eb;            /* ίδιο μπλε με τα άλλα “Επόμενο” */
	  color:#fff;
	  border:none;
	  padding:10px 16px;
	  border-radius:8px;
	  font-weight:600;
	  cursor:pointer;
	}

	#group-hub-continue-btn:hover{
	  background:#1e40af;
	}

	/* ===== Group Hub – Right summary card ===== */
	#step-group-hub .bs-hub-right{
	  background:#fff;
	  border:1px solid #e5e7eb;
	  border-radius:12px;
	  padding:16px;
	}

	#step-group-hub .bs-hub-right .hint{
	  font-size:13px;
	  color:#6b7280;
	  line-height:1.4;
	  margin-top:12px;
	}
	
	/* ===== Group Hub – Member cards ===== */
	.group-hub-card{
	  background:#fff;
	  border:1px solid #e5e7eb;
	  border-radius:12px;
	  padding:12px 14px;
	  margin-bottom:10px;
	}

	.group-hub-card .name{
	  display:flex;
	  align-items:center;
	  gap:6px;
	  font-weight:600;
	}

	.group-hub-badge{
	  font-size:11px;
	  padding:2px 6px;
	  border-radius:999px;
	  background:#e0e7ff;
	  color:#1e3a8a;
	}

	.group-hub-card .actions button{
	  background:transparent;
	  border:none;
	  cursor:pointer;
	  font-size:14px;
	}

	.group-hub-card .actions button:hover{
	  color:#dc2626;
	}
	
	/* ===== Group Hub – Action buttons μέσα στις κάρτες (Edit / Trash) ===== */
	#step-group-hub .group-hub-card{
	  display:flex;
	  align-items:flex-start;
	  justify-content:space-between;
	  gap:12px;
	}

	#step-group-hub .group-hub-card .actions{
	  display:flex;
	  gap:8px;
	  align-items:center;
	  flex-shrink:0;
	}

	#step-group-hub .group-hub-card .actions button{
	  background:#fff;
	  color:#111827;
	  border:1px solid #d1d5db;
	  border-radius:999px;
	  padding:6px 10px;
	  font-size:13px;
	  font-weight:600;
	  cursor:pointer;
	  line-height:1;
	  display:inline-flex;
	  align-items:center;
	  gap:6px;
	}

	#step-group-hub .group-hub-card .actions button:hover{
	  background:#f3f4f6;
	}

	#step-group-hub .group-hub-card .actions button[data-action="remove"]{
	  border-color:#fecaca;
	  color:#b91c1c;
	}

	#step-group-hub .group-hub-card .actions button[data-action="remove"]:hover{
	  background:#fee2e2;
	}

	/* Step 2 (Group) – member switcher pills */
	#group-barber-member-switcher{
	  display:flex;
	  gap:8px;
	  align-items:center;
	  margin: 8px 0 12px;
	}

	#group-barber-member-switcher button{
	  background:#fff;
	  color:#111827;
	  border:1px solid #d1d5db;
	  padding:6px 10px;
	  border-radius:999px;
	  font-size:13px;
	  font-weight:600;
	  cursor:pointer;
	  line-height:1;
	}

	#group-barber-member-switcher button:hover{
	  background:#f3f4f6;
	}

	#group-barber-member-switcher button.active{
	  background:#2563eb;
	  color:#fff;
	  border-color:#2563eb;
	}
	
	/* Step 3 (Group) – proposals buttons σαν timeslots */
	#group-proposals-container .group-proposals-list{
	  display:flex;
	  flex-wrap:wrap;
	  gap:8px;
	}

	#group-proposals-container .bs-slot-btn{
	  background:#fff;
	  color:#0d6efd;
	  border:1px solid #0d6efd;
	  border-radius:8px;
	  padding:10px 12px;
	  font-weight:600;
	  cursor:pointer;
	  line-height:1;
	  min-width:70px;
	  text-align:center;
	}

	#group-proposals-container .bs-slot-btn:hover{
	  background:#0b5ed7;
	  color:#fff;
	  border-color:#0b5ed7;
	}

	#group-proposals-container .bs-slot-btn.active{
	  background:#0d6efd;
	  color:#fff;
	  border-color:#0d6efd;
	}
	
	.bs-summary-member-title{
	  font-size:14px;
	  font-weight:700;
	  margin:8px 0 6px;
	}

	.bs-summary-divider{
	  border:0;
	  border-top:1px solid #e5e7eb;
	  margin:10px 0;
	}
	/* Hide intro headers όταν ξεκινά το wizard */
	body.wizard-active .dashboard-intro{
	  display: none !important;
	}
	.bs-summary-member-title{
	  display:flex;
	  align-items:center;
	  gap:6px;
	}

	.bs-summary-member-barber{
	  font-size:13px;
	  font-weight:500;
	  color:#6b7280;
	}
	
	.bs-barber-avatars {
	  display: flex;
	  align-items: center;
	}

	.bs-barber-avatar.stacked {
	  margin-left: -8px;
	  border: 2px solid #fff;
	  border-radius: 50%;
	  width: 48px;
	  height: 48px;
	  overflow: hidden;
	}

	.bs-barber-avatar.stacked img {
	  width: 100%;
	  height: 100%;
	  object-fit: cover;
	}

	.bs-barber-avatar.extra {
	  width: 48px;
	  height: 48px;
	  border-radius: 50%;
	  background: #e5e7eb;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  font-weight: 700;
	  margin-left: -8px;
	}
	
	/* =========================
	   Wizard layout: left scroll, right sticky (no sidebar scroll)
	   ========================= */

	/* Όταν είμαστε σε wizard-active: κόψε το window scroll (θα το ενεργοποιήσουμε και με JS class στο body) */
	body.bs-wizard-lock {
	  overflow: hidden !important;
	}

	/* Κράτα το grid σε “viewport height” ώστε να μην σπρώχνει τη σελίδα */
	.barbershop-dashboard.wizard-active .bs-step3-grid {
	  max-height: calc(100vh - 180px);
	  overflow: hidden; /* σημαντικό: κόβει το window scroll μέσα στον grid */
	}

	/* Η αριστερή στήλη κάνει scroll */
	.barbershop-dashboard.wizard-active .bs-step3-main {
	  max-height: calc(100vh - 180px);
	  overflow-y: auto;
	  padding-right: 10px;
	}

	/* Η δεξιά στήλη (summary) μένει σταθερή */
	.barbershop-dashboard.wizard-active .bs-step3-summary {
	  position: sticky;
	  top: 12px;
	  align-self: flex-start;
	  max-height: calc(100vh - 180px);
	  overflow: visible; /* να ΜΗΝ κάνει scroll */
	}

	/* Mobile: άστο να γίνει normal (stack) */
	@media (max-width: 768px) {
	  .barbershop-dashboard.wizard-active .bs-step3-grid {
		max-height: none;
		overflow: visible;
	  }
	  .barbershop-dashboard.wizard-active .bs-step3-main {
		max-height: none;
		overflow: visible;
		padding-right: 0;
	  }
	  .barbershop-dashboard.wizard-active .bs-step3-summary {
		position: static;
		max-height: none;
	  }
	}

	/* =========================
	   Step 1 sticky tabs (Services / Combos)
	   ========================= */
	.bs-service-tabs {
	  position: sticky;
	  top: 0;
	  z-index: 5;
	  background: #fff;
	  padding: 8px 0 10px;
	  margin-bottom: 10px;
	  border-bottom: 1px solid #eee;
	  display: flex;
	  gap: 10px;
	}

	.bs-service-tab-btn {
	  border: 1px solid #ddd;
	  background: #fff;
	  border-radius: 999px;
	  padding: 8px 14px;
	  font-weight: 600;
	  cursor: pointer;
	  color:#111 !important;
	}

	.bs-service-tab-btn.active {
	  background: #000;
	  color: #fff !important;
	  border-color: #000;
	}

	.bs-service-section-title {
	  font-size: 16px;
	  font-weight: 800;
	  margin: 12px 0 10px;
	}
	
	/* να μη κόβεται το τέλος της λίστας στο Step 1 */
	.barbershop-dashboard.wizard-active .bs-step3-main{
	  padding-bottom: 140px; /* αρκετό για να φαίνεται ο τίτλος Combos + τελευταία items */
	}
	@media (max-width: 768px) {
	  .barbershop-dashboard.wizard-active .bs-step3-main {
		padding-bottom: 12px !important; /* μικρό κενό */
	  }
	}
	/* sticky Continue */
	@media (max-width: 768px) {
	  .bs-mobile-sticky {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 9999;
		padding: 10px 12px;
		background: rgba(255,255,255,0.96);
		border-top: 1px solid #e5e7eb;
		backdrop-filter: blur(6px);
	  }

	  .bs-mobile-sticky-btn {
		width: 100%;
		border: 0;
		border-radius: 10px;
		padding: 14px 12px;
		font-weight: 700;
		background: #0d6efd; /* ίδιο vibe με τα primary σου */
		color: #fff;
	  }

	  /* να μην καλύπτει το sticky bar το περιεχόμενο */
	  .barbershop-dashboard.wizard-active {
		padding-bottom: 72px;
	  }
	  /* END sticky Continue */
	}
	
	@media (max-width: 768px) {
	  /* Step 2 & Step 3: κάνε το summary να πιάνει όλο το πλάτος */
	  #booking-summary-sidebar-step2,
	  #booking-summary-sidebar {
		width: 100% !important;
		max-width: 100% !important;
		margin: 12px 0 0 !important;
	  }

	  /* Αν το summary βρίσκεται σε column/asides που έχουν fixed widths */
	  .bs-step3-summary,
	  .bs-step2-summary,
	  aside.bs-summary,
	  .booking-summary-sidebar {
		width: 100% !important;
		max-width: 100% !important;
	  }

	  /* Τα κουμπιά μέσα στο summary να μην στριμώχνονται */
	  #booking-summary-sidebar-step2 .bs-summary-actions,
	  #booking-summary-sidebar .bs-summary-actions,
	  #booking-summary-sidebar-step2 .bs-summary-buttons,
	  #booking-summary-sidebar .bs-summary-buttons,
	  #booking-summary-sidebar-step2 .bs-summary-controls,
	  #booking-summary-sidebar .bs-summary-controls {
		display: flex;
		gap: 10px;
		width: 100%;
	  }

	  /* Τα βασικά buttons να μοιράζονται σωστά */
	  #booking-summary-sidebar-step2 button,
	  #booking-summary-sidebar button {
		flex: 1;
		min-width: 0;
	  }
	}
	
	/* default (desktop) */
	.appt-date-cell .appt-date-top{
	  display:flex;
	  align-items:center;
	  justify-content:space-between;
	  gap:10px;
	}

	.appt-cancel-btn{
	  border:0;
	  background:transparent;
	  padding:6px;
	  font-size:18px;
	  line-height:1;
	  cursor:pointer;
	  opacity:.85;
	}

	.appt-cancel-btn:active{
	  transform:scale(.95);
	}

	@media (max-width: 576px){
	  .appt-cancel-btn{
		padding:4px;
		font-size:18px;
	  }
	}

	/* mobile tweaks */
	@media (max-width: 576px){

	  /* μικραίνουμε τη στήλη Ημ/νία */
	  .appointments-table th:first-child,
	  .appointments-table td:first-child{
		width: 90px;
		min-width: 90px;
		max-width: 90px;
	  }

	  /* κάθετη διάταξη ημερομηνίας + κάδου */
	  .appt-date-cell .appt-date-top{
		flex-direction: column;
		align-items: flex-start;
		gap:6px;
	  }

	  /* κάδος κάτω από την ημερομηνία */
	  .appt-cancel-btn{
		padding:4px 6px;
		font-size:18px;
		align-self:flex-start;
	  }
	}

	
</style>