/**
 * Warenwirtschaft Premium – Frontend Styles v5.0.0
 * Mobile-First Premium Layout · Twenty Twenty-Four Compatible
 */

/* ═══ CSS CUSTOM PROPERTIES ═══════════════════════════════════════════ */
:root {
    --wwp-radius-sm:   6px;
    --wwp-radius-md:   10px;
    --wwp-radius-lg:   14px;
    --wwp-shadow-sm:   0 1px 3px rgba(0,0,0,.06),0 1px 8px rgba(0,0,0,.05);
    --wwp-shadow-md:   0 2px 8px rgba(0,0,0,.07),0 8px 24px rgba(0,0,0,.06);
    --wwp-shadow-lg:   0 4px 20px rgba(0,0,0,.09),0 16px 40px rgba(0,0,0,.06);
    --wwp-blue:        #2271b1;
    --wwp-blue-dark:   #1a5a8f;
    --wwp-blue-light:  #eff6ff;
    --wwp-green:       #16a34a;
    --wwp-red:         #dc2626;
    --wwp-border:      #e2e8f0;
    --wwp-bg:          #f8fafc;
    --wwp-text:        #1e293b;
    --wwp-text-muted:  #64748b;
    --wwp-font:        -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
    --wwp-safe-left:   env(safe-area-inset-left,0px);
    --wwp-safe-right:  env(safe-area-inset-right,0px);
    /* Layout-Werte – per Settings überschreibbar */
    --wwp-max-width:   1340px;
    --wwp-pad-x:       2rem;
    --wwp-pad-y:       1.75rem;
}

/* ═══ WP-Admin-Leiste auf Mobil im Frontend ausblenden ════════════════ */
@media (max-width: 782px) {
    #wpadminbar {
        display: none !important;
    }
    html {
        margin-top: 0 !important;
    }
}

/* ═══ TWENTY TWENTY-FOUR THEME COMPAT ═════════════════════════════════
   TwentyTwentyFour setzt padding-inline auf .entry-content.
   Unsere Container müssen davon unabhängig sein.
══════════════════════════════════════════════════════════════════════ */
.entry-content .wwp-frontend-card,
.entry-content .wwp-scanner-container,
.entry-content .wwp-bestand-container,
.entry-content .wwp-transaktionen-container,
.entry-content .wwp-bestellvorschlaege-container,
.entry-content .wwp-mhd-container,
.wp-block-post-content .wwp-frontend-card {
    margin-inline: auto !important;
}

/* ═══ RESET ════════════════════════════════════════════════════════════ */
.wwp-frontend-card *, .wwp-frontend-card *::before, .wwp-frontend-card *::after {
    box-sizing: border-box;
}

/* ═══ HAUPT-CARD ═══════════════════════════════════════════════════════ */
.wwp-frontend-card {
    max-width: var(--wwp-max-width);
    width: 100%;
    margin: var(--wwp-pad-y) auto;
    padding: var(--wwp-pad-y) var(--wwp-pad-x);
    background: #fff;
    border: 1px solid var(--wwp-border);
    border-radius: var(--wwp-radius-lg);
    box-shadow: var(--wwp-shadow-md);
    font-family: var(--wwp-font);
    color: var(--wwp-text);
    font-size: 14px;
    line-height: 1.6;
}
.wwp-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 1.25rem;
    padding-bottom: .875rem;
    border-bottom: 2px solid #f1f5f9;
    /* Premium: Einzelne Module überschreiben dies mit blauem Gradient */
}
.wwp-card-header h2 {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 700;
    color: #111827;
    letter-spacing: -.015em;
}

