/* Custom Styles for Status Barbershop */

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

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 12px;
}
::-webkit-scrollbar-track {
    background: #F3F4F6;
}
::-webkit-scrollbar-thumb {
    background: #0f4d2a;
    border-radius: 6px;
}
::-webkit-scrollbar-thumb:hover {
    background: #1d7a43;
}

/* Selection Color */
::selection {
    background: #0f4d2a;
    color: #ffffff;
}

/* Geometric Background Pattern */
body {
    background-image: radial-gradient(#0f4d2a 0.5px, transparent 0.5px), radial-gradient(#0f4d2a 0.5px, #F9FAFB 0.5px);
    background-size: 40px 40px;
    background-position: 0 0, 20px 20px;
    background-opacity: 0.03;
}

/* Animation Utilities */
.service-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}

/* Ensure images don't overflow on small screens */
img {
    max-width: 100%;
    height: auto;
}

/* Mobile Menu Transitions */
#mobile-menu {
    transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out;
}