/* Host innerhalb des modified-Shops */
.mmw-host {
    position: relative !important;
    z-index: 1302 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
}

.mmw-frame {
    display: block !important;
    width: 100% !important;
    height: 760px;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: #fff !important;
}

/* Ab hier nur Inhalt des isolierten Iframes */
html,
body.mmw-embed-body {
    margin: 0;
    padding: 0;
    background: #fff;
}

body.mmw-embed-body {
    overflow-x: hidden;
    overflow-y: auto;
    font-family: Arial, Helvetica, sans-serif;
    color: #20201f;
}

#mmw,
#mmw *,
#mmw *::before,
#mmw *::after {
    box-sizing: border-box;
}

#mmw {
    --text: #20201f;
    --muted: #77736e;
    --border: #e2ded8;
    --soft: #f7f4ef;
    --soft2: #fbfaf8;
    --dark: #191919;
    --red: #d92d20;
    --green: #357348;
    width: 100%;
    padding: 24px 0 36px;
}

#mmw [hidden] { display: none !important; }
#mmw .mmw-shell { width: calc(100% - 30px); max-width: 960px; margin: 0 auto; }
#mmw .mmw-hero { text-align: center; margin: 0 auto 26px; }
#mmw .mmw-kicker { display:block; margin-bottom:8px; color:#8c8780; font-size:10px; line-height:15px; font-weight:700; letter-spacing:.14em; }
#mmw .mmw-hero h1 { margin:0; color:#161616; font-size:42px; line-height:48px; letter-spacing:-.035em; }
#mmw .mmw-hero p { max-width:620px; margin:11px auto 0; color:var(--muted); font-size:14px; line-height:22px; }

#mmw .mmw-progress { display:flex; align-items:center; max-width:800px; margin:0 auto 22px; }
#mmw .mmw-progress-item { display:flex; align-items:center; gap:8px; width:auto; padding:0; margin:0; border:0; background:transparent; color:inherit; cursor:pointer; font:inherit; }
#mmw .mmw-progress-number { display:flex; align-items:center; justify-content:center; width:31px; height:31px; min-width:31px; background:#eeebe7; color:#8d8780; border-radius:50%; font-size:11px; font-weight:700; }
#mmw .mmw-progress-item.is-active .mmw-progress-number { background:var(--dark); color:#fff; }
#mmw .mmw-progress-item.is-complete .mmw-progress-number { background:var(--green); color:#fff; }
#mmw .mmw-progress-copy { text-align:left; }
#mmw .mmw-progress-copy strong, #mmw .mmw-progress-copy small { display:block; }
#mmw .mmw-progress-copy strong { font-size:11px; line-height:15px; }
#mmw .mmw-progress-copy small { color:#99928b; font-size:9px; line-height:13px; }
#mmw .mmw-progress-line { flex:1 1 auto; height:1px; min-width:15px; margin:0 12px; background:#ddd8d2; }

#mmw .mmw-card { max-width:820px; margin:0 auto; padding:34px; background:#fff; border:1px solid var(--border); border-radius:15px; box-shadow:0 12px 36px rgba(30,26,22,.055); }
#mmw .mmw-step-label { display:block; margin-bottom:6px; color:#97918a; font-size:9px; line-height:13px; font-weight:700; letter-spacing:.12em; }
#mmw .mmw-card h2 { margin:0 0 6px; font-size:26px; line-height:32px; color:var(--text); }
#mmw .mmw-intro { margin:0 0 26px; color:var(--muted); font-size:13px; line-height:20px; }

#mmw .mmw-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
#mmw .mmw-field { margin:0 0 18px; }
#mmw .mmw-field label { display:block; margin:0 0 6px; color:#35312e; font-size:12px; line-height:18px; font-weight:700; }

#mmw input.mmw-input,
#mmw textarea.mmw-input {
    display:block;
    width:100%;
    margin:0;
    background:#fff;
    color:#222;
    border:1px solid #d6d1ca;
    border-radius:8px;
    outline:0;
    box-shadow:none;
    font-family:Arial,Helvetica,sans-serif;
    font-size:14px;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    user-select:text;
    caret-color:#111;
}
#mmw input.mmw-input { height:48px; padding:0 13px; }
#mmw textarea.mmw-input { min-height:110px; padding:12px 13px; line-height:20px; resize:vertical; }
#mmw input.mmw-input:focus, #mmw textarea.mmw-input:focus { border-color:#4b4946; box-shadow:0 0 0 3px rgba(0,0,0,.055); }
#mmw input.mmw-input::placeholder, #mmw textarea.mmw-input::placeholder { color:#aaa49d; opacity:1; }

