/* Restaurant information 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.4rem, 2vw, 5rem);
}

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

h2 {
    text-align: center;
    font-weight: 600;
    text-transform: uppercase;
    font-family: "Roboto", sans-serif;
}

#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;
}

#opening_hours {
    border: 2px solid var(--low_opacity_black);
}

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

.apero_hours {
    color: var(--violet);
}

.closed {
    color: var(--red);
}

.horaire_element {
    width: 33%;
}

.carousel-item{
  height: 31vh;
  max-height: 400px;
  min-width: 200px;
}

.carousel-item img{
  height: 100%;
  width: 100%;
  object-fit: contain;
}