/* ==========================================================================
   BBNTour — Modern Theme Overlay
   Loaded AFTER all page/section stylesheets on every master page.
   Only touches color, type, shadow, radius, and motion — never position,
   width, float or display — so existing layouts never shift.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');

:root{
  --bbn-primary:#FF5A5F;
  --bbn-primary-dark:#E14850;
  --bbn-secondary:#00A699;
  --bbn-secondary-dark:#00857A;
  --bbn-dark:#26303A;
  --bbn-dark-2:#1B2229;
  --bbn-light:#F7F8FA;
  --bbn-text:#4A4F54;
  --bbn-radius:10px;
  --bbn-radius-sm:6px;
  --bbn-shadow-sm:0 2px 10px rgba(20,20,30,.06);
  --bbn-shadow-md:0 10px 30px rgba(20,20,30,.10);
  --bbn-shadow-lg:0 18px 45px rgba(20,20,30,.16);
  --bbn-ease:cubic-bezier(.22,.61,.36,1);
}

html{ scroll-behavior:smooth; }

::selection{ background:var(--bbn-primary); color:#fff; }

/* thin modern scrollbar (no-op in browsers without support) */
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:var(--bbn-light); }
::-webkit-scrollbar-thumb{ background:#c7ccd1; border-radius:8px; }
::-webkit-scrollbar-thumb:hover{ background:var(--bbn-secondary); }

body{
  font-family:'Poppins', 'Source Sans Pro', 'Lato', sans-serif;
  color:var(--bbn-text);
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4,h5,h6{
  font-family:'Poppins','Lobster Two', cursive, sans-serif;
  letter-spacing:.2px;
}

a{ transition:color .3s var(--bbn-ease), background-color .3s var(--bbn-ease), transform .3s var(--bbn-ease), box-shadow .3s var(--bbn-ease); }

/* ---- generic buttons / submits (low specificity -> only fills gaps) --- */
button,
input[type="submit"],
input[type="button"],
.btn{
  border-radius:var(--bbn-radius-sm);
  transition:transform .3s var(--bbn-ease), box-shadow .3s var(--bbn-ease), background-color .3s var(--bbn-ease), color .3s var(--bbn-ease);
}
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.btn:hover{
  transform:translateY(-2px);
  box-shadow:var(--bbn-shadow-md);
}
button:active,
input[type="submit"]:active,
input[type="button"]:active,
.btn:active{
  transform:translateY(0);
}

/* ---- known site CTA / link-buttons get a real lift + glow on hover ---- */
.acount-btn:hover,
.login-right input[type="submit"]:hover,
.contact-section-grid-sumbit:hover,
.register-but input[type="submit"]:hover,
.order-form-grid input[type="button"]:hover,
.form_details input[type="submit"]:hover,
.form_details a:hover,
a.morebtn:hover,
.buy input[type="button"]:hover,
.service-section-top-row-grid4 input[type="submit"]:hover,
.contact-form input[type="submit"]:hover{
  transform:translateY(-3px) scale(1.02);
  box-shadow:var(--bbn-shadow-md);
}

/* ---- inputs: soft modern focus state, no size change ---- */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
textarea,
select{
  transition:box-shadow .3s var(--bbn-ease), border-color .3s var(--bbn-ease);
  border-radius:var(--bbn-radius-sm);
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="tel"]:focus,
textarea:focus,
select:focus{
  box-shadow:0 0 0 3px rgba(0,166,153,.18);
  border-color:var(--bbn-secondary);
  outline:none;
}

/* ---- cards / panels used across templates: soften with shadow+radius -- */
.offer,
.cart-sec,
.main-search,
.flat,
.facts,
.contact-section-grid-input{
  border-radius:var(--bbn-radius);
  box-shadow:var(--bbn-shadow-sm);
}

/* ---- image hover zoom (parent already clips via existing overflow) --- */
.img-responsive,
.res-img-1 img,
.res-img-2 img,
.offer-image img,
.cart-item img{
  transition:transform .5s var(--bbn-ease);
}
a:hover > .img-responsive,
.res-img-1:hover img,
.res-img-2:hover img,
.offer-image:hover img,
.cart-item:hover img{
  transform:scale(1.04);
}

/* ---- nav links: animated underline, no layout shift (absolute) ------- */
.top-menu ul li a,
.login-section ul li a{
  position:relative;
}
.top-menu ul li a::after{
  content:'';
  position:absolute;
  left:0; bottom:-6px;
  width:0; height:2px;
  background:var(--bbn-secondary);
  transition:width .3s var(--bbn-ease);
}
.top-menu ul li a:hover::after,
.top-menu ul li.active a::after{
  width:100%;
}

/* ---- soft elevation on key section blocks --------------------------- */
.header{ box-shadow:var(--bbn-shadow-sm); }
.contact-section{ box-shadow:inset 0 1px 0 rgba(255,255,255,.05); }

/* ==========================================================================
   Entrance animations — purely visual, settle into the exact original
   resting position/size. Disabled automatically for users who prefer
   reduced motion.
   ========================================================================== */
@keyframes bbnFadeDown{
  from{ opacity:0; transform:translateY(-16px); }
  to{ opacity:1; transform:translateY(0); }
}
@keyframes bbnFadeUp{
  from{ opacity:0; transform:translateY(24px); }
  to{ opacity:1; transform:translateY(0); }
}
@keyframes bbnFadeIn{
  from{ opacity:0; }
  to{ opacity:1; }
}
@keyframes bbnPulseGlow{
  0%,100%{ box-shadow:0 0 0 0 rgba(0,166,153,.35); }
  50%{ box-shadow:0 0 0 8px rgba(0,166,153,0); }
}

.header{ animation:bbnFadeDown .6s var(--bbn-ease) both; }
.menu-bar{ animation:bbnFadeDown .7s var(--bbn-ease) .05s both; }
.banner{ animation:bbnFadeIn .9s var(--bbn-ease) .1s both; }
.contact_top,
.login-page,
.register,
.cart-items,
.orders,
.contact_top .container{ animation:bbnFadeUp .7s var(--bbn-ease) .12s both; }
.contact-section{ animation:bbnFadeUp .7s var(--bbn-ease) .05s both; }
.footer{ animation:bbnFadeIn .8s var(--bbn-ease) both; }

@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
}

/* ==========================================================================
   Full-width layout
   The legacy stylesheets box everything into a ~1170px (and even 735px on
   tablet) .container. Open that up so content uses the available screen,
   while header/banner/footer get an edge-to-edge full-bleed feel.
   ========================================================================== */
.container{
  width:100% !important;
  max-width:1400px;
}
.header,
.menu-bar,
.banner,
.footer,
.contact-section{
  width:100%;
}

/* ==========================================================================
   Hamburger menu — button + mobile nav drawer
   Markup added alongside this stylesheet:
     <button id="bbnHamburger" class="bbn-hamburger" ...><span></span>x3</button>
     <div class="bbn-nav-collapse" id="bbnNavCollapse"> .top-menu + .login-section </div>
   ========================================================================== */
.bbn-hamburger{
  display:none;
  position:relative;
  width:42px;
  height:36px;
  padding:0;
  margin-left:auto;
  background:transparent;
  border:none;
  cursor:pointer;
  z-index:1001;
}
.bbn-hamburger span{
  display:block;
  position:absolute;
  left:6px;
  right:6px;
  height:3px;
  border-radius:3px;
  background:var(--bbn-dark);
  transition:transform .3s var(--bbn-ease), opacity .3s var(--bbn-ease), background-color .3s var(--bbn-ease);
}
.bbn-hamburger span:nth-child(1){ top:9px; }
.bbn-hamburger span:nth-child(2){ top:17px; }
.bbn-hamburger span:nth-child(3){ top:25px; }
.bbn-hamburger.active span{ background:var(--bbn-primary); }
.bbn-hamburger.active span:nth-child(1){ top:17px; transform:rotate(45deg); }
.bbn-hamburger.active span:nth-child(2){ opacity:0; }
.bbn-hamburger.active span:nth-child(3){ top:17px; transform:rotate(-45deg); }

.bbn-nav-collapse{ display:flex; align-items:center; flex-wrap:wrap; }

/* ---- sticky / scrolled header ----------------------------------------- */
.menu-bar{
  position:sticky;
  top:0;
  z-index:1000;
  transition:box-shadow .3s var(--bbn-ease), padding .3s var(--bbn-ease), background-color .3s var(--bbn-ease);
}
.menu-bar.bbn-scrolled{
  box-shadow:var(--bbn-shadow-md);
  padding-top:.2em;
  padding-bottom:.2em;
}

@media (max-width:991px){
  .bbn-hamburger{ display:block; }

  .menu-bar .container{
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
  }

  .bbn-nav-collapse{
    flex-basis:100%;
    width:100%;
    max-height:0;
    overflow:hidden;
    opacity:0;
    flex-direction:column;
    align-items:stretch;
    transition:max-height .4s var(--bbn-ease), opacity .3s var(--bbn-ease);
  }
  .bbn-nav-collapse.open{
    max-height:1200px;
    opacity:1;
    padding:.5em 0 1em;
  }

  .top-menu,
  .login-section{
    float:none !important;
    width:100%;
  }
  .top-menu ul,
  .login-section ul{
    display:block;
    margin:0;
    padding:0;
  }
  .top-menu ul li,
  .login-section ul li{
    display:block !important;
    margin:0 !important;
    border-bottom:1px solid rgba(0,0,0,.06);
  }
  .top-menu ul li a,
  .login-section ul li a{
    padding:.7em 0;
  }
  .top-menu ul li a::after{ display:none; }
}

body.bbn-nav-open{ overflow:hidden; }

/* ==========================================================================
   Extra polish — richer entrance motion + small decorative details,
   layered on top of the base animations above.
   ========================================================================== */
@keyframes bbnFloat{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(-8px); }
}
@keyframes bbnPop{
  from{ opacity:0; transform:scale(.92); }
  to{ opacity:1; transform:scale(1); }
}

