/* FitStore Custom CSS */

/* Line clamp */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Carousel animation */
.carousel-slide {
    transition: opacity 0.7s ease-in-out;
}

/* Smooth scroll */
html { scroll-behavior: smooth; }

/* Product card hover effect */
a.group:hover .group-hover\:scale-105 {
    transform: scale(1.05);
}

/* Focus ring */
input:focus, select:focus, textarea:focus {
    box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.3);
}

/* =========================================
   Mobile Responsive Overrides
   ========================================= */

/* Mobile: prevent horizontal overflow */
body {
    overflow-x: hidden;
}

/* Product card: smaller image on mobile */
@media (max-width: 640px) {
    .product-card-img {
        height: 140px !important;
    }
}

/* Account tabs: horizontal scroll on mobile */
@media (max-width: 640px) {
    .account-tabs {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .account-tabs::-webkit-scrollbar {
        display: none;
    }
    .account-tabs .tab-btn {
        white-space: nowrap;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}

/* Cart items: stack on mobile */
@media (max-width: 640px) {
    .cart-item {
        flex-direction: column !important;
        align-items: flex-start !important;
    }
    .cart-item > * {
        width: 100% !important;
    }
    .cart-item .cart-item-price {
        text-align: left !important;
        margin-top: 0.5rem;
    }
    .cart-item .cart-item-actions {
        justify-content: flex-start !important;
        margin-top: 0.5rem;
    }
}

/* Table responsive: horizontal scroll */
.table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.table-scroll table {
    min-width: 500px;
}

/* Mobile: reduce padding */
@media (max-width: 640px) {
    .container-padding {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}

/* Mobile menu: hide scrollbar */
#mobile-menu > div:last-child {
    scrollbar-width: thin;
    scrollbar-color: #d1d5db transparent;
}

/* Mobile: hero text size */
@media (max-width: 640px) {
    .hero-title {
        font-size: 1.75rem !important;
        line-height: 1.2 !important;
    }
    .hero-subtitle {
        font-size: 0.875rem !important;
    }
}

/* Mobile: hide footer badges on small screens */
@media (max-width: 480px) {
    .footer-badges span {
        display: none;
    }
    .footer-badges span:first-child {
        display: inline;
    }
}

/* Mobile: ensure menu toggle is clickable */
.touch-manipulation {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}

/* Mobile: checkout form single column */
@media (max-width: 640px) {
    .checkout-grid {
        grid-template-columns: 1fr !important;
    }
}

/* Mobile: product detail specs scrollable */
@media (max-width: 640px) {
    .specs-table {
        font-size: 0.8125rem;
    }
}
