/*
Theme Name: Aquamio
Theme URI: https://aquamio.co/
Template: water-filter-pro
Author: Aquamio
Description: Child theme of Water Filter Pro, adapted for Aquamio. Fixes template bugs, adds a sticky white header, simplifies the contact and FAQ sections, and adds Cyrillic font support.
Version: 1.2.0
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: aquamio-child
*/

/* ============================================================
   AQUAMIO BRAND TOKENS
   ============================================================ */
:root {
  --aq-blue: #3698C7;
  --aq-blue-dark: #2b7ba3;
  --aq-ink: #111418;
  --aq-muted: #5b6770;
  --aq-header-h: 84px;
}

/* ============================================================
   1. CYRILLIC FONT SUPPORT
   The parent theme loads Poppins / Jura / Signika, none of which
   contain Cyrillic glyphs, so Macedonian text falls back to a
   serif. This forces a Cyrillic-capable stack site-wide.
   ============================================================ */
html body,
body p,
body h1, body h2, body h3, body h4, body h5, body h6,
body a, body span, body li, body div,
body input, body textarea, body select, body button,
#slider p, #slider .banner-main-text,
.section-head h3, .section-head h4 {
  font-family: 'Noto Sans', 'Open Sans', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif !important;
}

/* ============================================================
   2. STICKY WHITE HEADER WITH LOGO
   ============================================================ */
#header {
  background: #ffffff !important;
  position: sticky;
  top: 0;
  z-index: 9999;
  box-shadow: 0 2px 14px rgba(17, 20, 24, 0.07);
}

#header .main-header-start {
  min-height: var(--aq-header-h);
  display: flex;
  align-items: center;
}

#header .search-space {
  width: 100%;
  align-items: center;
}

/* logo sits inside the white bar */
#header .head-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-block: 10px;
}

#header .head-logo img,
#header .head-logo .custom-logo {
  max-height: 52px;
  width: auto;
  height: auto;
}

#header .logo-text h2 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
}

#header .logo-text h2 a { color: var(--aq-ink); text-decoration: none; }
#header .logo-text p { margin: 0; font-size: 13px; color: var(--aq-muted); }

/* nav links: black, blue on hover */
#header .primary-menu > li > a,
#header .primary-menu li a {
  color: var(--aq-ink) !important;
  font-weight: 500;
  transition: color .25s ease;
}

#header .primary-menu > li > a:hover,
#header .primary-menu > li > a:focus,
#header .primary-menu > li.current-menu-item > a,
#header .primary-menu > li.current_page_item > a,
#header .primary-menu li a:hover {
  color: var(--aq-blue) !important;
}

/* dropdowns */
#header .primary-menu ul.sub-menu {
  background: #ffffff;
  border: 1px solid #eef1f3;
  box-shadow: 0 8px 24px rgba(17, 20, 24, .08);
}
#header .primary-menu ul.sub-menu li a { color: var(--aq-ink) !important; }
#header .primary-menu ul.sub-menu li a:hover { color: var(--aq-blue) !important; }

/* the parent theme's own sticky bar duplicates the logo — hide it */
#header .innermenubox.sticky-header {
  background: transparent !important;
  box-shadow: none !important;
  position: static !important;
}

/* hamburger + close icons on white */
#header .hamburger i,
#header .close-sidebar i { color: var(--aq-ink); }
#header .hamburger i:hover { color: var(--aq-blue); }

/* keep anchor links clear of the sticky bar */
html { scroll-padding-top: calc(var(--aq-header-h) + 12px); }

/* ============================================================
   3. SLIDER — readable on a white background
   Parent theme hardcodes white text in home.css.
   ============================================================ */
#slider .banner-main-text { color: var(--aq-ink) !important; }
#slider p { color: var(--aq-muted) !important; }

#slider .banner-main-button {
  color: #ffffff !important;
  background-color: var(--aq-blue) !important;
  border-color: var(--aq-blue) !important;
}
#slider .banner-main-button:hover {
  background-color: var(--aq-blue-dark) !important;
  border-color: var(--aq-blue-dark) !important;
}

/* ============================================================
   4. CONTACT SECTION — form only, centred
   ============================================================ */
#contact .contact_location_details,
#contact .contactpage_map,
#contact .google-map,
#contact .social-icons,
#contact .contact-address-content,
#contact .contact-number-content {
  display: none !important;
}

#contact .container > .row {
  justify-content: center;
}

#contact .container > .row > .col-lg-6:first-child,
#contact .aq-contact-form-col {
  flex: 0 0 100%;
  max-width: 720px;
  margin-inline: auto;
}

#contact .contact-heading { color: var(--aq-blue); }

