/* ==== GZS UX 2026-10-18 fix27 — menu on html.*, header, filters off, grid, sticky ==== */

/* ---------- 1) Mobile drawer: Porto puts nav-open on <html>, not <body> ---------- */
@media (max-width: 991px) {
  html.nav-before-open,
  html.nav-open {
    overflow: hidden !important;
    width: 100% !important;
    height: 100% !important;
  }

  /* Do not slide the whole page — overlay drawer only */
  html.nav-before-open .page-wrapper,
  html.nav-open .page-wrapper,
  html.nav-before-open body,
  html.nav-open body,
  body.nav-before-open .page-wrapper,
  body.nav-open .page-wrapper {
    transform: none !important;
    left: 0 !important;
    right: auto !important;
    position: relative !important;
    width: 100% !important;
    margin: 0 !important;
  }

  .nav-sections,
  .page-header.type23 + .sections.nav-sections,
  .sections.nav-sections {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    width: min(88vw, 360px) !important;
    max-width: 360px !important;
    height: 100% !important;
    height: 100dvh !important;
    background: #fff !important;
    z-index: 10050 !important;
    transform: translate3d(-110%, 0, 0) !important;
    transition: transform .25s ease !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    box-shadow: 8px 0 28px rgba(4, 62, 137, .18) !important;
    padding: 0 !important;
    margin: 0 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  html.nav-open .nav-sections,
  html.nav-open .sections.nav-sections,
  html.nav-open .page-header.type23 + .sections.nav-sections,
  body.nav-open .nav-sections {
    transform: translate3d(0, 0, 0) !important;
  }

  /* Backdrop on html so it paints above content, below drawer */
  html.nav-open::before {
    content: "" !important;
    position: fixed !important;
    inset: 0 !important;
    background: rgba(20, 28, 40, .45) !important;
    z-index: 10040 !important;
    pointer-events: auto !important;
  }

  .nav-sections .nav-sections-items {
    padding-top: 56px !important;
    width: 100% !important;
    max-width: 100% !important;
    left: 0 !important;
    transform: none !important;
    position: relative !important;
  }

  .nav-sections .nav-sections-item-content,
  .nav-sections .navigation,
  .nav-sections .navigation > ul {
    width: 100% !important;
    max-width: 100% !important;
    left: 0 !important;
    transform: none !important;
    position: relative !important;
    display: block !important;
  }

  .nav-sections .gzs-nav-close {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    width: 44px !important;
    height: 44px !important;
    z-index: 5 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #dde3ea !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: #043E89 !important;
    font-size: 22px !important;
    cursor: pointer !important;
  }

  .nav-sections .nav-sections-item-title {
    background: #EEF3F9 !important;
    border: 0 !important;
    border-bottom: 2px solid transparent !important;
    display: inline-flex !important;
    width: 50% !important;
    min-height: 48px !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    float: none !important;
  }
  .nav-sections .nav-sections-item-title.active,
  .nav-sections .nav-sections-item-title[aria-expanded="true"] {
    background: #fff !important;
    border-bottom-color: #043E89 !important;
  }
  .nav-sections .nav-sections-item-title a,
  .nav-sections .nav-sections-item-switch {
    color: #5b6570 !important;
    font-size: 16px !important;
    font-weight: 650 !important;
    width: 100% !important;
    min-height: 48px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
  }
  .nav-sections .nav-sections-item-title.active a,
  .nav-sections .nav-sections-item-title[aria-expanded="true"] a {
    color: #043E89 !important;
  }

  .navigation .ui-menu-item.level0,
  .navigation .level0 {
    display: block !important;
    position: relative !important;
    border-bottom: 1px solid #e8eef5 !important;
    margin: 0 !important;
    width: 100% !important;
  }
  .navigation .level0 > .level-top {
    display: flex !important;
    align-items: center !important;
    min-height: 48px !important;
    padding: 12px 56px 12px 16px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #043E89 !important;
    text-transform: none !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    width: auto !important;
    max-width: 100% !important;
  }
  .navigation .level0 > .level-top img { display: none !important; }
  .navigation .open-children-toggle {
    position: absolute !important;
    top: 4px !important;
    right: 8px !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid #dde3ea !important;
    border-radius: 10px !important;
    background: #F3F6FA !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 2 !important;
    cursor: pointer !important;
  }
  /* One plus control — kill Porto chevron/icon-font glyphs */
  .navigation .open-children-toggle:before,
  .navigation .open-children-toggle:after,
  .navigation .level0 > .level-top:after,
  .navigation .level0 > .level-top:before,
  .navigation .ui-menu-icon:before,
  .navigation .ui-menu-icon:after {
    content: none !important;
    display: none !important;
    background: none !important;
    border: 0 !important;
  }
  .navigation .open-children-toggle {
    font-size: 0 !important;
    color: transparent !important;
  }
  .navigation .open-children-toggle::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: 12px !important;
    height: 2px !important;
    background: #043E89 !important;
    transform: translate(-50%, -50%) !important;
  }
  .navigation .open-children-toggle::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    width: 2px !important;
    height: 12px !important;
    background: #043E89 !important;
    transform: translate(-50%, -50%) !important;
  }
  .navigation .level0.opened > .open-children-toggle::before { display: none !important; }
  .navigation .submenu a {
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    font-size: 15px !important;
    color: #243041 !important;
    padding: 10px 16px !important;
  }
  .nav-sections .header.links a {
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    font-size: 16px !important;
    color: #043E89 !important;
    padding: 10px 16px !important;
  }
}

