/*
 Theme Name: Nest Divi
 Theme URI: https://www.elegantthemes.com/gallery/divi/
 Description: Divi Child Theme for Nest
 Author: Elegant Themes and Bison Design
 Author URI: https://www.elegantthemes.com
 Template: Divi
 Version: 1.0.0
*/

/* =Theme customization starts here
------------------------------------------------------- */
:root {
  --orange: #f15422;
  --lt-orange: #f7986b;

  --yellow: #fcb62a;
  --lt-yellow: #fed182;

  --blue: #132246;
  --lt-blue: #606079;

  --grey: #e9e9e9;
  --lt-grey: #fafafa;
}

html {
  /* font-family: "Museo Sans Rounded", sans-serif; */
  font-weight: 300;
  font-size: 100%;
  line-height: 1.5;
}

body {
  background-color: #252530 !important;
}

.et_pb_section {
  background-color: #252530;
}

.et_pb_row {
  width: 90%;
}

h1,
h2,
h3,
p,
a {
  /* font-family: "Museo Sans Rounded", sans-serif; */
  color: #efefef;
}

h1 {
  font-size: clamp(2.25rem, 1.9773rem + 1.3636vw, 3rem);
}

h2 {
  font-size: clamp(1.75rem, 1.5682rem + 0.9091vw, 2.25rem);
}

h3 {
  font-size: clamp(1.25rem, 1.0682rem + 0.9091vw, 1.75rem);
}

h4 {

}

p,
a {
  font-weight: 300;
}

.et_pb_heading_container > h1 {
  color: #f6f6f7;
}

/*********** MENU PAGE ***********/

/* Menu category carousel  */


.cat-list li {
  text-align: center;
  display: flex;
  flex-direction: column;
  padding: 0.5rem;
  min-width: 110px;
}


.cat-list-item {
  display: block;
  width: 100%;  /* Optional: Set width to 100% for full clickable area */
  height: 100%;
}

.cat-list-item img {
   width: 50px;
   height: auto;
} 

