/* Mayday B2B — typography (Jost, same as store.maydaydist.com) */
@import url("https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap");

:root {
  --md-font: "Jost", sans-serif;
  --md-page-bg: #ffffff;
  --md-page-max: 1742px;
  --md-page-gutter: 20px;
  --md-col-gap: 40px;
}

body,
.btn,
.form-control,
input,
select,
textarea,
.page-header h1,
h1, h2, h3, h4, h5, h6 {
  font-family: var(--md-font);
}

/* Legacy at_nova_child: white canvas (Classic uses #f6f6f6 on #wrapper) */
body,
#wrapper,
#content-wrapper,
#main,
.breadcrumb,
#header {
  background-color: var(--md-page-bg);
}

/* Classic #footer shell — maydayfooter provides its own dark footer */
#footer {
  padding: 0;
  margin-top: 0;
  background: transparent;
  border: none;
  box-shadow: none;
}

#header {
  box-shadow: none;
}

#header .header-nav,
#header .header-top,
#header .header-banner {
  background-color: var(--md-page-bg);
  border-bottom-color: #e8e8e8;
  box-shadow: none;
}

#header .header-nav {
  border-bottom-width: 1px;
}

/* Match Classic's 20px top padding so the nav isn't flush to the content below. */
#header .header-top {
  padding-bottom: 20px;
}

/* Classic adds ~25px above #wrapper so the header shadow has room.
   Flush the category cover against the nav instead. */
#wrapper {
  padding-top: 0;
}

/* Content column: cap width and stay centered on wide screens.
   Always keep side gutters so copy never sits flush to the viewport. */
@media (min-width: 768px) {
  :root {
    --md-page-gutter: 24px;
  }
}

#header .container,
#wrapper .container,
#footer .container,
.breadcrumb .container,
body .container {
  width: 100%;
  max-width: var(--md-page-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--md-page-gutter);
  padding-right: var(--md-page-gutter);
  box-sizing: border-box;
}

#header .logo {
  max-height: 56px;
  width: auto;
}

/* Search icon: Classic positions both the button and the inner <i>.
   Keep a single overlay on the left of the input. */
#header #search_widget form {
  position: relative;
  width: 100%;
  overflow: hidden;
}

#header #search_widget form input[name="s"] {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100%;
  box-sizing: border-box !important;
  padding: 10px 16px 10px 44px;
}

#header #search_widget form button[type="submit"] {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 44px;
  height: auto;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 0;
  box-shadow: none;
  transform: none;
}

#header #search_widget form button[type="submit"] i,
#header #search_widget form i.search {
  position: static;
  padding: 0;
  font-size: 22px;
  line-height: 1;
  color: #7a7a7a;
}

#header #search_widget form button[type="submit"] span {
  display: none;
}

/* Header row: logo, category menu, and search share one wrapping flex line.
   The search slot grows from 220px. The field inside is capped at 360px
   and stays on the right while they share the line. When 220px no longer
   fits, only the search wraps and the field becomes full width.
   The logo stays left and the menu is not squeezed.
   Classic moves #_desktop_top_menu into the mobile drawer, so these
   rules must not apply below the md breakpoint. */
