@import 'tailwindcss';
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&family=Inter:wght@300;400;500;600;700&display=swap');

@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
@source '../../storage/framework/views/*.php';
@source '../**/*.blade.php';
@source '../**/*.js';

@theme {
    --font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
        'Segoe UI Symbol', 'Noto Color Emoji';
    --font-serif: 'Playfair Display', Georgia, 'Times New Roman', Times, serif;
    
    /* Tan color palette */
    --color-tan-50: #faf8f5;
    --color-tan-100: #f5f0e8;
    --color-tan-200: #e8ddd0;
    --color-tan-300: #d4c4b0;
    --color-tan-400: #b8a088;
    --color-tan-500: #9d8566;
    --color-tan-600: #7d6a52;
    --color-tan-700: #645443;
    --color-tan-800: #524438;
    --color-tan-900: #453a2f;
    
    /* Accent colors */
    --color-cream: #fef9f3;
    --color-caramel: #c97d60;
    --color-rose: #e8b4a0;
}

/* Custom animations */
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes slideUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fadeIn {
    animation: fadeIn 0.3s ease-out;
}

.animate-slideUp {
    animation: slideUp 0.4s ease-out;
}

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #f5f0e8;
}

::-webkit-scrollbar-thumb {
    background: #9d8566;
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: #7d6a52;
}

/* Screen reader only class */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

.sr-only.focus\:not-sr-only:focus {
    position: static;
    width: auto;
    height: auto;
    padding: inherit;
    margin: inherit;
    overflow: visible;
    clip: auto;
    white-space: normal;
}