.banner-info-head h1{
  animation:bbnFadeUp .8s var(--bbn-ease) .15s both;
}
.offer,
.flat,
.facts{
  animation:bbnPop .6s var(--bbn-ease) both;
}
.offer:hover,
.flat:hover,
.facts:hover{
  transform:translateY(-6px);
  box-shadow:var(--bbn-shadow-lg);
  transition:transform .35s var(--bbn-ease), box-shadow .35s var(--bbn-ease);
}
.logo img{
  animation:bbnFloat 5s var(--bbn-ease) infinite;
}

@media (prefers-reduced-motion: reduce){
  .logo img{ animation:none; }
}

/* ==========================================================================
   Footer — recolor to match the new brand palette instead of the old
   neutral grays, with colored hover states on links/social icons.
   ========================================================================== */
.contact-section{
  background:var(--bbn-dark-2) !important;
  position:relative;
}
.contact-section::before{
  content:'';
  position:absolute;
  top:0; left:0; right:0;
  height:3px;
  background:linear-gradient(90deg, var(--bbn-primary), var(--bbn-secondary));
}
.contact-section-grid h4{
  position:relative;
  padding-bottom:.5em;
}
.contact-section-grid h4::after{
  content:'';
  position:absolute;
  left:0; bottom:0;
  width:36px; height:3px;
  border-radius:3px;
  background:var(--bbn-primary);
}
.contact-section-grid ul li.data,
.contact-section-grid ul li a,
.contact-section-grid p{
  color:#B7BDC4 !important;
}
.contact-section-grid ul li a:hover{
  color:var(--bbn-secondary) !important;
  padding-left:3px;
  transition:color .25s var(--bbn-ease), padding-left .25s var(--bbn-ease);
}
.footer{ background:var(--bbn-dark-2) !important; }
.footer p{ color:var(--bbn-secondary) !important; }
.footer a{ color:#fff !important; }
.footer a:hover{ color:var(--bbn-primary) !important; }

/* ==========================================================================
   Repeater / card-driven content (gallery, events, attractions lists) —
   bring the same shadow + radius + hover-lift language used elsewhere.
   ========================================================================== */
.top-cuisine-grid{
  border-radius:var(--bbn-radius);
  overflow:hidden;
  box-shadow:var(--bbn-shadow-sm);
  transition:transform .35s var(--bbn-ease), box-shadow .35s var(--bbn-ease);
}
.top-cuisine-grid:hover{
  transform:translateY(-5px);
  box-shadow:var(--bbn-shadow-lg);
}
ul.list-cards li{
  background:#fff;
  border-radius:var(--bbn-radius);
  box-shadow:var(--bbn-shadow-sm);
  transition:transform .3s var(--bbn-ease), box-shadow .3s var(--bbn-ease);
}
ul.list-cards li:hover{
  transform:translateY(-4px);
  box-shadow:var(--bbn-shadow-md);
}
ul.list-cards li a.list-card-header .list-card-img{
  border-radius:var(--bbn-radius-sm) 0 0 var(--bbn-radius-sm);
}

/* ==========================================================================
   Homepage hero — full-bleed carousel + urbanhost-style floating white
   search card (replacing the old dark inline search box visually only;
   markup/fields are unchanged).
   ========================================================================== */
html, body{ overflow-x:hidden; max-width:100%; }
#bg-fade-carousel{ position:relative; min-height:550px; width:100%; }
#bg-fade-carousel .carousel-inner,
#bg-fade-carousel .carousel-inner .item,
#bg-fade-carousel .slide1,
#bg-fade-carousel .slide2,
#bg-fade-carousel .slide3,
#bg-fade-carousel .slide4{
  width:100%;
}
#bg-fade-carousel::after{
  content:'';
  position:absolute;
  left:0; right:0; bottom:0;
  height:120px;
  background:linear-gradient(180deg, rgba(247,248,250,0) 0%, rgba(247,248,250,1) 100%);
  pointer-events:none;
}
/* Legacy rule was position:relative + bottom:100px (a fixed pixel shift,
   not height-aware) — any growth in overlay content (e.g. adding the
   slogan) pushed the whole card out of place. Switch to true vertical
   centering so it always sits correctly regardless of content height. */
