/*
 Theme Name:   Superio Child
 Theme URI:    https://themeforest.net/item/superio-job-board-wordpress-theme/32180231
 Description:  Superio Child Theme
 Author:       ApusTheme
 Author URI:   http://apusthemes.com
 Template:     superio
 Version:      1.0.0
 Text Domain:  superio-child
*/

/* ================================================================
   LOGIN / REGISTER POPUP — REPLACE SUPERIO TITLE WITH ATOZ LOGO
================================================================ */

/* 1 · Hide the default text title */
.apus_login_register_form .title-wrapper .title {
  display: none !important;
}

/* 2 · Add your logo as a background image */
.apus_login_register_form .title-wrapper {
  background-image: url('https://atozjobs.net/wp-content/uploads/2026/10/Primary-Logo-1.svg') !important;
  background-repeat: no-repeat !important;
  background-position: left center !important;
  background-size: contain !important;
  min-height: 60px !important;
  padding-left: 200px !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  display: flex !important;
  align-items: center !important;
  position: relative !important;
}

/* 3 · Keep the close (✕) button aligned right */
.apus_login_register_form .title-wrapper .close-magnific-popup {
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 2 !important;
}

/* ================================================================
   CONTACT FORM 7 — VISIBLE SUBMIT BUTTON (ATOZJOBS BRANDING)
================================================================ */

.wpcf7-form input.wpcf7-submit,
.wpcf7-form .wpcf7-submit,
input.wpcf7-submit[type="submit"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  width: 100% !important;
  padding: 18px 32px !important;
  background: #F97316 !important;
  background-color: #F97316 !important;
  color: #FFFFFF !important;
  font-weight: 800 !important;
  font-size: 1.1rem !important;
  font-family: 'Inter', sans-serif !important;
  border: none !important;
  border-radius: 44px !important;
  cursor: pointer !important;
  transition: all .15s ease !important;
  box-shadow: 0 8px 18px -8px rgba(249,115,22,.5) !important;
  margin-top: 8px !important;
  text-transform: none !important;
  line-height: 1.4 !important;
  min-height: 56px !important;
  opacity: 1 !important;
  visibility: visible !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

.wpcf7-form input.wpcf7-submit:hover,
.wpcf7-form .wpcf7-submit:hover {
  background: #EA580C !important;
  background-color: #EA580C !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 26px -10px rgba(249,115,22,.6) !important;
}

.wpcf7-form .wpcf7-submit.has-spinner::after,
.wpcf7-form .wpcf7-submit .wpcf7-spinner {
  display: none !important;
}

/* ================================================================
   ATOZJOBS LOGO — AZ BRIEFCASE (HEADER + FOOTER SIZING)
================================================================ */

/* HEADER — compact, vertically centered */
.apus-header .logo img,
.site-header .logo img,
header .logo img,
#apus-header .logo img,
.header-20-7857 .logo img {
  max-height: 38px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
}

.apus-header .logo,
.site-header .logo,
header .logo,
#apus-header .logo {
  display: inline-flex !important;
  align-items: center !important;
  line-height: 1 !important;
}

/* FOOTER — smaller for balance */
.site-footer .logo img,
footer .logo img,
.apus-footer .logo img,
#apus-footer .logo img {
  max-height: 34px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
}

.site-footer .logo,
footer .logo,
.apus-footer .logo,
#apus-footer .logo {
  display: inline-flex !important;
  align-items: center !important;
  line-height: 1 !important;
}

/* MOBILE — even more compact */
@media (max-width: 720px) {
  .apus-header .logo img,
  .site-header .logo img,
  header .logo img,
  #apus-header .logo img {
    max-height: 32px !important;
  }

  .site-footer .logo img,
  footer .logo img,
  .apus-footer .logo img,
  #apus-footer .logo img {
    max-height: 30px !important;
  }
}

/* ================================================================
   MOBILE MENU — WHITE BACKGROUND (ATOZJOBS)
   Overrides Superio's default black mobile menu
================================================================ */

