/* ============================================================
   Search results page: full search bar above results.
   Loaded AFTER custom.css and style.css so these rules win.
   ============================================================ */

/* Make the view a flex column so we can reorder children. */
.faq-search-page.gva-view {
   display: flex;
   flex-direction: column;
}

/* Move the exposed form ABOVE the result-summary header. */
.faq-search-page .views-exposed-form {
   order: -1;
   display: flex !important;
   flex-wrap: wrap;
   align-items: center;
   gap: 8px;
   margin-bottom: 12px;
   padding: 0;
   width: 100%;
}

/* Show the search text input. */
.search-results-page .views-exposed-form .form-item-search-api-fulltext,
#views-exposed-form-search-page-page-1 .form-item-search-api-fulltext {
   display: block !important;
   flex: 1 1 auto !important;
   min-width: 0 !important;
   max-width: none !important;
   width: auto !important;
   margin: 0 !important;
}
.search-results-page .views-exposed-form .form-item-search-api-fulltext label {
   display: none !important;
}
.search-results-page .views-exposed-form .form-item-search-api-fulltext input {
   width: 100% !important;
   height: 44px;
   margin: 0 !important;
   border: 2px solid #1A2740 !important;
   border-radius: 999px !important;
   padding: 0 18px !important;
   font-size: 15px;
   color: #1A2740;
   background: #fff !important;
   outline: none;
   box-shadow: 0 1px 4px rgba(0,0,0,.06);
}
.search-results-page .views-exposed-form .form-item-search-api-fulltext input:focus {
   border-color: #1A2740 !important;
   box-shadow: 0 2px 8px rgba(26,39,64,.15);
}

/* Hide per-page select (kept in URL by search-filters.js). */
.search-results-page .views-exposed-form .form-item-items-per-page,
#views-exposed-form-search-page-page-1 .form-item-items-per-page {
   display: none !important;
}

/* Hide "Search" label heading */
.search-results-page .views-exposed-form > .form-item > label,
#views-exposed-form-search-page-page-1 > .form-item > label {
   display: none !important;
}

/* Hide "Per Page" label */
.search-results-page .views-exposed-form .form-item-items-per-page label,
#views-exposed-form-search-page-page-1 .form-item-items-per-page label {
   display: none !important;
}

/* Show the submit button, styled as a pill. */
#views-exposed-form-search-page-page-1 .form-actions,
.search-results-page form#views-exposed-form-search-page-page-1 .form-actions,
.search-results-page .views-exposed-form .form-actions {
   display: flex !important;
   align-items: center !important;
   align-self: center !important;
   margin: 0 !important;
   padding: 0 !important;
}

/* Override search-form.css hiding of .form-submit */
.search-results-page .form-submit,
#views-exposed-form-search-page-page-1 .form-submit {
   display: inline-block !important;
}

.search-results-page .views-exposed-form .form-actions input[type="submit"] {
   display: inline-block !important;
   background: #1A2740 !important;
   color: #fff !important;
   border: none !important;
   border-radius: 999px;
   margin: 0 !important;
   padding: 0 24px !important;
   height: 44px;
   line-height: 44px;
   font-size: 15px;
   font-weight: 600;
   cursor: pointer;
   white-space: nowrap;
}
.search-results-page .views-exposed-form .form-actions input[type="submit"]:hover {
   background: #2c3e5e !important;
}

/* Result summary — below the search bar. */
.faq-search-page > header {
   order: 0;
   text-align: left;
   font-size: 13px;
   color: #666;
   margin-bottom: 12px;
   padding: 0;
}

/* Keep results and pagination in normal order. */
.faq-search-page .view-content-wrap { order: 1; }
.faq-search-page .search-filters-pagelist { order: 2; }