/* ═══ PREMIUM CARD HEADER – Blue Gradient alle Module ══════════════ */
.wwp-scanner-container .wwp-card-header,
.wwp-bestand-container .wwp-card-header,
.wwp-transaktionen-container .wwp-card-header,
.wwp-bestellvorschlaege-container .wwp-card-header,
.wwp-mhd-container .wwp-card-header,
.wwp-frontend-card .wwp-card-header {
    background: linear-gradient(135deg, #1e3a5f 0%, #2271b1 100%);
    color: #fff;
    border-radius: 10px 10px 0 0;
    margin: calc(var(--wwp-pad-y) * -1) calc(var(--wwp-pad-x) * -1) 1.25rem;
    padding: 14px 20px;
    border-bottom: none;
}
.wwp-scanner-container .wwp-card-header h2,
.wwp-bestand-container .wwp-card-header h2,
.wwp-transaktionen-container .wwp-card-header h2,
.wwp-bestellvorschlaege-container .wwp-card-header h2,
.wwp-mhd-container .wwp-card-header h2,
.wwp-frontend-card .wwp-card-header h2 {
    color: #fff;
    font-size: 16px;
}
.wwp-scanner-container .wwp-card-header p,
.wwp-bestand-container .wwp-card-header p,
.wwp-frontend-card .wwp-card-header p,
.wwp-frontend-card .wwp-muted {
    color: rgba(255,255,255,.8);
    margin: 3px 0 0;
    font-size: 12px;
}
.wwp-scanner-container .wwp-card-header .wwp-btn-secondary,
.wwp-bestand-container .wwp-card-header .wwp-btn-secondary,
.wwp-frontend-card .wwp-card-header .wwp-btn-secondary {
    background: rgba(255,255,255,.15);
    color: #fff;
    border-color: rgba(255,255,255,.3);
}
.wwp-scanner-container .wwp-card-header .wwp-btn-secondary:hover,
.wwp-bestand-container .wwp-card-header .wwp-btn-secondary:hover,
.wwp-frontend-card .wwp-card-header .wwp-btn-secondary:hover {
    background: rgba(255,255,255,.25);
}
/* ─── wwp-ms max-width (= other pages) ─── */
.wwp-ms { max-width: var(--wwp-max-width); width: 100%; }
.wwp-bestell-wrap { max-width: var(--wwp-max-width); }

/* ═══ LEGACY CONTAINERS ════════════════════════════════════════════════ */
.wwp-scanner-container,
.wwp-bestand-container,
.wwp-transaktionen-container,
.wwp-bestellvorschlaege-container,
.wwp-mhd-container {
    max-width: var(--wwp-max-width);
    margin: var(--wwp-pad-y) auto;
    padding: var(--wwp-pad-y) var(--wwp-pad-x);
    background: #fff;
    border: 1px solid var(--wwp-border);
    border-radius: var(--wwp-radius-lg);
    box-shadow: var(--wwp-shadow-md);
    font-family: var(--wwp-font);
}
.wwp-scanner-v2.wwp-scanner-container { padding-top:0!important; margin-top:.5rem; }

/* ═══ BUTTONS ══════════════════════════════════════════════════════════ */
.wwp-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 9px 16px;
    font-size: 13px;
    font-weight: 600;
    border-radius: var(--wwp-radius-sm);
    border: none;
    cursor: pointer;
    text-decoration: none;
    transition: background .15s,box-shadow .12s,transform .08s;
    white-space: nowrap;
    line-height: 1.4;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}
