/* Journal 3.1 -> 3.2 presentation compatibility, checked against the live shop. */
.main-products.product-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 20px !important;
}
.main-products.product-grid .price { border-top: 1px solid #ddd !important; width: fit-content; margin-left: auto; margin-right: auto; padding-top: 5px; }
footer .icons-menu-61 .icons-menu-item > a {
  display: flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 50%; background: #653417;
}
footer .links-menu-item:has(> a[href="https://www.tvs.lt/"]) {
  display: flex; flex-direction: row; justify-content: flex-end; align-items: center;
  width: 100% !important;
  max-width: none !important;
}
.products-filter .input-group select.form-control {
  height: 26px !important;
  min-height: 26px !important;
  padding: 0 !important;
  line-height: normal;
  appearance: auto;
  background-image: none !important;
}
.products-filter .input-group-addon { height: 26px !important; }
.products-filter .input-group { gap: 0 !important; }
footer .links-menu-310 .links-menu-item > a {
  flex: 0 0 auto !important;
  width: auto !important;
}
/* Keep the original compact product option and quantity controls. */
#product .product-options select.form-control {
  height: 34px !important;
  min-height: 34px !important;
  padding: 6px 12px !important;
  font-size: 14px !important;
  line-height: normal;
  appearance: auto;
  background-image: none !important;
}
#product .stepper-group .stepper {
  position: relative;
  width: 60px !important;
  flex: 0 0 60px !important;
  max-width: 60px !important;
  height: 40px !important;
  margin: 0 10px 0 0 !important;
}
#product .stepper #product-quantity {
  width: 40px !important;
  height: 40px !important;
  flex: 0 0 40px;
  font-size: 15px;
}
#product .stepper > button {
  position: absolute;
  right: 0;
  width: 20px !important;
  height: 20px !important;
  min-width: 0;
  min-height: 0;
  padding: 0;
}
#product .stepper > button[aria-label="+"] { top: 0; }
#product .stepper > button[aria-label="-"] { bottom: 0; }
#product #button-cart { height: 40px !important; margin: 0 !important; flex: 0 0 auto !important; min-width: 112px; }
@media (min-width: 1025px) {
  .header-compact .mid-bar, .desktop-logo-wrapper { height: 90px !important; }
  .main-menu { margin-left: 20px !important; }
  .main-menu > .j-menu { gap: 10px !important; }
  html.route-common-home.over-content .site-wrapper { margin-top: -90px !important; }
}
.module-info_blocks-86 .info-block { gap: 0 !important; }
/* The E969 code point changed meaning in Journal 3.2's icon font. */
@font-face { font-family: alpaka-legacy; src: url('../icons/fonts/icomoon-legacy.woff') format('woff'); font-weight: normal; font-style: normal; font-display: block; }
.module-info_blocks-194 .info-block { gap: 0 !important; }
.module-info_blocks-194 .module-item-1 .info-block::before { font-family: alpaka-legacy !important; }
/* Keep thumbnail spacing and cap the rail when a viewport is resized. */
.product-image.direction-vertical { container-type: inline-size; align-items: flex-start; }
.product-image.direction-vertical .main-image { width: calc(100% - 90px) !important; }
.product-image.direction-vertical .additional-images { width: 80px !important; margin: -5px 10px 0 0 !important; max-height: calc(100cqw - 85px); }
.product-image.direction-vertical .additional-images .swiper-container { width: 80px !important; margin: 0 !important; max-height: calc(100cqw - 85px); }
.product-image.direction-vertical .additional-image { padding: 5px !important; }
.product-image.direction-vertical .additional-image img { width: 100%; height: auto; }

/* Preserve the original product typography and vertical form layout. */
.product-stats { font-size: 16px !important; font-weight: 400 !important; line-height: 24px !important; text-transform: none !important; margin-bottom: 15px !important; }
.product-stats li { font-size: 16px !important; font-weight: 400 !important; line-height: 24px !important; text-transform: none !important; }
.product-stats li b { font-size: 12px !important; font-weight: 700 !important; line-height: 18px !important; text-transform: uppercase !important; }
.product-stats .brand-image { flex: 1; justify-content: flex-end; align-items: flex-start; }
.product-stats .brand-image a { font-size: 13px !important; font-weight: 400 !important; text-transform: none !important; width: auto !important; margin-top: -30px !important; padding: 5px !important; }
.product-stats .brand-image img { width: 70px !important; height: 70px !important; margin: 0 auto 3px !important; }
.product-stats .brand-image a, .product-stats .brand-image span { line-height: 19.5px !important; }
.product-stats .brand-image span { margin: 0 !important; }
.product-price-group, #product .product-options { margin-bottom: 15px !important; }
#product .product-options .form-group { flex-direction: column !important; }
#product .product-options select.form-control { flex: 0 0 34px !important; max-height: 34px !important; }
#product .product-options .control-label { flex: 0 0 auto !important; width: 100% !important; max-width: none !important; padding: 7px 0 5px !important; line-height: 24px !important; }
#product .buttons-wrapper { margin: 0 !important; align-items: center !important; }
@media (min-width: 768px) {
  .product-info { gap: 0 !important; }
  .product-info > .product-left, .product-info > .product-right { flex: 0 0 50% !important; width: 50% !important; }
  .product-info > .product-right { padding-left: 30px !important; }
}
@media (max-width: 1024px) {
  .mobile-search-wrapper { display: none !important; }
}
@media (max-width: 767px) {
  .main-products.product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .products-filter .input-group select.form-control { font-size: 14px !important; }
  .product-stats { flex-wrap: nowrap !important; }
  .product-stats > ul { flex: 1 1 0; min-width: 0; }
  .product-stats li { flex-wrap: wrap; overflow-wrap: anywhere; }
  .product-stats .brand-image { flex: 0 0 100px; max-width: 100px; }
  .product-stats .brand-image a { max-width: 100px; text-align: center; margin-top: 0 !important; }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .main-products.product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
