/* A single banner needs natural image sizing, not a cached bxSlider height. */
#wpsideslider-wrap.zactise-single-sidebar-promo .bx-viewport {
  height: auto !important;
}
#wpsideslider-wrap.zactise-single-sidebar-promo #wpbxslider,
#wpsideslider-wrap.zactise-single-sidebar-promo #wpbxslider > li {
  position: relative !important;
  width: 100% !important;
  float: none !important;
}
#wpsideslider-wrap.zactise-single-sidebar-promo figure { margin: 0; }
#wpsideslider-wrap.zactise-single-sidebar-promo #wpbxslider { margin: 0; padding: 0; }
#wpsideslider-wrap.zactise-single-sidebar-promo img {
  display: block;
  width: 100%;
  height: auto;
}

/* Space-only adjustments for the existing desktop design at narrower widths. */
@media (min-width: 900px) and (max-width: 1199px) {
  .container { width: calc(100% - 30px); max-width: 1140px; }
  #header .header-top .menu > ul#top-menu {
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  #header #_desktop_top_menu #top-menu > li > .sub-menu {
    top: 100% !important;
    max-height: calc(100vh - 260px);
    overflow-y: auto;
    overflow-x: hidden;
  }
  #header #_desktop_top_menu #top-menu > li:focus-within > .sub-menu {
    opacity: 1;
    visibility: visible;
  }
  #products #js-product-list > .products > .product-miniature {
    flex-basis: 33.333333%;
    max-width: 33.333333%;
    width: 33.333333%;
  }
  #category #left-column {
    flex: 0 0 210px;
    width: 210px;
    max-width: 210px;
  }
  #category #content-wrapper {
    flex: 0 0 calc(100% - 210px);
    width: calc(100% - 210px);
    max-width: calc(100% - 210px);
  }
  #category #left-column #wpsideslider-wrap,
  #category #left-column #wpsideslider-wrap .bx-wrapper,
  #category #left-column #wpsideslider-wrap .bx-viewport {
    width: 100% !important;
    max-width: 100% !important;
  }
  #category #left-column #wpsideslider-wrap img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
  }
  #footer .footer-container > .container > .row {
    display: flex;
    flex-wrap: wrap;
  }
  #footer .footer-container > .container > .row > .about-us {
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
    margin-bottom: 24px;
  }
  #footer .footer-container > .container > .row > .links:not(.about-us):not(.block-contact) {
    flex: 0 0 66.666667%;
    width: 66.666667%;
    max-width: 66.666667%;
  }
  #footer .footer-container > .container > .row > .block-contact {
    flex: 0 0 33.333333%;
    width: 33.333333%;
    max-width: 33.333333%;
  }
}

@media (max-width: 899px) {
  #header .header-top { background: var(--zactise-page); }
  #header .header-top #mobile_top_menu_wrapper {
    padding: 0;
    background: var(--zactise-page);
    border: 1px solid var(--zactise-line);
    border-radius: 2px;
    box-shadow: 0 8px 24px rgba(68, 55, 46, .1);
  }
  #header #mobile_top_menu_wrapper #top-menu { margin: 0; }
  #header .header-top #mobile_top_menu_wrapper a[data-depth="0"] {
    min-height: 46px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--zactise-line);
    background: transparent;
    color: var(--zactise-ink);
    font-size: 14px;
    font-weight: 600;
    line-height: 22px;
  }
  #header #mobile_top_menu_wrapper .top-menu .sub-menu {
    background: var(--zactise-soft);
  }
  #header #mobile_top_menu_wrapper .top-menu .sub-menu li > a {
    min-height: 44px;
    padding: 11px 16px 11px 26px;
    border-bottom: 1px solid var(--zactise-line);
    background: transparent;
    color: var(--zactise-ink);
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
  }
  #header #mobile_top_menu_wrapper .top-menu .sub-menu ul[data-depth="2"] li > a { padding-left: 38px; }
  #header #mobile_top_menu_wrapper .top-menu .sub-menu ul[data-depth="3"] li > a { padding-left: 50px; }
  #header #mobile_top_menu_wrapper .top-menu a:hover,
  #header #mobile_top_menu_wrapper .top-menu a:focus,
  #header #mobile_top_menu_wrapper .top-menu li.current > a {
    color: var(--zactise-raspberry);
    background: var(--zactise-soft);
  }
  #header #mobile_top_menu_wrapper .collapse-icons {
    color: var(--zactise-turquoise);
  }
  #header #mobile_top_menu_wrapper a:focus-visible {
    outline: 3px solid #0b7895;
    outline-offset: -3px;
  }
}
