/* LDstyle: product materials pilot. No global typography or catalogue changes. */
.ld-pm { margin: 20px 0 28px; padding: 18px; border: 1px solid #DED7C9; border-radius: 10px; background: #fff; color: #333; font-family: 'Open Sans', sans-serif; scroll-margin-top: 150px; }
.ld-pm *, .ld-pm *::before, .ld-pm *::after { box-sizing: border-box; }
.ld-pm [hidden] { display: none !important; }
.ld-pm-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 15px; }
.ld-pm .ld-pm-header h2 { margin: 0; color: #333; text-align: left; font-size: 24px; font-weight: 700; line-height: 1.3; }
.ld-pm-product { margin: 5px 0 0; font-size: 13px; line-height: 1.4; color: #59564D; }
.ld-pm-total { flex: none; color: #59564D; font-size: 13px; line-height: 1.4; }
.ld-pm button { font-family: inherit; }
.ld-pm-button, .ld-pm .ld-material-filter-reset { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 14px; border: 1px solid #5B7229; border-radius: 5px; background: #F5F1E8; color: #5B7229; font-size: 14px; font-weight: 700; font-style: normal; line-height: 1.4; text-align: center; text-transform: uppercase; white-space: normal; transition: background-color 180ms, color 180ms, border-color 180ms; }
.ld-pm-primary { background: #5B7229; color: #fff; }
.ld-pm-button:hover, .ld-pm-button:active, .ld-pm .ld-material-filter-reset:not(:disabled):hover, .ld-pm .ld-material-filter-reset:not(:disabled):active { background: #FFC754; color: #333; border-color: #FFC754; }
.ld-pm-button:focus-visible, .ld-pm-close:focus-visible, .ld-pm-back:focus-visible, .ld-pm .material_block:focus-visible, .ld-pm-preview-card:focus-visible, .ld-pm .icon_link:focus-visible { outline: 2px solid #5B7229; outline-offset: 3px; }
.ld-pm .ld-material-filter-reset:disabled { opacity: .5; cursor: default; }
.ld-pm-close, .ld-pm-preview, .ld-pm-show-all, .ld-pm-filter-toggle, .ld-pm-filter-footer { display: none; }
.ld-pm-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; min-height: 44px; gap: 10px; margin-bottom: 12px; }
.ld-pm-native-status { display: contents; }
.ld-pm .ld-material-filter-status { display: contents; }
.ld-pm .ld-material-filter-reset { grid-column: 3; grid-row: 1; }
.ld-pm .ld-material-filter-count { grid-column: 2; grid-row: 1; min-width: 0; font-size: 14px; color: #59564D; white-space: nowrap; }
.ld-pm-selection { grid-column: 1; grid-row: 1; min-width: 0; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; line-height: 18px; color: #59564D; }
.ld-pm-body { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 18px; }
.ld-pm.is-enhanced .ld-pm-body { height: 560px; height: min(580px, calc(100dvh - 220px)); min-height: 360px; }
.ld-pm.has-no-filters .ld-pm-body { grid-template-columns: minmax(0, 1fr); }
.ld-pm.is-compact .ld-pm-body { height: auto; min-height: 0; }
.ld-pm-filters { min-width: 0; padding: 14px; border: 1px solid #DED7C9; border-radius: 10px; background: #F5F1E8; }
.ld-pm.is-enhanced .ld-pm-filters { overflow-y: auto; }
.ld-pm #filtersBlock { display: block !important; height: auto !important; margin: 0; padding: 0; }
.ld-pm #filtersBlock .filters_container { display: block; width: 100%; margin: 0; padding: 0; border: 0; background: transparent; }
.ld-pm #filtersBlock .filter_block { float: none; width: 100%; min-height: 0; height: auto; margin: 0 0 18px; padding: 0; border: 0; }
.ld-pm #filtersBlock .filter_block:last-child { margin-bottom: 0; }
.ld-pm #filtersBlock h5 { margin: 0 0 10px; padding: 0; color: #333; font-size: 14px; font-weight: 700; line-height: 1.35; text-transform: uppercase; }
.ld-pm .filter_block.ld-pm-color-group { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.ld-pm .ld-pm-color-group h5 { grid-column: 1 / -1; margin-bottom: 2px !important; }
.ld-pm #filtersBlock .icon_link { float: none; display: flex; align-items: center; justify-content: flex-start; width: 100%; min-height: 38px; height: auto; margin: 0 0 6px; padding: 6px 2px; gap: 8px; border: 1px solid transparent; border-radius: 5px; color: #333; text-decoration: none; background: transparent; cursor: pointer; }
.ld-pm #filtersBlock .icon_link.ld-pm-color-link { justify-content: center; width: 34px; height: 34px; min-height: 34px; margin: 0; padding: 2px; border-radius: 50%; }
.ld-pm #filtersBlock .color_filter { display: block; width: 26px; height: 26px; margin: 0; border: 1px solid #BDB8AD; border-radius: 50%; }
.ld-pm #filtersBlock .icon_link.bordered { border-color: #5B7229; box-shadow: 0 0 0 1px #5B7229; }
.ld-pm #filtersBlock .icon_link > img { flex: none; width: 22px; height: 22px; margin: 0; object-fit: contain; }
.ld-pm-filter-label { font-size: 13px; line-height: 1.4; font-weight: 400; }
.ld-pm #filtersBlock .checkbox { margin: 8px 0; font-size: 13px; line-height: 1.4; }
.ld-pm #filtersBlock input { accent-color: #5B7229; }
.ld-pm-grid-scroll { min-width: 0; min-height: 0; }
.ld-pm.is-enhanced .ld-pm-grid-scroll { overflow-y: auto; padding: 2px 8px 4px 2px; scrollbar-gutter: stable; }
.ld-pm.is-compact .ld-pm-grid-scroll { overflow: visible; padding: 2px 0 4px; scrollbar-gutter: auto; }
.ld-pm .materials_container { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); align-items: start; gap: 14px 9px; width: 100%; margin: 0; padding: 0; }
.ld-pm .materials_container > .material_block { float: none; width: auto; min-width: 0; margin: 0; padding: 0; border: 0; background: transparent; cursor: pointer; }
.ld-pm .material_block > picture, .ld-pm-preview-card > picture { position: relative; display: block; width: 100%; aspect-ratio: 1; overflow: hidden; border-radius: 5px; }
.ld-pm .material_block > picture > img, .ld-pm-preview-card > picture > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ld-pm .material_block .mat_name, .ld-pm-preview-card .mat_name { display: flex; align-items: flex-start; justify-content: center; width: 100%; min-height: 28px; height: auto; margin: 6px 0 0; color: #333; font-size: 11px; font-weight: 700; font-style: normal; line-height: 14px; text-align: center; text-transform: uppercase; text-decoration: none; }
.ld-pm .material_block .mat_cut, .ld-pm-preview-card .mat_cut { display: none; }
.ld-pm .material_block.is-selected > picture { outline: 2px solid #5B7229; outline-offset: -2px; }
@media (hover: hover) { .ld-pm .material_block:hover > picture, .ld-pm-preview-card:hover > picture { outline: 2px solid #5B7229; outline-offset: -2px; } }
.ld-pm .material_block:active > picture, .ld-pm-preview-card:active > picture { outline: 2px solid #5B7229; outline-offset: -2px; }
.ld-pm.is-enhanced .material_info { display: none !important; }
.ld-pm:not(.is-enhanced) .material_info { grid-column: 1 / -1; }
.ld-pm .alert_mat { margin: 0 0 12px; }
.ld-pm-back { display: inline-flex; align-items: center; min-height: 42px; margin: 0 0 10px; padding: 8px 0; border: 0; color: #5B7229; background: transparent; font-size: 14px; font-weight: 700; line-height: 1.4; text-align: left; }
.ld-pm-back:hover, .ld-pm.is-open .ld-pm-close:hover { background: #FFC754; color: #333; }
.ld-pm-detail { max-height: 600px; overflow-y: auto; padding: 5px 8px 5px 0; }
.ld-pm .ld-pm-detail .material_info_content { width: 100%; margin: 0; padding: 0; border: 0; background: #fff; }
.ld-pm .ld-pm-detail .material_info_content > .row { margin-left: 0; margin-right: 0; }
.ld-pm .ld-pm-detail .param_info_img { display: block; max-width: 100%; width: 100%; height: auto; margin: 0 0 15px; border-radius: 9px; }
.ld-pm .ld-pm-detail .param_info_table { width: 100%; margin-top: 12px; font-size: 14px; line-height: 1.45; }
.ld-pm .ld-pm-detail .param_info_table td { overflow-wrap: break-word; }
.ld-pm .ld-pm-detail .param_info_icon { width: 44px; height: 44px; object-fit: contain; margin: 0 5px 6px 0; padding: 4px; border: 0; border-radius: 50%; background: #F5F1E8; }
.ld-pm .ld-pm-detail .param_info_table .param_info_icon { width: 24px; height: auto; padding: 0; border: 0; }
.ld-pm .ld-pm-detail .param_icon_name { display: none; }
.ld-pm .ld-material-actions { margin: 15px 0; }
/* Photo reuses the picker shell; fitted view has no nested scroll area. */
.ld-pm.is-photo { position: fixed; z-index: 1045; inset: 0; display: flex; flex-direction: column; width: 100%; height: 100%; height: 100dvh; margin: 0; padding: 18px; border: 0; border-radius: 0; overflow: hidden; background: #fff; }
.ld-pm.is-photo > .ld-pm-header, .ld-pm.is-photo .ld-pm-toolbar, .ld-pm.is-photo .ld-pm-back, .ld-pm.is-photo .ld-pm-preview, .ld-pm.is-photo .ld-pm-show-all { display: none; }
.ld-pm.is-photo .ld-pm-catalog { display: flex; flex: 1; flex-direction: column; min-height: 0; }
.ld-pm-photo { display: flex; flex: 1; flex-direction: column; min-height: 0; overflow: hidden; }
.ld-pm-photo-toolbar { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 12px; flex: none; padding-bottom: 12px; }
.ld-pm-photo-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 16px; font-weight: 700; color: #333; }
.ld-pm-photo-toolbar .ld-pm-button { min-width: 44px; min-height: 44px; cursor: pointer; }
.ld-pm-photo-toolbar .ld-pm-photo-close { width: 44px; padding: 0; font-size: 30px; font-weight: 400; }
.ld-pm-photo-toolbar button:disabled { opacity: .5; cursor: default; }
.ld-pm-photo-stage { position: relative; flex: 1; min-width: 0; min-height: 0; overflow: hidden; border: 1px solid #DED7C9; border-radius: 10px; background: #F5F1E8; touch-action: none; }
.ld-pm-photo-stage.is-zoomed { cursor: grab; }
.ld-pm-photo-stage.is-dragging { cursor: grabbing; }
.ld-pm-photo-stage:focus-visible { outline: 2px solid #5B7229; outline-offset: 2px; }
.ld-pm-photo .ld-pm-photo-image { position: absolute; display: block; max-width: none; max-height: none; margin: 0; user-select: none; -webkit-user-select: none; }
.ld-pm-photo-status { position: absolute; inset: 0; display: grid; place-items: center; margin: 0; padding: 20px; text-align: center; color: #59564D; font-size: 16px; line-height: 1.55; }
.ld-pm-message { margin: 10px 0; font-size: 16px; color: #59564D; }
@media (min-width: 768px) and (max-width: 991px) {
    .ld-pm-body { grid-template-columns: 190px minmax(0, 1fr); gap: 14px; }
    .ld-pm .materials_container { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    .ld-pm { padding: 15px; margin: 18px 0 24px; }
    .ld-pm .ld-pm-header h2 { font-size: 22px; }
    .ld-pm-product { font-size: 12px; }
    .ld-pm-total { font-size: 12px; }
    .ld-pm.is-enhanced:not(.is-open) .ld-pm-catalog { display: none; }
    .ld-pm.is-enhanced .ld-pm-preview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px 8px; }
    .ld-pm-preview-card { min-width: 0; margin: 0; padding: 0; border: 0; color: #333; background: transparent; cursor: pointer; }
    .ld-pm-preview-card picture[data-material-code]::after { content: attr(data-material-code); position: absolute; right: 0; bottom: 0; padding: 2px 6px; border-radius: 5px 0 5px 0; background: rgba(255,255,255,.35); color: #333; font-size: 11px; font-weight: 400; font-style: normal; line-height: 15px; white-space: nowrap; pointer-events: none; }
    .ld-pm.is-enhanced .ld-pm-show-all { display: flex; width: 100%; margin-top: 12px; min-height: 48px; font-size: 16px; }
    .ld-pm.is-open { position: fixed; z-index: 1045; inset: 0; display: flex; flex-direction: column; width: 100%; height: 100%; height: 100dvh; margin: 0; padding: 14px 15px max(14px, env(safe-area-inset-bottom)); border: 0; border-radius: 0; overflow: hidden; background: #fff; }
    .ld-pm.is-open .ld-pm-header { flex: none; align-items: flex-start; gap: 10px; margin-bottom: 12px; }
    .ld-pm.is-open .ld-pm-header > div { min-width: 0; flex: 1; }
    .ld-pm.is-open .ld-pm-total { display: none; }
    .ld-pm.is-open .ld-pm-close { display: grid; place-items: center; flex: none; width: 44px; height: 44px; padding: 0; border: 1px solid #DED7C9; border-radius: 5px; background: #F5F1E8; color: #5B7229; font-size: 30px; line-height: 1; }
    .ld-pm.is-open .ld-pm-preview, .ld-pm.is-open .ld-pm-show-all { display: none; }
    .ld-pm.is-open .ld-pm-catalog { display: flex; flex: 1; flex-direction: column; min-height: 0; }
    .ld-pm.is-open .ld-pm-toolbar { flex: none; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; margin-bottom: 10px; }
    .ld-pm .ld-pm-selection { display: none !important; }
    .ld-pm.is-open .ld-pm-filter-toggle { display: inline-flex; grid-column: 1; grid-row: 1; gap: 6px; font-size: 13px; }
    .ld-pm [data-pm-active] { min-width: 18px; padding: 1px 4px; border-radius: 4px; background: #5B7229; color: #fff; font-size: 11px; }
    .ld-pm .ld-material-filter-count { font-size: 11px; line-height: 14px; white-space: normal; text-align: center; }
    .ld-pm .ld-material-filter-reset { padding: 7px 8px; min-height: 36px; font-size: 11px; }
    .ld-pm.is-open .ld-pm-body { display: block; flex: 1; min-height: 0; height: auto; }
    .ld-pm.is-open .ld-pm-filters { display: none; }
    .ld-pm.is-open .ld-pm-grid-scroll { height: 100%; padding: 2px 4px 4px 2px; overflow-y: auto; overscroll-behavior-y: contain; }
    .ld-pm .materials_container { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px 8px; }
    .ld-pm.is-open.is-filters .ld-pm-filters { display: block; width: 100%; height: 100%; overflow-y: auto; overscroll-behavior-y: contain; }
    .ld-pm.is-open.is-filters .ld-pm-grid-scroll { display: none; }
    .ld-pm.is-open.is-filters .ld-pm-filter-toggle { display: none; }
    .ld-pm.is-open.is-filters .ld-pm-filter-footer { display: block; flex: none; padding-top: 12px; }
    .ld-pm-filter-footer .ld-pm-button { width: 100%; min-height: 48px; font-size: 15px; }
    .ld-pm #filtersBlock .icon_link.ld-pm-color-link { width: 44px; height: 44px; }
    .ld-pm #filtersBlock .color_filter { width: 28px; height: 28px; }
    .ld-pm .filter_block.ld-pm-color-group { grid-template-columns: repeat(4, 1fr); max-width: 270px; }
    .ld-pm #filtersBlock .icon_link:not(.ld-pm-color-link) { min-height: 44px; }
    .ld-pm-filter-label { font-size: 14px; }
    .ld-pm.is-open .ld-pm-detail { flex: 1; min-height: 0; max-height: none; overflow-y: auto; overscroll-behavior-y: contain; }
    .ld-pm-photo-toolbar { grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; }
    .ld-pm-photo-title { grid-column: 1 / 3; grid-row: 1; font-size: 14px; }
    .ld-pm-photo-close { grid-column: 3; grid-row: 1; }
    .ld-pm-photo-back { grid-column: 1; grid-row: 2; justify-self: start; }
    .ld-pm-photo-zoom { grid-column: 2 / 4; grid-row: 2; justify-self: end; }
    .ld-pm.is-photo .ld-pm-toolbar { display: none; }
    .ld-pm.is-photo .ld-pm-photo { overflow: hidden; }
    .ld-pm .ld-pm-detail .param_info_img { max-width: 280px; margin: 0 auto 15px; }
    .ld-pm .ld-pm-detail .param_info_table { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) { .ld-pm-button { transition: none; } }