/* Die Auswahl nimmt im Warenkorb-Formular immer die volle Breite ein */
.mmk{flex:0 0 100%;width:100%;max-width:100%;min-width:0;box-sizing:border-box;margin-block:var(--s-4,1rem)}
.mmk fieldset{min-width:0;border:0;padding:0;margin-inline:0}
.mmk .opt > span em{white-space:nowrap}
.mmk .check{display:flex;gap:.6rem;align-items:flex-start;cursor:pointer}
.mmk .field{margin:0 0 var(--s-3,1rem)}
.mmk .field label{display:block;font-weight:600;margin-bottom:.25rem}
.mmk .field input[type=text],.mmk .field select{width:100%;max-width:26rem;min-height:44px;padding:0 .6rem;border:1px solid #7f7a6d;border-radius:8px;background:#fff}
.mmk .field__hint{display:block;color:#6b6b6b;font-size:.9rem;margin-top:.25rem}
.mmk__etuiview{margin:var(--s-3,1rem) 0 0;text-align:center}
.mmk__etuiview img{max-width:16rem;width:100%;height:auto;border:1px solid var(--line,#e3e0d8);border-radius:8px;background:#fff}
.mmk__etuiview[hidden],.mmk #grav-box[hidden],.mmk #grav-prev[hidden]{display:none}
/* Gravur-Vorschau auf dem Foto ersetzt das Galeriebild */
.box-view{background:#0e0e10;border-radius:10px;overflow:hidden;line-height:0}
.box-view[hidden]{display:none}
.box-view svg{display:block;width:100%;height:auto}
.mmk-viz-on > *:not(.box-view){display:none!important}

/* Sicherheitsnetz: Andere Formatvorlagen (WooCommerce/PayPal) ordnen Inhalte im Warenkorb-Formular als Zeile an.
   Die Auswahl bleibt trotzdem immer eine Spalte, alle Teile untereinander. */
.woocommerce div.product form.cart .mmk,.mmk.panel{display:block!important;flex-direction:column!important;flex:0 0 100%!important;width:100%!important;float:none!important}
.mmk > h2,.mmk > fieldset,.mmk > dl,.mmk > .engrave{display:block!important;flex:none!important;float:none!important;width:100%!important;max-width:100%!important;position:static!important;margin-left:0!important;margin-right:0!important}
.mmk .cfg-group{margin-bottom:var(--s-5,1.5rem)}
.mmk .opts{display:flex!important;flex-wrap:wrap}
.mmk .summary > div{display:flex!important}

/* Sicherheitsnetz 2: Auch die Unterbereiche (Gravur, Felder, Auswahlknöpfe) bleiben untereinander bzw. umbrechend */
.mmk #grav-box,.mmk .field,.mmk .engrave,.mmk .engrave > *{display:block!important;width:100%!important;max-width:100%!important;float:none!important;position:static!important}
.mmk .check{display:flex!important;align-items:flex-start;gap:.6rem}
.mmk .opts{display:flex!important;flex-wrap:wrap!important;justify-content:flex-start!important;align-items:center;gap:var(--s-2,.5rem)!important;width:100%!important}
.mmk .opt{flex:0 0 auto!important;width:auto!important;margin:0!important}
.mmk .cfg-group__t{display:flex!important;justify-content:flex-start!important;gap:var(--s-3,1rem)}
.mmk .field label{display:block!important;width:auto!important}
.mmk .field input[type=text],.mmk .field select{display:block!important;width:100%!important;max-width:26rem!important}
.mmk .field__hint{display:block!important;width:auto!important}
.mmk .engrave-prev{display:grid!important;width:100%!important;min-height:4.2rem}
.mmk .summary > div{justify-content:space-between}
.mmk [hidden]{display:none!important}

.mmk #grav-box[hidden],.mmk #grav-prev[hidden],.mmk .engrave #grav-box[hidden]{display:none!important}
.mmk .engrave-prev span{font-size:1.6rem}

.mmk-tabs{display:flex!important;gap:.5rem;margin:0 0 .6rem}
.mmk-viz-on > .mmk-tabs{display:flex!important}
.mmk-tabs button{flex:1 1 0;min-height:44px;padding:.5rem .75rem;border:1px solid var(--line,#cfcac0);border-radius:8px;background:#fff;color:inherit;font:inherit;font-weight:600;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mmk-tabs button[aria-pressed="true"]{background:var(--accent,#1f3a7a);border-color:var(--accent,#1f3a7a);color:#fff}
.mmk-tabs[hidden],.mmk-viz-on > .mmk-tabs[hidden]{display:none!important}