@media (max-width: 900px) {

  .apus-offcanvas,
  .apus-mobile-menu,
  .mobile-menu,
  .mobile-nav,
  .nav-menu,
  .main-menu-wrapper,
  .mobile-drawer,
  #apus-mobile-menu {
    background: #FFFFFF !important;
    color: #000000 !important;
    box-shadow: 0 20px 40px -12px rgba(0,0,0,.10) !important;
  }

  .apus-offcanvas-body {
    background: #FFFFFF !important;
  }

  .apus-offcanvas .header-offcanvas,
  .apus-mobile-menu .header-offcanvas,
  #apus-mobile-menu .header-offcanvas {
    background: #FFFFFF !important;
    border-bottom: 1px solid #E2E8F0 !important;
  }

  .apus-offcanvas .navbar-offcanvas a,
  .apus-mobile-menu a,
  .mobile-menu a,
  .mobile-nav a,
  .nav-menu a,
  .main-menu-wrapper a,
  .mobile-drawer a,
  #apus-mobile-menu a {
    display: block !important;
    color: #000000 !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 1.05rem !important;
    font-weight: 600 !important;
    padding: 16px 24px !important;
    border-bottom: 1px solid #E2E8F0 !important;
    background: #FFFFFF !important;
    text-decoration: none !important;
    transition: all .15s ease !important;
    border-radius: 0 !important;
  }

  .apus-offcanvas .navbar-offcanvas a:hover,
  .apus-mobile-menu a:hover,
  .mobile-menu a:hover,
  .mobile-nav a:hover,
  .nav-menu a:hover,
  .main-menu-wrapper a:hover,
  .mobile-drawer a:hover,
  #apus-mobile-menu a:hover {
    background: #FFF7ED !important;
    color: #F97316 !important;
    padding-left: 28px !important;
  }

  .apus-mobile-menu a.active,
  .mobile-menu a.active,
  .mobile-nav a.active,
  #apus-mobile-menu a.active {
    background: #FFF7ED !important;
    color: #F97316 !important;
    font-weight: 800 !important;
  }

  .apus-mobile-menu a:last-child,
  .mobile-menu a:last-child,
  #apus-mobile-menu a:last-child {
    border-bottom: none !important;
  }

  .apus-mobile-menu .sub-menu,
  .apus-offcanvas .sub-menu,
  .mobile-menu .sub-menu,
  .mobile-menu ul ul,
  #apus-mobile-menu .sub-menu {
    background: #F8FAFC !important;
    border-radius: 0 !important;
    padding: 8px 0 !important;
    border-top: 1px solid #E2E8F0 !important;
    border-bottom: 1px solid #E2E8F0 !important;
  }

  .apus-mobile-menu .sub-menu a,
  .apus-offcanvas .sub-menu a,
  .mobile-menu .sub-menu a,
  .mobile-menu ul ul a,
  #apus-mobile-menu .sub-menu a {
    padding-left: 40px !important;
    font-size: .98rem !important;
    font-weight: 500 !important;
    border-bottom: none !important;
    color: #334155 !important;
    background: #F8FAFC !important;
  }

  .apus-mobile-menu .sub-menu a:hover,
  .apus-offcanvas .sub-menu a:hover,
  .mobile-menu .sub-menu a:hover,
  #apus-mobile-menu .sub-menu a:hover {
    background: #FFF7ED !important;
    color: #F97316 !important;
    padding-left: 44px !important;
  }

  .apus-offcanvas .btn-toggle-canvas,
  .apus-mobile-menu .close,
  .apus-mobile-menu .close-btn,
  .mobile-menu .close,
  .mobile-drawer .close,
  .mobile-toggle-close,
  #apus-mobile-menu .btn-toggle-canvas,
  #apus-mobile-menu .btn-menu-account {
    color: #000000 !important;
    background: transparent !important;
    transition: color .15s ease !important;
  }

  .apus-offcanvas .btn-toggle-canvas:hover,
  .apus-mobile-menu .close:hover,
  #apus-mobile-menu .btn-toggle-canvas:hover {
    color: #F97316 !important;
  }

  #apus-mobile-menu .btn-menu-account,
  .apus-offcanvas .btn-menu-account {
    color: #000000 !important;
  }

  #apus-mobile-menu .btn-menu-account:hover,
  .apus-offcanvas .btn-menu-account:hover {
    color: #F97316 !important;
  }

  .apus-offcanvas .header-mobile-bottom,
  #apus-mobile-menu .header-mobile-bottom {
    background: #FFFFFF !important;
    color: #000000 !important;
    border-top: 1px solid #E2E8F0 !important;
    padding: 20px 24px !important;
  }

  .apus-offcanvas .header-mobile-bottom h4,
  .apus-offcanvas .header-mobile-bottom .title,
  #apus-mobile-menu .header-mobile-bottom h4,
  #apus-mobile-menu .header-mobile-bottom .title {
    color: #000000 !important;
    font-weight: 800 !important;
    font-size: 1rem !important;
    margin-bottom: 8px !important;
  }

  .apus-offcanvas .header-mobile-bottom .textwidget,
  .apus-offcanvas .header-mobile-bottom .elementor-text-editor,
  #apus-mobile-menu .header-mobile-bottom .textwidget,
  #apus-mobile-menu .header-mobile-bottom .elementor-text-editor {
    color: #64748B !important;
    font-size: .9rem !important;
    line-height: 1.65 !important;
  }

  .apus-offcanvas .header-mobile-bottom .btn,
  .apus-offcanvas .header-mobile-bottom .btn-theme,
  #apus-mobile-menu .header-mobile-bottom .btn,
  #apus-mobile-menu .header-mobile-bottom .btn-theme {
    display: block !important;
    width: 100% !important;
    background: #F97316 !important;
    color: #FFFFFF !important;
    font-weight: 800 !important;
    border-radius: 40px !important;
    padding: 14px 24px !important;
    text-align: center !important;
    border: none !important;
    margin-bottom: 16px !important;
    box-shadow: 0 8px 18px -8px rgba(249,115,22,.5) !important;
    transition: all .15s ease !important;
  }

  .apus-offcanvas .header-mobile-bottom .btn:hover,
  #apus-mobile-menu .header-mobile-bottom .btn:hover {
    background: #EA580C !important;
    transform: translateY(-1px) !important;
  }

  .apus-offcanvas .apus_socials a,
  #apus-mobile-menu .apus_socials a {
    color: #000000 !important;
    transition: color .15s ease !important;
  }

  .apus-offcanvas .apus_socials a:hover,
  #apus-mobile-menu .apus_socials a:hover {
    color: #F97316 !important;
  }

  .over-dark {
    background: rgba(0, 0, 0, .5) !important;
  }
}