.wwp-btn:active  { transform: scale(.96); }
.wwp-btn:disabled { opacity:.6; cursor:not-allowed; transform:none; }
.wwp-btn-primary  { background:var(--wwp-blue); color:#fff; box-shadow:0 1px 4px rgba(34,113,177,.25); }
.wwp-btn-primary:hover  { background:var(--wwp-blue-dark); }
.wwp-btn-secondary { background:#f1f5f9; color:#334155; border:1px solid var(--wwp-border); }
.wwp-btn-secondary:hover { background:#e2e8f0; }
.wwp-btn-outline { background:transparent; color:var(--wwp-blue); border:1.5px solid var(--wwp-blue); }
.wwp-btn-outline:hover { background:var(--wwp-blue-light); }
.wwp-btn-danger  { background:#fee2e2; color:#991b1b; border:1px solid #fca5a5; }
.wwp-btn-danger:hover  { background:#fecaca; }
.wwp-btn-success { background:#dcfce7; color:#166534; border:1px solid #86efac; }
.wwp-btn-success:hover { background:#bbf7d0; }
.wwp-btn-sm { padding:5px 10px; font-size:12px; }
.wwp-btn-lg { padding:12px 22px; font-size:15px; }

/* ═══ FORM CONTROLS ════════════════════════════════════════════════════ */
.wwp-input, .wwp-select, .wwp-form-control {
    width: 100%;
    padding: 9px 12px;
    font-size: 14px;
    border: 1px solid #cbd5e1;
    border-radius: var(--wwp-radius-sm);
    background: #fff;
    color: var(--wwp-text);
    transition: border-color .15s,box-shadow .15s;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
    font-family: var(--wwp-font);
}
.wwp-input:focus,.wwp-select:focus,.wwp-form-control:focus {
    outline: none;
    border-color: var(--wwp-blue);
    box-shadow: 0 0 0 3px rgba(34,113,177,.12);
}
.wwp-input::placeholder { color:#94a3b8; }
.wwp-form-group { margin-bottom:14px; }
.wwp-form-group label {
    display:block; font-size:11.5px; font-weight:600; color:#475569;
    margin-bottom:5px; text-transform:uppercase; letter-spacing:.5px;
}

/* Filter-Leiste */
.wwp-filter-bar {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    margin-bottom: 1.25rem;
    align-items: flex-end;
    background: var(--wwp-bg);
    border: 1px solid var(--wwp-border);
    border-radius: var(--wwp-radius-md);
    padding: .875rem 1rem;
}
.wwp-filter-bar input,.wwp-filter-bar select {
    padding: 8px 10px;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    font-size: 14px;
    background: #fff;
    color: var(--wwp-text);
    height: 38px;
    -webkit-appearance: none;
    appearance: none;
    transition: border-color .15s,box-shadow .15s;
}
.wwp-filter-bar input:focus,.wwp-filter-bar select:focus {
    outline:none; border-color:var(--wwp-blue); box-shadow:0 0 0 3px rgba(34,113,177,.1);
}

/* ═══ TABELLEN ══════════════════════════════════════════════════════════ */
.wwp-table { width:100%; border-collapse:collapse; font-size:13px; line-height:1.5; background:#fff; }
.wwp-table thead tr { background:linear-gradient(135deg,#2271b1 0%,#1a5a8f 100%); color:#fff; }
.wwp-table thead th {
    padding:11px 14px; text-align:left; font-weight:600;
    font-size:11.5px; letter-spacing:.4px; white-space:nowrap;
}
.wwp-table tbody tr { border-bottom:1px solid #f0f4f8; transition:background .1s; }
.wwp-table tbody tr:hover { background:#f0f7ff; }
.wwp-table tbody tr:last-child { border-bottom:none; }
.wwp-table td { padding:10px 14px; color:#334155; vertical-align:middle; }
.wwp-table-scroll,.wwp-table-wrap {
    overflow-x:auto; -webkit-overflow-scrolling:touch;
    border-radius:var(--wwp-radius-sm); border:1px solid var(--wwp-border);
}

/* Legacy */
.wwp-bestand-table,.wwp-transaktionen-table,.wwp-vorschlaege-table,.wwp-mhd-table {
    width:100%; border-collapse:collapse; font-size:13px; background:#fff;
}
.wwp-bestand-table thead,.wwp-transaktionen-table thead,.wwp-vorschlaege-table thead,.wwp-mhd-table thead {
    background:linear-gradient(135deg,#1e3a5f 0%,#2271b1 100%);
}
.wwp-bestand-table th,.wwp-transaktionen-table th,.wwp-vorschlaege-table th,.wwp-mhd-table th {
    padding:11px 14px; text-align:left; font-weight:600; color:#fff;
    border-bottom:none; white-space:nowrap; font-size:11.5px;
}
.wwp-bestand-table td,.wwp-transaktionen-table td,.wwp-vorschlaege-table td,.wwp-mhd-table td {
    padding:9px 14px; border-bottom:1px solid #f0f4f8; color:#334155;
}
.wwp-bestand-table tr:hover td,.wwp-transaktionen-table tr:hover td,
.wwp-vorschlaege-table tr:hover td,.wwp-mhd-table tr:hover td { background:#f0f7ff; }

/* Transaktionen */
.wwp-trans-wrap { width:100%; max-width:100%; box-sizing:border-box; }
.wwp-trans-wrap .wwp-t-table { width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.wwp-trans-wrap .wwp-t-table table { width:100%; min-width:620px; }

/* ═══ BADGES & STATUS ══════════════════════════════════════════════════ */
.wwp-badge,.wwp-mhd-badge {
    display:inline-flex; align-items:center; gap:4px;
    padding:3px 10px; border-radius:20px; font-size:11px;
    font-weight:700; white-space:nowrap; line-height:1.5;
}
.mhd-ok       { background:#dcfce7; color:#14532d; border:1px solid #86efac; }
.mhd-soon     { background:#fef9c3; color:#713f12; border:1px solid #fde047; }
.mhd-warn     { background:#ffedd5; color:#7c2d12; border:1px solid #fb923c; }
.mhd-critical { background:#fee2e2; color:#7f1d1d; border:1px solid #f87171; }
.mhd-expired  { background:#4b5563; color:#fff;    border:1px solid #1f2937; }
.badge-in  { background:#dcfce7; color:#166534; }
.badge-out { background:#fee2e2; color:#991b1b; }
.badge-fix { background:#eff6ff; color:#1e40af; }
.badge-inv { background:#f5f3ff; color:#5b21b6; }
.wwp-prio-badge { display:inline-block; padding:3px 10px; border-radius:12px; font-size:11px; font-weight:600; }
.prio-hoch    { background:#fee2e2; color:#7f1d1d; }
.prio-mittel  { background:#ffedd5; color:#7c2d12; }
.prio-niedrig { background:#dcfce7; color:#14532d; }
.wwp-lagerort-badge { display:inline-block; padding:2px 8px; background:#f1f5f9; border-radius:12px; font-size:11px; color:#475569; border:1px solid #e2e8f0; }

/* ═══ MHD AMPEL ════════════════════════════════════════════════════════ */
tr.row-expired td  { background:#f3f4f6; opacity:.78; }
tr.row-critical td { background:#fef2f2; }
tr.row-warn td     { background:#fff7ed; }
tr.row-soon td     { background:#fefce8; }
.wwp-bestand-table tr.critical td { background:#fee2e2; }
.wwp-bestand-table tr.warning td  { background:#fff3cd; }

/* ═══ NOTICES ══════════════════════════════════════════════════════════ */
#wwp-scan-result { margin-top:1.25rem; padding:.875rem 1.25rem; border-radius:var(--wwp-radius-sm); display:none; font-weight:500; }
#wwp-scan-result.success { background:#dcfce7; border:1px solid #86efac; color:#166534; }
#wwp-scan-result.error   { background:#fee2e2; border:1px solid #fca5a5; color:#991b1b; }
#wwp-scan-result.info    { background:#eff6ff; border:1px solid #93c5fd; color:#1e40af; }
.wwp-notice { padding:.875rem 1.25rem; border-radius:var(--wwp-radius-sm); margin-bottom:1rem; font-size:13px; font-weight:500; display:flex; align-items:center; gap:8px; border-left:4px solid transparent; }
.wwp-notice-error   { background:#fee2e2; border-color:#dc2626; color:#991b1b; border:1px solid #fca5a5; border-left:4px solid #dc2626; }
.wwp-notice-success { background:#dcfce7; border-color:#16a34a; color:#166534; border:1px solid #86efac; border-left:4px solid #16a34a; }
.wwp-notice-info    { background:#eff6ff; border-color:#2271b1; color:#1e40af; border:1px solid #93c5fd; border-left:4px solid #2271b1; }
.wwp-notice-warn    { background:#fef3c7; border-color:#d97706; color:#92400e; border:1px solid #fcd34d; border-left:4px solid #d97706; }

/* ═══ SCANNER ══════════════════════════════════════════════════════════ */
.wwp-scanner-main { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin-bottom:1.5rem; }
.wwp-scanner-left,.wwp-scanner-right { background:var(--wwp-bg); border:1px solid var(--wwp-border); border-radius:var(--wwp-radius-md); padding:1.25rem; }
#wwp-scanner-view,
.wwp-camera-view{
    width:100%;
    height:280px;
    background:#0f172a;
    border-radius:8px;
    overflow:hidden;
    position:relative;
}
#wwp-scanner-view video,
#wwp-scanner-view canvas,
.wwp-camera-view video,
.wwp-camera-view canvas{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.wwp-scanner-controls { text-align:center; margin-top:1rem; }
.wwp-scanner-status { text-align:center; font-size:12px; color:var(--wwp-text-muted); margin:.5rem 0; min-height:1.4em; }
.wwp-camera-select-wrap { display:none; margin-top:.75rem; }
.wwp-camera-select-wrap select { width:100%; }
.wwp-file-upload-wrap { text-align:center; margin-top:.75rem; }
.wwp-file-upload-label { display:inline-block; padding:.4rem .9rem; background:#f1f5f9; border:1px dashed #94a3b8; border-radius:6px; cursor:pointer; font-size:12px; color:#475569; }
.wwp-file-upload-label:hover { background:#e2e8f0; }
#wwp-resume-scanner { background:#f59e0b; color:#fff; border:none; border-radius:6px; padding:.6rem 1.25rem; cursor:pointer; font-size:13px; margin-top:.5rem; }
.wwp-scanner-info { background:var(--wwp-bg); padding:1.25rem 1.5rem; border-radius:8px; border-left:4px solid var(--wwp-blue); margin-bottom:1.5rem; font-size:13px; line-height:1.7; }
.wwp-scanner-info code { background:#e2e8f0; padding:.15rem .45rem; border-radius:4px; font-size:12px; color:#0f172a; }

/* ═══ LOADING ══════════════════════════════════════════════════════════ */
.wwp-loading { text-align:center; padding:3rem 1rem; color:var(--wwp-text-muted); font-size:14px; }
@keyframes wwp-spin { to { transform:rotate(360deg); } }
.wwp-spinner { display:inline-block; width:18px; height:18px; border:2px solid var(--wwp-border); border-top-color:var(--wwp-blue); border-radius:50%; animation:wwp-spin .8s linear infinite; vertical-align:middle; margin-left:6px; }
.wwp-no-data { text-align:center; padding:3rem 1rem; background:var(--wwp-bg); border-radius:8px; color:var(--wwp-text-muted); font-size:14px; }

/* ═══ MISC ═════════════════════════════════════════════════════════════ */
.wwp-bestand-summary { margin-top:1rem; padding:.75rem 1rem; background:var(--wwp-bg); border-radius:8px; border:1px solid var(--wwp-border); font-size:13px; color:#475569; display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.wwp-warn-count { color:var(--wwp-red); font-weight:700; }
.wwp-menge      { text-align:right; font-variant-numeric:tabular-nums; }
.wwp-fehlmenge  { color:var(--wwp-red); }
.wwp-pct        { color:#94a3b8; font-size:11px; }
.wwp-datetime   { font-size:12px; color:var(--wwp-text-muted); white-space:nowrap; }
.wwp-qr-wrapper { display:inline-block; vertical-align:top; }
.wwp-qr-wrapper img,.wwp-qr-wrapper canvas { display:block!important; }
.wwp-qr-label   { font-size:11px; color:#666; text-align:center; margin-top:4px; }
.wwp-qr-print-btn { font-size:12px!important; padding:5px 10px!important; }
.wwp-qr-artikel-wrap { text-align:center; display:inline-block; }
.wwp-qr-artikel-name { font-weight:600; font-size:13px; margin-bottom:6px; }
.wwp-qr-artikel-id   { font-size:11px; color:#888; margin-top:4px; }

/* ═══ RESPONSIVE ≤ 968px — HAUPT-FIX Mobiles Layout ══════════════════
   Problem: TwentyTwentyFour hat breite padding-inline auf .entry-content
   → Plugin-Container wird links versetzt. Fix: width:100%, margin:0.
══════════════════════════════════════════════════════════════════════ */
@media (max-width: 968px) {
    :root { --wwp-pad-x:1.25rem; --wwp-pad-y:1.25rem; }

    #wwp-scanner-view,
    .wwp-camera-view{
        height:240px;
    }

    .wwp-frontend-card,
    .wwp-scanner-container,
    .wwp-bestand-container,
    .wwp-transaktionen-container,
    .wwp-bestellvorschlaege-container,
    .wwp-mhd-container {
        margin: 1rem 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    /* TT4 override bei Tablet */
    .entry-content .wwp-frontend-card,
    .entry-content .wwp-scanner-container,
    .entry-content .wwp-bestand-container,
    .entry-content .wwp-transaktionen-container,
    .entry-content .wwp-bestellvorschlaege-container,
    .entry-content .wwp-mhd-container,
    .wp-block-post-content .wwp-frontend-card {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
    }
    .wwp-scanner-main { grid-template-columns:1fr; }
}

/* ═══ RESPONSIVE ≤ 640px — Smartphone ════════════════════════════════ */
@media (max-width: 640px) {
    :root { --wwp-pad-x:1rem; --wwp-pad-y:1rem; }

    .wwp-frontend-card,
    .wwp-scanner-container,
    .wwp-bestand-container,
    .wwp-transaktionen-container,
    .wwp-bestellvorschlaege-container,
    .wwp-mhd-container {
        margin: 0 !important;
        padding: 1rem !important;
        width: 100% !important;
        max-width: 100% !important;
        border-radius: var(--wwp-radius-sm) !important;
        border-left: none !important;
        border-right: none !important;
        box-shadow: none !important;
        box-sizing: border-box !important;
    }

    /* TwentyTwentyFour: negative Margin-Technik um padding-inline aufzuheben */
    .entry-content .wwp-frontend-card,
    .entry-content .wwp-scanner-container,
    .entry-content .wwp-bestand-container,
    .entry-content .wwp-transaktionen-container,
    .entry-content .wwp-bestellvorschlaege-container,
    .entry-content .wwp-mhd-container,
    .wp-block-post-content .wwp-frontend-card {
        margin-left: -1.5rem !important;
        margin-right: -1.5rem !important;
        width: calc(100% + 3rem) !important;
        max-width: none !important;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
        border-radius: 0 !important;
    }

    .wwp-card-header { flex-direction:column; align-items:flex-start; gap:8px; padding-bottom:.75rem; margin-bottom:1rem; }
    .wwp-card-header h2 { font-size:1.1rem; }

    /* Touch-freundlich (Apple HIG: min 44px) */
    .wwp-btn { min-height:44px; padding:10px 14px; font-size:14px; }

    /* iOS kein Auto-Zoom */
    .wwp-input,.wwp-select,.wwp-form-control,
    .wwp-filter-bar input,.wwp-filter-bar select,
    input[type="text"],input[type="number"],input[type="date"],
    input[type="email"],select,textarea {
        font-size:16px!important;
        min-height:44px;
    }

    .wwp-filter-bar { flex-direction:column; gap:.6rem; padding:.75rem; }
    .wwp-filter-bar > * { width:100%; }

    .wwp-bestand-table,.wwp-transaktionen-table,.wwp-vorschlaege-table,.wwp-mhd-table {
        display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; white-space:nowrap;
    }

    .wwp-scanner-v2.wwp-scanner-container { margin:0!important; border:none!important; border-radius:0!important; box-shadow:none!important; padding:0!important; }
    .wwp-scanner-main { gap:1rem; }
    .wwp-scanner-left,.wwp-scanner-right { padding:.875rem; }
}

/* ═══ RESPONSIVE ≤ 380px ══════════════════════════════════════════════ */
@media (max-width: 380px) {
    .wwp-frontend-card,.wwp-scanner-container,.wwp-bestand-container,
    .wwp-transaktionen-container,.wwp-bestellvorschlaege-container,.wwp-mhd-container {
        padding:.75rem!important;
    }
    .entry-content .wwp-frontend-card {
        margin-left:-1rem!important; margin-right:-1rem!important;
        width:calc(100% + 2rem)!important;
    }
}

/* ═══ PRODUKTION ═══════════════════════════════════════════════════════ */
@media (max-width: 768px) {
    .wwp-prod-grid { display:grid!important; grid-template-columns:1fr!important; gap:14px!important; }
}