/* Dynamic Font System for Sm'ashleys */

/* Default font variables - can be overridden by JavaScript */
:root {
    --heading-font: 'Bungee', cursive;
    --body-font: 'Montserrat', sans-serif;
    --special-font: 'Permanent Marker', cursive;
}

/* Apply fonts dynamically */
h1, h2, h3, h4, h5, h6,
.navbar-brand,
.category-heading,
.hero-title,
.section-title {
    font-family: var(--heading-font) !important;
}

/* Body text and descriptions */
body, p, .card-text, .lead,
.menu-description,
.form-control,
.btn {
    font-family: var(--body-font) !important;
}

/* Special callouts and promotions */
.special-callout,
.weekly-special,
.promotion-text,
.hero-subtitle,
.featured-item .badge {
    font-family: var(--special-font) !important;
}

/* Menu item names with heading font */
.menu-item-card h5,
.card-title {
    font-family: var(--heading-font) !important;
}

/* Brand name special styling */
.brand-name {
    font-family: var(--heading-font) !important;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Category headers with bold styling */
.category-header {
    font-family: var(--heading-font) !important;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: 2px;
}

/* Price styling */
.price {
    font-family: var(--body-font) !important;
    font-weight: 700;
}

/* Button text */
.btn {
    font-family: var(--body-font) !important;
    font-weight: 600;
}

/* Navigation items */
.nav-link, .navbar-nav .nav-link {
    font-family: var(--body-font) !important;
    font-weight: 500;
}

/* Form labels and inputs */
.form-label {
    font-family: var(--body-font) !important;
    font-weight: 500;
}

/* Special announcement styling */
.announcement {
    font-family: var(--special-font) !important;
    font-size: 1.1em;
}

/* Hero section text */
.hero-container h1 {
    font-family: var(--heading-font) !important;
    font-size: 3.5rem;
    font-weight: bold;
}

.hero-container .lead {
    font-family: var(--special-font) !important;
    font-size: 1.4rem;
}

/* Menu category styling to match physical menu */
.menu-category-title {
    font-family: var(--heading-font) !important;
    background-color: var(--smashleys-yellow);
    color: var(--smashleys-text-dark);
    padding: 15px 25px;
    border-radius: 10px;
    font-weight: bold;
    text-transform: uppercase;
    border: 3px solid var(--smashleys-purple);
    letter-spacing: 2px;
    text-align: center;
    margin: 20px 0;
    font-size: 1.5rem;
}

/* Responsive font sizes */
@media (max-width: 768px) {
    .hero-container h1 {
        font-size: 2.5rem;
    }
    
    .menu-category-title {
        font-size: 1.2rem;
        padding: 12px 20px;
        letter-spacing: 1px;
    }
}

@media (max-width: 576px) {
    .hero-container h1 {
        font-size: 2rem;
    }
    
    .menu-category-title {
        font-size: 1rem;
        padding: 10px 15px;
    }
}