/**
 * Menu2WhatsApp Custom SaaS & Mobile Menu Styling
 */

:root {
    --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --color-primary: #10b981;
    --color-primary-dark: #059669;
}

body {
    font-family: var(--font-sans);
    color: #1f2937;
    -webkit-font-smoothing: antialiased;
}

.font-sans {
    font-family: var(--font-sans);
}

.tracking-tight {
    letter-spacing: -0.025em;
}

.shadow-xs {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

.shadow-2xs {
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.03);
}

.shadow-2xl {
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
}

/* Custom Text Truncation */
.text-truncate-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Category Scrolling Bar on Mobile */
.category-scroll-nav, .menu-pills-bar {
    white-space: nowrap;
    scrollbar-width: none; /* Firefox */
}
.category-scroll-nav::-webkit-scrollbar, .menu-pills-bar::-webkit-scrollbar {
    display: none; /* Chrome, Safari */
}

/* Sticky cart bar transition */
#sticky-cart-bar {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Dish Item Card Hover */
.dish-item {
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.dish-item:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}

/* Print Standee Stylesheet */
@media print {
    .no-print, nav, footer, .dashboard-sidebar, header {
        display: none !important;
    }
    body {
        background-color: #ffffff !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    .printable-standee {
        box-shadow: none !important;
        border: 2px dashed #ccc !important;
        width: 100% !important;
        max-width: 500px !important;
        margin: 20px auto !important;
        padding: 30px !important;
    }
}

/* Mobile Responsiveness Fine-Tuning */
@media (max-width: 576px) {
    .display-4 {
        font-size: 2.25rem;
    }
    .display-6 {
        font-size: 1.75rem;
    }
}

.border-dashed {
    border-style: dashed !important;
}

.btn-xs {
    padding: 0.2rem 0.5rem;
    font-size: 0.75rem;
}