/* ==========================================================================
   Navegação Araújo & Santana - Desktop e Mobile
   ========================================================================== */

/* Top header call to action */
.header-one .top-header .address-wrapper .quotes .call-action-pergunte { min-width: 255px; padding: 8px 20px !important; }
.header-one .top-header .address-wrapper .quotes .call-action-pergunte span { font-size: 100%; }

/* ==========================================================================
   DESKTOP (>= 992px)
   ========================================================================== */
@media (min-width: 992px) {
  .header-one .theme-menu-wrapper { margin-bottom: -42px; }
  #mega-menu-holder > ul.menu { display: flex; align-items: stretch; justify-content: center; flex-wrap: nowrap; }
  #mega-menu-holder > ul > li > a { min-height: 60px; display: flex; align-items: center; padding: 0 18px 0 13px; font-size: 14px; letter-spacing: 0; text-transform: none; }
  #mega-menu-holder > ul > li > a:before { line-height: 60px; }
  #mega-menu-holder .menu-group { position: relative; }
  #mega-menu-holder .sub-toggle { display: none !important; }
  #mega-menu-holder .sub-collapser { display: none !important; }
  #mega-menu-holder .nav-toggle { position: absolute; z-index: 10; top: 0; bottom: 0; right: 18px; display: flex; width: 22px; height: auto; align-items: center; justify-content: center; padding: 0; color: #aeb9cf; border: 0; background: transparent; font-size: 16px; font-weight: 400; line-height: 1; }
  #mega-menu-holder .menu-group > a { padding-right: 43px; }
  #mega-menu-holder .menu-group > a:before { display: none; }
  #mega-menu-holder .menu-group:after { position: absolute; top: 0; bottom: 0; right: 0; display: flex; align-items: center; color: #8f97ab; content: "/"; font-size: 14px; line-height: 1; }
  #mega-menu-holder .menu-group:hover > .nav-toggle, #mega-menu-holder .menu-group:focus-within > .nav-toggle, #mega-menu-holder .menu-group.is-open > .nav-toggle { color: #fff; }
  #mega-menu-holder .menu-group.is-open > .nav-toggle { transform: rotate(180deg); }
  #mega-menu-holder li > ul.dropdown { display: none; width: 360px !important; min-width: 360px !important; padding: 8px 0; border-top: 3px solid #c9a76b; }
  #mega-menu-holder .menu-group:hover > ul.dropdown, #mega-menu-holder .menu-group:focus-within > ul.dropdown, #mega-menu-holder .menu-group.is-open > ul.dropdown { display: block; }
  #mega-menu-holder ul.dropdown li a { padding: 16px 22px; line-height: 1.3; font-family: "Source Sans Pro", sans-serif; font-size: 18px !important; font-weight: 600; text-transform: none !important; white-space: normal; }
}

@media (min-width: 992px) and (max-width: 1199px) {
  #mega-menu-holder > ul > li > a { padding-left: 9px; padding-right: 28px; font-size: 12px; }
}

/* ==========================================================================
   MOBILE (<= 991px) - OVERLAY DO FINAL DA FAIXA AZUL ATÉ A BASE INFERIOR
   ========================================================================== */
@media (max-width: 991px) {
  .header-one .theme-menu-wrapper {
    margin-bottom: 0 !important;
    position: relative !important;
  }
  .header-one .theme-menu-wrapper .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .header-one .theme-menu-wrapper .bg-wrapper {
    position: relative !important;
    margin: 0 !important;
    width: 100% !important;
    height: 60px !important;
    min-height: 60px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }
  .header-one .menu-wrapper {
    position: static !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
  }
  .header-one .menu-collapser {
    margin: 0 0 0 15px !important;
    padding: 0 !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    cursor: pointer !important;
    clear: none !important;
    float: none !important;
  }
  .header-one .collapse-button {
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    cursor: pointer !important;
  }
  .header-one .collapse-button .icon-bar {
    display: block !important;
    width: 26px !important;
    height: 3px !important;
    margin: 0 !important;
    background: #fff !important;
    border-radius: 2px !important;
  }
  .header-one .collapse-button .icon-bar + .icon-bar {
    margin-top: 5px !important;
  }
  .header-one .right-widget.linktel {
    float: none !important;
    margin: 0 !important;
    padding-right: 15px !important;
    line-height: 60px !important;
    white-space: nowrap !important;
    display: flex !important;
    align-items: center !important;
    height: 100% !important;
    flex-shrink: 0 !important;
  }
  .header-one .right-widget.linktel a {
    white-space: nowrap !important;
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 15px !important;
    line-height: 1 !important;
  }

  /* O MENU MOBILE QUANDO FECHADO */
  body #mega-menu-holder:not(.menu-aberto) {
    display: none !important;
  }

  /* O MENU MOBILE QUANDO ABERTO: OVERLAY DA FAIXA AZUL ATÉ A BASE INFERIOR */
  body #mega-menu-holder.menu-aberto {
    display: block !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: calc(100vh - 60px) !important;
    min-height: calc(100vh - 60px) !important;
    max-height: calc(100vh - 60px) !important;
    background: #ffffff !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
    border: none !important;
    border-top: 1px solid #dce2ec !important;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.4) !important;
    z-index: 999999 !important;
    padding: 2px 0 25px 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  /* Ocultar triângulos do slimmenu e botões desktop */
  body #mega-menu-holder .sub-collapser,
  body #mega-menu-holder .sub-toggle,
  body #mega-menu-holder .nav-toggle,
  body #mega-menu-holder .menu-group:after {
    display: none !important;
  }

  /* Lista vertical em 100% da largura */
  body #mega-menu-holder > ul.menu {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    box-sizing: border-box !important;
    float: none !important;
  }

  body #mega-menu-holder > ul.menu > li,
  body #mega-menu-holder.collapsed li {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    border-bottom: 1px solid #eef2f7 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  body #mega-menu-holder > ul.menu > li > a,
  body #mega-menu-holder.collapsed li > a {
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 8px 16px !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    color: #001a57 !important;
    text-transform: uppercase !important;
    line-height: 1.3 !important;
    box-sizing: border-box !important;
    letter-spacing: 0.2px !important;
  }

  body #mega-menu-holder > ul.menu > li > a:before {
    display: none !important;
  }

  /* Submenus sempre abertos e recuados */
  body #mega-menu-holder.collapsed li > ul,
  body #mega-menu-holder .menu-group > ul.dropdown,
  body #mega-menu-holder li > ul.dropdown {
    display: block !important;
    position: static !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    background: #f7f9fd !important;
    padding: 2px 0 !important;
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    float: none !important;
  }

  body #mega-menu-holder ul.dropdown li {
    display: block !important;
    width: 100% !important;
    float: none !important;
    border-bottom: 1px solid rgba(0, 26, 87, 0.05) !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  body #mega-menu-holder ul.dropdown li:last-child {
    border-bottom: none !important;
  }

  body #mega-menu-holder ul.dropdown li a {
    display: block !important;
    width: 100% !important;
    padding: 6px 16px 6px 28px !important;
    font-family: "Source Sans Pro", sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #3b485e !important;
    line-height: 1.3 !important;
    text-transform: none !important;
    white-space: normal !important;
    box-sizing: border-box !important;
  }

  body #mega-menu-holder ul.dropdown li a:active,
  body #mega-menu-holder ul.dropdown li a:hover {
    background: #e9effa !important;
    color: #001a57 !important;
  }
}
