/*---------------------------------------------------------------------------------

 Theme Name:   Chinatown Bakery
 Theme URI:    
 Description:  
 Author:       
 Author URI:   
 Template:     Divi
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html

------------------------------ ADDITIONAL CSS HERE ------------------------------*/

/* ===================== */
/* Main Menu Styling */
/* ===================== */
.dl-menu li {
  margin: 0 10px !important;
}

.dl-menu li a {
  position: relative;
  margin-top: 10px !important;
  padding-bottom: 10px !important; /* space between text and underline */
  transition: color 0.3s ease;
}

.dl-menu li a:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0; /* start hidden */
  background: url("https://guyh218.sg-host.com/wp-content/uploads/2025/08/Line-2.png")
    no-repeat center bottom;
  background-size: cover;
  transition: height 0.3s ease-out;
  z-index: -1;
}

/* Hover + Active state */
.dl-menu li a:hover:before,
.dl-menu .current-menu-item a:before,
.dl-menu .current_page_item a:before {
  height: 6px; /* underline thickness */
}

/* Hover font color */
.dl-menu li a:hover {
  color: #c9413f;
}
.dl-menu .current-menu-item a,
.dl-menu .current_page_item a {
  color: #c9413f;
}

/* ===================== */
/* Mega Menu - 3 Columns Centered */
/* ===================== */
.dl-menu .et_pb_fullwidth_menu .et-menu li.mega-menu > ul {
  display: flex !important;
  justify-content: center !important; /* center the 3 columns */
  flex-wrap: wrap; /* allow wrapping on smaller screens */
  padding: 20px 0;
  background-color: #eae8da !important; /* dropdown background */
}

.dl-menu .et_pb_fullwidth_menu .et-menu li.mega-menu > ul > li {
  width: 250px; /* fixed column width */
  margin: 0 20px; /* spacing between columns */
  float: none !important;
  clear: none !important;
  padding: 0 15px;
  box-sizing: border-box;
  text-align: center !important;
}

.et-menu-nav li.mega-menu > ul > li > a:first-child {
  padding-top: 0 !important;
  font-weight: 700;
  border-bottom: 1px solid rgba(0, 0, 0, 0.03);
  text-align: center !important;
}

/* Make sure child items inside each column stack properly */
.dl-menu .et_pb_fullwidth_menu .et-menu li.mega-menu > ul > li ul {
  width: 100% !important;
}

/* ===================== */
/* Submenu 4 per row, centered */
/* ===================== */
.dl-menu ul.sub-menu {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  background-color: #eae8da !important;
  padding: 20px 0 !important;
  border-radius: 0;
  box-shadow: none;
  border: 2px solid black;
  z-index: 999;
}

.dl-menu ul.sub-menu li {
  float: none !important; /* remove Divi float */
  clear: none !important;
  display: flex !important; /* flex container for text centering */
  justify-content: center !important;
  width: 30% !important; /* 3 per row */
  margin: 1.5% !important; /* adjust spacing */
  text-align: center;
}

.dl-menu ul.sub-menu li a {
  display: block;
  padding: 10px 0;
  color: #000;
  transition: background 0.3s ease;
}

.dl-menu ul.sub-menu li a:hover {
  background-color: #dcd9c8;
}

.mastfoot.text-center.no-bg {
  display: none;
}
/* ===================== */
/* Title Blocks */
/* ===================== */
.red-bg-title {
  font-size: 40px !important;
  padding: 10px;
  margin-bottom: 5px;
  float: left;
  background-color: #c9413f;
}

.green-bg-title {
  font-size: 40px !important;
  padding: 10px;
  margin-bottom: 5px;
  float: left;
  background-color: #28433c;
}

/* ===================== */
/* Forminator Styling */
/* ===================== */
#forminator-module-328,
#forminator-module-390 {
  background: transparent;
}

/* Make form labels white */
#forminator-module-328 .forminator-label,
#forminator-module-390 .forminator-label {
  color: #ffffff !important;
}

/* Style the submit button */
#forminator-module-328 .forminator-button-submit,
#forminator-module-390 .forminator-button-submit {
  background-color: #87a986 !important; /* green */
  color: #fff !important;
  border: none !important;
  padding: 12px 24px !important;
  border-radius: 0px !important;
  float: right; /* align button right */
  transition: background 0.3s ease;
  font-size: 20px !important;
  text-transform: uppercase;
}

/* Button hover effect */
#forminator-module-328 .forminator-button-submit:hover,
#forminator-module-390 .forminator-button-submit:hover {
  background-color: #87a986 !important; /* darker green on hover */
}

#forminator-module-390 .forminator-checkbox__label p {
  color: white;
}

.forminator-ui#forminator-module-328.forminator-design--default
  .forminator-file-upload
  > span {
  font-size: 12px;
  font-family: inherit;
  font-weight: 500;
  color: white;
}

/* Style consent field link */
.forminator-checkbox__wrapper a {
  color: #ffffff !important;
  text-decoration: underline; /* optional */
}

/*show desktop menu on phone*/

@media (max-width: 980px) {
  .pa-open-mobile-menu .et_pb_menu__menu {
    display: flex !important;
  }
  .pa-open-mobile-menu .et_mobile_nav_menu {
    display: none !important;
  }
}

/* ===================== */
/* Responsive Adjustments */
/* ===================== */

/* Tablet */
@media (max-width: 991px) {
  .red-bg-title {
    font-size: 35px !important;
    padding: 8px;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .red-bg-title {
    font-size: 32px !important;
    padding: 6px;
    float: none;
    display: inline-block;
  }
}

/* Very small screens */
@media (max-width: 480px) {
  .red-bg-title {
    font-size: 32px !important;
    padding: 4px;
  }
}
