/* COLOR SCHEME
CHARCOAL - #1F1F1F - HEADERS, FOOTERS, CONTRAST
BURNT ORANGE - #D96B2B - PRIMARY BUTTONS, HIGHLIGHTS
CREMA - #F6E8D5 - BACKGROUNDS, SOFT SECTIONS
MUSTARD - #D4A72C - ACCENTS, BADGES, CALLOUTS
MUTED TEAL - #2F7A78 - SECONDARY ACCENTS AND LINKS

FONT SECTIONS
'Frijole', 'Impact', sans-serif;
'Bebas Neue', 'Arial Black', sans-serif
MONTSERRAT, 'Arial Narrow', sans-serif - BODY
*/

@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Frijole&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');


/**** BASE FORMATTING *****/
/*------------------------------------------------------------------------------------*/
body {
    font-family: 'Montserrat', sans-serif;
    background-color: #F6E8D5; /* Crema */
    color: #1F1F1F; /* Charcoal */
    margin: 0;
    padding: 0;
}

header, footer {
    background-color: #F6E8D5; /* Crema */
    color: #1F1F1F; /* Charcoal */
    text-align: center;
    padding: 20px 0;
}

/**** TEXT FORMATTING ****/
/*--------------- ---------------------------------------------------------------------*/
h2, h3 {
    font-family: 'Bebas Neue', 'Arial Black', sans-serif; 
    color: #1F1F1F; /* Charcoal */
}

h1 {
    font-family: 'Frijole', 'Impact', sans-serif; /* Frijole for title */
    color: #D96B2B; /* Burnt Orange */
}

p {
    font-family: 'Montserrat', 'Arial Narrow', sans-serif; /* Montserrat for body text */
    color: #1F1F1F; /* Charcoal */
}

/**** HEADER & NAVIGATION FORMATTING ****/
/*------------------------------------------------------------------------------------*/
.logo {
    display: block;
    max-height: 200px;
    padding-left: 5px;
}

li a {
    display: inline-block;
    text-align: center;
    text-decoration: none;
    padding: 0.25em 0.75em;
    margin: 1em;
    line-height: 1.2;
    color: #2F7A78; /* Muted Teal */
    font-family: 'bebas neue', 'Arial Black', sans-serif;
}

li {
    text-decoration: none;
}

.navbar-nav .nav-link { 
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
} /* reduces horizontal spaces between navbar items */

@media (max-width: 991px) {
    .navbar-nav .nav-link {
        font-size: 1.25rem !important; /*adjusts if it's too wide for container box*/
    }
}



/**** PICTURE FORMATTING ****/
/*------------------------------------------------------------------------------------*/
.truck-img-wrap {
    width: 100%;
    overflow: hidden;
}

.truck-img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 10px;
}

.menuItem {
    width: 200px;
    height: auto;
    border-radius: 10px;
}

/**** BUTTON AND BADGE FORMATTING ****/
/*------------------------------------------------------------------------------------*/
.badge-taco {
    background-color: #D96B2B;
    color: #1F1F1F;
} /*creates customer color combo for the badging on the cart quantity. */

.button-menu {
    background-color: #D96B2B;
    color: #1F1F1F;   
    font-weight: bold;
}

/**** FORM FORMATTING ****/
/*------------------------------------------------------------------------------------*/
.form-label {
    font-weight: 600; /* Makes labels slightly bolder for better readability */
    color: #495057;   /* Softer black than pure #000 */
}

.container {
    max-width: 800px; /* Limits the form width so it doesn't span the whole screen on large desktops */
}