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

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Inter', sans-serif;
    color: #1A1A1A;
    background-color: #FAFAFA;
}

h1,
h2,
h3,
h4,
h5,
h6,
.font-serif {
    font-family: 'Playfair Display', serif;
}

/* Custom Utilities for Luxury Aesthetic */
.luxury-shadow {
    box-shadow: 0 10px 40px -10px rgba(0, 0, 0, 0.08);
}

.luxury-shadow-hover:hover {
    box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.12);
    transform: translateY(-4px);
}

.transition-all-custom {
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Navbar active link */
.nav-link {
    position: relative;
    display: inline-block;
}

.nav-link::after {
    content: '';
    position: absolute;
    width: 0;
    height: 1px;
    bottom: -4px;
    left: 0;
    background-color: #C7A06A;
    transition: width 0.3s ease-in-out;
}

.nav-link:hover::after,
.nav-link.active::after {
    width: 100%;
}

/* Sticky Navbar Effect */
.navbar-scrolled {
    background-color: #ffffff;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
}

/* Dropdown */
.group:hover .group-hover\:block {
    display: block;
}

.dropdown-anim {
    animation: fadeInDown 0.3s ease-out forwards;
    transform-origin: top center;
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Image Hover Zoom */
.img-zoom-container {
    overflow: hidden;
}

.img-zoom-container img {
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.img-zoom-container:hover img {
    transform: scale(1.05);
}

/* Dark mode specific elements (if needed for footer etc) */
.bg-charcoal {
    background-color: #1A1A1A;
}

.text-beige {
    color: #C7A06A;
}

.bg-beige {
    background-color: #C7A06A;
}

.hover\:bg-beige-dark:hover {
    background-color: #B58C57;
}

/* Admin Dashboard Mobile Sidebar */
@media (max-width: 768px) {
    #admin-sidebar:not(.hidden) {
        position: fixed;
        left: 0;
        top: 0;
        bottom: 0;
        z-index: 50;
        box-shadow: 4px 0 20px rgba(0, 0, 0, 0.1);
    }
}