/* Custom styles for static website - No animations */

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

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

::-webkit-scrollbar-thumb {
    background: #1e3a8a;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #3b82f6;
}

/* Animations disabled for better performance */

/* Mobile optimizations */
@media (max-width: 768px) {
    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    
    /* Fix product grid for mobile */
    #products-grid {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
    }
    
    /* Fix product card images for mobile */
    #products-grid img {
        height: 200px !important;
        object-fit: cover !important;
        width: 100% !important;
    }
    
    /* Fix card padding for mobile */
    #products-grid .group {
        margin-bottom: 1rem;
    }
    
    /* Ensure proper image display */
    .product-image-container {
        height: 200px !important;
        overflow: hidden;
    }
    
    /* Better button sizing for mobile */
    #products-grid button {
        font-size: 0.9rem !important;
        padding: 0.75rem 1rem !important;
    }
}

/* Small mobile devices */
@media (max-width: 480px) {
    #products-grid {
        padding: 0 0.5rem;
    }
    
    #products-grid .group {
        border-radius: 1rem;
        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    }
    
    #products-grid h3 {
        font-size: 1.1rem !important;
        line-height: 1.4;
    }
    
    #products-grid p {
        font-size: 0.85rem !important;
        line-height: 1.5;
    }
}

/* Accessibility */
a:focus,
button:focus {
    outline: 2px solid #1e3a8a;
    outline-offset: 2px;
}

/* Performance optimizations - simplified */

/* RTL improvements */
[dir="rtl"] .space-x-reverse > :not([hidden]) ~ :not([hidden]) {
    --tw-space-x-reverse: 1;
    margin-right: calc(1rem * var(--tw-space-x-reverse));
    margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
}
