/* Fragrant Travel mobile slide-out navigation */
.ft-mobile-backdrop,
.ft-mobile-drawer { display:none; }

@media (max-width:767px) {
  body.ft-mobile-menu-open { overflow:hidden !important; }
  .navbar .navbar-header { width:100%; min-height:54px; }
  .navbar .navbar-toggle.ft-mobile-menu-toggle {
    display:block !important;
    float:right;
    margin:8px 14px 8px 0;
    padding:9px 10px;
    border:1px solid rgba(255,255,255,.42);
    border-radius:4px;
    background:transparent;
    z-index:10001;
    transform: translateY(-20px);
  }
  .navbar .navbar-toggle.ft-mobile-menu-toggle .icon-bar {
    display:block; width:24px; height:2px; border-radius:1px;
    background:#fff; margin:5px 0;
  }
  /* Use the dedicated drawer on phones, not Bootstrap's collapsing list. */
  #bs-example-navbar-collapse-animations { display:none !important; }
  .ft-mobile-backdrop {
    display:block; position:fixed; inset:0; z-index:20000;
    background:rgba(0,0,0,.52); opacity:1;
  }
  .ft-mobile-backdrop[hidden] { display:none !important; }
  .ft-mobile-drawer {
    display:flex; flex-direction:column; position:fixed; z-index:20001;
    top:0; right:0; bottom:0; width:min(82vw,420px); max-width:100%;
    background:#155194; color:#fff; box-shadow:-10px 0 30px rgba(0,0,0,.2);
    transform:translateX(105%); visibility:hidden;
    transition:transform .25s ease, visibility .25s ease;
    overflow:hidden; padding:0; margin:0; text-align:left;
  }
  .ft-mobile-drawer.is-open { transform:translateX(0); visibility:visible; }
  .ft-mobile-drawer-head {
    display:flex; align-items:center; justify-content:space-between; gap:12px;
    min-height:74px; padding:12px 16px; flex:0 0 auto;
    background:#104780; border-bottom:1px solid rgba(255,255,255,.18);
  }
  .ft-mobile-drawer-brand { display:block; min-width:0; }
  .ft-mobile-drawer-brand img { display:block; width:auto; max-width:210px; max-height:48px; object-fit:contain; }
  .ft-mobile-close {
    flex:0 0 38px; width:38px; height:38px; border:0; border-radius:50%;
    background:rgba(255,255,255,.13); color:#fff; font-size:30px;
    line-height:1; cursor:pointer;
  }
  .ft-mobile-nav { flex:1 1 auto; overflow-y:auto; overscroll-behavior:contain; padding:8px 0 24px; }
  .ft-mobile-nav a { color:#fff; text-decoration:none; }
  .ft-mobile-link,
  .ft-mobile-group > summary {
    display:flex; align-items:center; justify-content:space-between; gap:14px;
    width:100%; min-height:56px; padding:15px 22px; margin:0;
    box-sizing:border-box; border:0; border-bottom:1px solid rgba(255,255,255,.12);
    background:transparent; color:#fff; text-align:left; text-transform:uppercase;
    font-size:16px; font-weight:700; line-height:1.35; list-style:none; cursor:pointer;
  }
  .ft-mobile-link.is-current { background:#292929; margin:0 0 2px; }
  .ft-mobile-group > summary::-webkit-details-marker { display:none; }
  .ft-mobile-group > summary::after {
    content:""; flex:0 0 8px; width:8px; height:8px;
    border-right:2px solid #fff; border-bottom:2px solid #fff;
    transform:rotate(45deg); margin:0 4px 5px 0; transition:transform .18s ease;
  }
  .ft-mobile-group[open] > summary::after { transform:rotate(225deg); margin-bottom:0; }
  .ft-mobile-submenu { background:#fff; color:#333; padding:2px 14px 8px; }
  .ft-mobile-region > summary,
  .ft-mobile-state > summary {
    min-height:48px; padding:12px 10px; color:#333; background:#fff;
    border-bottom:1px solid #e4e4e4; font-size:15px; font-weight:600;
    text-transform:none;
  }
  .ft-mobile-region > summary::after,
  .ft-mobile-state > summary::after { border-color:#555; }
  .ft-mobile-state > summary { font-size:14px; font-weight:500; padding-left:14px; }
  .ft-mobile-city-list { padding:0 0 5px 18px; }
  .ft-mobile-leaf {
    display:block; padding:11px 8px; border-bottom:1px solid #ededed;
    color:#333 !important; font-size:14px; line-height:1.4; overflow-wrap:anywhere;
  }
  .ft-mobile-leaf:last-child { border-bottom:0; }
  .ft-mobile-empty { display:block; padding:10px 8px; color:#777; font-size:13px; }
  .ft-mobile-payment { background:rgba(255,255,255,.1); }
  .ft-mobile-language { padding:18px 22px 8px; color:#fff; font-size:13px; }
  .ft-mobile-language-links { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
  .ft-mobile-language-links a { display:inline-block; padding:7px 10px; border:1px solid rgba(255,255,255,.4); border-radius:3px; }
}
@media (prefers-reduced-motion:reduce) {
  .ft-mobile-drawer { transition:none !important; }
}


/* Header refinements: fixed 65px logo height, centered hamburger, mobile-only tagline. */
.ft-mobile-tagline { display:none; }
#header .container .row .col-md-4.col-xs-6 > a > img.logo {
  display:block !important;
  height:65px !important;
  width:auto !important;
  max-height:none !important;
  max-width:100% !important;
  object-fit:contain;
}
#header .container .row .col-md-4.col-xs-6 > a {
  display:flex;
  align-items:center;
  min-height:75px;
}
@media (max-width: 767px) {
  #header .container .row .col-md-4.col-xs-6 > a > img.logo {
    height:65px !important;
    width:auto !important;
    max-height:none !important;
    max-width:calc(100vw - 105px) !important;
  }
  #header .container .row .col-md-4.col-xs-6 > a {
    min-height:82px;
  }
  .ft-mobile-tagline {
    display:block !important;
    width:100%;
    min-height:30px;
    box-sizing:border-box;
    padding:6px 12px;
    background:linear-gradient(90deg,#155194 0%,#1872a7 100%);
    color:#fff;
    font-size:15px;
    font-weight:700;
    line-height:18px;
    text-align:center;
    letter-spacing:.15px;
  }
  .navbar.navbg {
    position:relative !important;
    height:0 !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    z-index:10010 !important;
  }
  .navbar.navbg > .container,
  .navbar.navbg .navbar-header {
    position:static !important;
    height:0 !important;
    min-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
  }
  .navbar.navbg .bestthing { display:none !important; }
  .navbar.navbg .navbar-toggle.ft-mobile-menu-toggle {
    display:block !important;
    position:absolute !important;
    top:-46px !important;
    right:12px !important;
    float:none !important;
    width:48px !important;
    height:44px !important;
    margin:0 !important;
    padding:8px 10px !important;
    background:#155194 !important;
    border:2px solid #155194 !important;
    border-radius:5px !important;
    box-shadow:0 2px 7px rgba(0,0,0,.18) !important;
    z-index:10020 !important;
  }
  .navbar.navbg .navbar-toggle.ft-mobile-menu-toggle .icon-bar {
    display:block !important;
    width:24px !important;
    height:3px !important;
    margin:4px 0 !important;
    background:#fff !important;
    border-radius:2px !important;
  }
  .navbar.navbg .navbar-toggle.ft-mobile-menu-toggle:focus,
  .navbar.navbg .navbar-toggle.ft-mobile-menu-toggle:hover,
  .navbar.navbg .navbar-toggle.ft-mobile-menu-toggle:active {
    background:#104780 !important;
    border-color:#104780 !important;
    outline:2px solid rgba(21,81,148,.2) !important;
  }
}