/* Custom CSS for Gedankenstrom - Overrides and custom styles for Tailwind */

/* Olive color palette */
:root {
	--color-olive-50: #f6f5f4;
	--color-olive-100: #e6e2e0;
	--color-olive-200: #cec4bf;
	--color-olive-300: #b4a59e;
	--color-olive-400: #9a877d;
	--color-olive-500: #806a61;
	--color-olive-600: #68534b;
	--color-olive-700: #503a35;
	--color-olive-800: #392923;
	--color-olive-900: #2e1e13;
}

/* Custom fonts */
.font-merriweather {
	font-family: 'Merriweather', serif;
}

.font-poppins {
	font-family: 'Poppins', sans-serif;
}

/* Base styles and utility classes for Tailwind */
.bg-olive-50 {
	background-color: var(--color-olive-50);
}
.bg-olive-200 {
	background-color: var(--color-olive-200);
}
.bg-olive-500 {
	background-color: var(--color-olive-500);
}
.bg-olive-600 {
	background-color: var(--color-olive-600);
}
.text-olive-600 {
	color: var(--color-olive-600);
}
.text-olive-700 {
	color: var(--color-olive-700);
}
.text-olive-800 {
	color: var(--color-olive-800);
}
.hover\:bg-olive-600:hover {
	background-color: var(--color-olive-600);
}
.hover\:text-olive-700:hover {
	color: var(--color-olive-700);
}

/* Custom overrides for form elements and buttons for better consistency */
.form-input:focus {
	border-color: var(--color-olive-500);
	box-shadow: 0 0 0 2px rgba(122, 128, 97, 0.5); /* Olive-500 with opacity */
}

/* Specific component styles not handled by Tailwind directly */
.mobile-menu-overlay {
	transition: transform 0.3s ease-in-out;
}

.mobile-menu-overlay.open {
	transform: translateX(0);
}

.mobile-menu-overlay.closed {
	transform: translateX(100%);
}

@media (min-width: 768px) {
	.mobile-menu-overlay {
		display: none !important;
	}
}