.splide__slide:hover {
  background-image: linear-gradient(to right, #152447, #484848);
  border-radius: 15px;

}

.splide__slide:focus,
.splide__slide:active,
.selected {
  background-image: linear-gradient(to right, #152447, #484848);
  border-radius: 15px;
}

.splide__pagination {
  top: 150px; /* Adjust the distance from the bottom as needed */
}

.menu-category {
  margin: 5rem 0;
}

.splide {
  margin: 0 auto;
}

.menu-category h2 {
  font-size: 2rem;
  color: #fdcf87;
  margin-bottom: 3rem;
}

.menu-item-container {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  background-image: linear-gradient(to right, #152447, #484848);
  margin-bottom: 2rem;
  border-radius: 15px;
}

.menu-text-container {
  padding: 1.25rem 1.25rem 1.25rem 0;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.menu-flex-container {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 1rem;
  gap: 1rem;
}

.menu-text-container h3 {
  color: #fdcf87;
  font-size: 1.25rem;
  padding-bottom: 0px;
}

.dietary-icon {
  width: 1.5rem;
  height: auto;
}

.dish-name {
  max-width: max-content;
  margin-bottom: 6px;

}

.dish-price, .addon-price {
  white-space: nowrap;
}

.menu-text-container .dish-price {
  font-weight: 500;
  font-size: 1.25rem;
}

.dish-description {
  margin-bottom: 1rem;
}

.menu-addon-container {
  display: flex;
  order: 10;
}

.menu-addon-container p {
  font-weight: 500;
  padding-bottom: 0.5rem;
  color: #fed182;
  margin-right: 0.5rem;
}

.menu-addon-container .addon-price::before {
  content: "  ——  ";
}

.menu-item-photo {
  order: -1;
  padding: 0;
  max-width: unset;
  flex-basis: unset;
  margin-right: unset;
  border-radius: 15px 15px 0 0;
  width: 100%;
  height: auto;
}

.menu-text-container {
  padding: 1.25rem;
}


/* flex */

.flex {
  display: flex;
}

.specials-flex {
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
  align-items: center;
}

.flex-row {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}

.dietary-icon {
  margin-right: 1rem;
}

/* lists */
ul {
  list-style-type: none !important;
}

/* Weekly Special Card */

.weekly-specials,
.promotion-card,
.event-card-homepage {
  background-image: linear-gradient(to right, #152447, #484848);
  border-radius: 15px;
  padding: 1rem;
  height: 200px;
  position: relative; 
  overflow: hidden; 
  width: 100%;  
}

.specials-content > h2,
.promotion-card > h2,
.event-card-homepage > h2 {
  color: #fdb728;
  font-size: 28px;
}

.weekly-specials ul {
  padding: 0;
}

.event-card-homepage .event-details {
  padding: 0;
}

.promotion-card .promotion-description, 
.event-card-homepage .event-details,
.weekly-specials ul {
  width: 50%;
}

.weekly-specials .special-thumbnail img,
.event-card-homepage .event-image img,
.promotion-card .promotion-image img {
  position: absolute; 
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; 
}

.special-thumbnail img,
.event-card-homepage .event-image img,
.promotion-image img {
  -webkit-mask:
    linear-gradient(#000 0 0),
    linear-gradient(135deg,#000 50%,#0000 0) content-box 
     35% 50%/200% 200% no-repeat;
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  transition: .5s;
  cursor: pointer;
}

.special-thumbnail img:hover,
.event-card-homepage .event-image img:hover,
.promotion-image img:hover {
  -webkit-mask-position: 100% 100%;
}

/************ Events Page ************/
#event_code > .et_pb_code_inner{
  display: flex;
  }
  
.search-form {
  margin-bottom: 2rem;
}
.event-search {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem;
}

/* event select  */
#month-filter{
  webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg fill='white' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'><path d='M7 10l5 5 5-5z'/></svg>");
  background-repeat: no-repeat;
  background-position: right .7em top 50%;
  background-size: 1.5em;
  color: #efefef;
}
/* Search Field */
.search-field {
  color: grey;
  border: 1px solid #efefef;
  border-radius: 1rem;
  width: 255px;
  padding: 0.75rem;
  margin: 1rem 1rem 1rem 0;
  font-size: 16px;
  background-color: #252530;
}

/* Month Filter */
#month-filter {
  color: grey;
  width: 255px;
  padding: 0.75rem;
  margin: 1rem 0;
  border: 1px solid #efefef;
  border-radius: 1rem;
  background-color: #252530;
  font-size: 16px;
}
#month-filter:hover {
  cursor: pointer;
}

.search-submit {
  display: block;
  background-color: #44444D;
  color: #efefef;
  border: none;
  padding: 0.75rem 6.5rem;
  border-radius: 1rem;
  cursor: pointer;
  font-size: 16px;
  margin: 1rem 0 4rem 0;
}

.search-submit:hover,
.search-submit:focus {
  background-color: #efefef;
  color: #44444D;
}

/* event card */
.event-card-container {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}
.event-heading h2 {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--lt-grey);
}

.event-card {
  flex: 1 0 calc(50% - 1rem);
  box-sizing: border-box;
  background-color: #44444D;
  color: #ffffff;
  box-shadow: 0 0 10px rgba(84, 84, 84, 0.5)
}

.event-card:last-child {
  margin-right: 0;
}

.event-image img {
  width: 100%;
  height: 200px;
  object-fit: cover;
}

.event-details {
  padding: 20px;
  text-align: left;
}

.event-link a {
  color: var(--lt-grey);
  display: block;
  text-align: left;
  padding: 10px 20px;
  border-top: 0.5px solid var(--grey);
  font-weight: 500;
}

#event-results > p {
  color: var(--lt-grey);
  font-size: 1.25rem;
  text-align: center;
}

.event-date-time > img , 
.event-location > img{
 fill: white;
width: 1.75rem;
padding: 0.25rem;
}

.event-date-time,
.event-location{
  display: flex;
  align-items: center;
  margin-bottom: 0.5rem;
}

/* Tablet and Desktop Styles */
@media screen and (max-width: 980px) {
  #event_code > .et_pb_code_inner{
  flex-wrap: wrap;
  }
  .event-card {
    flex: 1 0 calc(50% - 1rem);
  }

}

/* Mobile Styles */

@media screen and (max-width: 700px) {
  .event-card {
    flex: 1 0 100%;
  }

   .menu-two-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 2%;
  }
  
  .menu-item-container {
    flex: 49%;
    display: flex;
    justify-content: flex-start;
    background-image: linear-gradient(to right, #152447, #484848);
    margin-bottom: 1rem;
    border-radius: 15px;
  } 

   .menu-item-container {
    flex-direction: column;
  } 
  
  .menu-item-photo {
    max-width: unset;
    flex-basis: unset;
    margin-right: unset;
    border-radius: 15px 15px 0 0;
  }

  .menu-text-container {
    padding: 1.25rem;
  }
}

@media screen and (max-width: 576px) {
  .event-card {
    flex: 1 0 calc(100% - 1rem);
    margin-right: 0;
  }

}


@media screen and (min-width: 650px) {
  .menu-two-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 2%;
  }

  .menu-item-container {
    flex: 49%; 
    flex-grow: 0;
  }
}

@media screen and (min-width: 1000px) {
  .menu-item-container {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
  }

  .menu-item-photo {
    width: 30%; 
    max-width: 300px; 
    /* margin-right: 2rem; */
    flex-shrink: 0;
    overflow: hidden;
    border-radius: 15px 0 0 15px;
    object-fit: cover;
  }

  .splide__list {
    justify-content: center;
  }
  
  
}