/* ================================================================
   GOVERNMENT JOB BOARDS SECTION — FULL WIDTH (EDGE-TO-EDGE)
================================================================ */

.gov-section {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  position: relative;
  left: 0;
  right: 0;
}

.gov-section .container,
.gov-section .elementor-container {
  max-width: 1360px !important;
  margin: 0 auto !important;
  padding: 0 28px !important;
}

.gov-grid,
.gov-grid .board-grid {
  width: 100% !important;
}

.elementor-section[data-settings*="background_background"],
.elementor-section.dark-section,
.section-dark,
section[style*="background:#0B1220"],
section[style*="background: #0B1220"],
section[style*="background-color: #0B1220"] {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

body .elementor-section.elementor-section-boxed.dark-bg,
body .elementor-section.elementor-section-boxed[data-id*="government"],
body .elementor-section.elementor-section-boxed[data-id*="gov"] {
  max-width: 100% !important;
  width: 100% !important;
}

.e-con.gov-section,
.e-con.dark-section,
.e-con-full.gov-section {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

/* ================================================================
   FOOTER — FORCE FULL-WIDTH EDGE-TO-EDGE (ATOZJOBS)
================================================================ */

#apus-footer,
.apus-footer,
.site-footer,
footer.elementor-section {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#apus-footer .elementor-container,
.apus-footer .elementor-container,
.site-footer .elementor-container,
footer .elementor-container {
  max-width: 1360px !important;
  margin: 0 auto !important;
  padding: 0 28px !important;
}

#apus-footer > .e-con,
.apus-footer > .e-con,
.site-footer > .e-con,
footer > .e-con {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#apus-footer *,
.apus-footer *,
.site-footer *,
footer * {
  --footer-overflow-x: hidden;
}

body {
  overflow-x: hidden !important;
}

@media (max-width: 900px) {
  #apus-footer .elementor-container,
  .apus-footer .elementor-container,
  .site-footer .elementor-container,
  footer .elementor-container {
    padding: 0 20px !important;
  }
}/* ================================================================
   PRICING PAGE / WOOCOMMERCE — FIX SMALL NAV AND FOOTER TEXT
================================================================ */

/* 1. Force the WooCommerce pricing page to use a readable base size */
body.woocommerce-page,
.woocommerce-page {
  font-size: 1.05rem !important;
}

/* 2. Fix the header navigation links */
.woocommerce-page .apus-header .navbar-nav > li > a,
.woocommerce-page .apus-header .main-menu a,
.woocommerce-page .site-header .navbar-nav > li > a,
.woocommerce-page .site-header .main-menu a {
  font-size: 1.05rem !important;
  font-weight: 600 !important;
}

/* 3. Fix the footer links and text */
.woocommerce-page footer,
.woocommerce-page .site-footer,
.woocommerce-page #apus-footer {
  font-size: 1rem !important;
}

.woocommerce-page footer a,
.woocommerce-page .site-footer a,
.woocommerce-page #apus-footer a,
.woocommerce-page footer p,
.woocommerce-page footer li,
.woocommerce-page footer .menu li a {
  font-size: 1rem !important;
  line-height: 1.7 !important;
}

/* 4. Fix the pricing table text itself (just in case it looks too small) */
.woocommerce-page .pricing-table .price,
.woocommerce-page .pricing-table h3,
.woocommerce-page .pricing-table li {
  font-size: 1.05rem !important;
}
/* ================================================================
   FIX PRICING PAGE TEXT SIZE (WOOCOMMERCE PACKAGES)
================================================================ */

/* 1. Target the pricing page body and its widgets */
.page-id-23109 .widget-packages,
.page-template-page-pricing .widget-packages,
.woocommerce-page .widget-packages {
  font-size: 1.05rem !important;
}

/* 2. Increase the size of the package titles and prices */
.widget-packages .subwoo-inner .title {
  font-size: 1.3rem !important;
  font-weight: 700 !important;
}

.widget-packages .subwoo-inner .price {
  font-size: 2rem !important;
  font-weight: 800 !important;
}

/* 3. Increase the size of the package features (the list) */
.widget-packages .subwoo-inner .content,
.widget-packages .subwoo-inner .content p,
.widget-packages .subwoo-inner .content li {
  font-size: 1.05rem !important;
  line-height: 1.7 !important;
}

/* 4. Increase the size of the "Get Started" button */
.widget-packages .subwoo-inner .button-action .btn {
  font-size: 1.05rem !important;
  padding: 12px 24px !important;
}

/* 5. Fix the Header and Footer specifically for the pricing page */
.woocommerce-page .apus-header .navbar-nav > li > a,
.woocommerce-page .apus-header .main-menu a {
  font-size: 1.05rem !important;
}

.woocommerce-page .apus-footer,
.woocommerce-page .apus-footer p,
.woocommerce-page .apus-footer li,
.woocommerce-page .apus-footer a {
  font-size: 1rem !important;
  line-height: 1.7 !important;
}
/* ============================================================
   AtoZJobs — Bigger, more readable mobile menu
   Targets Superio / Elementor mobile menu popups
   ============================================================ */

@media (max-width: 1024px) {

  /* --- 1. Menu link size & spacing --- */
  .elementor-nav-menu--dropdown a,
  .elementor-nav-menu--dropdown .elementor-item,
  .superio-mobile-menu a,
  .superio-mobile-menu .menu-item > a,
  .mobile-menu-wrap a,
  .mobile-nav a {
    font-size: 18px !important;       /* base size — raise to 20px if still small */
    font-weight: 600 !important;
    line-height: 1.5 !important;
    padding: 16px 24px !important;    /* taller tap targets */
    letter-spacing: 0.01em;
  }

  /* --- 2. Sub-menu (dropdown) links slightly smaller --- */
  .elementor-nav-menu--dropdown .sub-menu a,
  .elementor-nav-menu--dropdown .menu-item .sub-menu a,
  .superio-mobile-menu .sub-menu a,
  .mobile-menu-wrap .sub-menu a {
    font-size: 16px !important;
    font-weight: 500 !important;
    padding: 12px 24px 12px 40px !important;  /* indent sub-items */
  }

  /* --- 3. Row dividers for readability --- */
  .elementor-nav-menu--dropdown li,
  .superio-mobile-menu li,
  .mobile-menu-wrap li {
    border-bottom: 1px solid #E5E7EB;
  }
  .elementor-nav-menu--dropdown li:last-child,
  .superio-mobile-menu li:last-child,
  .mobile-menu-wrap li:last-child {
    border-bottom: none;
  }

  /* --- 4. Popup container padding & background --- */
  .elementor-nav-menu--dropdown,
  .elementor-nav-menu__container,
  .superio-mobile-menu,
  .mobile-menu-wrap {
    background: #FFFFFF !important;
    padding: 8px 0 !important;
  }

  /* --- 5. Close (X) button bigger --- */
  .elementor-menu-toggle,
  .superio-mobile-menu .close-menu,
  .mobile-menu-wrap .close-menu {
    font-size: 28px !important;
    width: 48px !important;
    height: 48px !important;
    line-height: 48px !important;
  }

  /* --- 6. Hamburger button bigger --- */
  .elementor-menu-toggle,
  .superio-menu-toggle,
  .mobile-toggle {
    font-size: 26px !important;
    padding: 12px !important;
  }

  /* --- 7. CTA button inside mobile menu (e.g. "Post a Job") --- */
  .elementor-nav-menu--dropdown a.elementor-item.elementor-item-button,
  .superio-mobile-menu .btn,
  .mobile-menu-wrap .btn {
    font-size: 17px !important;
    font-weight: 700 !important;
    padding: 16px 24px !important;
    text-align: center;
    margin: 12px 24px !important;
    border-radius: 999px;
    display: block;
  }
}