/* ── Content-type badge (::before) ─────────────────────────── */
.search-results-page .item::before {
   display: inline-block;
   padding: 2px 8px;
   margin-right: 8px;
   border-radius: 10px;
   font-family: "DM Sans", sans-serif;
   font-size: 11px;
   font-weight: 700;
   text-transform: uppercase;
   letter-spacing: 0.4px;
   color: #fff;
   vertical-align: middle;
   line-height: 1.4;
}
.search-results-page .row-forms.item::before       { content: "Form / PDF"; background: #0B5394; }
.search-results-page .row-page.item::before        { content: "Page";       background: #3D7DCA; }
.search-results-page .row-service.item::before     { content: "Service";    background: #2E7D32; }
.search-results-page .row-article.item::before     { content: "Article";    background: #6A1B9A; }
.search-results-page .row-event.item::before       { content: "Event";      background: #C62828; }
.search-results-page .row-testimonial.item::before { content: "Story";      background: #00695C; }
.search-results-page .row-faq.item::before         { content: "FAQ";        background: #455A64; }

/* ============================================================
   Navbar search DROPDOWN panel (drops down beneath the header).
   The wrapper is moved to <body> by search-popup.js, then this
   CSS pins it as a full-width sheet below the header bar.
   ============================================================ */
.search-wrapper.is-dropdown {
   position: fixed !important;
   top: 0 !important;
   left: 0 !important;
   right: 0 !important;
   bottom: auto !important;
   inset: auto !important;
   width: 100% !important;
   max-width: none !important;
   /* Critical: legacy search-block.scss sets height:440px on .search-wrapper,
      which leaves ~350px of empty space below the input in this dropdown.
      Force the wrapper to hug its content (the form). */
   height: auto !important;
   min-height: 0 !important;
   max-height: none !important;
   margin: 0 !important;
   padding: 0 !important;
   background: #fff !important;
   background-color: #fff !important;
   color: inherit !important;
   box-shadow: 0 4px 16px rgba(0,0,0,0.12) !important;
   border-top: 1px solid #e5e7eb;
   border-bottom: 1px solid #e5e7eb;
   z-index: 9998;
   transform: translateY(-12px);
   opacity: 0;
   pointer-events: none;
   transition: transform .22s ease, opacity .22s ease;
}
/* Position the panel just below the header bar (≈126px on desktop). */
body.ladbs-search-open .search-wrapper.is-dropdown,
.search-wrapper.is-dropdown.is-open {
   top: 126px !important;
}
.search-wrapper.is-dropdown.is-open {
   transform: translateY(0);
   opacity: 1;
   pointer-events: auto;
}
.search-wrapper.is-dropdown form.block-form-search {
   max-width: 960px;
   margin: 0 auto !important;
   /* Tight padding so the panel hugs the input. */
   padding: 8px 24px !important;
   background: transparent !important;
   box-shadow: none !important;
   display: block !important;
}
.search-wrapper.is-dropdown .form-group.has-search {
   position: relative;
   margin: 0;
}
.search-wrapper.is-dropdown .search-block-icon {
   position: absolute !important;
   left: 18px !important;
   top: 50% !important;
   transform: translateY(-50%) !important;
   color: #555 !important;
   pointer-events: none;
   z-index: 1;
   width: 18px !important;
   height: 18px !important;
   line-height: 1 !important;
   font-size: 16px;
   display: block !important;
}
.search-wrapper.is-dropdown input.search-block-field {
   width: 100% !important;
   height: 42px !important;
   line-height: 42px !important;
   border-radius: 999px !important;
   border: 2px solid #1A2740 !important;
   padding: 0 20px 0 42px !important;
   font-size: 16px !important;
   background: #fff !important;
   color: #1A2740 !important;
   box-shadow: 0 1px 4px rgba(0,0,0,0.06);
   outline: none;
   position: static !important;
}
.search-wrapper.is-dropdown input.search-block-field:focus {
   border-color: #1A2740 !important;
   box-shadow: 0 2px 8px rgba(26,39,64,0.15);
}
.search-wrapper.is-dropdown input.search-block-field::placeholder {
   color: #6b7280 !important;
}
.search-wrapper.is-dropdown .search-close-wrapper { display: none !important; }

/* The "X" close button injected by JS that visually replaces the
   magnifying-glass while the panel is open. Sized/coloured to match. */
.search-close-trigger {
   background: transparent;
   border: 0;
   padding: 0;
   margin: 0;
   cursor: pointer;
   color: inherit;
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 25px;
   height: 25px;
   vertical-align: middle;
}
.search-close-trigger:hover,
.search-close-trigger:focus { color: #f5a31a; outline: none; }
.search-close-trigger svg { width: 22px; height: 22px; }

/* Mobile: panel still drops down but sits closer to the (shorter) header. */
@media (max-width: 991px) {
   body.ladbs-search-open .search-wrapper.is-dropdown,
   .search-wrapper.is-dropdown.is-open {
      top: 70px !important;
   }
   .search-wrapper.is-dropdown form.block-form-search {
      padding: 12px 14px !important;
   }
   .search-wrapper.is-dropdown input.search-block-field {
      height: 46px !important;
      line-height: 46px !important;
      font-size: 15px !important;
   }
}