.carousel-overlay{
  position:absolute !important;
  top:50% !important;
  bottom:auto !important;
  left:0; right:0;
  transform:translateY(-50%);
  z-index:2;
}

.banner-info-head h1{
  text-shadow:0 2px 18px rgba(0,0,0,.35);
}

.banner-info{
  max-width:1040px;
  margin:0 auto;
  background:#fff;
  border-radius:60px;
  box-shadow:var(--bbn-shadow-lg);
  padding:.7em .7em .7em 1.8em;
  display:flex;
  align-items:center;
  gap:.5em;
}
.form-list{
  flex:1 1 auto;
  min-width:0;
}
.form-list ul.navmain{
  display:flex;
  align-items:center;
}
.form-list ul li{
  display:block;
  width:auto !important;
  flex:1 1 0;
  min-width:0;
  padding:0 1.4em;
  border-right:1px solid #ECEDEF;
}
.form-list ul li:first-child{
  padding-left:0;
}
.form-list ul li:last-child{
  border-right:none;
}
.form-list span{
  color:#9AA1A8 !important;
  font-size:11px !important;
  font-weight:700 !important;
  text-transform:uppercase;
  letter-spacing:.5px;
  margin-bottom:.2em;
}
.form-list input.text{
  background:transparent !important;
  color:var(--bbn-dark) !important;
  border-radius:0 !important;
  width:100% !important;
  padding:0 !important;
  margin-top:.15em !important;
  font-size:15px !important;
  font-weight:600 !important;
}
.srch{
  margin:0 !important;
  flex:0 0 auto;
}
.srch .button{
  position:static !important;
  display:flex !important;
  align-items:center;
  justify-content:center;
  gap:.5em;
  background:var(--bbn-primary) !important;
  background-image:none !important;
  width:auto !important;
  height:auto !important;
  padding:1em 1.8em;
  border-radius:50px !important;
  color:#fff !important;
  font-weight:600;
  font-size:15px;
  letter-spacing:.3px;
  text-decoration:none !important;
  box-shadow:0 8px 20px rgba(255,90,95,.35);
  transition:transform .3s var(--bbn-ease), background-color .3s var(--bbn-ease), box-shadow .3s var(--bbn-ease);
}
.srch .button .fa-search{
  font-size:14px;
}
.srch .button:hover{
  background:var(--bbn-primary-dark) !important;
  transform:translateY(-2px);
  box-shadow:0 10px 26px rgba(255,90,95,.45);
}