@media (min-width: 768px) {
  #header .header-top > .container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    row-gap: 8px;
    container-type: inline-size;
    container-name: headerbar;
  }

  #header .header-top-main {
    display: flex;
    flex: 0 0 auto;
    flex-wrap: nowrap;
    align-items: center;
    width: auto;
    max-width: none;
    /* 32px before the search while they share the first line. */
    margin: 0 32px 0 0;
    position: relative;
    z-index: 2;
  }

  /* Bootstrap's row clearfix is an extra flex item and would sit
     between the menu and the right edge. */
  #header .header-top-main::before,
  #header .header-top-main::after {
    content: none;
    display: none;
  }

  /* Search on its own line: the logo row fills the line and the menu
     is pushed to the right edge. min-width: 100% is what actually
     forces that in Safari; flex-basis: 100% alone does not.
     980px is the content width where logo + menu + gap + search
     no longer fit, so this also applies when the wrap script has
     not added .is-search-wrapped yet. */
  #header .header-top.is-search-wrapped .header-top-main {
    flex: 1 0 auto;
    width: 100%;
    min-width: 100%;
    max-width: none;
    margin: 0;
    justify-content: space-between;
  }

  #header .header-top.is-search-wrapped .header-top-right {
    margin-left: auto;
  }

  #header .header-top.is-search-wrapped .header-top-search {
    flex: 1 0 100%;
    width: 100%;
    min-width: 0;
    max-width: none;
    margin-left: 0;
  }

  #header .header-top.is-search-wrapped .header-top-search #search_widget {
    max-width: none;
    margin-left: 0 !important;
  }

  @container headerbar (max-width: 980px) {
    #header .header-top-main {
      flex: 1 0 auto;
      width: 100%;
      min-width: 100%;
      max-width: none;
      margin: 0;
      justify-content: space-between;
    }

    #header .header-top-right {
      margin-left: auto;
    }

    #header .header-top-search {
      flex: 1 0 100%;
      width: 100%;
      min-width: 0;
      max-width: none;
      margin-left: 0;
    }
  }

  #header .header-top #_desktop_logo {
    flex: 0 0 auto;
    width: auto;
    max-width: 220px;
    padding-left: 0;
    padding-right: 0;
    float: none;
  }

  #header .header-top-right {
    display: flex !important;
    flex: 0 0 auto;
    min-width: max-content;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: auto;
    max-width: none;
    padding: 0;
    float: none;
  }

  #header #_desktop_top_menu {
    flex: 0 0 auto;
    min-width: max-content;
    width: auto;
  }

  #header #_desktop_top_menu .clearfix {
    display: none;
  }

  #header .header-top-search {
    position: relative;
    z-index: 1;
    display: block;
    flex: 1 0 220px;
    width: auto;
    min-width: 220px;
    max-width: 100%;
    margin: 0;
    clear: none;
    box-sizing: border-box;
  }

  #header .header-top-search #search_widget {
    float: none !important;
    display: block;
    flex: none;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 360px;
    margin: 0 0 0 auto !important;
    overflow: hidden;
    box-sizing: border-box;
  }

  /* After the 360px cap so this wins while the search is on its own line,
     including before the wrap script has added .is-search-wrapped. */
  @container headerbar (max-width: 980px) {
    #header .header-top-search #search_widget {
      max-width: none;
      margin-left: 0 !important;
    }
  }

  #_desktop_top_menu .top-menu[data-depth="0"] {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  #_desktop_top_menu .top-menu[data-depth="0"] > li {
    position: relative;
    float: none;
  }

  #_desktop_top_menu .top-menu[data-depth="0"] > li > a {
    display: block;
    padding: 16px 8px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #222222;
    background: transparent;
    white-space: nowrap;
  }

  #_desktop_top_menu .top-menu[data-depth="0"] > li > a:hover,
  #_desktop_top_menu .top-menu[data-depth="0"] > li:hover > a,
  #_desktop_top_menu .top-menu[data-depth="0"] > li.current > a {
    color: #e97e3d;
  }

  #_desktop_top_menu .sub-menu {
    width: auto;
    min-width: 220px;
    max-width: 320px;
    margin-left: 0;
    padding: 8px 0;
    background: #fff;
    border: 1px solid #eee;
  }

  #_desktop_top_menu .sub-menu ul[data-depth="1"] > li {
    float: none;
    margin: 0;
  }

  #_desktop_top_menu .sub-menu a {
    color: #444;
    text-transform: none;
    font-weight: 400;
    font-size: 14px;
  }

  #_desktop_top_menu .sub-menu a:hover {
    color: #e97e3d;
  }
}

/* Classic draws a focus ring around the clicked menu link. */
#header .top-menu a:focus,
#header .top-menu a:active,
#mobile_top_menu_wrapper .top-menu a:focus,
#mobile_top_menu_wrapper .top-menu a:active {
  outline: none;
}

@media (max-width: 767px) {
  /* Classic forces the first header row to flex. Hide it once the
     logo and menu have moved into the mobile bar and drawer. */
  #header .header-top > .container > .row.header-top-main {
    display: none;
  }

  #header .header-top-right {
    display: block !important;
    width: 100% !important;
    max-width: none;
    padding: 0;
    float: none;
  }

  #header .header-top-search {
    display: block;
    width: 100%;
  }

  #header #search_widget {
    float: none !important;
    display: block;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 0 12px !important;
    padding: 0;
    box-sizing: border-box;
    overflow: visible;
  }

  #mobile_top_menu_wrapper,
  #mobile_top_menu_wrapper.row {
    display: block;
    width: 100%;
    margin: 0;
    padding: 12px 0 24px;
    float: none;
  }

  #mobile_top_menu_wrapper #_mobile_top_menu,
  #mobile_top_menu_wrapper #_desktop_top_menu,
  #mobile_top_menu_wrapper .js-top-menu-bottom {
    display: block;
    float: none;
    width: 100%;
    max-width: none;
    flex: none;
  }

  #mobile_top_menu_wrapper .top-menu[data-depth="0"] {
    display: block;
    width: 100%;
  }

  #mobile_top_menu_wrapper .top-menu[data-depth="0"] > li {
    float: none;
    display: block;
    width: 100%;
  }

  #mobile_top_menu_wrapper .top-menu a {
    color: #222;
    white-space: normal;
  }

  #mobile_top_menu_wrapper .top-menu a[data-depth="0"] {
    display: block;
    padding: 12px 0;
    text-transform: uppercase;
    font-weight: 600;
  }

  #mobile_top_menu_wrapper .top-menu a:hover,
  #mobile_top_menu_wrapper .top-menu li.current > a {
    color: #e97e3d;
  }

  #mobile_top_menu_wrapper .js-top-menu-bottom {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid #eee;
  }

  #mobile_top_menu_wrapper .js-top-menu-bottom > div {
    display: block;
    width: 100%;
    padding: 8px 0;
  }
}

body {
  font-weight: 400;
}

h1, h2, h3, h4, h5, h6,
.page-header h1,
.h1, .h2, .h3 {
  font-weight: 600;
}

