/*
 * Astalias Base Theme System - Final responsive header, search and mobile nav layer
 * Permanent layer generated/managed by Astalias_ChildThemeMaker.
 * Magento 2.4.8 / PHP 8.4 safe CSS only. No vendor/native edits.
 */

/* Desktop/tablet header foundation: logo | search | cart/actions */
@media (min-width: 768px) {
  body .page-header .header.content {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    grid-template-rows: auto !important;
    align-items: center !important;
    column-gap: 16px !important;
    row-gap: 0 !important;
    flex-wrap: nowrap !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    box-sizing: border-box !important;
  }

  body .page-header .header.content:before,
  body .page-header .header.content:after {
    content: none !important;
    display: none !important;
  }

  body .page-header .header.content > .nav-toggle {
    display: none !important;
  }

  body .page-header .header.content > .logo {
    grid-column: 1 / 3 !important;
    grid-row: 1 !important;
    order: 1 !important;
    float: none !important;
    margin: 0 !important;
    max-width: 220px !important;
    justify-self: start !important;
    align-self: center !important;
  }

  body .page-header .header.content > .logo img {
    display: block !important;
    max-width: 100% !important;
    height: auto !important;
  }

  body .page-header .header.content > .block-search {
    grid-column: 3 / 6 !important;
    grid-row: 1 !important;
    order: 2 !important;
    display: block !important;
    float: none !important;
    position: relative !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding-left: 0 !important;
    justify-self: stretch !important;
    align-self: center !important;
    z-index: 3 !important;
  }

  body .page-header .header.content > .block-search .block-content,
  body .page-header .header.content > .block-search form,
  body .page-header .header.content > .block-search .field.search,
  body .page-header .header.content > .block-search .control {
    width: 100% !important;
    max-width: none !important;
  }

  body .page-header .header.content > .block-search .control {
    position: relative !important;
    margin: 0 !important;
    padding: 0 !important;
    border-top: 0 !important;
  }

  body .page-header .header.content > .block-search input#search,
  body .page-header .header.content > .block-search input.input-text {
    width: 100% !important;
    margin: 0 !important;
    position: static !important;
    padding-right: 172px !important;
  }

  body .page-header .header.content > .block-search .nested {
    position: absolute !important;
    right: 44px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 5 !important;
    white-space: nowrap !important;
    height: auto !important;
  }

  body .page-header .header.content > .block-search .nested a.action.advanced {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 24px !important;
    padding: 0 8px !important;
    border-left: 1px solid #dbe3ef !important;
    color: #2563eb !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    text-decoration: none !important;
  }

  body .page-header .header.content > .block-search .nested a.action.advanced:hover,
  body .page-header .header.content > .block-search .nested a.action.advanced:focus {
    color: #0b6bff !important;
    text-decoration: underline !important;
  }

  body .page-header .header.content > .minicart-wrapper {
    grid-column: 6 / 7 !important;
    grid-row: 1 !important;
    order: 3 !important;
    float: none !important;
    margin: 0 !important;
    justify-self: end !important;
    align-self: center !important;
  }

  body .nav-sections .navigation > ul {
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px 18px !important;
    align-items: center !important;
    padding: 0 !important;
  }

  body .nav-sections .navigation .level0 .submenu {
    display: none !important;
  }

  body .nav-sections .navigation .level0.parent:hover > .submenu,
  body .nav-sections .navigation .level0.parent:focus-within > .submenu,
  body .nav-sections .navigation .level0.parent._hover > .submenu,
  body .nav-sections .navigation .level0.parent.active > .submenu {
    display: block !important;
  }
}

/* Mobile header: nav + logo + cart, search full-width */
@media (max-width: 767px) {
  body .page-header .header.content {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 12px 16px !important;
    box-sizing: border-box !important;
  }

  body .page-header .header.content > .nav-toggle {
    display: inline-flex !important;
    order: 1 !important;
  }

  body .page-header .header.content > .logo {
    order: 2 !important;
    flex: 1 1 auto !important;
    max-width: 180px !important;
    margin: 0 !important;
  }

  body .page-header .header.content > .minicart-wrapper {
    order: 3 !important;
    margin-left: auto !important;
  }

  body .page-header .header.content > .block-search {
    order: 4 !important;
    flex: 1 0 100% !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding-left: 0 !important;
    float: none !important;
  }

  body .page-header .header.content > .block-search .nested {
    position: static !important;
    display: block !important;
    margin-top: 6px !important;
    padding: 0 !important;
  }

  body .page-header .header.content > .block-search .nested a.action.advanced {
    font-size: 12px !important;
  }
}