#innn1, #innn2{ display:none !important; }

@media (max-width:991px){
  .banner-info{
    max-width:92%;
    flex-wrap:wrap;
    border-radius:20px;
    padding:1.2em 1.2em .6em;
  }
  .form-list{
    flex:1 1 100%;
    order:1;
  }
  .form-list ul.navmain{
    flex-wrap:wrap;
  }
  .form-list ul li{
    flex:1 1 100%;
    width:100% !important;
    padding:.6em 0 !important;
    border-right:none !important;
    border-bottom:1px solid #ECEDEF;
  }
  .form-list ul li:last-child{
    border-bottom:none;
  }
  .srch{
    flex:1 1 100%;
    order:2;
    margin-top:.8em !important;
  }
  .srch .button{
    width:100%;
    padding:.9em 1.8em;
  }
}

/* ==========================================================================
   Hero slogan — sits above the floating search card, brand-new element
   (page markup only adds this block; no existing nodes touched).
   ========================================================================== */
.bbn-hero-slogan{
  max-width:760px;
  margin:0 auto 1.4em;
  padding:0 1em;
  animation:bbnFadeUp .8s var(--bbn-ease) .05s both;
}
.bbn-hero-slogan h1{
  color:#fff;
  font-size:2.6em;
  font-weight:800;
  line-height:1.25;
  letter-spacing:.2px;
  margin:0 0 .4em;
  text-shadow:0 2px 18px rgba(0,0,0,.4);
}
.bbn-hero-slogan p{
  color:rgba(255,255,255,.92);
  font-size:1.15em;
  font-weight:500;
  margin:0;
  text-shadow:0 1px 10px rgba(0,0,0,.35);
}
@media (max-width:991px){
  .bbn-hero-slogan{
    max-width:94%;
    margin:0 auto 1em;
  }
  .bbn-hero-slogan h1{
    font-size:1.7em;
  }
  .bbn-hero-slogan p{
    font-size:1em;
  }
}
@media (max-width:480px){
  .bbn-hero-slogan h1{
    font-size:1.4em;
  }
  .bbn-hero-slogan p{
    font-size:.92em;
  }
}