/* Accent / primary — legacy at_nova_child #e97e3d */
.btn-primary,
.btn.btn-primary {
  background-color: #e97e3d;
  border-color: #e97e3d;
  color: #fff;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn.btn-primary:hover,
.btn.btn-primary:focus {
  background-color: #d56e30;
  border-color: #d56e30;
  color: #fff;
}

/* Restricted category (guest) — match at_nova_child/errors/forbidden.tpl */
.mayday-forbidden {
  text-align: center;
  max-width: 720px;
  margin: 48px auto 72px;
  padding: 0 16px;
}

.mayday-forbidden h1 {
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.35;
  margin: 0 0 28px;
  color: #222;
}

.mayday-forbidden p {
  font-size: 1rem;
  line-height: 1.5;
  color: #414042;
  margin-bottom: 28px;
}

.mayday-forbidden .btn-primary {
  display: inline-block;
  padding: 12px 28px;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-radius: 2px;
}

.page-restricted .page-header,
.page-restricted .logo {
  display: none;
}

/* Homepage slider — closer to legacy mayday_homeslider */
.homeslider-container,
#carousel {
  margin: 0;
}

.homeslider-container .rslides,
#carousel .carousel-inner {
  max-height: none;
}

.homeslider-container .slide,
#carousel .carousel-item {
  position: relative;
  min-height: 520px;
  max-height: 700px;
  overflow: hidden;
  background: #111;
}

.homeslider-container .slide > a,
#carousel .carousel-item > a,
#carousel .carousel-item figure {
  display: block;
  position: relative;
  min-height: 520px;
  margin: 0;
}

.homeslider-container .slide img,
#carousel .carousel-item img {
  width: 100%;
  height: 700px;
  max-height: 700px;
  object-fit: cover;
  object-position: center right;
}

.homeslider-container .caption,
#carousel .caption,
#carousel .carousel-caption {
  position: absolute;
  left: 0;
  bottom: 0;
  top: 0;
  width: min(42%, 560px);
  max-width: 100%;
  margin: 0;
  padding: 50px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  text-align: left;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.72) 0%, rgba(255, 255, 255, 0.35) 70%, rgba(255, 255, 255, 0) 100%);
  color: #262626;
  right: auto;
  transform: none;
}

.homeslider-container .caption h2,
#carousel .caption h2,
#carousel .carousel-caption h2 {
  display: none; /* title duplicated in description h3 for richer HTML */
}

.homeslider-container .caption h3,
#carousel .caption h3,
#carousel .carousel-caption h3 {
  display: block;
  margin: 0 0 12px;
  font-size: clamp(2.4rem, 5vw, 4.75rem);
  font-weight: 600;
  line-height: 1.05;
  color: #262626;
}

.homeslider-container .caption p,
#carousel .caption p,
#carousel .carousel-caption p {
  margin: 0 0 12px;
  font-size: 1rem;
  line-height: 1.45;
  color: #262626;
}

.homeslider-container .md-slide-kicker,
#carousel .md-slide-kicker {
  margin-bottom: 6px;
  color: #d37d54;
  font-size: 1.05rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.homeslider-container .md-slide-cta span,
#carousel .md-slide-cta span {
  display: inline-block;
  margin-top: 8px;
  padding: 12px 22px;
  background: #262626;
  color: #fff;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.homeslider-container .md-slide-logo img,
#carousel .md-slide-logo img {
  width: 130px;
  height: auto;
  margin-bottom: 12px;
}

/* Darker text panel for Conso / darker photos */
.homeslider-container .slide:has(img[src*="conso"]) .caption,
.homeslider-container .slide:has(img[src*="lakai"]) .caption,
#carousel .carousel-item:has(img[src*="conso"]) .caption,
#carousel .carousel-item:has(img[src*="lakai"]) .caption {
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.2) 65%, rgba(0, 0, 0, 0) 100%);
  color: #fff;
}

.homeslider-container .slide:has(img[src*="conso"]) .caption h3,
.homeslider-container .slide:has(img[src*="conso"]) .caption p,
.homeslider-container .slide:has(img[src*="lakai"]) .caption h3,
.homeslider-container .slide:has(img[src*="lakai"]) .caption p,
#carousel .carousel-item:has(img[src*="conso"]) .caption h3,
#carousel .carousel-item:has(img[src*="conso"]) .caption p,
#carousel .carousel-item:has(img[src*="lakai"]) .caption h3,
#carousel .carousel-item:has(img[src*="lakai"]) .caption p {
  color: #fff;
}

@media (max-width: 991px) {
  .homeslider-container .slide img,
  #carousel .carousel-item img {
    height: 420px;
  }

  .homeslider-container .caption,
  #carousel .caption,
  #carousel .carousel-caption {
    width: 100%;
    padding: 24px;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0.15) 100%);
    color: #fff;
  }

  .homeslider-container .caption h3,
  .homeslider-container .caption p,
  #carousel .caption h3,
  #carousel .caption p,
  #carousel .carousel-caption h3,
  #carousel .carousel-caption p {
    color: #fff;
  }

  .homeslider-container .caption h3,
  #carousel .caption h3,
  #carousel .carousel-caption h3 {
    font-size: 2.2rem;
  }
}

/* PDP — Prebook / 24h shipping boxes (legacy parity) */
.mayday-shipping-info {
  min-height: 160px;
  margin: 24px 0 16px;
  color: #636363;
  background-repeat: no-repeat;
  background-position: left top;
  background-size: 100px auto;
  padding-left: 130px;
  max-width: 420px;
  box-sizing: content-box;
}

.mayday-shipping-info strong {
  display: block;
  color: #d37d54;
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 10px;
  letter-spacing: 0.02em;
}

