/* V44 - late loaded mobile fixes for Journal pages */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

img,
picture,
video,
canvas,
svg,
iframe,
embed,
object {
  max-width: 100%;
}

img,
picture,
video,
canvas,
svg {
  height: auto;
}

@media (max-width: 767px) {
  html.mobile body {
    overflow-x: hidden !important;
  }

  html.mobile .site-wrapper > .container,
  html.mobile #content,
  html.mobile .container,
  html.mobile .container-fluid {
    max-width: 100% !important;
    min-width: 0 !important;
  }

  html.mobile h1,
  html.mobile .h1,
  html.mobile .title.page-title {
    font-size: clamp(24px, 6.5vw, 32px) !important;
    line-height: 1.14 !important;
    letter-spacing: 0 !important;
    overflow-wrap: anywhere !important;
  }

  html.mobile h2,
  html.mobile .h2 {
    font-size: clamp(20px, 5.3vw, 26px) !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    overflow-wrap: anywhere !important;
  }

  html.mobile h3,
  html.mobile .h3 {
    font-size: clamp(17px, 4.8vw, 21px) !important;
    line-height: 1.25 !important;
    letter-spacing: 0 !important;
    overflow-wrap: anywhere !important;
  }

  html.mobile p,
  html.mobile li,
  html.mobile td,
  html.mobile th,
  html.mobile .description,
  html.mobile .caption,
  html.mobile .name {
    overflow-wrap: anywhere !important;
  }

  html.mobile .breadcrumb,
  html.mobile .breadcrumbs {
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    white-space: nowrap !important;
    -webkit-overflow-scrolling: touch;
  }

  html.mobile .breadcrumb > li {
    word-break: normal !important;
    white-space: nowrap !important;
  }

  html.mobile table {
    max-width: 100% !important;
  }

  html.mobile .table-responsive,
  html.mobile .table-scroll {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  html.mobile input,
  html.mobile select,
  html.mobile textarea,
  html.mobile button {
    max-width: 100% !important;
  }
}

/* Compact Journal mobile header */
@media (max-width: 767px) {
  html.mobile .mobile-header {
    max-width: 100vw !important;
    overflow: hidden !important;
  }

  html.mobile .mobile-header > .grid-rows > .grid-row,
  html.mobile .mobile-header .grid-row {
    min-height: 0 !important;
  }

  html.mobile .mobile-header .grid-cols-wrapper,
  html.mobile .mobile-header .grid-cols,
  html.mobile .mobile-header .grid-col,
  html.mobile .mobile-header .grid-items,
  html.mobile .mobile-header .grid-item,
  html.mobile .mobile-header .module {
    min-width: 0 !important;
    min-height: 0 !important;
  }

  html.mobile .mobile-header .grid-item {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }

  html.mobile .mobile-header .j-logo,
  html.mobile .mobile-header .module-logo {
    min-height: 34px !important;
    max-height: 42px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  html.mobile .mobile-header .j-logo img,
  html.mobile .mobile-header .module-logo img,
  html.mobile .mobile-header .j-logo svg,
  html.mobile .mobile-header .module-logo svg {
    max-height: 34px !important;
    width: auto !important;
    object-fit: contain !important;
  }

  html.mobile .mobile-header .mobile-search,
  html.mobile .mobile-header .mobile-search-wrapper,
  html.mobile .mobile-header .header-search,
  html.mobile .mobile-header .search-wrapper,
  html.mobile .mobile-header .mini-search,
  html.mobile .mobile-header #search {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  html.mobile .mobile-header #search input,
  html.mobile .mobile-header .header-search input,
  html.mobile .mobile-header .search-input,
  html.mobile .mobile-header input[type="text"],
  html.mobile .mobile-header input[type="search"] {
    height: 42px !important;
    min-height: 42px !important;
    font-size: 16px !important;
    line-height: 42px !important;
  }

  html.mobile .mobile-header .search-button,
  html.mobile .mobile-header button[type="button"] {
    min-height: 42px !important;
  }

  html.mobile .mobile-header .cart-heading,
  html.mobile .mobile-header #cart > a,
  html.mobile .mobile-header [data-off-canvas],
  html.mobile .mobile-header .menu-trigger {
    min-height: 42px !important;
  }
}

/* Product page: real mobile layout, loaded after Journal style.min */
@media (max-width: 767px) {
  html.route-product-product.mobile .site-wrapper > .container {
    margin-top: 0 !important;
  }

  html.route-product-product.mobile .breadcrumbs {
    min-height: 34px !important;
    padding: 6px 10px !important;
    margin: 0 !important;
  }

  html.route-product-product.mobile .breadcrumb {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
    padding-bottom: 3px !important;
  }

  html.route-product-product.mobile .breadcrumb > li {
    flex: 0 0 auto !important;
    max-width: 72vw !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  html.route-product-product.mobile .site-wrapper > .page-title,
  html.route-product-product.mobile h1.page-title {
    margin: 0 !important;
    padding: 14px 12px 10px !important;
  }

  html.route-product-product.mobile .site-wrapper > .page-title .page-title-text,
  html.route-product-product.mobile h1.page-title .page-title-text,
  html.route-product-product.mobile h1.page-title {
    font-size: clamp(25px, 7vw, 34px) !important;
    line-height: 1.12 !important;
    letter-spacing: 0 !important;
  }

  html.route-product-product.mobile .site-wrapper > .page-title::after,
  html.route-product-product.mobile h1.page-title::after {
    margin-top: 10px !important;
  }

  html.route-product-product.mobile #content {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  html.route-product-product.mobile #product-product,
  html.route-product-product.mobile .product-info,
  html.route-product-product.mobile .product-left,
  html.route-product-product.mobile .product-left-wrapper,
  html.route-product-product.mobile .product-right,
  html.route-product-product.mobile .product-details,
  html.route-product-product.mobile .product-image {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  html.route-product-product.mobile .product-info {
    gap: 10px !important;
    margin-top: 0 !important;
  }

  html.route-product-product.mobile .product-left,
  html.route-product-product.mobile .product-left-wrapper,
  html.route-product-product.mobile .product-image {
    margin-bottom: 6px !important;
  }

  html.route-product-product.mobile .product-image .main-image,
  html.route-product-product.mobile .product-image .main-image .swiper-container,
  html.route-product-product.mobile .product-image .main-image .swiper-wrapper,
  html.route-product-product.mobile .product-image .main-image .swiper-slide {
    height: auto !important;
    min-height: 0 !important;
    max-height: 44vh !important;
  }

  html.route-product-product.mobile .product-image .main-image .swiper-slide {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  html.route-product-product.mobile .product-image .main-image img {
    width: auto !important;
    max-width: 100% !important;
    max-height: min(44vh, 340px) !important;
    object-fit: contain !important;
    margin: 0 auto !important;
  }

  html.route-product-product.mobile .product-image .product-label strong,
  html.route-product-product.mobile .product-labels .product-label strong {
    font-size: 12px !important;
    line-height: 1.1 !important;
    padding: 4px 8px !important;
  }

  html.route-product-product.mobile .additional-images,
  html.route-product-product.mobile .yektek-image-tools {
    display: none !important;
  }

  html.route-product-product.mobile .product-details > .title.page-title {
    display: none !important;
  }

  html.route-product-product.mobile .product-details .product-price-group.yek-has-installment {
    width: 100% !important;
    max-width: 100% !important;
    margin: 6px 0 7px !important;
  }

  html.route-product-product.mobile .product-details .product-price-group.yek-has-installment .yektek-installment-v7,
  html.route-product-product.mobile .list-unstyled.yek-has-installment .yektek-installment-v7 {
    width: 100% !important;
    min-height: 0 !important;
    padding: 9px 11px !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 18px rgba(215, 25, 32, .10) !important;
  }

  html.route-product-product.mobile .product-details .yektek-installment-v7 strong,
  html.route-product-product.mobile .list-unstyled.yek-has-installment .yektek-installment-v7 strong {
    font-size: clamp(23px, 6.1vw, 30px) !important;
    line-height: 1.04 !important;
  }

  html.route-product-product.mobile .yektek-installment-v7:after {
    font-size: 54px !important;
    right: 10px !important;
    bottom: -18px !important;
  }

  html.route-product-product.mobile .product-details .button-group-page {
    margin-top: 7px !important;
    padding-top: 8px !important;
    border-top: 1px solid #edf1f5 !important;
  }

  html.route-product-product.mobile .product-details .button-group-page .buttons-wrapper {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    width: 100% !important;
  }

  html.route-product-product.mobile .product-details .button-group-page .cart-group,
  html.route-product-product.mobile .product-details .button-group-page.yek-out-of-stock-actions .cart-group,
  html.route-product-product.mobile .product-details .button-group-page .cart-group:has(.yek-stock-request-open) {
    display: grid !important;
    grid-template-columns: minmax(88px, 104px) minmax(0, 1fr) !important;
    gap: 8px !important;
    align-items: center !important;
    width: 100% !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  html.route-product-product.mobile .product-details .button-group-page .cart-group .control-label {
    display: none !important;
  }

  html.route-product-product.mobile .product-details .button-group-page .cart-group .stepper {
    grid-column: 1 !important;
    width: 100% !important;
    max-width: 104px !important;
    height: 42px !important;
    min-height: 42px !important;
    border-radius: 999px !important;
  }

  html.route-product-product.mobile .product-info.out-of-stock .product-details .button-group-page .cart-group .stepper,
  html.route-product-product.mobile .product-details .button-group-page.yek-out-of-stock-actions .cart-group .stepper {
    opacity: .65 !important;
    pointer-events: none !important;
  }

  html.route-product-product.mobile .product-details .button-group-page .cart-group #button-cart,
  html.route-product-product.mobile .product-details .button-group-page .cart-group .yek-stock-watch-main,
  html.route-product-product.mobile .product-details .button-group-page .cart-group .yek-stock-request-open {
    grid-column: 2 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 42px !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 0 12px !important;
    border-radius: 999px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-size: 13px !important;
    line-height: 1.1 !important;
    pointer-events: auto !important;
  }

  html.route-product-product.mobile .product-details .button-group-page .cart-group .yek-stock-request-open .btn-text,
  html.route-product-product.mobile .product-details .button-group-page .cart-group #button-cart .btn-text {
    display: block !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html.route-product-product.mobile .product-details .button-group-page .extra-group {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 0 !important;
  }

  html.route-product-product.mobile .product-details .button-group-page .extra-group .btn-extra,
  html.route-product-product.mobile .product-details .button-group-page .extra-group .btn-extra.yek-extra-quickbuy,
  html.route-product-product.mobile .product-details .button-group-page .extra-group a.yek-extra-quickbuy,
  html.route-product-product.mobile .product-details .button-group-page .extra-group .yek-extra-whatsapp {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 10px !important;
    border-radius: 999px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    overflow: hidden !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  html.route-product-product.mobile .product-details .button-group-page .extra-group .btn-extra .btn-text,
  html.route-product-product.mobile .product-details .button-group-page .extra-group .yek-extra-quickbuy .btn-text,
  html.route-product-product.mobile .product-details .button-group-page .extra-group .yek-extra-whatsapp .btn-text {
    min-width: 0 !important;
    max-width: 100% !important;
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: 13px !important;
    line-height: 1.1 !important;
  }

  html.route-product-product.mobile .product-details .button-group-page .extra-group .yek-extra-quickbuy {
    background: #16a34a !important;
    border-color: #16a34a !important;
    color: #fff !important;
    box-shadow: 0 8px 18px rgba(22, 163, 74, .18) !important;
  }

  html.route-product-product.mobile .product-details .button-group-page.yek-out-of-stock-actions .extra-group .yek-extra-quickbuy,
  html.route-product-product.mobile .product-details .button-group-page .extra-group .yek-extra-quickbuy.yek-quickbuy-disabled,
  html.route-product-product.mobile .product-details .button-group-page .extra-group .yek-quickbuy-disabled {
    background: #30343a !important;
    border-color: #30343a !important;
    color: #fff !important;
    opacity: .9 !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
  }

  html.route-product-product.mobile .product-details .button-group-page .extra-group .yek-extra-whatsapp {
    background: #07111f !important;
    border: 1px solid #07111f !important;
    color: #22c55e !important;
    box-shadow: none !important;
  }
}

@media (max-width: 390px) {
  html.route-product-product.mobile .product-details .button-group-page .cart-group,
  html.route-product-product.mobile .product-details .button-group-page.yek-out-of-stock-actions .cart-group,
  html.route-product-product.mobile .product-details .button-group-page .cart-group:has(.yek-stock-request-open) {
    grid-template-columns: minmax(78px, 94px) minmax(0, 1fr) !important;
    gap: 7px !important;
  }

  html.route-product-product.mobile .product-details .button-group-page .cart-group .stepper {
    max-width: 94px !important;
  }

  html.route-product-product.mobile .product-details .button-group-page .extra-group {
    gap: 7px !important;
  }

  html.route-product-product.mobile .product-details .button-group-page .extra-group .btn-extra,
  html.route-product-product.mobile .product-details .button-group-page .cart-group #button-cart,
  html.route-product-product.mobile .product-details .button-group-page .cart-group .yek-stock-request-open {
    font-size: 12px !important;
  }
}

/* Dynamic utility pages and generated product cards */
@media (max-width: 767px) {
  html.mobile .yek-page {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  html.mobile .yek-hero,
  html.mobile .yek-section,
  html.mobile .yek-dark-band,
  html.mobile .yek-products-block,
  html.mobile .yek-review {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    border-radius: 10px !important;
    padding: 14px !important;
  }

  html.mobile .yek-tool-grid,
  html.mobile .yek-guide-grid,
  html.mobile .yek-trust-grid,
  html.mobile .yek-product-grid,
  html.mobile .yek-link-grid,
  html.mobile .yek-search-row {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  html.mobile .yek-tool-card,
  html.mobile .yek-trust-card,
  html.mobile .yek-guide-card,
  html.mobile .yek-link-card,
  html.mobile .yek-product-card {
    min-width: 0 !important;
    border-radius: 10px !important;
    padding: 14px !important;
  }

  html.mobile .yek-tool-top {
    gap: 10px !important;
    align-items: flex-start !important;
  }

  html.mobile .yek-tool-icon,
  html.mobile .yek-tool-card .yek-tool-top > span:first-child:not(:has(svg)) {
    width: 44px !important;
    height: 44px !important;
    flex: 0 0 44px !important;
    border-radius: 10px !important;
  }

  html.mobile .yek-actions,
  html.mobile .yek-tool-card .yek-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    width: 100% !important;
  }

  html.mobile .yek-btn,
  html.mobile .yek-page .yek-btn,
  html.mobile .yek-page button.yek-btn {
    width: 100% !important;
    min-height: 42px !important;
    padding: 10px 12px !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    white-space: normal !important;
  }

  html.mobile .main-products.product-grid .product-layout:not(.swiper-slide),
  html.mobile .one-column #content .main-products.product-grid .product-layout:not(.swiper-slide),
  html.mobile .two-column #content .main-products.product-grid .product-layout:not(.swiper-slide) {
    padding: 6px !important;
    width: 100% !important;
  }

  html.mobile .product-thumb,
  html.mobile .product-layout,
  html.mobile .main-products,
  html.mobile .module-products {
    min-width: 0 !important;
  }

  html.mobile .main-products-style.product-grid .product-thumb .name a,
  html.mobile .main-products-style.product-list .product-thumb .name a {
    font-size: 14px !important;
    line-height: 1.3 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden !important;
  }

  html.mobile .main-products-style.product-grid .product-thumb .price,
  html.mobile .main-products-style.product-list .product-thumb .price {
    font-size: 15px !important;
    line-height: 1.1 !important;
  }
}