/* ===== Listing cards (Accommodations/Attractions/Wineries/etc) ===== */
.bbn-listing-card{
  background:#fff;
  border-radius:16px;
  box-shadow:var(--bbn-shadow-md);
  padding:1.6em 1.8em;
  margin-bottom:1.6em;
  transition:transform .3s var(--bbn-ease), box-shadow .3s var(--bbn-ease);
  border-left:4px solid var(--bbn-secondary);
}
.bbn-listing-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--bbn-shadow-lg);
}
.bbn-listing-card h4{
  margin-top:0 !important;
}
.bbn-listing-card p{
  color:#5C6670;
  margin-bottom:.5em;
}
.bbn-listing-card p:last-child{
  margin-bottom:0;
}

/* filter buttons above listing cards */
.container > div.col-sm-2 > .btn-primary,
.container > div.col-sm-3 > .btn-primary{
  background:#fff !important;
  background-image:none !important;
  color:var(--bbn-dark) !important;
  border:2px solid #ECEDEF !important;
  border-radius:50px !important;
  font-weight:600;
  font-size:13px;
  padding:.7em 1em;
  box-shadow:none !important;
  text-shadow:none !important;
  transition:all .3s var(--bbn-ease);
}
.container > div.col-sm-2 > .btn-primary:hover,
.container > div.col-sm-3 > .btn-primary:hover{
  background:var(--bbn-secondary) !important;
  border-color:var(--bbn-secondary) !important;
  color:#fff !important;
  transform:translateY(-2px);
}

/* ===== Detail pages (Attractionsdetails/Wineriesdetails/etc + eventdetails) ===== */
.hilight{
  background:linear-gradient(120deg, var(--bbn-dark-2), var(--bbn-dark));
  color:#fff;
  padding:2.4em 0;
  margin-bottom:0;
  border-radius:0 0 24px 24px;
}
.hilight h3{
  color:#fff !important;
  font-weight:700;
  margin-bottom:.3em;
}
.hilight .glyphicon{
  color:var(--bbn-secondary);
  margin-right:.4em;
}
.hilight p{
  color:#D7DBE0;
  display:inline;
}

.nav-sidebar{
  background:#fff;
  border-radius:50px;
  box-shadow:var(--bbn-shadow-md);
  padding:.5em;
  margin:1.6em 0;
  display:inline-block;
}
.nav-sidebar.affix{
  border-radius:0;
  box-shadow:var(--bbn-shadow-sm);
}
.nav-sidebar .nav-tabs{
  border-bottom:none;
  display:flex;
  flex-wrap:wrap;
}
.nav-sidebar .nav-tabs > li{
  float:none;
}
.nav-sidebar .nav-tabs > li > a{
  border:none !important;
  border-radius:50px !important;
  margin:0 .2em;
  padding:.7em 1.4em;
  color:var(--bbn-dark);
  font-weight:600;
  font-size:13px;
  background:transparent;
  transition:all .3s var(--bbn-ease);
}
.nav-sidebar .nav-tabs > li > a p{
  display:inline;
  margin:0 0 0 .4em;
}
.nav-sidebar .nav-tabs > li > a:hover{
  background:var(--bbn-light);
  color:var(--bbn-secondary);
}
.nav-sidebar .nav-tabs > li.active > a,
.nav-sidebar .nav-tabs > li.active > a:focus,
.nav-sidebar .nav-tabs > li.active > a:hover{
  background:var(--bbn-secondary) !important;
  color:#fff !important;
}

.tab-content{
  background:#fff;
  border-radius:16px;
  box-shadow:var(--bbn-shadow-sm);
  padding:1.8em 2em;
}
.tab-content h4{
  color:var(--bbn-dark) !important;
}
.tab-content h4 small{
  color:var(--bbn-secondary);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.5px;
  font-size:13px;
}
.tab-content hr{
  border-top:1px solid #ECEDEF;
}
.tab-pane p{
  color:#5C6670;
  line-height:1.7;
}

