/* Базові стилі */
:root {
  --bg: #0f172a;       /* slate-900 */
  --panel: #111827;    /* gray-900 */
  --text: #e5e7eb;     /* gray-200 */
  --muted: #94a3b8;    /* slate-400 */
  --primary: #22c55e;  /* green-500 */
  --primary-700: #15803d;
}

* { box-sizing: border-box; }

html, body {
  height: 100dvh;
}

body {
  margin: 0;
  background: #e1decb;
  color: black;
  line-height: 1.6;
  font-family: 'Montserrat', sans-serif;
  padding: 16px;
  display: flex;
  flex-direction: column;
}
.site-header{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 0;
}
.reserv{
  font-size: 24px;
  font-weight: 700;
  color: black;
  text-align: start;

}
.reserv span{
  font-size: 16px;
  font-weight: 700;
  color: #f9b574;
  text-align: start;
  position: relative;
  bottom: 3px;
}
.burger_menu{
  width: 25px;
  height: 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: baseline;
  cursor: pointer;
}
.burger_menu .burger-line{
  width: 100%;
  height: 2px;
  background-color: black;
  border-radius: 2px;
}
.main_container{
  width: 100%;
  background-color: #d5d3be;
  border-radius: 10px;
  border: 1px solid #c5c2af;
  padding: 16px 10px;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.main_container_header{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: start;
  margin-bottom: 24px;
}
.main_container_header_title{
  font-size: 24px;
  font-weight: 700;
  line-height: 1.2;
  color: black;
  text-align: start;
  max-width: 60%;
}
.main_container_header_image{
  width: 30px;

}
.main_container_header_image img{
  width: 100%;
}
.birthday_container{
  width: 100%;
margin-bottom: 16px;
}
.birthday_container_title{
  font-size: 14px;
  font-weight: 400;
  line-height: 1.2;
  color: #8e8b7a;
}
.birthday_container_date{
  font-size: 16px;
  font-weight: 400;
  line-height: 1.2;
  color: black;
}
 .running_line{
   width: calc(100% + 20px);
   overflow: hidden;
   white-space: nowrap;
   border-top: 1px solid #6a4d19;
   border-bottom: 1px solid #6a4d19;
   margin-top: auto;
   padding: 8px 0;
   background: #6a4d19;
   margin-left: -10px;
   margin-right: -10px;
 }
 .running_line .marquee{
   display: inline-block;
   min-width: 200%;
   will-change: transform;
   animation: marquee-left 15s linear infinite;
 }
 .running_line .marquee span{
   display: inline-block;
   padding-right: 32px;
   color: #b8a380;
 }
 @keyframes marquee-left{
   0% { transform: translateX(0); }
   100% { transform: translateX(-50%); }
 }
 .main_container_footer{
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 24px;
 }
 .main_container_footer_title{
  font-size: 24px;
  font-weight: 700;
  line-height: 1.2;
  color: black;
  text-align: start;
 }
 .main_container_footer_plus{
   width: 40px;
   height: 40px;
   padding: 0;
  background-color: #fa7b00;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
 }
.main_container_footer_plus span{
  font-size: 24px;
  font-weight: 900;
   line-height: 1;
  color: black;
   display: block;

}