.custom-shepherd {
	background-color: #ffffff;
	color: #2f2f2f;
	border-radius: 12px;
	border: 1px solid rgba(59, 143, 58, 0.25);
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.18);
	padding: 0;
	overflow: hidden;
	border-left: 4px solid #3b8f3a;
}

.custom-shepherd .shepherd-arrow:before {
	background: #ffffff;
	border: 1px solid rgba(59, 143, 58, 0.25);
}

.custom-shepherd .shepherd-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 16px 18px;
	background: linear-gradient(135deg, rgba(59, 143, 58, 0.12), rgba(32, 121, 83, 0.08));
	border-bottom: 1px solid rgba(59, 143, 58, 0.15);
}

.custom-shepherd .shepherd-title {
	font-size: 1rem;
	font-weight: 700;
	color: #275727;
}

.custom-shepherd .shepherd-cancel-icon {
	color: #4d4d4d;
	transition: color 0.2s ease-in-out, transform 0.2s ease-in-out;
}

.custom-shepherd .shepherd-cancel-icon:hover {
	color: #3b8f3a;
	transform: scale(1.1);
}

.custom-shepherd .shepherd-content {
	font-size: 0.95rem;
	line-height: 1.5;
	padding: 20px 18px;
}

.custom-shepherd .shepherd-text {
	margin: 0;
}

.custom-shepherd .shepherd-footer {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
	padding: 14px 18px 18px;
	background-color: rgba(240, 250, 240, 0.65);
	border-top: 1px solid rgba(59, 143, 58, 0.15);
}

.custom-shepherd .shepherd-button {
	background-color: #3b8f3a;
	color: #ffffff;
	border-radius: 999px;
	border: 1px solid transparent;
	padding: 7px 18px;
	font-weight: 600;
	font-size: 0.85rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	transition: all 0.2s ease-in-out;
}

.custom-shepherd .shepherd-button:hover {
	background-color: #2f6c2e;
	box-shadow: 0 6px 14px rgba(59, 143, 58, 0.24);
}

.custom-shepherd .shepherd-button.shepherd-button-secondary {
	background-color: #ffffff;
	color: #3b8f3a;
	border-color: rgba(59, 143, 58, 0.3);
	box-shadow: none;
}

.custom-shepherd .shepherd-button.shepherd-button-secondary:hover {
	background-color: rgba(59, 143, 58, 0.12);
	color: #275727;
}

.custom-shepherd .shepherd-button:disabled,
.custom-shepherd .shepherd-button[aria-disabled="true"] {
	opacity: 0.6;
	cursor: not-allowed;
	box-shadow: none;
}

/* Responsive styles for tour button */
@media (max-width: 768px) {
  #start-tour-btn {
    padding: 6px 10px;
  }
}

/* Tour Controls Container */
.tour-controls {
  position: relative; 
  display: flex;
  gap: 10px;
  align-items: center;
  float: right;
}

@media (max-width: 768px) {
  .tour-controls {
    margin-top: 5px;
    margin-right: 5px;
  }
}

	
/* Tour Guide and Dark Mode Styling */
#start-tour-btn {
	background-color: #ffffff;
	color: #3b8f3a;
	border: 1px solid #3b8f3a;
	padding: 7px 16px;
	border-radius: 999px;
	font-weight: 600;
	letter-spacing: 0.01em;
	cursor: pointer;
	transition: all 0.2s ease-in-out;
	box-shadow: 0 4px 10px rgba(59, 143, 58, 0.18);
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

#start-tour-btn:hover {
	background-color: #3b8f3a;
	color: #ffffff;
	transform: translateY(-1px);
	box-shadow: 0 6px 14px rgba(59, 143, 58, 0.2);
}

#start-tour-btn:focus-visible {
	outline: 3px solid rgba(59, 143, 58, 0.3);
	outline-offset: 2px;
}

#start-tour-btn i {
	font-size: 1.15em;
}

.tour-btn-label {
	font-size: 0.85rem;
	text-transform: uppercase;
}

@media (max-width: 768px) {
	.tour-btn-label {
		display: none;
	}
}