/* Release 1: booking actions in the existing Yoruya header. */

/* Keep the header actions above the homepage introduction. */
header#header {
  z-index: 100;
}

header#header > .bottom_block > .reservation {
  width: 174px;
}

header#header .reservation > a.yoruya-booking-link {
  box-sizing: border-box;
  min-height: 48px;
  padding: 13px 10px;
  border: 1px solid #1e1b18;
  background: #1e1b18;
  color: #faf2ee;
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
}

header#header .reservation > a.yoruya-booking-link:hover {
  background: #43382f;
}

header#header .reservation > a.yoruya-booking-link:focus-visible {
  outline: 2px solid #1e1b18;
  outline-offset: 4px;
  box-shadow: 0 0 0 3px #faf2ee;
}

header#header > .sp_menu .reservation > a.yoruya-booking-link {
  border-color: #faf2ee;
  background: #faf2ee;
  color: #1e1b18;
}

header#header > .sp_menu .reservation > a.yoruya-booking-link:hover {
  background: #e8d8ce;
}

@media only screen and (max-width: 812px) {
  header#header.__top > .bottom_block {
    opacity: 1;
    transition: none;
  }

  header#header > .bottom_block > .reservation,
  header#header > .sp_menu > .reservation_block > .reservation {
    width: 168px;
  }
}
