/* ======================================================
   BBS HEADER NAVIGATION
   Booking / My Dashboard / Login / Logout
====================================================== */

.bbs-menu-booking > a,
.bbs-menu-account > a,
.bbs-menu-logout > a{
  display:inline-flex !important;
  align-items:center !important;
  gap:8px !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  text-decoration:none !important;
  transform:none !important;
}


/* ======================================================
   ICON FOUNDATION
====================================================== */

.bbs-menu-booking > a::before,
.bbs-menu-account > a::before,
.bbs-menu-logout > a::before{
  content:"" !important;
  position:static !important;
  display:inline-block !important;
  width:18px !important;
  height:18px !important;
  flex:0 0 18px !important;
  margin:0 !important;
  padding:0 !important;
  background-color:currentColor !important;
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
}


/* ======================================================
   BOOKING ICON
====================================================== */

.bbs-menu-booking > a::before{
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='5' width='18' height='16' rx='2'/><path d='M16 3v4M8 3v4M3 10h18'/></svg>") center / contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='5' width='18' height='16' rx='2'/><path d='M16 3v4M8 3v4M3 10h18'/></svg>") center / contain no-repeat;
}


/* ======================================================
   ACCOUNT / LOGIN ICON
====================================================== */

.bbs-menu-account > a::before{
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20 21a8 8 0 0 0-16 0'/><circle cx='12' cy='7' r='4'/></svg>") center / contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20 21a8 8 0 0 0-16 0'/><circle cx='12' cy='7' r='4'/></svg>") center / contain no-repeat;
}


/* ======================================================
   LOGOUT ICON
====================================================== */

.bbs-menu-logout > a::before{
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M10 17l5-5-5-5'/><path d='M15 12H3'/><path d='M14 3h5a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-5'/></svg>") center / contain no-repeat;
  mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M10 17l5-5-5-5'/><path d='M15 12H3'/><path d='M14 3h5a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-5'/></svg>") center / contain no-repeat;
}


/* ======================================================
   DESKTOP
====================================================== */

@media (min-width:992px){

  .bbs-menu-booking > a,
  .bbs-menu-account > a,
  .bbs-menu-logout > a{
    min-height:42px !important;
    padding:9px 12px !important;
    border-radius:8px !important;
    color:var(--bbs-text-main) !important;
    font-size:16px !important;
    font-weight:500 !important;
    line-height:1 !important;
    white-space:nowrap;
  }

  .bbs-menu-account > a{
    color:var(--bbs-primary) !important;
    font-weight:600 !important;
  }

  .bbs-menu-logout > a{
    color:var(--bbs-text-muted) !important;
  }

  .bbs-menu-booking > a:hover,
  .bbs-menu-booking > a:focus,
  .bbs-menu-account > a:hover,
  .bbs-menu-account > a:focus{
    border:0 !important;
    background:color-mix(in srgb, var(--bbs-primary) 7%, transparent) !important;
    box-shadow:none !important;
    color:var(--bbs-primary) !important;
    transform:none !important;
  }

  .bbs-menu-logout > a:hover,
  .bbs-menu-logout > a:focus{
    border:0 !important;
    background:color-mix(in srgb, var(--bbs-error) 6%, transparent) !important;
    box-shadow:none !important;
    color:var(--bbs-error) !important;
    transform:none !important;
  }

}


/* ======================================================
   MOBILE / TABLET
====================================================== */

@media (max-width:991px){

  .mobile-menu{
    padding-bottom:26px !important;
  }

  .mobile-menu .bbs-menu-booking,
  .mobile-menu .bbs-menu-account,
  .mobile-menu .bbs-menu-logout{
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
  }

  .mobile-menu .bbs-menu-booking > a,
  .mobile-menu .bbs-menu-account > a,
  .mobile-menu .bbs-menu-logout > a{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    width:100% !important;
    min-height:50px !important;
    margin:0 !important;
    padding:11px 18px !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    color:var(--bbs-text-main) !important;
    font-size:15px !important;
    font-weight:500 !important;
    line-height:1.25 !important;
    text-align:left !important;
    text-decoration:none !important;
    transform:none !important;
  }

  .mobile-menu .bbs-menu-account{
    margin-top:12px !important;
    padding-top:12px !important;
    border-top:1px solid rgba(15,36,84,.10);
  }

  .mobile-menu .bbs-menu-account > a{
    color:var(--bbs-primary) !important;
    font-weight:700 !important;
  }

  .mobile-menu .bbs-menu-logout > a{
    color:var(--bbs-text-muted) !important;
  }

  .mobile-menu .bbs-menu-booking > a:hover,
  .mobile-menu .bbs-menu-booking > a:focus,
  .mobile-menu .bbs-menu-account > a:hover,
  .mobile-menu .bbs-menu-account > a:focus{
    background:color-mix(in srgb, var(--bbs-primary) 6%, transparent) !important;
    color:var(--bbs-primary) !important;
  }

  .mobile-menu .bbs-menu-logout > a:hover,
  .mobile-menu .bbs-menu-logout > a:focus{
    background:color-mix(in srgb, var(--bbs-error) 6%, transparent) !important;
    color:var(--bbs-error) !important;
  }

  .mobile-menu .bbs-menu-booking > a::before,
  .mobile-menu .bbs-menu-account > a::before,
  .mobile-menu .bbs-menu-logout > a::before{
    width:20px !important;
    height:20px !important;
    flex:0 0 20px !important;
  }

}


/* ======================================================
   SMALL MOBILE
====================================================== */

@media (max-width:767px){

  .mobile-menu{
    padding-bottom:30px !important;
  }

  .mobile-menu .bbs-menu-booking > a,
  .mobile-menu .bbs-menu-account > a,
  .mobile-menu .bbs-menu-logout > a{
    min-height:48px !important;
    padding:10px 16px !important;
    font-size:15px !important;
  }

}