/*
   * Design tokens match waldemaster-generators/trap-generator and
   * waldemaster-magic-items/public.css (Teal/Gold/Pergament, Georgia-Serife,
   * flache 1px-Konturen statt Glass/Blur), damit alle Frontend-Werkzeuge
   * wie aus einer Hand wirken. Card/print CSS below stays untouched.
   */
  .wmx{
    --wmx-teal:#0c857b; --wmx-teal-light:#49a49c; --wmx-teal-tint:#e7f3f2;
    --wmx-gold:#c9a35c; --wmx-gold-tint:#f7f0e2;
    --wmx-parchment-dark:#e5e1d6; --wmx-panel:#faf7f0;
    --wmx-ink:#262421; --wmx-on-teal:#ffffff;
    --wmx-muted:#6b6558; --wmx-muted2:#8a8474;
    --wmx-surface:#ffffff; --wmx-divider:var(--wmx-parchment-dark);
    --wmx-radius:8px;

    --pvScale: 1;

    --bTitle: 9pt;
    --bRarity: 7pt;
    --bBody: 6pt;

    font-family: Georgia, 'Times New Roman', serif;
    color:var(--wmx-ink);
  }
  .wmx *{ box-sizing:border-box; }

  .wmx-shell{ display:grid; grid-template-columns: 360px 1fr; gap:18px; align-items:start; }
  @media (max-width: 980px){ .wmx-shell{ grid-template-columns: 1fr; } }

  .wmx-side-head{ padding:6px 4px 12px; }
  /* .wmx-title/.wmx-panel-h/.wmx-form-title/.wmx-a4h/.wmx-instructions-h sind
     jetzt echte Ueberschriften (h2/h3/h4) statt divs, fuer eine sinnvolle
     Dokumentstruktur (SEO + Screenreader) - margin:0 haelt das Aussehen
     dabei exakt wie vorher, ohne die Browser-Default-Abstaende von h2/h3. */
  .wmx-title{ margin:0; font-weight:700; font-size:20px; letter-spacing:.2px; }
  .wmx-sub{ color:var(--wmx-muted2); margin-top:4px; font-size:12.5px; }

  .wmx-panel{
    background:var(--wmx-surface);
    border:1px solid var(--wmx-divider);
    border-radius:var(--wmx-radius);
    padding:14px;
  }
  .wmx-panel-h{
    margin:0 0 10px 0;
    font-weight:700; font-size:12px; letter-spacing:.35px; text-transform:uppercase;
    color:var(--wmx-ink);
  }

  .wmx-row2{ display:grid; grid-template-columns: 1fr 1fr; gap:12px; margin-bottom:12px; }
  @media (max-width: 980px){ .wmx-row2{ grid-template-columns: 1fr; } }

  .wmx-field{ min-width:0; display:flex; flex-direction:column; gap:6px; }
  .wmx-label{ display:block; font-size:11px; color:var(--wmx-ink); font-weight:700; text-transform:uppercase; letter-spacing:.03em; }

  .wmx-input, .wmx-textarea{
    width:100%; background:#fff; border:1px solid var(--wmx-divider); border-radius:4px;
    padding:8px 10px; outline:none; font-size:14px; color:var(--wmx-ink); font-family:inherit;
  }
  .wmx-input:focus, .wmx-textarea:focus{
    border-color:var(--wmx-teal);
    box-shadow:0 0 0 2px var(--wmx-teal-tint);
  }
  .wmx-input::placeholder, .wmx-textarea::placeholder{ color: var(--wmx-muted2); }
  .wmx-textarea{ min-height:140px; resize:vertical; }

  .wmx-file{
    display:flex; align-items:center; justify-content:center; gap:8px; padding:9px 12px;
    border:1px solid var(--wmx-teal); border-radius:4px; background:#fff; cursor:pointer;
    width:100%; min-height:40px;
  }
  .wmx-file:hover{ background:var(--wmx-teal); }
  .wmx-file:hover span{ color:var(--wmx-on-teal); }
  .wmx-file input{ display:none; }
  .wmx-file span{ font-weight:700; color:var(--wmx-teal); overflow-wrap:break-word; text-align:center; }

  /* Untereinander statt nebeneinander: nebeneinander (je 50% Breite) reicht
     bei einer laengeren Uebersetzung (z.B. Deutsch) nicht, der Text bricht
     mitten im Wort. Untereinander bekommt jeder Button die volle Breite.
     flex-direction/width mit !important, weil das Seiten-Theme Buttons und
     Flex-Container sonst wieder in eine Reihe zwingt (gleiches Muster wie
     bei der Magenta-Ueberschreibung). Gleiches Prinzip bei .wmx-actions. */
  .wmx-seg{ display:flex !important; flex-direction:column !important; border:1px solid var(--wmx-teal); border-radius:4px; overflow:hidden; }
  .wmx-segbtn{
    display:block !important; width:100% !important; flex:0 0 auto !important; float:none !important;
    border:0; border-top:1px solid var(--wmx-teal);
    background:#fff; padding:9px 10px; font-weight:700; cursor:pointer; color:var(--wmx-teal); font-family:inherit;
    white-space:normal; overflow-wrap:break-word; text-align:center; line-height:1.3;
  }
  .wmx-segbtn:first-child{ border-top:0; }
  .wmx-segbtn:not(.active):hover{ background:var(--wmx-teal-tint); }
  .wmx-segbtn.active{ background:var(--wmx-teal); color:var(--wmx-on-teal); }

  .wmx-actions{ display:flex; flex-direction:column; gap:10px; margin-top:12px; }
  .wmx-btn{
    border:1px solid var(--wmx-teal); border-radius:4px; padding:10px 14px; font-weight:700; cursor:pointer;
    background:var(--wmx-teal); color:var(--wmx-on-teal); font-family:inherit;
    min-height:40px;
    white-space:normal; overflow-wrap:break-word; text-align:center; line-height:1.3;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
  }
  .wmx-btn:hover{ background:var(--wmx-teal-light); border-color:var(--wmx-teal-light); }
  .wmx-btn-ghost{ background:#fff; color:var(--wmx-teal); }
  .wmx-btn-ghost:hover{ background:var(--wmx-teal); color:var(--wmx-on-teal); }

  .wmx-sendbox{
    margin-top:12px;
    padding:12px;
    border:1px solid var(--wmx-divider);
    border-radius:var(--wmx-radius);
    background:var(--wmx-panel);
  }
  .wmx-sendbox-h{
    font-weight:700;
    font-size:11px;
    letter-spacing:.35px;
    text-transform:uppercase;
    color:var(--wmx-muted2);
  }
  .wmx-sendgrid{
    display:flex;
    flex-direction:column;
    gap:8px;
    margin-top:10px;
  }
  .wmx-sendbtn{
    min-height:40px;
    padding:9px 10px;
    font-size:13px;
    line-height:1.3;
    white-space:normal;
    overflow-wrap:break-word;
    text-align:center;
  }
  .wmx-sendbtn.is-loaded{
    background:var(--wmx-gold);
    color:var(--wmx-ink);
    border-color:var(--wmx-gold);
  }
  .wmx-sendbtn.is-loaded:hover{ background:#b88f47; border-color:#b88f47; }

  .wmx-hint{ margin-top:6px; font-size:12px; color:var(--wmx-muted2); line-height:1.4; }

  .wmx-a4box{
    margin-top:14px; padding:14px;
    border:1px solid var(--wmx-divider);
    border-radius:var(--wmx-radius);
    background:var(--wmx-panel);
  }
  .wmx-a4h{ margin:0; font-weight:700; font-size:12px; letter-spacing:.35px; text-transform:uppercase; color:var(--wmx-ink); }
  .wmx-a4sub{ margin-top:6px; font-size:12.5px; color:var(--wmx-muted2); }
  .wmx-a4grid{ display:grid; grid-template-columns: 1fr; gap:10px; margin-top:10px; }
  .wmx-a4slot{
    position:relative;
    border:1px solid var(--wmx-divider);
    border-left:4px solid var(--wmx-gold);
    border-radius:var(--wmx-radius); padding:12px; background:#fff;
  }
  .wmx-a4slot-h{
    font-weight:700; font-size:12px; color:var(--wmx-ink); margin-bottom:8px;
    display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap;
  }
  .wmx-a4slot.has-csv .wmx-a4slot-h::after{
    content:"CSV ready";
    font-size:10px; letter-spacing:.03em; font-weight:700; text-transform:uppercase;
    color:var(--wmx-teal);
    background:var(--wmx-teal-tint);
    padding:4px 8px; border-radius:999px;
  }

  .wmx-a4row{ display:grid; grid-template-columns: 1fr; gap:6px; margin-bottom:10px; min-width:0; }
  .wmx-a4btn{
    display:flex; align-items:center; justify-content:center; gap:8px;
    padding:9px 12px; border-radius:4px; border:1px solid var(--wmx-teal);
    background:#fff; cursor:pointer; width:100%; min-height:40px;
  }
  .wmx-a4btn:hover{ background:var(--wmx-teal); }
  .wmx-a4btn:hover span{ color:var(--wmx-on-teal); }
  .wmx-a4btn input{ display:none; }
  .wmx-a4btn span{ font-weight:700; color:var(--wmx-teal); white-space:normal; overflow-wrap:break-word; text-align:center; }

  .wmx-a4meta{
    width:100%; min-width:0; font-size:12px;
    color:var(--wmx-muted); font-weight:700;
    padding:8px 10px; border:1px solid var(--wmx-divider);
    background:var(--wmx-panel); border-radius:4px;
    white-space:normal; word-break:break-word;
  }
  .wmx-a4meta.ok{
    color:var(--wmx-teal);
    border-color:var(--wmx-teal-tint);
    background:var(--wmx-teal-tint);
  }
  .wmx-a4ta{ min-height:64px; margin-top:8px; }

  .wmx-tip{ margin-top:12px; padding-top:12px; border-top:1px solid var(--wmx-divider); }
  .wmx-tip-h{ font-size:11px; font-weight:700; letter-spacing:.35px; text-transform:uppercase; color:var(--wmx-muted2); margin-bottom:6px; }
  .wmx-tip-p{ color:var(--wmx-muted); font-size:13px; line-height:1.45; }

  .wmx-grid{ display:grid; grid-template-columns: 420px 1fr; gap:18px; align-items:start; }
  @media (max-width: 1200px){ .wmx-grid{ grid-template-columns: 1fr; } }

  .wmx-cardwrap{ position:sticky; top:10px; }
  @media (max-width: 1200px){ .wmx-cardwrap{ position:relative; top:auto; } }

  .wmx-card{
    width:420px; height:560px;
    border-radius:18px;
    position:relative;
    overflow:hidden;
    background:#0d5f5a;
    box-shadow: 0 18px 26px rgba(0,0,0,.25);
  }
  @media (max-width: 1200px){ .wmx-card{ width:100%; max-width:420px; } }

  .wmx-mflip{
    position:absolute; top:10px; right:10px; z-index:50;
    border:1px solid var(--wmx-teal); border-radius:999px; padding:8px 14px;
    font-weight:700; cursor:pointer; font-family:inherit;
    background:var(--wmx-teal); color:var(--wmx-on-teal);
    display:none;
  }
  .wmx-mflip:hover{ background:var(--wmx-teal-light); border-color:var(--wmx-teal-light); }
  @media (max-width: 980px){ .wmx-mflip{ display:block; } }

  .wmx-card-inner{ width:100%; height:100%; position:relative; transform-style:preserve-3d; transition: transform .6s cubic-bezier(.2,.8,.2,1); }
  .wmx-card-inner.is-flipped{ transform: rotateY(180deg); }
  .wmx-face{ position:absolute; inset:0; backface-visibility:hidden; border-radius:18px; overflow:hidden; }
  .wmx-back{ transform: rotateY(180deg); }

  .wmx-note{ margin-top:10px; background:var(--wmx-panel); border:1px solid var(--wmx-divider); border-radius:var(--wmx-radius); padding:10px 12px; width:420px; }
  @media (max-width: 1200px){ .wmx-note{ width:100%; max-width:420px; } }
  .wmx-note-k{ font-weight:700; letter-spacing:.35px; text-transform:uppercase; font-size:11px; color:var(--wmx-muted2); }
  .wmx-note-v{ margin-top:4px; font-weight:700; font-size:13px; color:var(--wmx-ink); }

  .wmx-cardpanel{
    background:var(--wmx-surface);
    border:1px solid var(--wmx-divider);
    border-radius:var(--wmx-radius);
    padding:16px;
  }
  .wmx-form-head{
    display:flex; align-items:flex-end; justify-content:space-between; gap:12px;
    border-bottom:2px solid var(--wmx-teal);
    padding:0 0 12px; margin-bottom:14px;
  }
  .wmx-form-title{ margin:0; font-weight:700; font-size:16px; letter-spacing:.2px; }
  .wmx-form-sub{ color:var(--wmx-muted2); font-size:13px; }

  .wmx-formgrid{ display:grid; grid-template-columns: repeat(3, 1fr); gap:12px; }
  @media (max-width: 1200px){ .wmx-formgrid{ grid-template-columns: 1fr; } }

  .wmx-formgrid2{ display:grid; grid-template-columns: 1fr 1fr; gap:12px; margin-top:14px; }
  @media (max-width: 1200px){ .wmx-formgrid2{ grid-template-columns: 1fr; } }
  .wmx-wide{ grid-column: 1 / -1; }
  .wmx-mono{ font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:12px; }

  .wmx-check{ display:flex; align-items:center; gap:10px; padding:9px 12px; border:1px solid var(--wmx-divider); border-radius:4px; background:#fff; }
  .wmx-check input{ transform: scale(1.05); accent-color: var(--wmx-teal); }
  .wmx-check span{ font-weight:700; color:var(--wmx-ink); }

  .wmx-abilabel{
    font-weight:700;
    letter-spacing:.35px;
    text-transform:uppercase;
    font-size:11px;
    color:var(--wmx-muted2);
    margin-bottom:10px;
  }
  .wmx-abilist{ display:grid; gap:10px; }
  .wmx-ab{ display:grid; grid-template-columns: 240px 1fr; gap:10px; }
  @media (max-width: 1200px){ .wmx-ab{ grid-template-columns: 1fr; } }

  /* ===== CARD STYLE (printed card — do not restyle) ===== */
  .frame { position: relative; width: 100%; height: 100%; background: #0d5f5a; border-radius: 2.6mm; padding: 2.6mm; }
  .card { width: 63.5mm; height: 88mm; border-radius: 2.6mm; overflow: hidden; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .inner { position: relative; width: 100%; height: 100%; border: .55mm solid rgba(214,163,64,.95); border-radius: 2.2mm; }

  .brand{
    position:absolute; left:2mm; right:2mm; top:1mm;
    display:flex; align-items:center; justify-content:center;
    color:#d6a340; text-align:center; font-weight:900; font-size:10.5pt;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
    font-family:"Cinzel","Trajan Pro",Georgia,"Times New Roman",serif;
    text-transform:uppercase;
  }

  /* FRONT */
  .art{
    position:absolute; left:0.4mm; right:0.4mm; top:8.2mm; bottom:0.4mm;
    border-radius:2mm; background:#f3ecd8;
    display:flex; align-items:center; justify-content:center;
    overflow:hidden;

    /* FIX: Keeps tall images above the name area in preview */
    padding:3mm 3mm 10mm;
  }
  .name{
    position:absolute; left:1.6mm; right:1.6mm; bottom:1.6mm;
    font-weight:750; font-size:9pt; line-height:1.0;
    display:flex; align-items:flex-end; justify-content:center;
    padding:1.6mm 1mm 0.2mm;
    text-align:center;
    white-space:nowrap; overflow:hidden; text-overflow:clip;
    font-family:"Cinzel","Trajan Pro",Georgia,"Times New Roman",serif;
    background: linear-gradient(to top, rgba(243,236,216,.92), rgba(243,236,216,0));
    color:#444;
    pointer-events:none;
  }

  /* BACK */
  .vp{
    position:absolute; left:0.4mm; right:0.4mm; top:0.4mm; bottom:0.4mm;
    border-radius:2mm; background:#f3ecd8;
    overflow:hidden;
  }
  .wmx-backpad{ padding:1.6mm 3.0mm 10.2mm; }

  .title{
    font-weight:750; font-size:var(--bTitle); line-height:1.04;
    text-align:center; white-space:nowrap; overflow:hidden; text-overflow:clip;
    font-family:"Cinzel","Trajan Pro",Georgia,"Times New Roman",serif; color: #333;
  }
.rarity{
  text-align:center;
  margin-top:0.05mm;
  margin-bottom:0;
  font-size:var(--bRarity);
  font-weight:800;
  color:rgba(0,0,0,.70);
  /* Kein text-transform: EN ist per JS bereits kleingeschrieben, DE braucht
     korrekte GroSSschreibung der Substantive (Einstimmung, Artefakt). */
  line-height:1.05; /* <- DAS ist der Abstand zwischen den 2 Zeilen */
}
  .rule{ height:.2mm; background:#d6a340; border-radius:999px; margin:0.6mm 0 1.2mm; }

  .wmx-body{
    font-size:var(--bBody); line-height:1.12; color:#111;
    word-break:break-word; overflow-wrap:anywhere;
    display:flex; flex-direction:column; gap:0.55mm;
  }
  .wmx-desc{ margin:0; padding:0; white-space:pre-wrap; }
  .wmx-abilities{ margin:0; display:grid; gap:.5mm; }
  .wmx-abilities b{ font-weight:950; } /* keep ability titles strong */
  .wmx-flair{
    margin-top:.55mm;
    padding-top:.55mm;
    border-top:.18mm solid rgba(13,95,90,.28);
    color:rgba(17,17,17,.78);
    font-style:italic;
    white-space:pre-wrap;
  }

  .footer.footer-merged{
    position:absolute; left:0; right:0; bottom:0; height:8mm;
    display:flex; align-items:center; justify-content:center;
    padding:0 2mm;
    text-align:center;
    white-space:normal;
    overflow-wrap:anywhere;
    word-break:break-word;
    line-height:1.1;
    background:transparent;
    border:none;
    color:#0d5f5a;
    font-weight:950;
    text-transform:uppercase;
    font-size:10pt;
    font-family:"Cinzel","Trajan Pro",Georgia,"Times New Roman",serif;
  }

  .wmx-noart{ font-weight:900; color:rgba(0,0,0,.45); letter-spacing:.10em; font-family:ui-sans-serif,system-ui,Segoe UI,Roboto,Arial; }
  .wmx-img{ width:100%; height:100%; max-width:100%; max-height:100%; object-fit:contain; display:none; transform:translateZ(0); }

  .wmx-pvstage{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
  /* zoom statt transform:scale(): transform-Skalierung rastert den Karten-
     Layer zuerst in Originalgroesse und streckt dann die Bitmap, was beim
     Hochskalieren fuer die Vorschau sichtbar unscharf wird. zoom lässt den
     Browser stattdessen bei der Zielgroesse neu layouten/rendern -> scharf. */
  .wmx-pvscale{ zoom: var(--pvScale); }
  /* Uralt-Browser ohne zoom-Unterstuetzung: lieber die alte (leicht
     unscharfe) transform-Skalierung als eine winzige, gar nicht skalierte
     Vorschau. */
  @supports not (zoom: 1){
    .wmx-pvscale{ transform:scale(var(--pvScale)); transform-origin:center center; }
  }
  .wmx-measure{ position:absolute; left:-9999px; top:-9999px; width:63.5mm; height:88mm; }



  @media print{ #wmx-item-editor{ display:none !important; } }

  /* Aktionszeile pro A4-Slot: breiter "Back to Editor" (fuellt die Zeile) +
     kompakter "Clear" daneben - identisch zum Spell/Monster-Card-Editor.
     flex-direction:row + flex mit !important, damit das Seiten-Theme die
     Buttons nicht untereinander stapelt (gleiches Muster wie beim Front/
     Back-Umschalter). */
  .wmx-a4slotbtns{
    display:flex !important;
    flex-direction:row !important;
    gap:8px;
    margin-top:8px;
  }
  .wmx-a4slot-btn{
    flex:1 1 auto !important;
    min-width:0;
    border:1px solid var(--wmx-teal); border-radius:4px;
    padding:8px 10px; min-height:36px;
    background:#fff; color:var(--wmx-teal);
    font-weight:700; font-family:inherit; font-size:12.5px;
    cursor:pointer;
    white-space:normal; overflow-wrap:break-word; text-align:center; line-height:1.3;
    transition: background .15s ease, color .15s ease;
  }
  .wmx-a4slot-btn:hover{ background:var(--wmx-teal); color:var(--wmx-on-teal); }
  .wmx-a4slot-btn-clear{
    flex:0 0 auto !important;
    border-color:var(--wmx-gold);
    color:var(--wmx-ink);
  }
  .wmx-a4slot-btn-clear:hover{ background:var(--wmx-gold-tint); color:var(--wmx-ink); }

  /* ===== Instructions Panel ===== */
  .wmx-instructions{
    margin-top:14px;
    padding:14px;
    border:1px solid var(--wmx-divider);
    border-radius:var(--wmx-radius);
    background:var(--wmx-panel);
  }
  .wmx-instructions-h{
    margin:0 0 10px 0;
    font-weight:700;
    font-size:12px;
    letter-spacing:.35px;
    text-transform:uppercase;
    color:var(--wmx-muted2);
  }
  .wmx-instructions-sub{
    font-size:13.5px;
    line-height:1.5;
    color:var(--wmx-ink);
  }
  .wmx-instructions-sub p{ margin:0 0 8px 0; }
  .wmx-instructions-sub ol,
  .wmx-instructions-sub ul{ margin:8px 0 0 18px; padding:0; }
  .wmx-instructions-sub li{ margin-bottom:6px; }
  .wmx-instructions-sub hr{ border:0; border-top:1px solid var(--wmx-divider); margin:10px 0; }

  /* ===== Editor sections — one gold accent bar per section ===== */
  .wmx-editor-section{
    margin-top:14px;
    padding:12px 12px 12px 16px;
    border:1px solid var(--wmx-divider);
    border-left:4px solid var(--wmx-gold);
    border-radius:var(--wmx-radius);
    background:#fff;
  }
  .wmx-form-head + .wmx-editor-section{ margin-top:0; }
  .wmx-editor-section-h{
    margin:0 0 10px 0;
    font-weight:700;
    font-size:11px;
    letter-spacing:.35px;
    text-transform:uppercase;
    color:var(--wmx-muted2);
  }
  .wmx-editor-section .wmx-formgrid,
  .wmx-editor-section .wmx-formgrid2{ margin-top:0; }
  .wmx-editor-subgrid{ display:grid; grid-template-columns:1fr; gap:12px; }
  .wmx-editor-basic .wmx-editor-subgrid{ margin-top:12px; }

  .wmx-settings-section{
    margin:0 0 14px 0;
    padding:14px 14px 14px 16px;
    border:1px solid var(--wmx-divider);
    border-left:4px solid var(--wmx-gold);
    border-radius:var(--wmx-radius);
    background:#fff;
  }
  .wmx-settings-section .wmx-panel-h{ margin:0 0 12px 0; }
  .wmx-settings-section .wmx-row2:last-child{ margin-bottom:0; }

/*
 * EN/DE-Sprachumschalter + sprachspezifische Bloecke (i18n in public.js).
 * data-wmg-show="en|de": ganze Bloecke (reich formatierte Hinweise/Anleitung)
 * werden nur in der passenden Sprache gezeigt; Standard ohne JS = Englisch.
 */
.wmx-side-head-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.wmx .wmg-lang-toggle{ display:inline-flex; border:1px solid rgba(15,23,32,.2); border-radius:4px; overflow:hidden; }
.wmx .wmg-lang-btn{
	appearance:none; -webkit-appearance:none; border:0;
	background:#fff !important; color:#5a6472 !important;
	font:inherit; font-size:11px; font-weight:700; letter-spacing:.06em;
	padding:4px 10px; min-height:24px; cursor:pointer;
	transition: background .15s ease, color .15s ease;
}
.wmx .wmg-lang-btn + .wmg-lang-btn{ border-left:1px solid rgba(15,23,32,.2); }
.wmx .wmg-lang-btn:hover{ color:#0c857b !important; }
.wmx .wmg-lang-btn.active{ background:#0c857b !important; color:#fff !important; }

.wmx [data-wmg-show="de"]{ display:none; }
body.wmg-lang-de .wmx [data-wmg-show="de"]{ display:block; }
body.wmg-lang-de .wmx [data-wmg-show="en"]{ display:none; }

/* ------------------------------------------------------------------
 * Import-Icon (Pfeil in Ablage) fuer alle Import-Buttons: als Mask ueber
 * currentColor statt Inline-SVG im Markup, weil der Sprachwechsel
 * (i18n-Baustein) textContent ersetzt und ein SVG im Element loeschen
 * wuerde; ::before bleibt davon unberuehrt und folgt der Textfarbe
 * automatisch (auch beim Hover).
 * ------------------------------------------------------------------ */
#wmxImportFromText::before,
#wmxImportFile + span::before,
input[id^="wmxA4Img"] + span::before,
input[id^="wmxA4Csv"] + span::before{
  content:""; display:inline-block; width:14px; height:14px;
  margin-right:7px; vertical-align:-2px; background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 13V3'/%3E%3Cpath d='m8 7 4-4 4 4'/%3E%3Cpath d='M4 15v4a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-4'/%3E%3C/svg%3E") center / contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 13V3'/%3E%3Cpath d='m8 7 4-4 4 4'/%3E%3Cpath d='M4 15v4a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-4'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* ------------------------------------------------------------------
 * Aktions-Icons (gleiches Muster wie das Import-Icon: Mask ueber
 * currentColor per ::before; uebersteht den EN/DE-Sprachwechsel und
 * folgt der Textfarbe inkl. Hover). Basisregel + je Icon die Mask.
 * ------------------------------------------------------------------ */
#wmxCopyPreview::before,
#wmxExportTXT::before,
#wmxExportPrint::before,
#wmxA4Print::before,
#wmxReset::before,
button[id^="wmxA4Clear"]::before,
button[id^="wmxSendA4_"]::before,
.wmxA4Edit::before,
#wmxImageInput + span::before{
  content:""; display:inline-block; width:14px; height:14px;
  margin-right:7px; vertical-align:-2px; background:currentColor;
  -webkit-mask-position:center; -webkit-mask-size:contain; -webkit-mask-repeat:no-repeat;
  mask-position:center; mask-size:contain; mask-repeat:no-repeat;
}
#wmxA4Clear1::before,
#wmxA4Clear2::before,
#wmxA4Clear3::before,
.wmxA4Edit::before{ width:12px; height:12px; margin-right:5px; vertical-align:-1px; }
#wmxCopyPreview::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='11' height='11' rx='2'/%3E%3Cpath d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='11' height='11' rx='2'/%3E%3Cpath d='M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1'/%3E%3C/svg%3E"); }
#wmxExportTXT::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v10'/%3E%3Cpath d='m8 9 4 4 4-4'/%3E%3Cpath d='M4 15v4a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-4'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v10'/%3E%3Cpath d='m8 9 4 4 4-4'/%3E%3Cpath d='M4 15v4a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-4'/%3E%3C/svg%3E"); }
#wmxExportPrint::before, #wmxA4Print::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9V3h12v6'/%3E%3Cpath d='M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2'/%3E%3Crect x='6' y='14' width='12' height='7'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9V3h12v6'/%3E%3Cpath d='M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2'/%3E%3Crect x='6' y='14' width='12' height='7'/%3E%3C/svg%3E"); }
#wmxReset::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4v6h6'/%3E%3Cpath d='M3.5 15a9 9 0 1 0 2.1-9.4L3 10'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4v6h6'/%3E%3Cpath d='M3.5 15a9 9 0 1 0 2.1-9.4L3 10'/%3E%3C/svg%3E"); }
button[id^="wmxA4Clear"]::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M8 6V4a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v2'/%3E%3Cpath d='m19 6-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M8 6V4a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1v2'/%3E%3Cpath d='m19 6-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6'/%3E%3C/svg%3E"); }
button[id^="wmxSendA4_"]::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m13 6 6 6-6 6'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m13 6 6 6-6 6'/%3E%3C/svg%3E"); }
.wmxA4Edit::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5'/%3E%3Cpath d='m11 18-6-6 6-6'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5'/%3E%3Cpath d='m11 18-6-6 6-6'/%3E%3C/svg%3E"); }
#wmxImageInput + span::before{ -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Ccircle cx='8.5' cy='8.5' r='1.5'/%3E%3Cpath d='m21 15-5-5L5 21'/%3E%3C/svg%3E"); mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Ccircle cx='8.5' cy='8.5' r='1.5'/%3E%3Cpath d='m21 15-5-5L5 21'/%3E%3C/svg%3E"); }