/* Menu page styles */
@import "stylebase.css";

#body_header {
    position: relative;
}

#body_header::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,0.6),
    rgba(0,0,0,0.2)
  );
}

#body_header > img {
    width: 100%;
    min-height: 500px;
    max-height: 500px;
    object-fit: cover;
}

#body_title {
    position: absolute;
    transform: translate(0%, 15%);
}

#body_title > p {
    color: var(--text_white);
    font-weight: 400;
    font-size: clamp(1.7rem, 2vw, 5rem);
}

#body_title > h1 {
    color: var(--text_white);
    font-weight: bold;
    font-size: clamp(2rem, 5.5vw, 7.5rem);
}

.menu_type {
    margin: 0.8rem;
    padding: 0.5rem;
    border: 2px solid var(--border);
    background-color: var(--menu_type_bg) !important;
}

.menu_price {
    color: var(--letter_accent);
}

.accordion {
    padding: 0.2rem;
    border: 1px solid var(--border);
}

.accordion * {
    z-index: 3 !important;
    background-color: var(--menu_type_bg) !important;
}

.accordion-button:focus,
.accordion-button:active {
  outline: none !important;
  box-shadow: none !important;
}

.accordion_visible {
    background-color: var(--accordion_bg) !important;
}

.img_menu {
    width: auto;
    height: 100%;
    max-height: 150px;
    object-fit: contain;
}

.element_price {
    color: var(--price);
}

.elements_filter {
    width: 250px;
}

#body_logo {
    position: fixed;
    opacity: 0.1;
    top: 50vh;
    left: 50vw;
    transform: translate(-50%, -50%);
    width: 10%;
    height: auto;
    max-width: 300px;
    min-width: 200px;
}