/* =============================================================================
   Al Mansoor — header & footer treatment
   -----------------------------------------------------------------------------
   Site-wide chrome, brought closer to the approved preview. No markup changes:
   the header is rearranged with flex ordering, the footer is released to full
   width. The preloader is untouched.
   ============================================================================= */

/* -----------------------------------------------------------------------------
   FOOTER — full screen width
   .am-container caps the footer to the site content width. Released here, with
   a fluid gutter so content never touches the screen edge on any viewport.
   -------------------------------------------------------------------------- */
.am-footer .am-container,
.am-footer .am-footer-grid,
.am-footer .am-footer-bottom > .am-container{
  max-width:none !important;
  width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
  padding-left:clamp(20px, 4vw, 72px) !important;
  padding-right:clamp(20px, 4vw, 72px) !important;
  box-sizing:border-box;
}

/* More columns read better once the row is full width. */
@media (min-width:1400px){
  .am-footer .am-footer-grid{
    grid-template-columns:1.6fr 1fr 1fr 1fr 1.2fr;
    gap:48px;
  }
}

/* -----------------------------------------------------------------------------
   HEADER — the preview arrangement: logo left, search centre, actions right
   The theme renders search left, logo centre, actions right. Flex ordering
   rearranges them visually without touching a single line of markup, so the
   mega menu, cart and account behaviour are unaffected.
   -------------------------------------------------------------------------- */
.site-header-main-section-left,
.site-header-main-section-center,
.site-header-main-section-right{ display:flex;align-items:center; }

.site-header-main-section-center{ order:1; flex:0 0 auto; justify-content:flex-start; }
.site-header-main-section-left  { order:2; flex:1 1 auto; justify-content:center;
                                  padding-left:clamp(16px,3vw,48px);
                                  padding-right:clamp(16px,3vw,48px); }
.site-header-main-section-right { order:3; flex:0 0 auto; justify-content:flex-end; }

/* Let the search actually use the space it has been given. */
.site-header-main-section-left .header-search-advanced,
.site-header-main-section-left .header-item-search-advanced{ width:100%;max-width:660px; }
.site-header-main-section-left form{ width:100%; }
.site-header-main-section-left input[type="search"],
.site-header-main-section-left input[type="text"]{
  width:100%;border-radius:10px 0 0 10px;border:1.5px solid #E2E8F0;border-right:0;
  padding:12px 16px;font-size:15px;transition:border-color .2s,box-shadow .2s;
}
.site-header-main-section-left input[type="search"]:focus,
.site-header-main-section-left input[type="text"]:focus{
  outline:0;border-color:#2563EB;box-shadow:0 0 0 4px rgba(37,99,235,.12);
}
.site-header-main-section-left button[type="submit"]{
  border-radius:0 10px 10px 0;background:#2563EB;color:#fff;border:0;
  padding:0 22px;font-family:Rubik,sans-serif;font-weight:600;
}
.site-header-main-section-left button[type="submit"]:hover{ background:#1D4ED8; }

/* Sticky header gains a shadow once the page scrolls. */
.site-header{ transition:box-shadow .3s; }
.site-header.am-stuck{ box-shadow:0 8px 24px -14px rgba(15,23,42,.45); }

/* Top utility bar: make the paybill read as a real element, not a footnote. */
.header-contact-wrap .header-contact-item{ font-size:13.5px; }

/* On narrow screens the theme's own stacked layout is better — stand down. */
@media (max-width:1024px){
  .site-header-main-section-left,
  .site-header-main-section-center,
  .site-header-main-section-right{ order:0;flex:initial;justify-content:initial;padding:0; }
}

@media (prefers-reduced-motion:reduce){
  .site-header{ transition:none; }
}