#contact input[type="text"],
#contact input[type="email"],
#contact input[type="tel"],
#contact select,
#contact textarea {
  width: 100%;
  border: 1px solid #e3e8ec;
  border-radius: 10px;
  padding: 14px 16px;
  margin-bottom: 16px;
  font-size: 15px;
}

#contact input:focus,
#contact select:focus,
#contact textarea:focus {
  outline: none;
  border-color: var(--aq-blue);
  box-shadow: 0 0 0 3px rgba(54, 152, 199, .12);
}

#contact .wpcf7-submit,
#contact .send-msg-btn input[type="submit"] {
  background: var(--aq-blue);
  color: #fff;
  border: none;
  border-radius: 10px;
  padding: 14px 34px;
  font-weight: 600;
  cursor: pointer;
  transition: background .25s ease;
}
#contact .wpcf7-submit:hover { background: var(--aq-blue-dark); }

/* ============================================================
   5. FAQ — accordion only
   ============================================================ */
#home-delivery .faq-left-image,
#home-delivery .faq-contact-box,
#home-delivery .faq-telephone-image,
#home-delivery .faq-watersplash-1,
#home-delivery .faq-watersplash-2,
.faq-contact-heading,
.faq-contact-desc,
.faq-contact-btn {
  display: none !important;
}

#home-delivery .faq-accordion-container {
  flex: 0 0 100%;
  max-width: 900px;
  margin-inline: auto;
}

/* ============================================================
   6. MINIMALIST FOOTER
   The markup is replaced by the child theme's own templates, so
   these rules style a simple grid rather than fighting the demo.
   ============================================================ */
.aq-footer {
  background: #ffffff !important;
  border-top: 1px solid #eef1f3;
  padding-top: 52px;
}
.aq-footer * { background: none !important; }

.aq-footer__grid {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) 2fr;
  gap: 48px;
  padding-bottom: 40px;
}

.aq-footer__logo img { max-height: 46px; width: auto; }

.aq-footer__text {
  margin: 18px 0 16px;
  font-size: 14px;
  line-height: 1.7;
  color: var(--aq-muted) !important;
  max-width: 340px;
}

.aq-footer__contact {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 14px;
  line-height: 1.9;
}
.aq-footer__contact a,
.aq-footer__contact li { color: var(--aq-muted) !important; text-decoration: none; }
.aq-footer__contact a:hover { color: var(--aq-blue) !important; }

.aq-footer__widgets {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 32px;
}

.aq-footer__col .widget-title,
.aq-footer__col h2,
.aq-footer__col h3,
.aq-footer__col h4 {
  font-size: 15px;
  font-weight: 600;
  color: var(--aq-ink) !important;
  margin: 0 0 14px;
}

.aq-footer__col ul {
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: left;
}
.aq-footer__col li { margin-bottom: 9px; }
.aq-footer__col a {
  color: var(--aq-muted) !important;
  font-size: 14px;
  text-decoration: none;
  transition: color .25s ease;
}
.aq-footer__col a:hover { color: var(--aq-blue) !important; }

/* social icons: hide any that have no image behind them */
.aq-footer__col img[src=""],
.aq-footer__col a:empty { display: none !important; }

.aq-copyright {
  background: #ffffff !important;
  border-top: 1px solid #eef1f3;
  padding-block: 18px;
}
.aq-copyright__text {
  margin: 0;
  text-align: center;
  font-size: 13px;
  color: var(--aq-muted) !important;
}

@media (max-width: 900px) {
  .aq-footer__grid { grid-template-columns: 1fr; gap: 34px; }
  .aq-footer__text { max-width: none; }
}

/* ============================================================
   7. SHARED ACCENTS
   ============================================================ */
#home-delivery .process-heading,
.section-head h4,
#our-products h2,
#browse-categories h2 {
  color: var(--aq-ink);
}

#home-delivery .process-icon { border-color: var(--aq-blue) !important; }
#home-delivery .number-badge { background-color: var(--aq-blue) !important; }
#home-delivery .process-box:hover::before { background-color: var(--aq-blue) !important; }

/* step numbering stays 1..n even when a slot is skipped */
#home-delivery .process-row { counter-reset: aqstep; }
#home-delivery .process-box { counter-increment: aqstep; }

/* ============================================================
   8. RESPONSIVE
   ============================================================ */
@media (max-width: 991px) {
  :root { --aq-header-h: 68px; }
  #header .head-logo img,
  #header .head-logo .custom-logo { max-height: 42px; }
  #header .primary-menu li a { color: var(--aq-ink) !important; }
}

@media (max-width: 575px) {
  #header .logo-text h2 { font-size: 18px; }
  #contact .container > .row > .col-lg-6:first-child { max-width: 100%; }
}