.mayday-shipping-info p {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.45;
}

.fast-shipping-box {
  background-image: url("../img/furgoncino-24h.svg");
}

.pre-order-calendar {
  background-image: url("../img/calendario-prebook.svg");
}

/* Category image as page header, then breadcrumb (legacy breadcrumb.tpl).
   Zoom from the top to crop the white letterbox on category_default JPEGs. */
#wrapper > .category-cover {
  display: block;
  height: 280px;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  font-size: 0;
  line-height: 0;
  background-color: #e8e8e8;
  background-repeat: no-repeat;
  background-position: center top;
  background-size: auto 120%;
}

@media (min-width: 768px) {
  #wrapper > .category-cover {
    height: 500px;
  }
}

#wrapper > .breadcrumb {
  display: flex;
  align-items: center;
  min-height: 44px;
  background: #f4f4f4;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
}

#wrapper > .breadcrumb .container {
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 1742px;
  padding-top: 0;
  padding-bottom: 0;
}

.breadcrumb .box-breadcrumb {
  width: 100%;
  text-align: right;
}

.breadcrumb .box-breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  margin: 0;
  padding: 0;
  list-style: none;
  color: #999999;
}

#wrapper > .breadcrumb li {
  display: flex;
  align-items: center;
  line-height: 1;
  font-size: 15px;
}

#wrapper > .breadcrumb li::after {
  content: "/";
  margin: 0 5px;
  color: #999999;
}

#wrapper > .breadcrumb li:last-child::after {
  display: none;
}

#wrapper > .breadcrumb li a {
  color: #888888;
}

#wrapper > .breadcrumb li a:hover {
  color: #e97e3d;
}

#wrapper > .breadcrumb li:last-child span {
  color: #222222;
}

/* Category title below banner — legacy .block-category (no cover, no card) */
.block-category,
#js-product-list-header .block-category {
  min-height: 0 !important;
  height: auto;
  margin-bottom: 16px;
  padding: 0;
  border: none;
  box-shadow: none;
  background: transparent;
}

.block-category.card,
.block-category.card-block {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
}

.block-category h1,
.block-category h1.h1 {
  font-size: 24px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #222222;
  margin: 20px 0 0;
  padding: 0;
}

.block-category #category-description,
.block-category #category-description.text-muted {
  margin-top: 20px;
  padding: 0;
  color: #666666;
}

.block-category #category-description p,
.block-category #category-description strong {
  font-weight: 400;
  color: #666666;
}

.block-category #category-description p {
  margin-bottom: 0;
  line-height: 20px;
  font-size: 15px;
}

.block-category #category-description p + p {
  margin-top: 20px;
}

.block-category .category-cover {
  display: none;
}

@media (max-width: 767px) {
  .block-category h1 {
    font-size: 20px;
  }
}

/* Category / search: narrow filter column, mosaic takes the rest (legacy styles.css) */
@media (min-width: 1200px) {
  .layout-left-column #wrapper .container > .row {
    display: flex;
    align-items: flex-start;
    flex-wrap: nowrap;
  }

  .layout-left-column #wrapper .container > .row #left-column {
    flex: 0 0 320px;
    max-width: 320px;
    width: 320px;
  }

  .layout-left-column #wrapper .container > .row #content-wrapper {
    flex: 1 1 0;
    min-width: 0;
    max-width: none;
    width: auto;
    padding-left: 30px;
  }
}

/* Left column — categories + filters (legacy at_nova_child .sidebar) */
#left-column.sidebar .block-categories,
#left-column.sidebar #search_filters,
#left-column.sidebar #search_filters_brands,
#left-column.sidebar #search_filters_suppliers {
  padding: 0;
  margin: 0 0 20px;
  background: transparent;
  box-shadow: none;
  border: none;
}

#left-column.sidebar .block-categories .title_block,
#left-column.sidebar .block-categories .h6,
#left-column.sidebar .block-categories .category-top-menu > li:first-child > a.h6,
#left-column.sidebar #search_filters > .h6,
#left-column.sidebar #search_filters .text-uppercase.h6 {
  color: #222222;
  text-transform: uppercase;
  font-size: 16px;
  line-height: 1.3;
  font-weight: 600;
  padding: 20px 0;
  margin: 0;
  text-align: left;
  border-bottom: 1px solid #e6e6e6;
}

#left-column.sidebar .block-categories .title_block a,
#left-column.sidebar .block-categories .h6 a,
#left-column.sidebar .block-categories .category-top-menu > li:first-child > a.h6 {
  color: #222222;
  font-size: inherit;
  font-weight: inherit;
  text-decoration: none;
}

#left-column.sidebar .block-categories .title_block a:hover,
#left-column.sidebar .block-categories .h6 a:hover {
  color: #e97e3d;
}

#left-column.sidebar .block-categories .block_content,
#left-column.sidebar #search_filters .block_content {
  padding: 20px 0;
  background: #fff;
}

#left-column.sidebar .block-categories .category-top-menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

#left-column.sidebar .block-categories .category-sub-menu {
  margin: 0;
  padding: 0;
  list-style: none;
}

#left-column.sidebar .block-categories .category-sub-menu li {
  position: relative;
  padding: 0;
  list-style: none;
}