.col-md-3.sidebar,
.container > .col-sm-9 + .col-sm-3{
  background:#fff;
  border-radius:16px;
  box-shadow:var(--bbn-shadow-sm);
  padding:1.6em;
}
.col-md-3.sidebar h4,
.container > .col-sm-9 + .col-sm-3 h4{
  color:var(--bbn-dark) !important;
}
.col-md-3.sidebar .btn-primary,
.container > .col-sm-9 + .col-sm-3 .btn-primary,
.tab-pane .btn-primary{
  background:var(--bbn-primary) !important;
  background-image:none !important;
  border:none !important;
  border-radius:50px !important;
  padding:.8em 1.4em;
  font-weight:600;
  box-shadow:0 8px 18px rgba(255,90,95,.3);
  transition:all .3s var(--bbn-ease);
}
.col-md-3.sidebar .btn-primary:hover,
.container > .col-sm-9 + .col-sm-3 .btn-primary:hover,
.tab-pane .btn-primary:hover{
  background:var(--bbn-primary-dark) !important;
  transform:translateY(-2px);
}
.col-md-3.sidebar marquee div,
.col-md-3.sidebar > div[style*="border"]{
  border:none !important;
  border-radius:12px;
  background:var(--bbn-light);
}

.modal-content{
  border-radius:16px;
  border:none;
  box-shadow:var(--bbn-shadow-lg);
  overflow:hidden;
}
.modal-header{
  background:var(--bbn-dark-2);
  border-bottom:none;
}
.modal-header .modal-title,
.modal-header .close{
  color:#fff;
}
.modal-body .form-control{
  border-radius:10px;
  border:1px solid #ECEDEF;
  padding:.7em 1em;
  height:auto;
  box-shadow:none;
}
.modal-footer{
  border-top:1px solid #ECEDEF;
}

/* ===== AjaxControlToolkit CalendarExtender popup — modern date-picker skin ===== */
.ajax__calendar{
  font-family:'Poppins', sans-serif !important;
  background:#fff !important;
  border:none !important;
  border-radius:18px !important;
  box-shadow:var(--bbn-shadow-lg) !important;
  padding:1em 1.1em !important;
  overflow:hidden;
}
.ajax__calendar_container{
  background:transparent !important;
  border:none !important;
}
.ajax__calendar_header{
  background:transparent !important;
  border:none !important;
  padding:.2em 0 .8em 0 !important;
}
.ajax__calendar_title{
  color:var(--bbn-dark) !important;
  font-weight:700 !important;
  font-size:15px !important;
}
.ajax__calendar_next, .ajax__calendar_prev{
  color:var(--bbn-secondary) !important;
  border-radius:50% !important;
  transition:background .2s var(--bbn-ease);
}
.ajax__calendar_next:hover, .ajax__calendar_prev:hover{
  background:var(--bbn-light) !important;
}
.ajax__calendar_body{
  background:transparent !important;
  border:none !important;
}
.ajax__calendar_dayname{
  color:#9AA1A8 !important;
  font-weight:700 !important;
  font-size:11px !important;
  text-transform:uppercase;
  border:none !important;
  background:transparent !important;
}
.ajax__calendar_day{
  color:var(--bbn-dark) !important;
  border:none !important;
  background:transparent !important;
  border-radius:50% !important;
  font-size:13px !important;
  font-weight:500;
  transition:all .2s var(--bbn-ease);
}
.ajax__calendar_other{
  color:#D6D9DC !important;
  background:transparent !important;
  border:none !important;
}
.ajax__calendar_hover .ajax__calendar_day,
.ajax__calendar_hover .ajax__calendar_month,
.ajax__calendar_hover .ajax__calendar_year{
  background:var(--bbn-secondary) !important;
  color:#fff !important;
  border-radius:50% !important;
  border:none !important;
}
.ajax__calendar_today{
  color:var(--bbn-primary) !important;
  font-weight:700 !important;
}
.ajax__calendar_active .ajax__calendar_day{
  background:var(--bbn-dark) !important;
  color:#fff !important;
  border-radius:50% !important;
}
.ajax__calendar_footer{
  background:transparent !important;
  border:none !important;
  border-top:1px solid #ECEDEF !important;
  padding-top:.6em !important;
  margin-top:.4em !important;
}
.ajax__calendar_footer .ajax__calendar_today{
  color:var(--bbn-secondary) !important;
  font-weight:600 !important;
  font-size:12px !important;
}
.ajax__calendar_month, .ajax__calendar_year{
  color:var(--bbn-dark) !important;
  border-radius:10px !important;
  border:none !important;
  background:transparent !important;
  font-size:13px !important;
  transition:all .2s var(--bbn-ease);
}

