/* Jibha Site: fixes for running the mockup components inside Solace + Elementor.
   jibha-mockup.css (the scoped mockup stylesheet) loads first. */

/* The mockup's body rules land on .jb itself: no page background, no safe-area bar. */
.jb { background: transparent; }
.jb::before { content: none; }

/* Header: the mega panels and the mobile menu hang from the header's outer container
   (class jb-header-root on the Site Builder header), so everything inside is static. */
.jb-header-root { position: relative; }
.jb-header-root .e-con:not(.jb-header-root),
.jb-header-root .e-con-inner,
.jb-header-root .elementor-widget-jibha-mega-nav,
.jb-header-root .elementor-widget-jibha-mega-nav > .elementor-widget-container { position: static; }
.jb-nav { display: flex; align-items: center; justify-content: flex-end; line-height: 1.4; }
.jb-nav .nav { flex-wrap: nowrap; }
.jb-nav .nav > a, .jb-nav .nav-link { white-space: nowrap; }
.jb-nav .mega { z-index: 98; }
.jb-nav .mega .wrap { max-width: 1200px; margin: 0 auto; }
@media (max-width: 1020px) {
  .jb-nav .nav { left: 0; right: 0; top: 100%; z-index: 98; }
}

/* Theme button and input styles must not leak into the widgets. */
.jb button { font-family: var(--body); text-transform: none; letter-spacing: normal; box-shadow: none; }
.jb .btn { line-height: 1.2; }
.jb input, .jb select, .jb textarea { font-family: var(--body); }

/* Hero slider fills its Elementor container edge to edge. */
.elementor-widget-jibha-hero-slider, .elementor-widget-jibha-hero-slider > .elementor-widget-container { width: 100%; }

/* Finder sits on the bottom edge of the hero. */
.jb-finder .finder-wrap { position: relative; z-index: 5; }

/* Route maps */
.jb-map .route-map { width: 100%; }

/* Solace sets word-break and uppercase buttons globally. */
.jb h1, .jb h2, .jb h3, .jb h4, .jb p, .jb span, .jb a { word-break: normal; overflow-wrap: normal; }
.jb .btn, .jb button, .jb .nav a, .jb .nav-link, .jb select, .jb input, .jb label { text-transform: none; letter-spacing: normal; }

/* Solace list styles off inside the widgets. */
.jb ul, .jb ol.steps-mini { list-style: none; margin: 0; padding: 0; }
.jb li { margin: 0; list-style: none; }
.jb .mega ul li::marker { content: none; }

/* Tour pages */
.jb-trip .tc-head { padding-top: 32px; }
.jb-trip .trip-enquiry-form { max-width: 820px; }
.jb-trip .trip-enquiry-form .wte_enquiry_contact_form-wrap { margin: 0; padding: 0; box-shadow: none; background: transparent; }
.jb-trip .trip-enquiry-form button, .jb-trip .trip-enquiry-form input[type=submit] { background: var(--red) !important; color: #fff !important; border: 0 !important; border-radius: 8px !important; padding: 13px 22px !important; font-weight: 700; }

/* Fluent Forms (contact + tour quote) in the brand style */
.jb-form-wrap .jb-ff { width: 100%; max-width: 860px; }
.jb-ff .fluentform { background: #fff; border: 1px solid #DEDFDC; border-radius: 14px; padding: 28px; font-family: "Lato", sans-serif; }
.jb-ff .ff-el-input--label label { font-weight: 700; color: #232323; font-size: 15px; }
.jb-ff .ff-el-form-control { border: 1px solid #DEDFDC !important; border-radius: 8px !important; padding: 11px 14px !important; font-size: 15px; }
.jb-ff .ff-el-form-control:focus { border-color: #232323 !important; box-shadow: none !important; }
.jb-ff .ff-btn-submit, .jb-ff button[type=submit] { background: #E0120C !important; color: #fff !important; border: 0 !important; border-radius: 8px !important; padding: 14px 26px !important; font-weight: 700 !important; font-size: 16px !important; }
.jb-ff .ff-btn-submit:hover { background: #B30E09 !important; }
.jb-ff .ff-message-success { border: 1px solid #DEDFDC; border-left: 4px solid #E0120C; border-radius: 10px; padding: 18px; background: #fff; }
@media (max-width: 767px) { .jb-ff .fluentform { padding: 18px; } }