#left-column.sidebar .block-categories .category-sub-menu li > a {
  position: relative;
  display: inline-block;
  width: 100%;
  margin: 0;
  padding: 10px 0 10px 27px;
  font-size: 15px;
  font-weight: 400;
  color: #666666;
  text-decoration: none;
  transition: color 0.3s ease;
}

#left-column.sidebar .block-categories .category-sub-menu li > a:before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 50%;
  width: 7px;
  height: 7px;
  border: 1px solid rgba(143, 143, 143, 0.4);
  border-radius: 50px;
  transform: translateY(50%);
  transition: all 0.2s ease;
}

#left-column.sidebar .block-categories .category-sub-menu li > a:hover,
#left-column.sidebar .block-categories .category-sub-menu li > a.current {
  color: #e97e3d;
}

#left-column.sidebar .block-categories .category-sub-menu li > a:hover:before,
#left-column.sidebar .block-categories .category-sub-menu li > a.current:before {
  background: #e97e3d;
  border-color: #e97e3d;
}

#left-column.sidebar .block-categories .collapse-icons {
  position: absolute;
  top: 4px;
  right: 0;
  width: 30px;
  height: 30px;
  padding: 0;
  cursor: pointer;
  text-align: center;
  line-height: 27px;
}

#left-column.sidebar .block-categories .collapse-icons .add,
#left-column.sidebar .block-categories .collapse-icons .remove {
  color: #999999;
  font-size: 16px;
}

#left-column.sidebar .block-categories .collapse-icons .remove {
  display: none;
}

#left-column.sidebar .block-categories .collapse-icons[aria-expanded="true"] .add {
  display: none;
}

#left-column.sidebar .block-categories .collapse-icons[aria-expanded="true"] .remove {
  display: block;
}

#left-column.sidebar #search_filters .facet {
  margin: 20px 0 10px;
  padding-top: 0;
}

#left-column.sidebar #search_filters .facet .collapse {
  display: block;
  max-height: none;
  overflow: visible;
  padding: 0;
  margin: 0;
  list-style: none;
}

#left-column.sidebar #search_filters .facet .collapse li {
  list-style: none;
}

#left-column.sidebar #search_filters .facet-title,
#left-column.sidebar #search_filters .facet .h6.facet-title {
  font-size: 15px;
  font-weight: 600;
  margin: 0 0 10px;
  padding: 0;
  color: #222222;
  text-align: left;
  text-transform: none;
  border: 0;
}

#left-column.sidebar #search_filters .facet-label {
  display: block;
  position: relative;
  text-align: left;
  padding: 4px 20px 4px 0;
  line-height: 20px;
  margin-bottom: 0;
  cursor: pointer;
}

#left-column.sidebar #search_filters .facet-label a {
  display: inline-block;
  margin-top: 0;
  font-size: 14px;
  color: #999999;
  text-align: left;
  text-decoration: none;
  vertical-align: middle;
}

#left-column.sidebar #search_filters .facet-label a:hover {
  color: #e97e3d;
}

#left-column.sidebar #search_filters .facet-label .magnitude {
  display: none;
}

#left-column.sidebar #search_filters .custom-checkbox {
  position: relative;
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-right: 6px;
  vertical-align: middle;
  overflow: hidden;
}

/* ps_facetedsearch sets top: -7px on these controls, which sits the box
   above the label text. */
#left-column.sidebar #search_filters .facet-label .custom-checkbox,
#left-column.sidebar #search_filters .facet-label .custom-radio {
  top: 0;
  vertical-align: middle;
}

#left-column.sidebar #search_filters .custom-checkbox input[type="checkbox"],
#left-column.sidebar #search_filters .custom-checkbox input[type="radio"] {
  position: absolute;
  left: 0;
  margin-top: 0;
  width: 15px;
  height: 15px;
  opacity: 0;
  cursor: pointer;
}

#left-column.sidebar #search_filters .custom-checkbox input[type="checkbox"] + span,
#left-column.sidebar #search_filters .custom-checkbox input[type="radio"] + span {
  display: block;
  width: 15px;
  height: 15px;
  margin: 0;
  border: 1px solid #999999;
  background: #fff;
  overflow: hidden;
  box-sizing: border-box;
  cursor: pointer;
}

#left-column.sidebar #search_filters .custom-checkbox input[type="checkbox"] + span .checkbox-checked,
#left-column.sidebar #search_filters .custom-checkbox input[type="radio"] + span .checkbox-checked {
  display: none;
  margin: -2px -2px;
  font-size: 1.1rem;
  line-height: normal;
  color: #414141;
}

#left-column.sidebar #search_filters .custom-checkbox input[type="checkbox"]:checked + span .checkbox-checked,
#left-column.sidebar #search_filters .custom-checkbox input[type="radio"]:checked + span .checkbox-checked {
  display: block;
}

#left-column.sidebar #search_filters .clear-all-wrapper {
  margin: 10px 0;
  text-align: left;
}

/* Space under the full-width breadcrumb (margin 0). The listing
   container uses 40px. Layout notifications sit between the breadcrumb
   and that container, so they need the same top gap. Otherwise the
   category-access alert is flush against the breadcrumb bar.
   Only the direct child is targeted: account pages re-include the same
   partial inside the content column, which already has this gap. */
#wrapper > #notifications {
  margin-top: 40px;
}

/* Space between breadcrumb and the listing container, and between
   that container and the footer. */