/* ===== Shared "blue box" category-grid template
   (attraction.aspx / VisitorsGuide.aspx and similar FAQ-style pages) ===== */
.main h4{
  color:var(--bbn-dark);
}
.faq{
  background:linear-gradient(120deg, var(--bbn-dark-2), var(--bbn-dark)) !important;
  border-radius:18px;
  margin:1.5em 0;
}
.faq h4{
  color:#fff;
}
.faq h3{
  color:var(--bbn-secondary) !important;
  text-decoration:none !important;
}
a.btn-block{
  background-color:var(--bbn-primary) !important;
  font-family:inherit !important;
  border-radius:50px !important;
  transition:all .3s var(--bbn-ease);
}
a.btn-block:hover{
  background-color:var(--bbn-primary-dark) !important;
  transform:translateY(-2px);
}
.questions .btn{
  background-color:#fff !important;
  background-image:none !important;
  color:var(--bbn-dark) !important;
  border:none !important;
  border-radius:16px !important;
  box-shadow:var(--bbn-shadow-md);
  text-shadow:none !important;
  transition:all .3s var(--bbn-ease) !important;
  display:flex !important;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.6em;
}
.questions .btn:hover{
  background-color:var(--bbn-secondary) !important;
  color:#fff !important;
  border-color:transparent !important;
  transform:translateY(-6px);
  box-shadow:var(--bbn-shadow-lg);
}
/* These were plain text-only cards — give every one a matching icon
   badge so they read as real content tiles instead of blank boxes. */
.questions .btn::before{
  content:"\f14e";
  font-family:'FontAwesome';
  font-style:normal;
  display:flex;
  align-items:center;
  justify-content:center;
  width:50px;
  height:50px;
  font-size:1.5em;
  color:#fff;
  border-radius:50%;
  background:linear-gradient(135deg, var(--bbn-secondary), var(--bbn-secondary-dark));
  box-shadow:var(--bbn-shadow-sm);
  transition:background .3s var(--bbn-ease);
}
.questions .btn:hover::before{
  background:linear-gradient(135deg, var(--bbn-primary), var(--bbn-primary-dark));
}
.panel-default > .panel-heading{
  border:none !important;
  background:var(--bbn-light) !important;
  border-radius:10px !important;
}
.panel-title > a{
  color:var(--bbn-dark) !important;
}
.panel-default{
  border:none !important;
  border-radius:10px !important;
  box-shadow:var(--bbn-shadow-sm);
  overflow:hidden;
  margin-bottom:1em;
}
.coverage [class*=col] .dec{
  border:none !important;
  border-radius:16px;
  box-shadow:var(--bbn-shadow-md);
}
.coverage [class*=col] .dec .dec_head{
  background:linear-gradient(120deg, var(--bbn-secondary), var(--bbn-secondary-dark)) !important;
  border-radius:16px 16px 0 0;
}
.coverage [class*=col]:hover .btn{
  background-color:var(--bbn-dark) !important;
}

/* ===== Plain flat content pages (familyplaces/GamingRacing/Historicsites/
   Uniquesites/aboutus and similar) — give raw paragraphs real card structure ===== */
.container > h2{
  color:var(--bbn-dark);
  font-weight:700;
  padding-bottom:.5em;
  position:relative;
}
.container > h2 + hr{
  display:none;
}
.container > p{
  color:var(--bbn-text);
  line-height:1.8;
}
.container > p:has(> strong:first-child){
  display:block;
  background:#fff;
  border-radius:16px;
  box-shadow:var(--bbn-shadow-md);
  padding:1.6em 1.8em;
  margin:0 0 1.4em 0 !important;
  border-left:4px solid var(--bbn-secondary);
  transition:transform .3s var(--bbn-ease), box-shadow .3s var(--bbn-ease);
}
.container > p:has(> strong:first-child):hover{
  transform:translateY(-4px);
  box-shadow:var(--bbn-shadow-lg);
}
.container > p:has(> strong:first-child) > strong:first-child{
  display:block;
  color:var(--bbn-secondary);
  font-size:1.15em;
  margin-bottom:.4em;
}
.container > p:has(> strong:first-child) + br{
  display:none;
}

