/**
 * Çelikyay Catalog - Custom Styles
 * Minimal custom CSS for special patterns and animations
 * Main styling is handled by Tailwind CSS CDN
 */

/* ============================================
   Special Patterns
   ============================================ */

/* Hide scrollbar utility */
.scrollbar-hide::-webkit-scrollbar {
    display: none;
}
.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Technical Grid Pattern (background) */
.bg-tech-grid {
    background-size: 40px 40px;
    background-image:
        linear-gradient(to right, rgba(15, 76, 129, 0.05) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(15, 76, 129, 0.05) 1px, transparent 1px);
}

/* ============================================
   Custom Animations
   ============================================ */

/* Mobile Filter Drawer Animation */
.filter-drawer {
    transition: transform 0.3s ease-in-out;
}
.filter-drawer.open {
    transform: translateY(0);
}
.filter-drawer.closed {
    transform: translateY(100%);
}

/* ============================================
   Helper Classes for Custom Values
   ============================================ */

/* Custom text size (10px) - not in standard Tailwind scale */
.text-\[10px\] {
    font-size: 10px;
}

/* Custom height (85vh) */
.h-\[85vh\] {
    height: 85vh;
}

/* Custom min-width */
.min-w-\[90px\] {
    min-width: 90px;
}

/* Custom shadows (for mobile drawers) */
.shadow-\[0_-5px_20px_rgba\(0\,0\,0\,0\.1\)\] {
    box-shadow: 0 -5px 20px rgba(0,0,0,0.1);
}
.shadow-\[0_-5px_30px_rgba\(0\,0\,0\,0\.2\)\] {
    box-shadow: 0 -5px 30px rgba(0,0,0,0.2);
}