#wrapper > .container {
  margin-top: 40px;
  margin-bottom: 40px;
}

body.page-index #wrapper > .container {
  margin-top: 0;
}

/* Product mosaic — 4-col grid like LISTING_PRODUCT_COLUMN=4 */
#products .products .product,
.featured-products .products .product {
  margin-bottom: 30px;
}

.products .product-miniature .thumbnail-container {
  position: relative;
  margin-bottom: 0;
  background: #fff;
  box-shadow: none;
  border: none;
  height: auto;
  overflow: visible;
}

.products .product-miniature .thumbnail-top,
.products .product-miniature .thumbnail-container .product-thumbnail {
  overflow: hidden;
  height: auto;
  display: block;
  width: 100%;
}

.products .product-miniature .product-thumbnail picture,
.products .product-miniature .thumbnail-container .product-thumbnail img {
  width: 100%;
  max-width: 100%;
  height: auto;
  margin: 0;
  display: block;
}

.products .product-miniature .highlighted-informations,
.products .product-miniature .wishlist-button-add,
.products .product-miniature .wishlist-button-product,
.products .product-miniature button[class*="wishlist"] {
  display: none !important;
}

/* Classic draws a grey separator under the photo on card hover. */
.products .product-miniature .thumbnail-container:hover .product-description::after,
.products .product-miniature .thumbnail-container:focus .product-description::after {
  content: none;
  border: 0;
  display: none;
}

.products .product-miniature .product-description {
  padding: 15px 0 0;
  text-align: left;
  background: transparent;
}

.products .product-miniature .product-title,
.products .product-miniature .product-title a,
.products .product-miniature .product-price-and-shipping {
  text-align: left;
}

.products .product-miniature .product-title {
  font-size: 14px;
  font-weight: 400;
  margin: 0 0 10px;
  text-transform: none;
}

.products .product-miniature .product-title a {
  font-size: 14px;
  font-weight: 400;
  color: #666;
  text-decoration: none;
}

.products .product-miniature .product-title a:hover {
  color: #e97e3d;
}

.products .product-miniature .product-price-and-shipping {
  color: #222;
  margin-bottom: 10px;
}

.products .product-miniature .product-price-and-shipping .price {
  font-size: 16px;
  font-weight: 700;
  color: #222;
}

.products .product-miniature .product-price-and-shipping .regular-price {
  color: #888;
  font-size: 14px;
  font-weight: 400;
  text-decoration: line-through;
}

/* Prebook root — subcategory mosaic (legacy #subcategories / .box-subcate) */
#subcategories,
.mayday-prebook-subcategories {
  margin-bottom: 30px;
  text-align: center;
}

#subcategories .subcategory-block,
.mayday-prebook-subcategories .subcategory-block {
  margin-bottom: 20px;
}

#subcategories .box-subcate,
.mayday-prebook-subcategories .box-subcate {
  padding: 15px;
  border: 1px solid #e6e6e6;
  border-radius: 4px;
  transition: border-color 0.3s;
}

#subcategories .box-subcate:hover,
.mayday-prebook-subcategories .box-subcate:hover {
  border-color: #e97e3d;
}

#subcategories .subcategory-image img,
.mayday-prebook-subcategories .subcategory-image img {
  width: 100%;
  height: auto;
  display: block;
}

#subcategories .subcategory-meta,
.mayday-prebook-subcategories .subcategory-meta {
  margin-top: 10px;
  line-height: 23px;
  font-size: 13px;
  color: #999;
}

#subcategories .subcategory-name,
.mayday-prebook-subcategories .subcategory-name {
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  color: #666;
  text-decoration: none;
}

#subcategories .subcategory-description,
.mayday-prebook-subcategories .subcategory-description {
  display: none;
}

@media (max-width: 575px) {
  .mayday-shipping-info {
    padding-left: 0;
    padding-top: 110px;
    background-position: center top;
    text-align: center;
    max-width: none;
  }
}

/* PDP — structure from at_nova_child catalog/product.tpl
   Body id is #product; Classic ID selectors beat .page-product alone. */
#product #content-wrapper {
  padding-left: 0;
  padding-right: 0;
}

#product #main.product-detail {
  padding-top: 20px;
}

@media (min-width: 768px) {
  #product .product-container.row {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    margin-left: 0;
    margin-right: 0;
    gap: var(--md-col-gap);
  }

  #product .product-container > .col-md-6 {
    flex: 1 1 0;
    max-width: none;
    width: auto;
    min-width: 0;
    padding-left: 0;
    padding-right: 0;
  }
}

#product #content.page-content,
#product section#content {
  max-width: none !important;
  width: 100%;
}

#product .images-container,
#product .product-cover {
  width: 100%;
  max-width: 100%;
}

#product .product-cover picture {
  display: block;
  width: 100%;
}

#product .product-cover img,
#product .product-cover .js-qv-product-cover {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  display: block;
}

#product .product-manufacturer {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}

#product .product-manufacturer span {
  color: #ababab;
  font-size: 16px;
  font-weight: 600;
  display: inline-block;
  margin-left: 20px;
}

#product .product-manufacturer .manufacturer-logo {
  display: block;
  height: 50px !important;
  width: auto !important;
  max-width: 160px;
  max-height: 50px !important;
}

