@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');

html { scroll-behavior: smooth; }

@layer utilities {
    .bg-nature-green { background-color: #2F4F4F; }
    .bg-wood-brown { background-color: #8B5A2B; }
    .bg-warm-sand { background-color: #F5F5DC; }
    
    .text-nature-green { color: #2F4F4F; }
    .text-wood-brown { color: #8B5A2B; }
    
    .font-lora { font-family: 'Lora', serif; }
    .font-inter { font-family: 'Inter', sans-serif; }
    
    .btn-nature {
        @apply inline-flex items-center justify-center bg-[#2F4F4F] text-white font-inter text-sm font-medium py-3.5 px-8 rounded-none hover:bg-[#1a2e2e] transition-all duration-300 shadow-md hover:shadow-lg;
    }
    
    .btn-wood {
        @apply inline-flex items-center justify-center bg-[#8B5A2B] text-white font-inter text-sm font-medium py-3.5 px-8 rounded-none hover:bg-[#6b4521] transition-all duration-300 shadow-md hover:shadow-lg;
    }

    .btn-outline {
        @apply inline-flex items-center justify-center border border-[#2F4F4F] text-[#2F4F4F] font-inter text-sm font-medium py-3.5 px-8 rounded-none hover:bg-[#2F4F4F] hover:text-white transition-all duration-300;
    }
    
    .nav-link {
        @apply text-slate-700 hover:text-[#8B5A2B] font-inter text-sm font-medium transition-colors duration-300 relative uppercase tracking-widest;
    }
    
    .nav-link::after {
        content: '';
        @apply absolute -bottom-1.5 left-1/2 -translate-x-1/2 w-0 h-px bg-[#8B5A2B] transition-all duration-300;
    }
    
    .nav-link:hover::after, .nav-link.active::after {
        @apply w-full;
    }
    
    .nav-link.active {
        @apply text-[#8B5A2B];
    }
}

.date-picker-custom::-webkit-calendar-picker-indicator {
    filter: invert(1);
    opacity: 0.5;
    cursor: pointer;
}