/* Style navigation menu to look like buttons */
.main-navigation .main-nav ul li a {
  background-color: #595DA3 !important;
  color: #ffffff !important;
  padding: 12px 20px !important;
  border-radius: 15px !important;
  text-transform: uppercase !important;
  font-weight: bold !important;
  transition: all 0.3s ease-in-out !important;
  display: inline-block !important;
  text-decoration: none !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15) !important;
}

/* Add hover effect for navigation buttons */
.main-navigation .main-nav ul li a:hover {
  background-color: #1B3183 !important;
  color: #ffffff !important;
  transform: scale(1.05) !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25) !important;
}

/* Adjust spacing between navigation buttons */
.main-navigation .main-nav ul li {
  margin-right: 15px !important;
}

/* Header with fixed gradient + padding */
.site-header {
  background: linear-gradient(to bottom, #595DA3, #FFFFFF);
  padding: 25px 0;
}

@media (max-width: 768px) {
  .mobile-header-navigation {
    background: linear-gradient(to bottom, #595DA3, #FFFFFF) !important;
  }
}

/* Hide admin-only fields from non-admin users */
body:not(.role-administrator) .admin-only {
  display: none !important;
}

/* Center and style page titles */
.page .entry-title {
  color: #1B3183;
  font-weight: bold;
  text-align: center;
  border-bottom: 3px solid #1B3183;
  padding-bottom: 10px;
  margin-bottom: 20px;
  display: inline-block;
  margin-left: auto;
  margin-right: auto;
}

/* Fix container alignment for page titles */
.entry-header,
.page-header {
  text-align: center;
}

/* Footer background and text color */
footer,
.site-footer,
.footer-widgets {
  background-color: #FFFFFF;
  color: #ffffff;
  padding: 40px 0;
}

/* Footer links styled as buttons */
footer a,
.site-footer a,
.footer-widgets a {
  background-color: #595DA3;
  color: #ffffff;
  padding: 10px 18px;
  border-radius: 8px;
  text-transform: uppercase;
  font-weight: bold;
  text-decoration: none;
  display: inline-block;
  margin: 5px 0;
  transition: all 0.3s ease-in-out;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

footer a:hover,
.site-footer a:hover,
.footer-widgets a:hover {
  background-color: #1B3183;
  color: #ffffff;
  transform: scale(1.05);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
}

/* Footer widget titles */
.footer-widgets .widget-title,
footer .widget-title,
.site-footer .widget-title {
  color: #1B3183;
  font-weight: bold;
  margin-bottom: 10px;
  text-align: left;
  padding-left: 0;
}

.footer-widgets {
  text-align: center;
}

.footer-widgets .widget {
  display: inline-block;
  text-align: left;
  margin: 0 20px;
  vertical-align: top;
  padding: 10px 0;
}

/* Sidebar widget titles with purple underline */
.sidebar .widget-title,
.widget-area .widget-title,
#secondary .widget-title {
  color: #595DA3;
  font-weight: bold;
  border-bottom: 2px solid #595DA3;
  padding-bottom: 5px;
  margin-bottom: 15px;
}

/* Ensure bottom footer bar is purple too */
.site-info,
.footer-bar,
.footer-bottom,
.footer-credits,
#colophon {
  background-color: #595DA3 !important;
  color: #ffffff !important;
}

/* Links in footer bar */
.site-info a,
.footer-bar a,
.footer-bottom a,
.footer-credits a,
#colophon a {
  color: #ffffff !important;
  text-decoration: none;
  font-weight: bold;
}

.site-info a:hover,
.footer-bar a:hover,
.footer-bottom a:hover,
.footer-credits a:hover,
#colophon a:hover {
  color: #000000 !important;
  text-decoration: underline;
}

/* 👇 PADDING ADJUSTMENT FOR FOOTER SEARCH WIDGET TITLE */
.footer-widgets .widget_search .widget-title {
  padding-left: 40px;
}

/* WooCommerce product page title styling */
.woocommerce-products-header__title.page-title {
  color: #1B3183;
  font-weight: bold;
  text-align: center;
  border-bottom: 3px solid #1B3183;
  padding-bottom: 10px;
  margin-bottom: 20px;
  display: inline-block;
  margin-left: auto;
  margin-right: auto;
}

/* WooCommerce product search bar styling */
.woocommerce-page .wp-block-search {
  display: flex;
  max-width: 500px;
  margin: 40px auto;
  border: 2px solid #1B3183;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.woocommerce-page .wp-block-search input[type="search"] {
  flex: 1;
  padding: 12px 16px;
  border: none;
  outline: none;
}