#product h1.h1.product-detail-name,
#product .product-detail-name {
  margin-top: 20px;
  margin-bottom: 20px;
  font-size: 42px !important;
  line-height: 1.15;
  text-transform: none !important;
  font-weight: 600;
  color: #5f5f5f !important;
  letter-spacing: 0;
  text-wrap: pretty;
  text-wrap: balance;
}

#product .product-prices {
  margin-top: 10px;
  margin-bottom: 10px;
  line-height: normal;
}

#product .product-prices .product-price {
  margin: 0;
  padding: 0;
}

#product .product-prices .current-price {
  margin: 0;
  padding: 0;
  line-height: 1.15;
}

#product .product-prices .product-price,
#product .product-prices .current-price-value {
  color: #e97e3d !important;
  display: inline-block;
  font-size: 34px !important;
  font-weight: 600;
  line-height: 1.05;
}

#product .product-prices .tax-shipping-delivery-label {
  font-size: 13px;
  font-weight: 600;
  color: #ababab;
  display: block;
  margin: 3px 0 0 !important;
  padding: 0 !important;
  line-height: 1.2;
}

#product .information-start-separator {
  display: block;
  background-color: #101010;
  height: 2px;
  width: 60px;
  margin-top: 24px;
  margin-bottom: 24px;
}

#product .product-information {
  color: #666;
  font-size: 14px;
  margin-top: 0;
}

#product .product-actions {
  margin-top: 0;
}

#product .product-variants {
  margin-top: 6px;
  margin-bottom: 0;
}

#product .product-variants-item {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 22px;
}

#product .product-variants-item:last-child {
  margin-bottom: 0;
}

#product .product-variants .control-label,
#product .product-actions .control-label {
  width: auto !important;
  min-width: 0;
  flex: 0 0 auto;
  float: none;
  line-height: 38px;
  display: block;
  font-weight: 400;
  color: #ababab;
  margin-right: 10px;
  margin-bottom: 0;
}

#product .product-variants .control-label {
  line-height: 1;
}

#product .product-variants .control-value {
  color: #636363;
  font-size: 24px;
  line-height: 1;
}

#product .product-variants .form-control-select {
  width: auto !important;
  min-width: 90px;
  max-width: 140px;
  height: 42px;
  margin: 0;
  flex: 0 0 auto;
  border-color: #d8d8d8;
  border-radius: 3px;
  color: #636363;
}

#product .product-description {
  line-height: 24px;
  color: #999999;
  margin-top: 48px;
  margin-bottom: 30px;
  font-size: 14px;
}

#product .product-description p {
  margin: 0;
  font-size: 14px;
  line-height: 24px;
  color: #999999;
}

#product .product-add-to-cart {
  padding: 10px 0 20px;
  margin: 0;
}

#product .product-add-to-cart .control-label {
  display: none;
}

#product .product-add-to-cart .product-quantity {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

#product .product-quantity .qty,
#product .product-quantity .add,
#product .product-quantity .wishlist-button {
  flex: 0 0 auto;
  width: auto;
}

#product .product-quantity .qty {
  margin-right: 0;
}

#product .product-quantity #quantity_wanted {
  color: #636363;
  background-color: #fff;
  height: 50px;
  width: 70px;
  text-align: center;
  border: 1px solid #d8d8d8;
  border-radius: 3px 0 0 3px;
  font-size: 20px;
}

#product .product-quantity .bootstrap-touchspin {
  display: flex;
  align-items: stretch;
  height: 50px;
  float: none;
}

#product .product-quantity .input-group-btn-vertical {
  display: flex;
  flex-direction: column;
  align-self: stretch;
  float: none;
  width: 24px;
  height: auto;
}

#product .product-quantity .btn-touchspin {
  flex: 1 1 0;
  height: auto !important;
  min-height: 0;
  margin: 0 !important;
  padding: 0;
  border-color: #d8d8d8;
  background: #fff;
}

#product .product-quantity .bootstrap-touchspin-up {
  border-radius: 0 3px 0 0;
}

#product .product-quantity .bootstrap-touchspin-down {
  border-radius: 0 0 3px 0;
}

#product .product-actions .add-to-cart {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  font-size: 14px;
  font-weight: 700;
  padding: 8px 40px;
  height: 50px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff !important;
  background: #d37d54 !important;
  border: none;
  border-radius: 3px;
  box-shadow: none;
  white-space: nowrap;
}

/* Wishlist sits in the same row as qty and add to cart (Classic displayProductActions). */
#product .product-quantity .wishlist-button-add {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  min-width: 50px;
  margin: 0;
  padding: 0;
  border: 1px solid #d8d8d8;
  border-radius: 3px;
  background: #fff;
  box-shadow: none;
}

#product .product-quantity .wishlist-button-add i {
  color: #afafaf;
  font-size: 22px;
  line-height: 1;
}

#product .product-quantity .wishlist-button-add:hover,
#product .product-quantity .wishlist-button-add:focus {
  opacity: 1;
  border-color: #d37d54;
  background: #fff;
}

#product .product-quantity .wishlist-button-add:hover i,
#product .product-quantity .wishlist-button-add:focus i {
  color: #d37d54;
}

#product .product-actions .add-to-cart:hover,
#product .product-actions .add-to-cart:focus {
  background: #e97e3d !important;
  color: #fff !important;
}

