.product-design-preview {
    --preview-ink: #172033;
    --preview-muted: #6b7280;
    --preview-line: #e7e9ee;
    --preview-paper: #fff;
    --preview-soft: #f6f7f9;
    --preview-accent: #ee0000;
    --preview-accent-dark: #bd0000;
    --preview-blue: #ee0000;
    color: var(--preview-ink);
    margin: 26px 0 72px;
}

.product-design-preview *,
.product-design-preview *::before,
.product-design-preview *::after { box-sizing: border-box; }

.product-design-preview button { font-family: inherit; }
.product-design-preview .preview-icon { width: 21px; height: 21px; flex: 0 0 auto; }

.preview-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    color: #7a8291;
    font-size: 14px;
    white-space: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
}
.preview-breadcrumb::-webkit-scrollbar { display: none; }
.preview-breadcrumb a { color: #525b6c; }
.preview-breadcrumb .preview-icon { width: 14px; height: 14px; }

.preview-lab-banner {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    overflow: hidden;
    margin-bottom: 18px;
    padding: 14px 18px;
    border: 1px solid #dce3ff;
    border-radius: 18px;
    background: linear-gradient(105deg, #f3f6ff, #fff8f4);
}
.preview-lab-banner::after {
    content: "";
    position: absolute;
    left: 8%;
    top: -36px;
    width: 100px;
    height: 100px;
    border-radius: 999px;
    background: rgba(238, 0, 0, .08);
}
.preview-lab-copy { display: flex; align-items: center; gap: 12px; position: relative; z-index: 1; }
.preview-lab-copy > span {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 13px;
    background: var(--preview-blue);
    color: #fff;
    box-shadow: 0 9px 24px rgba(238, 0, 0, .22);
}
.preview-lab-copy strong { display: block; font-size: 14px; }
.preview-lab-copy small { display: block; margin-top: 2px; color: #727a8a; }
.preview-lab-link {
    position: relative;
    z-index: 1;
    color: var(--preview-blue) !important;
    font-size: 14px;
    font-weight: 700;
}

.preview-masthead {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: end;
    gap: 24px;
    margin: 26px 0 24px;
}
.preview-eyebrow {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 9px;
    color: var(--preview-accent-dark);
    font-size: 14px;
    font-weight: 800;
}
.preview-eyebrow::before { content: ""; width: 22px; height: 3px; border-radius: 9px; background: var(--preview-accent); }
.preview-masthead h1 {
    max-width: 840px;
    margin: 0;
    font-size: clamp(24px, 3vw, 38px);
    line-height: 1.55;
    letter-spacing: -.035em;
}
.preview-product-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 13px; }
.preview-meta-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border: 1px solid var(--preview-line);
    border-radius: 999px;
    background: #fff;
    color: #626a79;
    font-size: 14px;
}
.preview-meta-chip .preview-icon { width: 14px; height: 14px; color: #858d9c; }
.preview-title-actions { display: flex; gap: 8px; }
.preview-icon-button {
    display: grid !important;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0 !important;
    border: 1px solid var(--preview-line) !important;
    border-radius: 14px !important;
    background: #fff !important;
    color: #5e6674 !important;
    box-shadow: 0 7px 20px rgba(23, 32, 51, .05) !important;
}
.preview-icon-button:hover,
.preview-icon-button.is-active { color: var(--preview-accent) !important; border-color: #ffcabe !important; transform: translateY(-2px); }
.preview-icon-button.is-active .preview-icon { fill: currentColor; }

.preview-command-grid {
    display: grid;
    grid-template-columns: minmax(280px, 1.02fr) minmax(330px, 1.18fr) minmax(270px, .8fr);
    gap: 18px;
    align-items: start;
}
.preview-panel {
    border: 1px solid var(--preview-line);
    border-radius: 24px;
    background: var(--preview-paper);
    box-shadow: 0 15px 42px rgba(24, 35, 58, .055);
}

.preview-gallery {
    height: 100%;
    position: relative;
    padding: 40px 30px;
    overflow: visible;
}
.preview-gallery-stage {
    position: relative;
    display: grid;
    place-items: center;
    min-height: 390px;
    overflow: hidden;
    border-radius: 19px;
    background:
        radial-gradient(circle at 50% 38%, rgba(255,255,255,.96) 0 20%, rgba(255,255,255,0) 58%),
        linear-gradient(145deg, #f3f5f8, #ebeef3);
}
.preview-gallery-stage::after {
    content: "";
    position: absolute;
    bottom: 34px;
    width: 58%;
    height: 18px;
    border-radius: 50%;
    background: rgba(38, 47, 68, .12);
    filter: blur(12px);
}
.preview-gallery-stage img {
    position: relative;
    z-index: 1;
    width: 86%;
    max-height: 360px;
    object-fit: contain;
    mix-blend-mode: multiply;
    transition: transform .35s ease;
}
.preview-gallery-stage:hover img { transform: scale(1.035); }
.preview-gallery-empty { position: relative; z-index: 1; color: #9098a6; text-align: center; }
.preview-gallery-empty .preview-icon { width: 54px; height: 54px; display: block; margin: 0 auto 10px; }
.preview-zoom-button { position: absolute; z-index: 2; left: 13px; bottom: 13px; }
.preview-image-badge {
    position: absolute;
    z-index: 2;
    top: 13px;
    right: 13px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(255,255,255,.86);
    color: #4c5565;
    font-size: 14px;
    font-weight: 700;
    backdrop-filter: blur(8px);
}
.preview-compliance-corner { position:absolute;z-index:5;top:3px;right:-1px;display:inline-flex!important;align-items:flex-start;gap:8px;width:auto!important;height:104px;min-height:104px!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;color:var(--preview-accent)!important;box-shadow:none!important;overflow:visible }
.preview-compliance-corner:hover { background:transparent!important;color:#cf0000!important;transform:translateY(-1px);box-shadow:none!important }
.preview-compliance-corner img { width:80px;height:88px;flex:0 0 80px;margin:0;object-fit:contain;filter:drop-shadow(0 6px 8px rgba(49,34,19,.2)) }
.preview-compliance-corner .preview-icon { width:70px;height:70px;flex:0 0 70px;margin:0 5px 7px;color:#d39b00;filter:drop-shadow(0 6px 8px rgba(49,34,19,.18)) }
.preview-compliance-corner span { display:inline-flex;align-items:center;margin-top:21px;margin-right:-25px;padding:7px 12px;border:1px solid #ffe1e1;border-radius:999px;background:#fff;color:inherit;font-size:14px;font-weight:900;line-height:1.4;white-space:nowrap;box-shadow:0 5px 16px rgba(238,0,0,.08) }

.preview-configurator { padding: 18px; }
.preview-level-row {
    display: grid;
    grid-template-columns: minmax(140px, .8fr) minmax(210px, 1.2fr);
    align-items: center;
    gap: 18px;
}
.preview-level-row label {
    margin: 0;
    color: #384359;
    font-size: 14px;
    font-weight: 800;
}
.preview-level-row select {
    min-height: 48px;
    margin: 0;
    padding: 10px 14px;
    border: 1px solid #cfd8e8;
    border-radius: 13px;
    background-color: #fff;
    color: #273247;
    font-size: 14px;
    font-weight: 600;
    box-shadow: none;
}
.preview-level-row select:focus {
    border-color: #f58c8c;
    box-shadow: 0 0 0 3px rgba(49,94,251,.09);
}
.preview-level-row .select2-container { width: 100% !important; min-width: 0; }
.preview-level-row .select2-container--default .select2-selection--single {
    height: auto;
    min-height: 48px;
    border: 1px solid #cfd8e8;
    border-radius: 13px;
    background: #fff;
    font: inherit;
    box-shadow: none;
}
.preview-level-row .select2-container--default.select2-container--focus .select2-selection--single,
.preview-level-row .select2-container--default.select2-container--open .select2-selection--single {
    border-color: #f58c8c;
    box-shadow: 0 0 0 3px rgba(238,0,0,.08);
}
.preview-level-row .select2-container--default .select2-selection--single .select2-selection__rendered {
    display: flex;
    align-items: center;
    min-height: 46px;
    padding-right: 14px;
    padding-left: 40px;
    overflow: visible;
    color: #273247;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.8;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
}
.preview-level-row .select2-container--default .select2-selection--single .select2-selection__arrow {
    right: auto;
    left: 11px;
    width: 24px;
    height: 46px;
}
.select2-container--open .select2-dropdown {
    direction: rtl;
    overflow: hidden;
    border-color: #cfd8e8;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 16px 38px rgba(23,32,51,.14);
    font-family: Vazirmatn,Tahoma,Arial,sans-serif;
    text-align: right;
}
.select2-container--open .select2-search--dropdown { padding: 9px; }
.select2-container--open .select2-search--dropdown .select2-search__field {
    min-height: 42px;
    padding: 8px 11px;
    direction: rtl;
    border: 1px solid #d7deea;
    border-radius: 9px;
    font: inherit;
}
.select2-container--open .select2-results__option { padding: 9px 12px; font-size: 14px; line-height: 1.8; }
.select2-container--default .select2-results__option--highlighted[aria-selected] { background: #ee0000; color: #fff; }
.preview-level-help {
    margin: 13px 0 15px;
    color: #71809a;
    font-size: 14px;
    line-height: 2;
}
.preview-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.preview-section-heading h2 { margin: 0; font-size: 17px; }
.preview-step { color: #9aa1ae; font-size: 14px; font-weight: 700; }
.preview-kit-intro { margin: -8px 0 15px; color: #858d9b; font-size: 14px; line-height: 1.9; }
.preview-kits-wrap {
    max-height: 390px;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 4px 14px 0;
    border-radius: 14px;
    background: #f7f9fc;
    scrollbar-color: #9299a5 transparent;
    scrollbar-width: auto;
}
.preview-kits-wrap::-webkit-scrollbar { width: 9px; }
.preview-kits-wrap::-webkit-scrollbar-track { background: transparent; }
.preview-kits-wrap::-webkit-scrollbar-thumb { border-radius: 99px; background: #9299a5; }
.preview-kit-panel[hidden] { display: none !important; }
.preview-kit-group {
    margin: 0;
    padding: 14px 0 18px;
    border: 0;
    border-bottom: 1px solid #dfe5ee;
}
.preview-kit-group:last-child { border-bottom: 0; }
.preview-kit-group legend {
    width: 100%;
    margin: 0 0 10px;
    padding: 0;
    color: #3b465b;
    font-size: 14px;
    font-weight: 900;
}
.preview-kit-options { display: grid; grid-template-columns: 1fr; gap: 8px; }
.preview-kit-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
    min-height: 47px;
    margin: 0;
    padding: 9px 12px;
    border: 1px solid #d9e1ed;
    border-radius: 11px;
    background: #fff;
    color: #465166;
    cursor: pointer;
    transition: border-color .18s, background-color .18s, box-shadow .18s;
}
.preview-kit-card:hover { border-color: #b9c6da; background: #fff; }
.preview-kit-card:has(input:checked) {
    border-color: #f28d8d;
    background: #fff7f7;
    box-shadow: 0 0 0 2px rgba(49,94,251,.06);
}
.preview-kit-card input {
    width: 15px;
    height: 15px;
    margin: 0;
    accent-color: var(--preview-blue);
    cursor: pointer;
}
.preview-kit-card strong {
    font-size: 14px;
    font-weight: 800;
    line-height: 1.7;
    white-space: normal;
    overflow-wrap: anywhere;
}
.preview-kit-card small {
    color: #ee0000;
    font-size: 14px;
    font-weight: 800;
    white-space: nowrap;
}
.preview-empty-kits { padding: 18px; border-radius: 12px; color: #8b92a0; font-size: 14px; text-align: center; }
.preview-order-card { position: sticky; top: 104px; overflow: hidden; }
.preview-seller { display: flex; align-items: center; gap: 11px; padding: 17px 18px; border-bottom: 1px solid var(--preview-line); }
.preview-seller-avatar { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 14px; background: #eff2f6; color: #697283; font-weight: 900; }
.preview-seller-copy { min-width: 0; flex: 1; }
.preview-seller-copy small { display: block; color: #9aa1ae; font-size: 14px; }
.preview-seller-copy strong { display: block; margin-top: 1px; color: #333c4c; font-size: 14px; line-height: 1.7; white-space: normal; overflow-wrap: anywhere; }
.preview-status-dot { width: 8px; height: 8px; border-radius: 50%; background: #21b77a; box-shadow: 0 0 0 4px #e5f8f0; }
.preview-order-body { padding: 20px; }
.preview-order-label { color: #8b93a0; font-size: 14px; }
.preview-total-price { display: flex; align-items: baseline; gap: 6px; margin: 4px 0 17px; color: #172033; }
.preview-total-price strong { font-size: clamp(24px, 2.4vw, 31px); letter-spacing: -.04em; }
.preview-total-price span { color: #6d7583; font-size: 14px; font-weight: 700; }
.preview-order-lines { display: grid; gap: 9px; padding: 13px 0; border-top: 1px solid var(--preview-line); border-bottom: 1px solid var(--preview-line); }
.preview-order-line { display: flex; justify-content: space-between; gap: 12px; color: #777f8d; font-size: 14px; }
.preview-order-line strong { max-width: 62%; overflow: hidden; color: #3b4454; text-overflow: ellipsis; white-space: nowrap; }
.preview-quantity-row { display: flex; align-items: center; justify-content: space-between; margin: 16px 0; }
.preview-quantity-row > span { color: #717987; font-size: 14px; }
.preview-pack-option { display: flex; align-items: center; gap: 10px; margin: 0 0 14px; padding: 11px 12px; border: 1px solid #e7ebf1; border-radius: 12px; background: #f8fafc; cursor: pointer; }
.preview-pack-option input { width: 17px; height: 17px; min-height: auto; margin: 0; padding: 0; accent-color: var(--preview-accent); }
.preview-pack-option span { display: grid; gap: 2px; }
.preview-pack-option strong { color: #3b4454; font-size: 14px; }
.preview-pack-option small { color: #8a93a2; font-size: 14px; line-height: 1.7; }
.preview-pack-option:has(input:checked) { border-color: #fecaca; background: #fff7f7; }
.preview-stepper { display: grid; grid-template-columns: 32px 34px 32px; align-items: center; height: 34px; border: 1px solid var(--preview-line); border-radius: 11px; }
.preview-stepper button { width: 32px; height: 32px; padding: 0 !important; border: 0 !important; background: transparent !important; color: #566071 !important; box-shadow: none !important; }
.preview-stepper output { text-align: center; font-weight: 800; }
.preview-buy-button {
    width: 100%;
    min-height: 52px;
    gap: 9px;
    border: 0 !important;
    border-radius: 15px !important;
    background: linear-gradient(135deg, var(--preview-accent), #c90000) !important;
    box-shadow: 0 13px 27px rgba(238, 0, 0, .22) !important;
}
.preview-buy-button:hover { transform: translateY(-2px); filter: none !important; }
.preview-buy-note { margin: 10px 0 0; color: #9aa1ad; font-size: 14px; line-height: 1.8; text-align: center; }
.preview-consultation-button { width: 100%; min-height: 46px; margin-top: 10px; border: 1px solid var(--preview-accent) !important; border-radius: 13px !important; background: #fff !important; color: var(--preview-accent-dark) !important; box-shadow: none !important; font-weight: 800; }
.preview-consultation-button:hover { background: #fff5f5 !important; color: var(--preview-accent-dark) !important; transform: translateY(-1px); }
.preview-trust-list { display: grid; grid-template-columns: repeat(3, 1fr); padding: 13px 8px; border-top: 1px solid var(--preview-line); background: #fafbfc; }
.preview-trust-item { display: grid; justify-items: center; gap: 5px; padding: 2px 5px; color: #737c8c; font-size: 14px; text-align: center; }
.preview-trust-item + .preview-trust-item { border-right: 1px solid var(--preview-line); }
.preview-trust-item .preview-icon { width: 19px; height: 19px; color: var(--preview-blue); }

.preview-info-zone { margin-top: 26px; padding: 0 27px 28px; }
.preview-tab-list { display: flex; gap: 7px; overflow-x: auto; margin: 0 -27px 24px; padding: 15px 27px 0; border-bottom: 1px solid var(--preview-line); scrollbar-width: none; }
.preview-tab-list::-webkit-scrollbar { display: none; }
.preview-tab-button {
    position: relative;
    min-width: max-content;
    padding: 10px 14px 14px !important;
    border: 0 !important;
    background: transparent !important;
    color: #848c99 !important;
    box-shadow: none !important;
    font-size: 14px;
}
.preview-tab-button::after { content: ""; position: absolute; right: 14px; left: 14px; bottom: -1px; height: 3px; border-radius: 3px 3px 0 0; background: transparent; }
.preview-tab-button.is-active { color: var(--preview-ink) !important; }
.preview-tab-button.is-active::after { background: var(--preview-accent); }
.preview-tab-panel[hidden] { display: none; }
.preview-tab-panel {
    max-width: 95%;
    margin: 0 auto;
    color: #5f6878;
    line-height: 2.15;
}
.preview-tab-panel h2 { margin: 0 0 12px; color: #263044; font-size: 20px; }
.preview-tab-panel p { margin: 0; white-space: pre-line; }
.preview-rich-content > :first-child { margin-top: 0; }
.preview-rich-content > :last-child { margin-bottom: 0; }
.preview-rich-content { overflow-wrap: anywhere; }
.preview-rich-content p + p { margin-top: 1em; }
.preview-rich-content p,.preview-rich-content li { line-height: 2.15; }
.preview-rich-content h1,.preview-rich-content h2,.preview-rich-content h3,.preview-rich-content h4,.preview-rich-content h5,.preview-rich-content h6 { margin: 20px 0 10px; color: #263044; line-height: 1.65; }
.preview-rich-content ul,.preview-rich-content ol { padding-right: 24px; }
.preview-rich-content blockquote { margin: 18px 0; padding: 12px 18px; border-right: 4px solid var(--preview-accent); background: var(--preview-soft); }
.preview-rich-content img { display: block; width: 100%; max-height: 560px; aspect-ratio: 16/9; margin: 18px auto; border-radius: 14px; object-fit: cover; }
.preview-rich-content figure { max-width: 100%; margin: 18px auto; }
.preview-rich-content figure img { margin: 0; }
.preview-rich-content video { display: block; width: min(100%, 760px); max-height: 520px; margin: 18px auto; border-radius: 14px; background: #111827; }
.preview-rich-content figcaption { margin-top: 8px; color: #7a8493; font-size: 14px; text-align: center; }
.preview-rich-content .aligncenter { margin-inline: auto; }
.preview-rich-content .alignleft { margin-right: auto; }
.preview-rich-content .alignright { margin-left: auto; }
.preview-rich-content .has-text-align-left { text-align: left; }
.preview-rich-content .has-text-align-right { text-align: right; }
.preview-rich-content .has-text-align-center { text-align: center; }
.preview-rich-content .has-text-align-justify { text-align: justify; }
.preview-rich-content table { width: 100%; margin: 16px 0; border-collapse: collapse; }
.preview-rich-content th,.preview-rich-content td { padding: 9px 11px; border: 1px solid var(--preview-line); }
.preview-rich-content a { color: var(--preview-accent); text-decoration: underline; }
.preview-spec-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.preview-spec { display: flex; justify-content: space-between; gap: 15px; padding: 12px 14px; border-radius: 12px; background: var(--preview-soft); font-size: 14px; }
.preview-spec span { color: #8b92a0; }
.preview-spec strong { color: #3c4555; }

.preview-related { margin-top: 34px; }
.preview-related-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.preview-related-heading h2 { margin: 0; font-size: 20px; }
.preview-related-heading a { color: var(--preview-accent); font-size: 14px; font-weight: 800; }
.preview-related-heading a:hover { color: var(--preview-accent-dark); }
.preview-related-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.preview-related-card { display: flex; min-width: 0; overflow: hidden; flex-direction: column; border: 1px solid var(--preview-line); border-radius: 22px; background: #fff; transition: border-color .23s ease, box-shadow .23s ease, transform .23s ease; }
.preview-related-card:hover { border-color: #ffc8c8; transform: translateY(-5px); box-shadow: 0 18px 42px rgba(27,34,48,.09); }
.preview-related-media { position: relative; display: grid; place-items: center; width: 100%; aspect-ratio: 1.15; overflow: hidden; padding: 18px; background: #f5f6f8; }
.preview-related-media img { width: 100%; height: 100%; padding: 34px; object-fit: contain; mix-blend-mode: multiply; transition: transform .3s ease; }
.preview-related-card:hover .preview-related-media img { transform: scale(1.045); }
.preview-related-media__empty { display: grid; justify-items: center; gap: 8px; color: #9ca3af; font-size: 14px; }
.preview-related-media__empty .store-icon { width: 42px; height: 42px; }
.preview-related-copy { display: flex; flex: 1; flex-direction: column; padding: 16px; }
.preview-related-category { color: var(--preview-accent); font-size: 14px; font-weight: 800; }
.preview-related-copy h3 { min-height: 52px; max-height: 52px; overflow: hidden; margin: 7px 0 11px; font-size: 14px; line-height: 1.9; }
.preview-related-copy h3 a { color: #303949; }
.preview-related-copy h3 a:hover { color: var(--preview-accent); }
.preview-related-seller { display: flex; align-items: flex-start; justify-content: space-between; gap: 7px; margin: 0 0 10px; padding: 8px 0; border-top: 1px solid #f0f1f4; }
.preview-related-seller .seller-store { flex: 1 1 auto; align-items: flex-start; }
.preview-related-seller .seller-store__text { flex: 1 1 auto; }
.preview-related-seller .seller-store__text strong { max-width: none; overflow: visible; font-size: 14px; line-height: 1.7; text-overflow: clip; white-space: normal; overflow-wrap: anywhere; }
.preview-related-seller .seller-rating { flex: 0 0 auto; }
.preview-related-seller .seller-rating__star { font-size: 14px; }
.preview-related-meta { display: flex; align-items: center; justify-content: space-between; gap: 9px; margin-top: auto; padding-top: 12px; border-top: 1px solid #eceef2; }
.preview-related-price { display: flex; min-width: 0; flex: 1; flex-direction: column; align-items: flex-start; color: #737c8b; }
.preview-related-price small { margin-bottom: 2px; color: #969da8; font-size: 14px; }
.preview-related-price strong { color: #1f2734; font-size: 14px; line-height: 1.7; white-space: nowrap; }
.preview-related-price em { color: #7c8490; font-size: 14px; font-style: normal; font-weight: 500; }
.preview-related-meta > a { display: grid; flex: 0 0 36px; width: 36px; height: 36px; place-items: center; border-radius: 11px; background: var(--preview-accent); color: #fff; box-shadow: 0 8px 18px rgba(238,0,0,.18); }
.preview-related-meta > a:hover { background: var(--preview-accent-dark); color: #fff; transform: translateX(-2px); }
.preview-related-meta .store-icon { width: 17px; height: 17px; }

.preview-seller-avatar { overflow: hidden; }
.preview-seller-avatar img { width: 100%; height: 100%; object-fit: cover; }
.preview-seller .seller-rating { flex: 0 0 auto; }
.preview-seller .seller-rating__star { font-size: 14px; }
.preview-purchase-error {
    margin-bottom: 14px;
    padding: 10px 12px;
    border: 1px solid #fecaca;
    border-radius: 11px;
    background: #fef2f2;
    color: #b91c1c;
    font-size: 14px;
    line-height: 1.9;
}
.preview-buy-button:disabled,
.preview-stepper button:disabled { cursor: not-allowed; opacity: .52; transform: none !important; }

.preview-toast {
    position: fixed;
    z-index: 120;
    right: 50%;
    bottom: 24px;
    min-width: min(390px, calc(100vw - 30px));
    padding: 13px 17px;
    border-radius: 13px;
    background: #172033;
    color: #fff;
    box-shadow: 0 18px 50px rgba(0,0,0,.24);
    font-size: 14px;
    text-align: center;
    transform: translate(50%, 20px);
    opacity: 0;
    pointer-events: none;
    transition: .25s;
}
.preview-toast.is-visible { opacity: 1; transform: translate(50%, 0); }
.preview-image-modal { position: fixed; z-index: 130; inset: 0; display: grid; place-items: center; padding: 30px; background: rgba(12,18,30,.82); backdrop-filter: blur(8px); }
.preview-image-modal[hidden] { display: none; }
.preview-image-modal img { max-width: min(920px, 90vw); max-height: 84vh; border-radius: 22px; background: #fff; object-fit: contain; }
.preview-image-modal button { position: absolute; top: 22px; left: 22px; width: 44px; height: 44px; padding: 0 !important; border: 0 !important; border-radius: 50% !important; background: #fff !important; color: #172033 !important; font-size: 24px; box-shadow: none !important; }
.product-compliance-modal { position:fixed;z-index:190;inset:0;display:grid;place-items:center;padding:22px }
.product-compliance-modal[hidden] { display:none }
.product-compliance-modal__backdrop { position:absolute;inset:0;width:100%;height:100%;padding:0;border:0!important;border-radius:0!important;background:rgba(15,23,42,.7)!important;box-shadow:none!important;backdrop-filter:blur(7px) }
.product-compliance-modal__backdrop:hover { transform:none;filter:none }
.product-compliance-modal__dialog { position:relative;z-index:1;width:min(620px,100%);max-height:90vh;overflow:auto;padding:28px;border:1px solid rgba(255,255,255,.7);border-radius:24px;background:#fff;box-shadow:0 30px 90px rgba(15,23,42,.34);direction:rtl }
.product-compliance-modal__close { position:absolute;z-index:2;top:14px;left:14px;width:38px;height:38px;min-height:38px;padding:0!important;border:0!important;border-radius:50%!important;background:#f1f5f9!important;color:#475569!important;box-shadow:none!important;font-size:27px;line-height:1 }
.product-compliance-modal__close:hover { background:#e2e8f0!important;color:#0f172a!important;transform:none }
.product-compliance-modal__head { display:flex;align-items:center;gap:13px;padding-left:45px;margin-bottom:20px }
.product-compliance-modal__head>span { display:grid;place-items:center;width:48px;height:48px;flex:0 0 auto;border-radius:15px;background:#dcfce7;color:#15803d }
.product-compliance-modal__head .preview-icon { width:25px;height:25px }
.product-compliance-modal__head h2 { margin:0;font-size:21px }
.product-compliance-modal__head p { margin:3px 0 0;color:#64748b;font-size:14px }
.product-compliance-modal__dates { display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:18px }
.product-compliance-modal__dates div { padding:12px 14px;border:1px solid #e2e8f0;border-radius:12px;background:#f8fafc }
.product-compliance-modal__dates span,.product-compliance-modal__dates strong { display:block }
.product-compliance-modal__dates span { color:#64748b;font-size:14px }
.product-compliance-modal__dates strong { margin-top:3px;color:#334155;font-size:14px }
.product-compliance-modal__image { display:block;width:100%;max-height:390px;margin:0 auto 18px;border:1px solid #e2e8f0;border-radius:14px;background:#f8fafc;object-fit:contain }
.product-compliance-modal__text { padding:15px 17px;border-right:4px solid #22c55e;border-radius:11px;background:#f0fdf4;color:#334155;line-height:2.1;overflow-wrap:anywhere }
.product-consultation-modal { position: fixed; z-index: 180; inset: 0; display: grid; place-items: center; padding: 22px; }
.product-consultation-modal[hidden] { display: none; }
.product-consultation-modal__backdrop { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0 !important; border-radius: 0 !important; background: rgba(15,23,42,.68) !important; box-shadow: none !important; backdrop-filter: blur(7px); }
.product-consultation-modal__backdrop:hover { transform: none; filter: none; }
.product-consultation-modal__dialog { position: relative; z-index: 1; width: min(900px,100%); max-height: min(88vh,900px); overflow-x: hidden; overflow-y: auto; border: 1px solid rgba(255,255,255,.72); border-radius: 24px; background: #fff; box-shadow: 0 30px 90px rgba(15,23,42,.34); direction: rtl; scrollbar-width: thin; }
.product-consultation-modal__close { position: sticky; z-index: 4; top: 12px; float: left; width: 38px; height: 38px; min-height: 38px; margin: 12px 0 -50px 12px; padding: 0 !important; border: 0 !important; border-radius: 50% !important; background: #f1f5f9 !important; color: #475569 !important; box-shadow: none !important; font-size: 27px; line-height: 1; }
.product-consultation-modal__close:hover { background: #e2e8f0 !important; color: #0f172a !important; transform: none; }
.product-consultation-modal .site-form-card { width:100%; max-width:100%; min-width:0; margin:0; padding:30px; border:0; border-radius:24px; box-shadow:none; }
.product-consultation-modal .site-form-card__head { padding-left:45px; }
.product-consultation-modal .site-form,
.product-consultation-modal .site-form-grid,
.product-consultation-modal .site-form-field { width:100%; max-width:100%; min-width:0; }
.product-consultation-modal .site-form-field input,
.product-consultation-modal .site-form-field select,
.product-consultation-modal .site-form-field textarea { max-width:100%; box-sizing:border-box; }

@media (max-width: 1080px) {
    .preview-command-grid { grid-template-columns: minmax(260px, .9fr) minmax(390px, 1.1fr); }
    .preview-order-card { position: static; grid-column: 1 / -1; }
    .preview-order-card .preview-order-body { display: grid; grid-template-columns: 1fr 1fr; column-gap: 28px; align-items: center; }
    .preview-order-card .preview-order-label,
    .preview-order-card .preview-total-price { grid-column: 1; }
    .preview-order-lines { grid-column: 1; }
    .preview-quantity-row,
    .preview-buy-button,
    .preview-buy-note,
    .preview-consultation-button { grid-column: 2; }
    .preview-quantity-row { align-self: end; }
}

@media (max-width: 760px) {
    .product-design-preview { margin-top: 15px; }
    .preview-lab-banner { align-items: flex-start; flex-direction: column; }
    .preview-masthead { grid-template-columns: 1fr; gap: 15px; }
    .preview-title-actions { position: absolute; left: 13px; margin-top: -3px; }
    .preview-command-grid { grid-template-columns: 1fr; }
    .preview-gallery-stage { min-height: 320px; }
    .preview-configurator { padding: 19px; }
    .preview-order-card { grid-column: auto; }
    .preview-order-card .preview-order-body { display: block; }
    .preview-related-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .preview-spec-grid { grid-template-columns: 1fr; }
    .product-consultation-modal { padding: 12px; }
    .product-consultation-modal__dialog { max-height: 92vh; border-radius: 19px; }
    .product-consultation-modal .site-form-card { padding:22px 17px; border-radius:19px; }
    .product-compliance-modal { padding:12px }
    .product-compliance-modal__dialog { padding:22px 17px;border-radius:19px }
}

@media (max-width: 480px) {
    .preview-lab-copy { align-items: flex-start; }
    .preview-lab-copy small { font-size: 14px; }
    .preview-masthead h1 { padding-left: 82px; font-size: 22px; }
    .preview-meta-chip { font-size: 14px; }
    .product-compliance-modal__dates { grid-template-columns:1fr }
    .preview-panel { border-radius: 19px; }
    .preview-gallery-stage { min-height: 280px; }
    .preview-compliance-corner { top:-25px;right:-18px;height:90px;min-height:90px!important;gap:6px }
    .preview-compliance-corner img { width:70px;height:76px;flex-basis:70px }
    .preview-compliance-corner .preview-icon { width:58px;height:58px;flex-basis:58px }
    .preview-compliance-corner span { margin-top:8px;padding:6px 9px;font-size:14px }
    .preview-level-row { grid-template-columns: 1fr; gap: 8px; }
    .preview-kit-options { grid-template-columns: 1fr; }
    .preview-info-zone { padding-inline: 18px; }
    .preview-tab-list { margin-inline: -18px; padding-inline: 18px; }
    .preview-related-grid { grid-template-columns: 1fr; gap: 14px; }
    .preview-related-media img { padding: 38px; }
}

@media (prefers-reduced-motion: reduce) {
    .product-design-preview *,
    .product-design-preview *::before,
    .product-design-preview *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}