#mmw .mmw-upload { padding:30px 24px; text-align:center; background:var(--soft2); border:2px dashed #cbc5bd; border-radius:12px; }
#mmw .mmw-upload.is-dragging { background:#f2eee8; border-color:#393633; }
#mmw .mmw-upload-icon { display:flex; align-items:center; justify-content:center; width:46px; height:46px; margin:0 auto 11px; background:#191919; color:#fff; border-radius:10px; font-size:20px; }
#mmw .mmw-upload > strong { display:block; margin-bottom:4px; font-size:14px; }
#mmw .mmw-upload > p { margin:0 0 13px; color:#79736d; font-size:12px; line-height:18px; }
#mmw .mmw-upload > small { display:block; margin-top:10px; color:#969089; font-size:10px; }
#mmw .mmw-upload-button { min-height:41px; padding:0 16px; background:#fff; color:#191919; border:1px solid #d2ccc5; border-radius:8px; font-weight:700; cursor:pointer; }
#mmw #mmw-file { display:none; }

#mmw .mmw-file-card { display:flex; align-items:center; gap:11px; margin-top:12px; padding:11px 13px; background:#f1f7f2; border:1px solid #d5e6d9; border-radius:9px; }
#mmw .mmw-file-card[hidden] { display:none !important; }
#mmw .mmw-file-check { display:flex; align-items:center; justify-content:center; width:28px; height:28px; min-width:28px; background:var(--green); color:#fff; border-radius:50%; }
#mmw .mmw-file-copy { flex:1 1 auto; min-width:0; text-align:left; }
#mmw .mmw-file-copy strong, #mmw .mmw-file-copy span { display:block; }
#mmw .mmw-file-copy strong { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:12px; }
#mmw .mmw-file-copy span { margin-top:2px; color:#788079; font-size:10px; }
#mmw .mmw-file-remove { padding:7px 9px; background:transparent; color:#6f6963; border:0; cursor:pointer; }

#mmw .mmw-config-block { margin-bottom:25px; }
#mmw .mmw-config-title { display:block; margin-bottom:8px; font-size:12px; line-height:18px; font-weight:700; }
#mmw .mmw-choice-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
#mmw .mmw-choice-grid-4 { grid-template-columns:repeat(4,minmax(0,1fr)); }
#mmw .mmw-choice { position:relative; display:flex; flex-direction:column; align-items:flex-start; width:100%; min-height:78px; margin:0; padding:13px 14px; text-align:left; background:#faf9f7; color:#282624; border:1px solid #dcd7d0; border-radius:9px; cursor:pointer; }
#mmw .mmw-choice:hover { background:#fff; border-color:#a9a39c; }
#mmw .mmw-choice.is-selected { background:#fff; border-color:#191919; box-shadow:inset 0 0 0 1px #191919; }
#mmw .mmw-choice.is-selected::after { content:'✓'; position:absolute; top:8px; right:8px; display:flex; align-items:center; justify-content:center; width:18px; height:18px; background:#191919; color:#fff; border-radius:50%; font-size:8px; }
#mmw .mmw-choice strong { padding-right:22px; font-size:13px; line-height:18px; }
#mmw .mmw-choice small { display:block; margin-top:5px; color:#7b756f; font-size:10px; line-height:15px; }

#mmw .mmw-quantity { display:inline-grid; grid-template-columns:44px 82px 44px; overflow:hidden; border:1px solid #d7d2cb; border-radius:8px; }
#mmw .mmw-quantity button { width:44px; height:44px; padding:0; background:#f5f2ed; border:0; font-size:19px; cursor:pointer; }
#mmw #mmw-quantity { width:82px; height:44px; padding:0; text-align:center; border:0; border-left:1px solid #ddd8d2; border-right:1px solid #ddd8d2; border-radius:0; font-weight:700; }

#mmw .mmw-summary { overflow:hidden; margin-bottom:18px; border:1px solid #e2ddd7; border-radius:10px; }
#mmw .mmw-summary-row { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:45px; padding:0 14px; border-bottom:1px solid #efede9; }
#mmw .mmw-summary-row:last-child { border-bottom:0; }
#mmw .mmw-summary-row span { color:#7c766f; font-size:11px; }
#mmw .mmw-summary-row strong { font-size:12px; text-align:right; }
#mmw .mmw-price-box { margin-bottom:18px; padding:18px; background:var(--soft); border-radius:10px; }
#mmw .mmw-price-box > span, #mmw .mmw-price-box > strong, #mmw .mmw-price-box > small { display:block; }
#mmw .mmw-price-box > span { color:#77716b; font-size:11px; }
#mmw .mmw-price-box > strong { margin:3px 0; font-size:30px; line-height:34px; }
#mmw .mmw-price-box > small { color:#918b84; font-size:10px; line-height:15px; }

