/* Custom styles for Curvy Diva Boutique */

/* Smooth scroll padding for fixed nav */
section[id] {
    scroll-margin-top: 80px;
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #f5f0e0;
}
::-webkit-scrollbar-thumb {
    background: #2d572d;
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: #1a351a;
}

/* Selection color */
::selection {
    background: #2d572d;
    color: #fdfcfa;
}

/* Link underline animation */
a.underline-hover {
    background-image: linear-gradient(currentColor, currentColor);
    background-position: 0% 100%;
    background-repeat: no-repeat;
    background-size: 0% 2px;
    transition: background-size 0.3s ease, background-position 0.3s ease;
}
a.underline-hover:hover {
    background-size: 100% 2px;
    background-position: 0% 100%;
}

/* Image aspect ratio helpers */
.img-tall {
    aspect-ratio: 3/4;
    object-fit: cover;
}
.img-square {
    aspect-ratio: 1/1;
    object-fit: cover;
}

/* Button focus styles */
button:focus-visible,
a:focus-visible {
    outline: 2px solid #98c598;
    outline-offset: 2px;
}

/* Mobile menu transitions */
#mobile-menu {
    transition: transform 0.3s ease-in-out;
}
#mobile-menu.open {
    transform: translateX(0);
}
#mobile-menu.closed {
    transform: translateX(100%);
}

/* Subtle pattern overlay for cream sections */
.bg-cream-pattern {
    background-image: radial-gradient(circle at 25% 25%, rgba(45,87,45,0.03) 0%, transparent 50%),
                      radial-gradient(circle at 75% 75%, rgba(45,87,45,0.03) 0%, transparent 50%);
}