/* Mobile native menu contrast and tab stability */
@media (max-width: 767px) {
  body .nav-sections,
  body .nav-sections .nav-sections-items,
  body .nav-sections .nav-sections-item-content,
  body .nav-sections .navigation {
    background: #ff7900 !important;
    color: #ffffff !important;
  }

  body .nav-sections .nav-sections-item-title,
  body .nav-sections .section-item-title {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    background: #d86600 !important;
    color: #ffffff !important;
    border-color: rgba(255,255,255,.22) !important;
    min-height: 56px !important;
    height: 56px !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  body .nav-sections .nav-sections-item-title.active,
  body .nav-sections .nav-sections-item-title:hover,
  body .nav-sections .nav-sections-item-title:focus,
  body .nav-sections .section-item-title.active,
  body .nav-sections .section-item-title:hover,
  body .nav-sections .section-item-title:focus {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    background: #ff7900 !important;
    color: #ffffff !important;
    border-bottom: 1px solid rgba(255,255,255,.22) !important;
  }

  body .nav-sections .nav-sections-item-title .nav-sections-item-switch,
  body .nav-sections .section-item-title .nav-sections-item-switch,
  body .nav-sections .nav-sections-item-switch,
  body .nav-sections .nav-sections-item-switch:visited,
  body .nav-sections .nav-sections-item-switch:hover,
  body .nav-sections .nav-sections-item-switch:focus,
  body .nav-sections .nav-sections-item-switch:active {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 56px !important;
    height: 56px !important;
    padding: 0 12px !important;
    color: #ffffff !important;
    background: transparent !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
  }

  body .nav-sections .navigation ul,
  body .nav-sections .navigation li,
  body .nav-sections .navigation .level0,
  body .nav-sections .navigation .level1,
  body .nav-sections .navigation .level2,
  body .nav-sections .navigation .submenu,
  body .nav-sections .header.links,
  body .nav-sections .header.links > li {
    background: #ff7900 !important;
    color: #ffffff !important;
  }

  body .nav-sections .navigation a,
  body .nav-sections .navigation .level-top,
  body .nav-sections .header.links a {
    display: block !important;
    color: #ffffff !important;
    background: transparent !important;
    border-color: rgba(255,255,255,.18) !important;
    opacity: 1 !important;
    text-decoration: none !important;
  }

  body .nav-sections .navigation a:hover,
  body .nav-sections .navigation a:focus,
  body .nav-sections .navigation .level-top:hover,
  body .nav-sections .navigation .level-top.ui-state-focus,
  body .nav-sections .header.links a:hover,
  body .nav-sections .header.links a:focus {
    background: #e86d00 !important;
    color: #ffffff !important;
    text-decoration: none !important;
  }

  body .nav-sections .navigation .ui-menu-icon:after {
    color: #ffffff !important;
    opacity: 1 !important;
  }

  body .nav-sections .header.links {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    border: 0 !important;
  }

  body .nav-sections .header.links > li {
    display: block !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.18) !important;
  }

  body .nav-sections .header.links > li > a,
  body .nav-sections .header.links .authorization-link > a,
  body .nav-sections .header.links .link > a {
    display: block !important;
    padding: 14px 16px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
  }
}

/* Tablet nav readability */
@media (min-width: 768px) and (max-width: 1024px) {
  body .nav-sections,
  body .nav-sections .navigation {
    background: #ff7900 !important;
    color: #ffffff !important;
    overflow: visible !important;
    position: relative !important;
    z-index: 120 !important;
  }

  body .nav-sections .navigation > ul {
    align-items: stretch !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
    padding: 0 !important;
  }

  body .navigation .level0,
  body .navigation .level0 > .level-top,
  body .navigation .level0 > .level-top span,
  body .nav-sections .navigation .submenu,
  body .nav-sections .navigation .submenu li {
    background: #ff7900 !important;
    color: #ffffff !important;
  }

  body .navigation .level0 > .level-top {
    display: block !important;
    min-height: 44px !important;
    padding: 14px 13px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
  }

  body .navigation .level0 > .level-top:hover,
  body .navigation .level0 > .level-top.ui-state-focus,
  body .navigation .level0.active > .level-top,
  body .navigation .level0.has-active > .level-top,
  body .nav-sections .navigation .submenu a:hover,
  body .nav-sections .navigation .submenu a:focus {
    background: #e86d00 !important;
    color: #ffffff !important;
  }

  body .nav-sections .navigation .submenu {
    border: 1px solid rgba(255,255,255,.25) !important;
    box-shadow: 0 18px 42px rgba(15,23,42,.22) !important;
    min-width: 240px !important;
    max-width: min(90vw, 340px) !important;
    padding: 8px 0 !important;
    z-index: 300 !important;
  }

  body .nav-sections .navigation .submenu a,
  body .nav-sections .navigation .submenu a span {
    background: transparent !important;
    color: #ffffff !important;
    display: block !important;
    font-size: 13px !important;
    line-height: 1.35 !important;
    opacity: 1 !important;
    padding: 10px 14px !important;
    text-shadow: none !important;
    visibility: visible !important;
    white-space: normal !important;
  }
}