/* ===== Homepage below-the-hero sections ===== */
.ordering-section-head h3{
  color:var(--bbn-dark) !important;
  letter-spacing:.3px;
}
.dotted-line{
  background:none !important;
}
.dotted-line::after{
  content:'';
  display:block;
  width:64px;
  height:4px;
  margin:.7em auto 0;
  border-radius:4px;
  background:linear-gradient(90deg, var(--bbn-primary), var(--bbn-secondary));
}
.ordering-section-grid{
  background:#fff !important;
  border-radius:18px;
  box-shadow:var(--bbn-shadow-md);
  margin:0 .6em;
  transition:transform .3s var(--bbn-ease), box-shadow .3s var(--bbn-ease);
}
.ordering-section-grid:hover{
  transform:translateY(-6px);
  box-shadow:var(--bbn-shadow-lg);
}
.ordering-section-grid-process p{
  color:var(--bbn-dark) !important;
}
/* The legacy icon sprites either land on blank regions of img-sprite.png,
   or (the "Connect" step) use fa-handshake-o, a class that doesn't exist
   in FontAwesome 4.7 (added in FA5) — both render as invisible. Replace
   with guaranteed real icons inside a brand-colored circle badge. */
.ordering-section-grid-process i.one-icon,
.ordering-section-grid-process i.two-icon,
.ordering-section-grid-process i.three-icon,
.ordering-section-grid-process i.four-icon,
.ordering-section-grid-process i.fa-handshake-o{
  background:linear-gradient(135deg, var(--bbn-secondary), var(--bbn-secondary-dark)) !important;
  border-radius:50% !important;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  width:45px !important;
  height:45px !important;
  box-shadow:var(--bbn-shadow-sm);
  font-size:20px !important;
  font-style:normal;
  color:#fff !important;
  padding:0 !important;
  vertical-align:middle;
}
.ordering-section-grid-process i.one-icon::before{ font-family:'FontAwesome'; content:"\f015"; }
.ordering-section-grid-process i.two-icon::before{ font-family:'FontAwesome'; content:"\f073"; }
.ordering-section-grid-process i.three-icon::before{ font-family:'FontAwesome'; content:"\f0e6"; }
.ordering-section-grid-process i.four-icon::before{ font-family:'FontAwesome'; content:"\f0f4"; }
.ordering-section-grid-process i.fa-handshake-o::before{ content:"\f0e6"; }
.ordering-section-grid:hover i.one-icon,
.ordering-section-grid:hover i.two-icon,
.ordering-section-grid:hover i.three-icon,
.ordering-section-grid:hover i.four-icon,
.ordering-section-grid:hover i.fa-handshake-o{
  background:linear-gradient(135deg, var(--bbn-primary), var(--bbn-primary-dark)) !important;
}
.special-offers-section-head h4{
  color:var(--bbn-dark) !important;
}
.lg-map-wrapper{
  background:#fff;
  border-radius:18px;
  box-shadow:var(--bbn-shadow-md);
  padding:1em;
}
.top-restaurent-head, .top-cuisine-head{
  background:none !important;
}
.top-restaurent-head h3::after, .top-cuisine-head h3::after{
  content:'';
  display:block;
  width:50px;
  height:4px;
  margin-top:.4em;
  border-radius:4px;
  background:linear-gradient(90deg, var(--bbn-primary), var(--bbn-secondary));
}
.res-img-1, .res-img-2{
  border-radius:14px;
  overflow:hidden;
  box-shadow:var(--bbn-shadow-sm);
  transition:box-shadow .3s var(--bbn-ease);
}
.res-img-1:hover, .res-img-2:hover{
  box-shadow:var(--bbn-shadow-md);
}
.service-section-bottom-grid{
  background:#fff;
  border-radius:16px;
  box-shadow:var(--bbn-shadow-sm);
  padding:1.6em 1.4em;
  transition:transform .3s var(--bbn-ease), box-shadow .3s var(--bbn-ease);
}
.service-section-bottom-grid:hover{
  transform:translateY(-6px);
  box-shadow:var(--bbn-shadow-lg);
}
.icon-data p{
  color:var(--bbn-text) !important;
}
.service-section-top-row-grids{
  border-radius:18px;
  overflow:hidden;
}
.service-section-top-row-grids::before{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(120deg, rgba(27,34,41,.65), rgba(27,34,41,.25));
}
.service-section-top-row-grid1, .service-section-top-row-grid2, .service-section-top-row-grid3, .service-section-top-row-grid4{
  position:relative;
  z-index:1;
}
.service-section-top-row-grid4 input[type="submit"]{
  border-radius:50px !important;
  box-shadow:0 8px 20px rgba(0,166,153,.35);
  transition:all .3s var(--bbn-ease);
}
.service-section-top-row-grid4 input[type="submit"]:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 26px rgba(225,72,80,.4);
}