#mmw .mmw-error { margin:2px 0 14px; padding:10px 12px; background:#fff2f1; color:#a12f27; border:1px solid #efd0cc; border-radius:8px; font-size:11px; line-height:17px; }
#mmw .mmw-consent { display:flex; align-items:flex-start; gap:9px; margin:18px 0 0; color:#6f6963; font-size:10px; line-height:16px; cursor:pointer; }
#mmw #mmw-privacy { width:16px; height:16px; min-width:16px; min-height:16px; margin:1px 0 0; opacity:1; visibility:visible; }

#mmw .mmw-actions { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:14px; }
#mmw .mmw-actions-right { justify-content:flex-end; }
#mmw .mmw-button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:0 17px; border-radius:8px; font-size:12px; line-height:16px; font-weight:700; cursor:pointer; }
#mmw .mmw-button span { margin-left:7px; }
#mmw .mmw-button-primary { background:#191919; color:#fff; border:1px solid #191919; }
#mmw .mmw-button-secondary { background:#fff; color:#514c47; border:1px solid #d7d2cb; }
#mmw .mmw-button-submit { background:var(--red); color:#fff; border:1px solid var(--red); }

@media (max-width:760px) {
    #mmw { padding-top:18px; }
    #mmw .mmw-shell { width:calc(100% - 20px); }
    #mmw .mmw-hero h1 { font-size:33px; line-height:39px; }
    #mmw .mmw-progress-copy { display:none; }
    #mmw .mmw-progress-line { margin:0 7px; }
    #mmw .mmw-card { padding:22px 17px; }
    #mmw .mmw-grid { grid-template-columns:1fr; gap:0; }
    #mmw .mmw-choice-grid, #mmw .mmw-choice-grid-4 { grid-template-columns:1fr; }
}


/* =========================================================
   3D-VORSCHAU
   ========================================================= */

#mmw .mmw-preview {
    margin-top: 14px;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 12px;
}

#mmw .mmw-preview[hidden] {
    display: none !important;
}

#mmw .mmw-preview-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 13px 15px;
    background: #fbfaf8;
    border-bottom: 1px solid #ebe7e1;
}

#mmw .mmw-preview-head > div {
    min-width: 0;
}

#mmw .mmw-preview-label {
    display: block;
    margin-bottom: 2px;
    color: #98918a;
    font-size: 8px;
    line-height: 12px;
    font-weight: 700;
    letter-spacing: .12em;
}

#mmw .mmw-preview-head strong {
    display: block;
    color: #292725;
    font-size: 12px;
    line-height: 17px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

#mmw .mmw-preview-head small {
    color: #8d8780;
    font-size: 9px;
    line-height: 14px;
    text-align: right;
}

#mmw .mmw-preview-stage {
    position: relative;
    width: 100%;
    height: 390px;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 35%, #ffffff 0, #faf9f6 55%, #f3f0eb 100%);
    touch-action: none;
}

#mmw .mmw-preview-stage canvas {
    display: block;
    width: 100% !important;
    height: 100% !important;
    outline: none;
}

#mmw .mmw-preview-status {
    position: absolute;
    z-index: 2;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 25px;
    color: #7a746e;
    font-size: 12px;
    line-height: 19px;
    text-align: center;
    pointer-events: none;
}

#mmw .mmw-dimensions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-top: 1px solid #ebe7e1;
}

#mmw .mmw-dimensions > div {
    padding: 12px 14px;
    text-align: center;
    border-right: 1px solid #ebe7e1;
}

#mmw .mmw-dimensions > div:last-child {
    border-right: 0;
}

#mmw .mmw-dimensions span,
#mmw .mmw-dimensions strong {
    display: block;
}

#mmw .mmw-dimensions span {
    margin-bottom: 3px;
    color: #8a847d;
    font-size: 9px;
    line-height: 13px;
}

#mmw .mmw-dimensions strong {
    color: #282624;
    font-size: 13px;
    line-height: 18px;
}

#mmw .mmw-preview-note {
    margin: 0;
    padding: 9px 14px 11px;
    color: #969089;
    background: #fbfaf8;
    border-top: 1px solid #ebe7e1;
    font-size: 9px;
    line-height: 14px;
    text-align: center;
}

@media (max-width: 760px) {
    #mmw .mmw-preview-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }

    #mmw .mmw-preview-head small {
        text-align: left;
    }

    #mmw .mmw-preview-stage {
        height: 300px;
    }

    #mmw .mmw-dimensions > div {
        padding: 10px 6px;
    }
}

#mmw .mmw-price-warning {
    margin: -4px 0 16px;
    padding: 11px 13px;

    background: #fff8e8;
    color: #7d6126;

    border: 1px solid #ead9aa;
    border-radius: 8px;

    font-size: 10px;
    line-height: 16px;
}