/* ============================================================
   JA Stark / T4 — Custom CSS
   Grapevine Marketing | grapevinemarketing.org
   ============================================================ */

/* ── REPLACEABLE VALUES (targets for GVDB_Replacer) ─────────
   Book Online button : #005DAB  ← Brand Colors → CSS File
   Footer background  : #111111  ← Brand Colors → CSS File
   ──────────────────────────────────────────────────────────── */


/* ── General ─────────────────────────────────────────────── */

body, h1, h2, h3, h4, h5, h6 {
  color: #000 !important;
}

p { font-size: 20px; }
.bg-overlay { display: none; }
.page-header h2 { display: none; }
.controls { margin-left: 0 !important; }


/* ── Header ──────────────────────────────────────────────── */

#t4-header {
  background-color: #fff !important;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2) !important;
}

/* Header logo — max height, preserve aspect ratio fully */
.logo-img,
.logo-img-sm {
  max-height: 80px !important;
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  margin-top: 8px !important;
  margin-bottom: 8px !important;
  object-fit: contain !important;
}


/* ── Desktop Navigation ───────────────────────────────────── */

.t4-megamenu .navbar-nav > li > a,
.t4-megamenu .navbar-nav > li > .nav-link {
  color: #000000 !important;
  font-weight: bold;
  font-size: 20px;
  padding: 1.875rem 0.5rem;
}

.t4-megamenu .navbar-nav > li > a:hover,
.t4-megamenu .navbar-nav > li > .nav-link:hover,
.t4-megamenu .navbar-nav > li.active > a,
.t4-megamenu .navbar-nav > li.active > .nav-link {
  color: #000000 !important;
}

.t4-megamenu .dropdown-menu ul > li a.nav-link:hover,
.t4-megamenu .dropdown-menu ul > li a.dropdown-item:hover {
  color: #000000 !important;
  font-weight: 900;
}

.t4-megamenu .dropdown-menu ul > .active a.nav-link,
.t4-megamenu .dropdown-menu ul > .active a.dropdown-item {
  color: #000000 !important;
  font-weight: 700;
}

.t4-palette-dark .nav > li > a {
  color: white !important;
}


/* ── Book Online Button ──────────────────────────────────── */

li.nav-item.my-btn { margin-top: 20px; }

li.nav-item.my-btn a {
  padding: 0.875rem 1.2rem !important;
  background-color: #005DAB;
  border: 2px solid #005DAB;
  border-radius: 8px;
  transition: none;
}

/* No hover — button stays same color on mouseover */
li.nav-item.my-btn a:hover {
  background-color: #005DAB !important;
  border-color: #005DAB !important;
}

.my-btn a,
.my-btn a span,
.my-btn a:hover,
.my-btn a:hover span,
.my-btn span,
.my-btn span:hover {
  color: #ffffff !important;
}

/* Offcanvas mobile Book Online button */
.t4-offcanvas li.nav-item.my-btn a {
  display: inline-block;
  padding: 10px 18px !important;
  background-color: #005DAB;
  border: 2px solid #005DAB;
  border-radius: 8px;
  color: #ffffff !important;
}

.t4-offcanvas li.nav-item.my-btn a span { color: #ffffff !important; }


/* ── Mobile / Offcanvas ───────────────────────────────────── */

.t4-offcanvas-toggle i,
.navbar-toggler i,
i.fa.fa-bars.toggle-bars {
  color: #000000;
}

.t4-offcanvas .t4-off-canvas-header {
  background-color: #000000 !important;
}

.t4-offcanvas .t4-off-canvas-header a img {
  max-height: 7rem !important;
  width: auto !important;
  max-width: 100% !important;
}

@media screen and (max-width: 600px) {
  .t4-header { height: 118px !important; }
}


/* ── Masthead ─────────────────────────────────────────────── */

#t4-masthead { padding-top: 1px !important; }
#t4-masthead h1 { padding: 10px 0; }

@media screen and (max-width: 992px) {
  .item-435 #t4-masthead { margin-top: 0px !important; }
}


/* ── Footer background ───────────────────────────────────── */
/* #111111 is replaced by GVDB_Replacer → Brand Colors → Footer Background */

#t4-footnav,
#t4-footer {
  background-color: #111111 !important;
}


/* ── Footer logo — fluid, fits any aspect ratio ─────────── */

#t4-footnav img {
  max-height: 100px !important;
  max-width: 200px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
}


/* ── Section spacing ─────────────────────────────────────── */

#t4-section-1 .container,
#t4-section-2 .container,
#t4-section-3 .container,
#t4-section-4 .container,
#t4-section-5 .container,
#t4-section-6 .container {
  padding: 50px 0;
}

#t4-section-4 { padding: 150px 0; }

.item-435 #t4-section-2 .container {
  padding-top: 20px !important;
  padding-bottom: 40px !important;
  margin-top: 20px;
  margin-bottom: 20px;
}

.item-435 #t4-section-3 .container,
.item-435 #t4-section-4 .container {
  padding-top: 20px !important;
  padding-bottom: 40px !important;
}

.t4-footer .container {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}


/* ── Icon / Feature Sections ─────────────────────────────── */

.section-1,
.section-2,
.section-3 {
  background-color: #5f8f91 !important;
  box-shadow: 0px 0px 12px -3px rgba(0, 0, 0, 0.39);
  padding: 10px;
  border-radius: 20px;
  margin: 10px;
}

.myBottomSection {
  background-color: #5f8f91 !important;
  padding-top: 30px;
  padding-bottom: 30px;
}

.IconsRowHomePage .t4-section-inner {
  padding-bottom: 0px !important;
  padding-top: 0px !important;
}

.IconsRowHomePage .section-5,
.IconsRowHomePage .section-6,
.IconsRowHomePage .section-7,
.IconsRowHomePage .section-8 {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

.IconsRowHomePage { background-color: #ffffffd4; }
.ourServicesHeading { padding-top: 20px; padding-bottom: 20px; }

.module-title {
  color: #fff !important;
  font-size: 25px;
  font-weight: bold;
}


/* ── TaxiBooking Booking Form ────────────────────────────── */

#tbNewStyleWrapper { margin-bottom: 100px !important; }

@media only screen and (min-width: 1024px) {
  .booking-final-masthead {
    padding-left: 15%;
    padding-right: 15%;
  }
}

#limobooking-step3-wrapper ::before { display: none; }
.form-inline { display: block !important; }

#bottomFloatingBar {
  width: 250px !important;
  margin-top: -60px !important;
}

.floatingButton {
  background-color: #005DAB !important;
  padding: 20px !important;
  font-size: 24px !important;
  color: #ffffff !important;
}


/* ── Login / Forms ───────────────────────────────────────── */

.login, #adminForm {
  margin-top: 50px !important;
  margin-bottom: 50px !important;
}

.bfFormDiv {
  width: 80%;
  margin-left: auto;
  margin-right: auto;
  padding: 50px;
  margin-top: 50px;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2) !important;
}


/* ── Generic Button ──────────────────────────────────────── */

.my-button {
  background-color: #005DAB;
  color: #ffffff;
  padding: 12px 24px;
  border: none;
  border-radius: 6px;
  font-size: 16px;
  cursor: pointer;
  margin-top: 20px !important;
}
.my-button:hover { background-color: #005DAB; color: #ffffff; }


/* ── Mobile Sliders ──────────────────────────────────────── */

#mobileslider { display: none; }

@media only screen and (max-width: 600px) {
  #desktopslider { display: none; }
  #mobileslider { display: block !important; }
}

.t4-module:first-child { margin-top: 10px !important; }