/* ---------- 2) Narrow mobile header ---------- */
@media (max-width: 767px) {
  html.nav-open .page-header.type23,
  html.nav-before-open .page-header.type23 {
    z-index: 10030 !important; /* under backdrop 10040 / drawer 10050 */
  }
  .page-header.type23 {
    height: auto !important;
    min-height: 0 !important;
  }
  /* search lives inside .header-main-right — use flex wrap, not parent grid areas */
  .page-header.type23 .header.content {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
  }
  .page-header.type23 .action.nav-toggle {
    order: 1 !important;
    flex: 0 0 44px !important;
    width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
  }
  .page-header.type23 .logo {
    order: 2 !important;
    flex: 1 1 auto !important;
    margin: 0 !important;
    max-width: calc(100% - 140px) !important;
    min-width: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
  }
  .page-header.type23 .logo a {
    display: flex !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  .page-header.type23 .logo img {
    max-height: 40px !important;
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: left center !important;
  }
  .page-header.type23 .header-main-right {
    order: 3 !important;
    display: flex !important;
    flex: 1 1 100% !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 4px 8px !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
  /* icons stay on first visual row via negative margin pull — keep simple: full-width search below icons */
  .page-header.type23 .header-main-right > .gzs-account-link,
  .page-header.type23 .header-main-right > .minicart-wrapper,
  .page-header.type23 .header-main-right > .action.my-wishlist {
    order: 1 !important;
  }
  .page-header.type23 .search-area {
    order: 2 !important;
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 4px 0 0 !important;
    height: auto !important;
    min-height: 44px !important;
  }
  .page-header.type23 .search-area .block-search,
  .page-header.type23 .search-area .block.block-search {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  .page-header.type23 .search-area .search-toggle-icon { display: none !important; }
  .page-header.type23 #search,
  .page-header.type23 .block-search input.input-text {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 44px !important;
    box-sizing: border-box !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  /* Keep cart + account; wishlist secondary / hide on very narrow */
  .page-header.type23 .action.my-wishlist { display: none !important; }
  .page-header.type23 .gzs-account-link,
  .page-header.type23 .minicart-wrapper {
    display: inline-flex !important;
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    flex: 0 0 44px !important;
    margin: 0 !important;
  }
  .page-header.type23 .main-panel-top { display: none !important; }
  .page-header.type23 .switcher { display: none !important; }

  /* Pull account+cart up next to logo: absolute on the right of first row */
  .page-header.type23 .header.content {
    position: relative !important;
    padding-right: 108px !important;
  }
  .page-header.type23 .header-main-right {
    position: static !important;
  }
  .page-header.type23 .gzs-account-link {
    position: absolute !important;
    top: 8px !important;
    right: 56px !important;
  }
  .page-header.type23 .minicart-wrapper {
    position: absolute !important;
    top: 8px !important;
    right: 12px !important;
  }
}

@media (max-width: 390px) {
  .page-header.type23 .logo img { max-height: 36px !important; }
}

/* Top shipping notice: short wrap */
@media (max-width: 767px) {
  .page-wrapper > .porto-block-html-top {
    font-size: 12px !important;
    line-height: 1.35 !important;
    padding: 6px 10px !important;
  }
  .page-wrapper > .porto-block-html-top * {
    white-space: normal !important;
  }
}

/* ---------- 3) Remove left filter sidebar + Filtri trigger (owner override) ---------- */
html body .sidebar.sidebar-main,
html body .sidebar-main,
html body.page-layout-2columns-left .sidebar.sidebar-main,
html body.page-layout-2columns-left .column.main {
  /* expand main after sidebar removal */
}
html body .sidebar.sidebar-main,
html body aside.sidebar.sidebar-main,
html body .block.filter,
html body .sidebar .block.filter,
html body .porto-product-filters,
html body .porto-product-filters-toggle,
html body a.porto-product-filters-toggle,
html body .filter-title,
html body .block.filter .filter-title,
html body .filter-content,
html body .block.filter .filter-content,
html body .filter-options,
html body .filter-current,
html body .filter-actions,
html body .side-custom-block,
html body .sidebar-filterproducts {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  pointer-events: none !important;
  position: absolute !important;
  left: -99999px !important;
  clip: rect(0, 0, 0, 0) !important;
}

/* Orphan CENA glyph / missing icon squares on filters (if any remnant) */
.block.filter .filter-options-title:before,
.block.filter .filter-options-title:after,
.filter-options-title .porto-icon:before,
.porto-product-filters-toggle:before,
.porto-product-filters-toggle:after {
  content: none !important;
  display: none !important;
}

html body.page-layout-2columns-left .columns,
html body.page-layout-2columns-left .column.main,
html body.catalog-category-view .column.main,
html body.catalogsearch-result-index .column.main {
  width: 100% !important;
  max-width: 100% !important;
  flex: 1 1 100% !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
  float: none !important;
}

/* ---------- 4) Six columns: buttons fit, titles wrap ---------- */
.products-grid .product-item-info,
.gzs-featured .product-item-info {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
  overflow: hidden !important;
}
.products-grid .product-item-details {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  padding-left: 6px !important;
  padding-right: 6px !important;
}
.product-item-name,
.product-item-name a,
.product.name a,
.products-grid .product-item-name,
.products-grid .product-item-name a,
.catalog-category-view .product-item-info .product-item-name,
.catalog-category-view .product-item-info .product-item-name a,
.catalogsearch-result-index .product-item-info .product-item-name,
.catalogsearch-result-index .product-item-info .product-item-name a,
.gzs-featured .product-item-name a {
  color: #333333 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
  line-clamp: 3 !important;
  max-height: none !important;
  height: auto !important;
  min-height: 3.6em !important;
  line-height: 1.25 !important;
  font-size: 13px !important;
  word-break: break-word !important;
}
.products-grid .product-item-actions,
.products-grid .actions-primary {
  margin-top: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  padding: 0 !important;
  min-width: 0 !important;
}
.product-item-info .actions-primary .tocart,
.products-grid .action.tocart,
.products-grid .tocart {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 8px 6px !important;
  min-height: 40px !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  white-space: normal !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  background: #043E89 !important;
  border: 1px solid #043E89 !important;
  color: #fff !important;
}
.product-item-info .actions-primary .tocart span,
.products-grid .action.tocart span {
  display: inline !important;
  float: none !important;
  margin: 0 !important;
  white-space: normal !important;
}
.product-item-info .actions-primary .tocart:before,
.products-grid .action.tocart:before {
  position: static !important;
  float: none !important;
  margin: 0 4px 0 0 !important;
  flex-shrink: 0 !important;
}
.products-grid .product-item-photo,
.products-grid .product-image-wrapper,
.products-grid .product-image-photo {
  max-width: 100% !important;
  box-sizing: border-box !important;
}
.products-grid .product-image-photo {
  object-fit: contain !important;
}

@media (min-width: 1440px) {
  .catalog-category-view .products-grid .product-item,
  .catalogsearch-result-index .products-grid .product-item {
    width: 16.666% !important;
    max-width: 16.666% !important;
    padding: 0 6px 16px !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
  }
}

/* ---------- 5) Sticky PDP bar vs footer + OOS hide ---------- */
.catalog-product-view .page-main {
  padding-bottom: 0 !important;
}
@media (max-width: 991px) {
  .catalog-product-view .page-footer,
  .catalog-product-view .gzs-footer {
    position: relative !important;
    z-index: 20 !important;
  }
  .catalog-product-view .sticky-product,
  .catalog-product-view .product-sticky-nav {
    z-index: 15 !important;
    max-width: 100vw !important;
    left: 0 !important;
    right: 0 !important;
    box-sizing: border-box !important;
    padding-bottom: env(safe-area-inset-bottom, 0) !important;
  }
  /* Hide sticky when product is out of stock */
  .catalog-product-view.product-outofstock .sticky-product,
  .catalog-product-view .stock.unavailable ~ * .sticky-product,
  .catalog-product-view .product-info-main .stock.unavailable ~ .box-tocart,
  body.catalog-product-view:has(.product-info-main .stock.unavailable) .sticky-product,
  body.catalog-product-view:has(.product-info-main .stock.unavailable) .product-sticky-nav {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
  }
}

/* ---------- 6) Visible page H1 ---------- */
.page-title-wrapper .page-title,
.page-title-wrapper h1.page-title,
.category-view .page-title-wrapper,
.category-view .page-title,
.cms-page-view .page-title-wrapper .page-title,
.contact-index-index .page-title-wrapper .page-title,
.catalog-category-view .page-title-wrapper,
.catalog-category-view .page-title-wrapper .page-title {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  max-height: none !important;
  width: auto !important;
  max-width: 100% !important;
  overflow: visible !important;
  clip: auto !important;
  position: static !important;
  font-size: 28px !important;
  line-height: 1.25 !important;
  color: #043E89 !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
}
@media (max-width: 767px) {
  .page-title-wrapper .page-title,
  .catalog-category-view .page-title-wrapper .page-title {
    font-size: 24px !important;
  }
}
/* Policy: one visible H1 — demote duplicate inner title if present */
.cms-page-view .column.main h1:not(.page-title) {
  font-size: 22px !important;
  font-weight: 650 !important;
  color: #333 !important;
}

/* ---------- 7) Contact SI labels (CMS / forms that still show EN) ---------- */
.contact-index-index .page-title span { font-size: inherit !important; }
.contact-index-index .fieldset > .legend,
.contact-index-index .box-tocart .legend { /* no-op safety */ }

/* ---------- 8) Footer mobile gaps + no overlay ---------- */
@media (max-width: 767px) {
  .gzs-footer .footer-middle,
  .page-footer .footer.content {
    padding-top: 20px !important;
    padding-bottom: 16px !important;
    row-gap: 12px !important;
  }
  .gzs-footer .block,
  .page-footer .block {
    margin-bottom: 16px !important;
  }
  .gzs-footer .links li,
  .page-footer .links li {
    margin: 0 !important;
  }
  .gzs-footer .links a,
  .page-footer .links a {
    min-height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
  }
}

/* ---------- 9) Registration compact chooser ---------- */
@media (max-width: 767px) {
  .customer-account-create .page-title-wrapper,
  .gzs-reg-chooser {
    margin-bottom: 12px !important;
  }
  .gzs-reg-chooser,
  .customer-account-create .gzs-account-type {
    display: flex !important;
    flex-direction: row !important;
    gap: 8px !important;
  }
  .gzs-reg-chooser a,
  .gzs-reg-chooser .item,
  .customer-account-create .gzs-account-type a {
    flex: 1 1 50% !important;
    min-height: 48px !important;
    padding: 10px 12px !important;
    box-sizing: border-box !important;
  }
}

/* ---------- 10) Homepage hero tablet ---------- */
@media (min-width: 768px) and (max-width: 1023px) {
  .gzs-hero img,
  .gzs-hero .gzs-hero-media img,
  .cms-gzs-domov .gzs-hero img {
    max-height: 320px !important;
    width: auto !important;
    object-fit: contain !important;
  }
  .gzs-hero,
  .cms-gzs-domov .gzs-hero {
    padding-top: 24px !important;
    padding-bottom: 24px !important;
  }
}
/* fix27c — force visible mobile search + catalog anchor helpers */

@media (max-width: 767px) {
  .page-header.type23 .search-area,
  .page-header.type23 .header-main-right .search-area {
    position: relative !important;
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 8px 0 0 !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    overflow: visible !important;
  }
  .page-header.type23 .search-area .block-search,
  .page-header.type23 .block-search,
  .page-header.type23 #search_mini_form {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    overflow: visible !important;
  }
  .page-header.type23 .block-search .control,
  .page-header.type23 .block-search .field.search {
    display: block !important;
    width: 100% !important;
    position: relative !important;
    left: auto !important;
    visibility: visible !important;
  }
  .page-header.type23 #search,
  .page-header.type23 .block-search input.input-text {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 10px 48px 10px 14px !important;
    box-sizing: border-box !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    background: #fff !important;
    border: 1px solid #dde3ea !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    color: #333 !important;
  }
  .page-header.type23 .search-toggle-icon,
  .page-header.type23 .search-area .search-toggle-icon {
    display: none !important;
  }
  .page-header.type23 .block-search .action.search {
    position: absolute !important;
    right: 4px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 40px !important;
    height: 40px !important;
    display: inline-flex !important;
    z-index: 2 !important;
  }

  /* header row: toggle | logo | spacer for absolute icons; search full width below */
  .page-header.type23 .header.content {
    display: flex !important;
    flex-wrap: wrap !important;
    padding: 8px 12px 10px !important;
    padding-right: 108px !important;
  }
  .page-header.type23 .header-main-right {
    flex: 1 1 100% !important;
    width: 100% !important;
    justify-content: stretch !important;
  }
}