#product .product-actions .add-to-cart:disabled,
#product .product-actions .add-to-cart.disabled {
  opacity: 0.65;
}

#product .product-cover {
  background: #f6f6f6;
  margin-bottom: 16px;
}

#product .product-cover img {
  width: 100%;
  height: auto;
}

#product .images-container .product-images {
  white-space: normal;
}

#product .images-container .product-images > li.thumb-container {
  margin: 0 8px 8px 0;
}

#product .images-container .product-images img.thumb {
  border: 1px solid #e6e6e6;
  width: 92px;
  height: auto;
}

#product .images-container .product-images img.thumb.selected,
#product .images-container .product-images img.thumb.js-thumb-selected {
  border-color: #222;
}

/* Product flags — outlined labels from legacy at_nova_child (not Classic solid badges). */
.product-flags {
  position: absolute;
  top: 10px;
  left: 10px;
  right: auto;
  width: auto;
  max-width: calc(100% - 20px);
  margin: 0;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 4px 6px;
  text-align: left;
  z-index: 2;
  pointer-events: none;
}

#product #content.page-content {
  position: relative;
}

.product-miniature .product-flags li.product-flag,
.product-flags li.product-flag,
#product .product-flags .product-flag {
  position: static;
  display: inline-block;
  width: auto;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 2px 5px;
  background: transparent;
  color: #77c66d;
  font-family: var(--md-font);
  font-size: 11px;
  font-weight: 500;
  line-height: 15px;
  letter-spacing: 0;
  text-transform: uppercase;
  text-align: left;
  border: 0;
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-radius: 0;
  box-shadow: none;
  order: 0;
  pointer-events: auto;
}

.product-miniature .product-flags li.product-flag.online-only,
.product-flags li.product-flag.online-only {
  position: static;
  top: auto;
  right: auto;
  margin: 0;
  font-size: 11px;
  color: #ff9a52;
  background: transparent;
}

.product-flags li.product-flag.online-only::before {
  content: none;
}

.product-flags li.product-flag.on-sale {
  order: 0;
  width: auto;
  margin: 0 !important;
  text-align: left;
  color: #f8956c;
  background: transparent;
}

.product-flags li.product-flag.discount,
.product-flags li.product-flag.discount-amount,
.product-flags li.product-flag.discount-percentage {
  color: #fc0000;
  background: transparent;
}

#product #product-availability,
#product .social-sharing,
#product .product-additional-info,
#product #block-reassurance,
#product .tabs,
#product .scroll-box-arrows {
  display: none;
}

#product .mayday-shipping-info {
  min-height: 200px;
  margin-top: 10px;
}

#product .mayday-shipping-info strong {
  font-weight: 400;
}

@media (max-width: 767px) {
  #product h1.h1.product-detail-name,
  #product .product-detail-name {
    font-size: 28px !important;
  }

  #product .product-prices .product-price,
  #product .product-prices .current-price-value {
    font-size: 28px !important;
  }
}

/* Category mosaic — bottom pagination (legacy at_nova) */
#products .pagination,
#js-product-list .pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: 100%;
  min-height: 50px;
  margin: 0;
  padding: 0 10px;
  background: #f7f7f9;
  color: #999999;
  font-size: 15px;
  border-radius: 0;
}

#products .pagination > div:first-child,
#js-product-list .pagination > div:first-child {
  padding-left: 0;
  line-height: 60px;
}

#products .pagination .page-list,
#js-product-list .pagination .page-list {
  padding: 10px 0;
  margin: 0;
  background: transparent;
  list-style: none;
}

#products .pagination .page-list li,
#js-product-list .pagination .page-list li {
  display: inline-block;
  float: none;
  margin: 3px 0;
  padding-left: 5px;
}

#products .pagination .page-list li span,
#js-product-list .pagination .page-list li span {
  display: none;
}

#products .pagination .page-list li .spacer,
#js-product-list .pagination .page-list li .spacer {
  display: block;
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  color: #999999;
}

#products .pagination a,
#js-product-list .pagination a {
  display: inline-block;
  float: none;
  width: 30px;
  height: 30px;
  padding: 0;
  line-height: 28px;
  border: 1px solid #cccccc;
  text-align: center;
  color: #999999;
  font-weight: 400;
  letter-spacing: 0;
  text-decoration: none;
  background: transparent;
  box-sizing: border-box;
}

#products .pagination a .material-icons,
#js-product-list .pagination a .material-icons {
  display: inline-block;
  width: auto;
  height: auto;
  font-size: 18px;
  line-height: 28px;
  vertical-align: top;
}

#products .pagination a:hover,
#products .pagination a:focus,
#js-product-list .pagination a:hover,
#js-product-list .pagination a:focus {
  color: #e97e3d;
  border-color: #e97e3d;
  text-decoration: none;
  background: transparent;
}

#products .pagination .disabled,
#js-product-list .pagination .disabled {
  color: #666;
  cursor: not-allowed;
  pointer-events: none;
}

#products .pagination .current a,
#js-product-list .pagination .current a {
  color: #e97e3d;
  border-color: #e97e3d;
  font-size: inherit;
  text-decoration: none;
}

#products .pagination .previous,
#products .pagination .next,
#js-product-list .pagination .previous,
#js-product-list .pagination .next {
  float: none;
}

#js-product-list .hidden-md-up.up {
  display: none;
}