.woocommerce-page .wp-block-search button {
  background-color: #1B3183;
  color: white;
  padding: 12px 20px;
  font-weight: bold;
  text-transform: uppercase;
  border: none;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
}

.woocommerce-page .wp-block-search button:hover {
  background-color: #3A2F85;
}

.woocommerce-page .wp-block-search form {
  width: 100%;
}

.woocommerce-page .wp-block-search__inside-wrapper {
  display: flex;
  width: 100%;
  align-items: stretch;
}

/* Kill invisible cart button */
.main-navigation a[href*="/cart/"] {
  display: none !important;
}

/* Mobile menu toggle button */
.mobile-menu-toggle {
  display: none;
  background-color: #1B3183;
  color: white;
  padding: 12px 20px;
  font-size: 16px;
  text-transform: uppercase;
  font-weight: bold;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  margin: 10px auto;
  width: fit-content;
  transition: all 0.3s ease-in-out;
}

.mobile-menu-toggle:hover {
  background-color: #3A2F85;
}

/* Mobile menu styling */
.mobile-nav-menu {
  display: none;
  flex-direction: column;
  background-color: #ffffff;
  border: 2px solid #1B3183;
  border-radius: 8px;
  margin: 0 auto 20px auto;
  padding: 0px;
  max-width: 300px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.mobile-nav-menu li {
  list-style: none;
  text-align: center;
  margin-bottom: 10px;
}

.mobile-nav-menu li a {
  color: #1B3183;
  padding: 12px 16px;
  text-decoration: none;
  font-weight: bold;
  display: block;
  border-bottom: 1px solid #ddd;
}

.mobile-nav-menu li:last-child a {
  border-bottom: none;
}

.mobile-nav-menu li a:hover {
  background-color: #F0F0F0;
  color: #3A2F85;
}

/* Show only on mobile */
@media (max-width: 768px) {
  .mobile-menu-toggle {
    display: block;
  }
  .desktop-navigation {
    display: none !important;
  }
}

/* Show menu when active */
.mobile-nav-menu.active {
  display: flex;
}

@media (max-width: 768px) {
  .site-main {
    display: flex;
    flex-direction: column-reverse;
  }
}

/* Fix padding on WooCommerce checkout page */
.woocommerce-checkout .site-main,
.woocommerce-checkout .entry-content,
.woocommerce-checkout form.checkout {
  padding-left: 20px !important;
  padding-right: 20px !important;
  box-sizing: border-box;
}

/* Optional: constrain width so it's not full screen edge-to-edge */
.woocommerce-checkout .site-main {
  max-width: 1000px;
  margin: 0 auto;
}

/* Force padding on all WooCommerce checkout page elements */
body.woocommerce-checkout,
body.woocommerce-checkout .site,
body.woocommerce-checkout .site-main,
body.woocommerce-checkout .content-area,
body.woocommerce-checkout .entry-content,
body.woocommerce-checkout form.checkout,
body.woocommerce-checkout .woocommerce {
  padding-left: 20px !important;
  padding-right: 20px !important;
  box-sizing: border-box !important;
}

/* Also ensure nothing is overriding margin */
body.woocommerce-checkout .site-main {
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 1200px;
}

/* Make the menu wrap nicely with space between rows and columns */
.main-navigation .main-nav ul {
  display: flex;              /* most themes already do this, but safe to set */
  flex-wrap: wrap;
  gap: 10px 15px;             /* row gap, then column gap */
  align-items: center;
}

/* Let gap control spacing (not per-li margins) */
.main-navigation .main-nav ul li {
  margin: 0 !important;
}

/* Optional: tiny extra bottom spacing if your theme forces block layout */
.main-navigation .main-nav ul li a {
  margin: 0;                  /* make sure no stray margins */
}

/* Prevent hover scaling from causing collisions on smaller screens */
@media (max-width: 992px) {
  .main-navigation .main-nav ul li a:hover {
    transform: none !important; /* keep the shadow change, lose the scale */
  }
}

/* Fallback for very old browsers without gap in flexbox */
@supports not (gap: 10px) {
  .main-navigation .main-nav ul li {
    margin: 0 15px 10px 0 !important; /* right + bottom spacing */
  }
}

/* === Unify Woo product search styling (block + widget + PHP snippet) === */

/* Outer container + max width */
.wc-search-bar,
.woocommerce .wp-block-search,
.woocommerce .wp-block-woocommerce-product-search,
.woocommerce .widget_product_search,
.woocommerce .woocommerce-product-search {
  max-width: 500px;
  margin: 40px auto;
}

/* The form wrapper */
.wc-search-bar form,
.woocommerce .wp-block-search form,
.woocommerce .wp-block-woocommerce-product-search form,
.woocommerce .widget_product_search form,
.woocommerce .woocommerce-product-search {
  display: flex;
  border: 2px solid #1B3183;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* The input */
.wc-search-bar input[type="search"],
.woocommerce .wp-block-search input[type="search"],
.woocommerce .widget_product_search .search-field,
.woocommerce .woocommerce-product-search input[type="search"] {
  flex: 1;
  padding: 12px 16px;
  border: none;
  outline: none;
}

/* The submit button (covers block, widget, and PHP submit types) */
.wc-search-bar button,
.wc-search-bar input[type="submit"],
.woocommerce .wp-block-search button,
.woocommerce .wp-block-search .wp-block-search__button,
.woocommerce .widget_product_search button,
.woocommerce .widget_product_search input[type="submit"],
.woocommerce .woocommerce-product-search button,
.woocommerce .woocommerce-product-search input[type="submit"] {
  background-color: #1B3183;
  color: #fff;
  padding: 12px 20px;
  font-weight: bold;
  text-transform: uppercase;
  border: none;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
}

.wc-search-bar button:hover,
.wc-search-bar input[type="submit"]:hover,
.woocommerce .wp-block-search button:hover,
.woocommerce .wp-block-search .wp-block-search__button:hover,
.woocommerce .widget_product_search button:hover,
.woocommerce .widget_product_search input[type="submit"]:hover,
.woocommerce .woocommerce-product-search button:hover,
.woocommerce .woocommerce-product-search input[type="submit"]:hover {
  background-color: #3A2F85;
}

/* Make sure it shows on results pages too */
.search .wc-search-bar,
.search .wp-block-search,
.search .wp-block-woocommerce-product-search,
.search .widget_product_search,
.search .woocommerce-product-search { display: block; }

/* Make the input stretch nicely in Safari/Firefox too */
.wc-search-bar input[type="search"] { min-width: 0; }

/* Remove the built-in clear "X" button offset on WebKit if it misaligns */
.wc-search-bar input[type="search"]::-webkit-search-decoration,
.wc-search-bar input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }

/* Ensure the product-search form spans the full wrapper width */
.wc-search-bar form,
.woocommerce .woocommerce-product-search {
  width: 100%;
  box-sizing: border-box;
}

/* Make the input truly flexible inside the form */
.wc-search-bar .search-field,
.woocommerce .woocommerce-product-search input[type="search"] {
  flex: 1 1 auto;
  min-width: 0;              /* fixes Safari/Firefox shrinking quirks */
  width: 100%;               /* belt-and-suspenders */
  box-sizing: border-box;
}

/* Keep the button from squishing oddly */
.wc-search-bar button,
.wc-search-bar input[type="submit"],
.woocommerce .woocommerce-product-search button,
.woocommerce .woocommerce-product-search input[type="submit"] {
  white-space: nowrap;
  flex: 0 0 auto;
}

/* Make sure the container can shrink on small screens */
.wc-search-bar,
.woocommerce .woocommerce-product-search {
  width: 100%;
  max-width: 500px;
}

@media (max-width: 600px) {
  .wc-search-bar,
  .woocommerce .woocommerce-product-search {
    max-width: 100%;
  }
}

/* Keep product-search input + button on one line, no wrap */
.wc-search-bar form,
.woocommerce .woocommerce-product-search {
  display: flex;
  flex-wrap: nowrap;          /* prevent wrapping */
  align-items: stretch;
  gap: 0;                     /* kill any theme gap that forces wrapping */
  width: 100%;
  box-sizing: border-box;
}

/* Input should flex, not force overflow */
.wc-search-bar .search-field,
.woocommerce .woocommerce-product-search input[type="search"] {
  flex: 1 1 auto;
  min-width: 0;               /* critical to prevent flex overflow */
  width: 100%;
  box-sizing: border-box;
}

/* Button should NOT be block or 100% width */
.wc-search-bar button,
.wc-search-bar input[type="submit"],
.woocommerce .woocommerce-product-search button,
.woocommerce .woocommerce-product-search input[type="submit"] {
  display: inline-flex;       /* override block buttons */
  width: auto;                /* prevent full-width buttons */
  flex: 0 0 auto;
  margin: 0;                  /* kill stray margins that can push it down */
  line-height: 1;             /* keep height tidy */
  white-space: nowrap;        /* keep label on one line */
}

/* If a visible label is sneaking in, keep it screen-reader-only */
.wc-search-bar label,
.woocommerce .woocommerce-product-search label {
  position: absolute !important;
  width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}