/* ══════════════════════════════════════════════════════
   Suriname Market – Vendor Dashboard CSS
   ══════════════════════════════════════════════════════ */

:root {
    --vd-green:       #1a6b3a;
    --vd-green-light: #2d9c56;
    --vd-gold:        #e8a000;
    --vd-red:         #c0392b;
    --vd-blue:        #2563eb;
    --vd-purple:      #7c3aed;
    --vd-sidebar-w:   260px;
    --vd-topbar-h:    64px;
    --vd-bg:          #f0f2f5;
    --vd-card-bg:     #ffffff;
    --vd-border:      #e4e7ec;
    --vd-text:        #111827;
    --vd-muted:       #6b7280;
    --vd-radius:      10px;
    --vd-shadow:      0 1px 6px rgba(0,0,0,.08);
    --vd-font:        'Segoe UI', system-ui, -apple-system, sans-serif;
}

/* ── Reset ─────────────────────────────────────────── */
.sm-vd-body { margin:0; padding:0; background:var(--vd-bg); font-family:var(--vd-font); color:var(--vd-text); overflow-x:hidden; max-width:100vw; }
.sm-vd-body *, .sm-vd-body *::before, .sm-vd-body *::after { box-sizing:border-box; }

/* ── Layout ────────────────────────────────────────── */
.sm-vd-layout { display:flex; min-height:100vh; overflow-x:hidden; width:100%; max-width:100vw; }

/* ── Sidebar ───────────────────────────────────────── */
.sm-vd-sidebar {
    width: var(--vd-sidebar-w); background: var(--vd-green); color: #fff;
    display: flex; flex-direction: column; position: fixed; top:0; left:0; bottom:0;
    z-index: 200; transition: transform .3s;
    overflow-y: auto;
}
.sm-vd-sidebar__logo { padding:20px; display:flex; align-items:center; gap:12px; border-bottom:1px solid rgba(255,255,255,.15); }
.sm-vd-sidebar__logo a { display:flex; align-items:center; gap:10px; color:#fff; text-decoration:none; }
.sm-vd-sidebar__logo-icon { font-size:24px; }
.sm-vd-sidebar__logo-text { font-weight:800; font-size:15px; }
.sm-vd-sidebar__store { padding:16px 20px; display:flex; align-items:center; gap:12px; border-bottom:1px solid rgba(255,255,255,.15); }
.sm-vd-sidebar__avatar { width:44px; height:44px; border-radius:50%; object-fit:cover; flex-shrink:0; }
.sm-vd-sidebar__avatar--placeholder { background:rgba(255,255,255,.25); display:flex; align-items:center; justify-content:center; font-size:20px; font-weight:800; }
.sm-vd-sidebar__store-info strong { display:block; font-size:14px; font-weight:700; }
.sm-vd-sidebar__balance { font-size:12px; opacity:.8; }

/* ── Nav ───────────────────────────────────────────── */
.sm-vd-nav { padding:12px 0; flex:1; display:flex; flex-direction:column; }
.sm-vd-nav__item { display:flex; align-items:center; gap:12px; padding:12px 20px; color:rgba(255,255,255,.85); text-decoration:none; font-size:14px; font-weight:500; transition:.2s; cursor:pointer; border:none; background:none; width:100%; text-align:left; }
.sm-vd-nav__item:hover { background:rgba(255,255,255,.12); color:#fff; }
.sm-vd-nav__item--active { background:rgba(255,255,255,.2); color:#fff; font-weight:700; }
.sm-vd-nav__item i { width:18px; text-align:center; font-size:16px; }
.sm-vd-nav__item--logout { 
    color:rgba(255,100,100,.9);
    margin-top: auto;
    border-top: 1px solid rgba(255,255,255,.12);
    padding-top: 14px;
    margin-bottom: 8px;
}
.sm-vd-nav__item--logout:hover { 
    background:rgba(255,100,100,.15); 
    color:#ff6464;
}
.sm-vd-sidebar__bottom { padding:12px 0; border-top:1px solid rgba(255,255,255,.15); }

/* ── Main ──────────────────────────────────────────── */
.sm-vd-main { margin-left:var(--vd-sidebar-w); flex:1; display:flex; flex-direction:column; min-height:100vh; min-width:0; overflow-x:hidden; }

/* ── Topbar ────────────────────────────────────────── */
.sm-vd-topbar { height:var(--vd-topbar-h); background:#fff; border-bottom:1px solid var(--vd-border); display:flex; align-items:center; gap:16px; padding:0 24px; position:sticky; top:0; z-index:100; box-shadow:var(--vd-shadow); }
.sm-vd-topbar__toggle { display:none; background:none; border:none; font-size:20px; cursor:pointer; color:var(--vd-text); }
.sm-vd-topbar__title { font-size:18px; font-weight:700; flex:1; }
.sm-vd-topbar__right { display:flex; align-items:center; gap:16px; }
.sm-vd-topbar__user { display:flex; align-items:center; gap:8px; font-size:14px; color:var(--vd-muted); }

/* ── Lang switcher ─────────────────────────────────── */
.sm-lang-switcher { position:relative; }
.sm-lang-switcher__btn { display:flex; align-items:center; gap:6px; padding:6px 12px; border:1.5px solid var(--vd-border); border-radius:8px; background:#fff; cursor:pointer; font-size:13px; font-weight:600; }
.sm-lang-switcher__dropdown { position:absolute; right:0; top:calc(100%+6px); background:#fff; border:1.5px solid var(--vd-border); border-radius:8px; box-shadow:0 8px 24px rgba(0,0,0,.12); min-width:140px; z-index:999; display:none; overflow:hidden; }
.sm-lang-switcher__dropdown.open { display:block; }
.sm-lang-option { display:block; width:100%; padding:10px 16px; text-align:left; border:none; background:none; cursor:pointer; font-size:13px; }
.sm-lang-option:hover { background:var(--vd-bg); }
.sm-lang-option.active { color:var(--vd-green); font-weight:700; }

/* ── Content ───────────────────────────────────────── */
.sm-vd-content { padding:24px; flex:1; }

/* ── Page header ───────────────────────────────────── */
.sm-vd-page-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:24px; }
.sm-vd-page-header h2 { font-size:1.4rem; font-weight:800; display:flex; align-items:center; gap:10px; }

/* ── Cards ─────────────────────────────────────────── */
.sm-vd-card { background:var(--vd-card-bg); border-radius:var(--vd-radius); box-shadow:var(--vd-shadow); border:1px solid var(--vd-border); margin-bottom:20px; overflow:hidden; }
.sm-vd-card__header { padding:16px 20px; border-bottom:1px solid var(--vd-border); display:flex; align-items:center; justify-content:space-between; }
.sm-vd-card__header h3 { font-size:15px; font-weight:700; margin:0; }
.sm-vd-card__body { padding:20px; }

/* ── Welcome ───────────────────────────────────────── */
.sm-vd-welcome { background:linear-gradient(135deg,var(--vd-green),var(--vd-green-light)); color:#fff; border-radius:var(--vd-radius); padding:24px 28px; margin-bottom:24px; display:flex; align-items:center; justify-content:space-between; }
.sm-vd-welcome h2 { font-size:1.3rem; margin:0 0 4px; }
.sm-vd-welcome p { margin:0; opacity:.85; font-size:14px; }

/* ── Stats grid ────────────────────────────────────── */
.sm-vd-stats-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:16px; margin-bottom:24px; }
.sm-vd-stat-card { background:var(--vd-card-bg); border-radius:var(--vd-radius); padding:20px; display:flex; align-items:center; gap:16px; box-shadow:var(--vd-shadow); border:1px solid var(--vd-border); border-left:4px solid #ccc; }
.sm-vd-stat-card--green  { border-left-color:var(--vd-green); }  .sm-vd-stat-card--green  .sm-vd-stat-card__icon { color:var(--vd-green); }
.sm-vd-stat-card--blue   { border-left-color:var(--vd-blue); }   .sm-vd-stat-card--blue   .sm-vd-stat-card__icon { color:var(--vd-blue); }
.sm-vd-stat-card--orange { border-left-color:#ea580c; }          .sm-vd-stat-card--orange .sm-vd-stat-card__icon { color:#ea580c; }
.sm-vd-stat-card--purple { border-left-color:var(--vd-purple); } .sm-vd-stat-card--purple .sm-vd-stat-card__icon { color:var(--vd-purple); }
.sm-vd-stat-card--gold   { border-left-color:var(--vd-gold); }   .sm-vd-stat-card--gold   .sm-vd-stat-card__icon { color:var(--vd-gold); }
.sm-vd-stat-card--red    { border-left-color:var(--vd-red); }    .sm-vd-stat-card--red    .sm-vd-stat-card__icon { color:var(--vd-red); }
.sm-vd-stat-card__icon { font-size:28px; flex-shrink:0; }
.sm-vd-stat-card__label { display:block; font-size:12px; color:var(--vd-muted); margin-bottom:4px; }
.sm-vd-stat-card__value { font-size:1.4rem; font-weight:800; line-height:1; }

/* ── Quick actions ─────────────────────────────────── */
.sm-vd-quick-actions { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:24px; }
.sm-vd-quick-card { background:#fff; border:1.5px solid var(--vd-border); border-radius:var(--vd-radius); padding:20px; text-align:center; text-decoration:none; color:var(--vd-text); display:flex; flex-direction:column; align-items:center; gap:8px; font-size:13px; font-weight:600; transition:.2s; }
.sm-vd-quick-card:hover { border-color:var(--vd-green); color:var(--vd-green); transform:translateY(-2px); }
.sm-vd-quick-card i { font-size:24px; }

/* ── Buttons ───────────────────────────────────────── */
.sm-vd-btn { display:inline-flex; align-items:center; gap:8px; padding:10px 20px; border-radius:8px; font-size:14px; font-weight:600; cursor:pointer; border:2px solid transparent; text-decoration:none; transition:.2s; font-family:var(--vd-font); white-space:nowrap; }
.sm-vd-btn--primary  { background:var(--vd-green);  color:#fff; border-color:var(--vd-green); }
.sm-vd-btn--primary:hover { background:var(--vd-green-light); color:#fff; }
.sm-vd-btn--secondary{ background:#f0f2f5; color:var(--vd-text); border-color:var(--vd-border); }
.sm-vd-btn--secondary:hover { background:#e4e7ec; }
.sm-vd-btn--ghost    { background:transparent; color:var(--vd-muted); border-color:var(--vd-border); }
.sm-vd-btn--danger   { background:var(--vd-red); color:#fff; border-color:var(--vd-red); }
.sm-vd-btn--full     { width:100%; justify-content:center; }

/* ── Table ─────────────────────────────────────────── */
.sm-vd-table-wrap { overflow-x:auto; }
.sm-vd-table { width:100%; border-collapse:collapse; font-size:14px; }
.sm-vd-table th { background:var(--vd-bg); padding:12px 16px; text-align:left; font-weight:700; font-size:12px; text-transform:uppercase; letter-spacing:.4px; color:var(--vd-muted); border-bottom:1px solid var(--vd-border); white-space:nowrap; }
.sm-vd-table td { padding:14px 16px; border-bottom:1px solid var(--vd-border); vertical-align:middle; }
.sm-vd-table tbody tr:hover { background:#f8f9fa; }
.sm-vd-table tbody tr:last-child td { border-bottom:none; }

/* ── Badges ────────────────────────────────────────── */
.sm-vd-badge { display:inline-block; padding:3px 10px; border-radius:999px; font-size:12px; font-weight:700; }
.sm-vd-badge--green       { background:#dcfce7; color:#166534; }
.sm-vd-badge--red         { background:#fee2e2; color:#991b1b; }
.sm-vd-badge--status-active      { background:#dcfce7; color:#166534; }
.sm-vd-badge--status-draft       { background:#f3f4f6; color:#6b7280; }
.sm-vd-badge--status-pending     { background:#fef9c3; color:#854d0e; }
.sm-vd-badge--status-processing  { background:#dbeafe; color:#1e40af; }
.sm-vd-badge--status-shipped     { background:#ede9fe; color:#5b21b6; }
.sm-vd-badge--status-delivered   { background:#dcfce7; color:#166534; }
.sm-vd-badge--status-completed   { background:#d1fae5; color:#065f46; }
.sm-vd-badge--status-disputed    { background:#fee2e2; color:#991b1b; }
.sm-vd-badge--status-refunded    { background:#f3f4f6; color:#6b7280; }
.sm-vd-badge--status-out_of_stock{ background:#fee2e2; color:#991b1b; }

/* ── Form ──────────────────────────────────────────── */
.sm-vd-form__grid { display:grid; grid-template-columns:1fr 340px; gap:20px; align-items:start; }
.sm-vd-form__sidebar { display:flex; flex-direction:column; gap:20px; }
.sm-vd-field { margin-bottom:16px; }
.sm-vd-field:last-child { margin-bottom:0; }
.sm-vd-field-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.sm-vd-label { display:block; font-size:13px; font-weight:600; margin-bottom:6px; color:var(--vd-text); }
.sm-vd-label .required { color:var(--vd-red); }
.sm-vd-input,.sm-vd-textarea,.sm-vd-select { width:100%; padding:10px 14px; border:1.5px solid var(--vd-border); border-radius:8px; font-size:14px; font-family:var(--vd-font); color:var(--vd-text); background:#fff; transition:.2s; }
.sm-vd-input:focus,.sm-vd-textarea:focus,.sm-vd-select:focus { outline:none; border-color:var(--vd-green); box-shadow:0 0 0 3px rgba(26,107,58,.1); }
.sm-vd-select--sm { padding:6px 10px; font-size:13px; }
.sm-vd-textarea { resize:vertical; }
.sm-vd-checkbox-label { display:flex; align-items:center; gap:10px; cursor:pointer; font-size:14px; }
.sm-vd-input-group { display:flex; }
.sm-vd-input-group__prefix { background:var(--vd-bg); border:1.5px solid var(--vd-border); border-right:none; border-radius:8px 0 0 8px; padding:10px 12px; font-size:13px; color:var(--vd-muted); white-space:nowrap; }
.sm-vd-input-group .sm-vd-input { border-radius:0 8px 8px 0; }
.sm-vd-form__actions { display:flex; flex-direction:column; gap:10px; }

/* ── Product thumbnail ─────────────────────────────── */
.sm-vd-product-thumb { width:48px; height:48px; object-fit:cover; border-radius:6px; border:1px solid var(--vd-border); }
.sm-vd-product-thumb--empty { width:48px; height:48px; background:var(--vd-bg); border-radius:6px; display:flex; align-items:center; justify-content:center; color:var(--vd-muted); border:1px solid var(--vd-border); }

/* ── Image grid ────────────────────────────────────── */
.sm-vd-image-grid { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:12px; min-height:60px; }
.sm-vd-image-item { position:relative; width:80px; height:80px; }
.sm-vd-image-item img { width:100%; height:100%; object-fit:cover; border-radius:8px; border:1px solid var(--vd-border); }
.sm-vd-image-remove { position:absolute; top:-6px; right:-6px; width:20px; height:20px; background:var(--vd-red); color:#fff; border:none; border-radius:50%; cursor:pointer; font-size:10px; display:flex; align-items:center; justify-content:center; }
.sm-vd-image-placeholder { width:80px; height:80px; background:var(--vd-bg); border-radius:8px; display:flex; align-items:center; justify-content:center; color:var(--vd-muted); font-size:24px; border:1px dashed var(--vd-border); }
.sm-vd-logo-preview { width:80px; height:80px; object-fit:cover; border-radius:8px; margin-bottom:12px; }

/* ── Empty state ───────────────────────────────────── */
.sm-vd-empty { text-align:center; padding:60px 20px; color:var(--vd-muted); }
.sm-vd-empty i { font-size:48px; margin-bottom:16px; display:block; }
.sm-vd-empty h3 { font-size:18px; color:var(--vd-text); margin-bottom:8px; }
.sm-vd-empty p { margin-bottom:20px; }
.sm-vd-empty--sm { padding:32px 20px; }

/* ── Filters ───────────────────────────────────────── */
.sm-vd-filters { margin-bottom:20px; }
.sm-vd-filters__row { display:flex; gap:12px; flex-wrap:wrap; }
.sm-vd-filters__row .sm-vd-input { max-width:280px; }

/* ── Pagination ────────────────────────────────────── */
.sm-vd-pagination { display:flex; gap:6px; padding:16px 20px; }
.sm-vd-pagination__btn { padding:6px 12px; border-radius:6px; border:1.5px solid var(--vd-border); background:#fff; text-decoration:none; color:var(--vd-text); font-size:13px; }
.sm-vd-pagination__btn.active { background:var(--vd-green); color:#fff; border-color:var(--vd-green); }

/* ── Actions ───────────────────────────────────────── */
.sm-vd-actions { display:flex; gap:6px; }
.sm-vd-icon-btn { width:34px; height:34px; border-radius:6px; border:1.5px solid var(--vd-border); background:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; color:var(--vd-muted); font-size:14px; transition:.2s; text-decoration:none; }
.sm-vd-icon-btn:hover { border-color:var(--vd-green); color:var(--vd-green); }
.sm-vd-icon-btn--danger:hover { border-color:var(--vd-red); color:var(--vd-red); }

/* ── Modal ─────────────────────────────────────────── */
.sm-vd-modal { position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:1000; display:flex; align-items:center; justify-content:center; }
.sm-vd-modal__box { background:#fff; border-radius:var(--vd-radius); width:480px; max-width:95vw; max-height:90vh; overflow-y:auto; box-shadow:0 20px 60px rgba(0,0,0,.2); }
.sm-vd-modal__header { padding:20px 24px; border-bottom:1px solid var(--vd-border); display:flex; align-items:center; justify-content:space-between; }
.sm-vd-modal__header h3 { font-size:16px; font-weight:700; margin:0; }
.sm-vd-modal__close { background:none; border:none; font-size:18px; cursor:pointer; color:var(--vd-muted); }
.sm-vd-modal__body { padding:24px; }
.sm-vd-modal__footer { padding:16px 24px; border-top:1px solid var(--vd-border); display:flex; justify-content:flex-end; gap:12px; }

/* ── Payouts ───────────────────────────────────────── */
.sm-vd-payout-summary { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:16px; margin-bottom:24px; }
.sm-vd-payout-card { background:#fff; border-radius:var(--vd-radius); padding:24px; border:1px solid var(--vd-border); display:flex; flex-direction:column; gap:12px; }
.sm-vd-payout-card--available { border-color:var(--vd-green); }
.sm-vd-payout-card__label { font-size:13px; color:var(--vd-muted); }
.sm-vd-payout-card__amount { font-size:2rem; font-weight:800; color:var(--vd-green); }

/* ── Alerts ────────────────────────────────────────── */
.sm-vd-alert { padding:14px 20px; border-radius:8px; display:flex; align-items:center; gap:10px; margin-bottom:20px; font-size:14px; font-weight:600; }
.sm-vd-alert--success { background:#dcfce7; color:#166534; border:1px solid #bbf7d0; }
.sm-vd-alert--error   { background:#fee2e2; color:#991b1b; border:1px solid #fecaca; }

/* ── Pending ───────────────────────────────────────── */
.sm-vd-pending { text-align:center; padding:80px 20px; }
.sm-vd-pending__icon { font-size:64px; margin-bottom:24px; }
.sm-vd-pending h2 { font-size:1.6rem; margin-bottom:12px; }
.sm-vd-pending p { color:var(--vd-muted); margin-bottom:24px; }

/* ── Period form ───────────────────────────────────── */
.sm-vd-period-form select { padding:8px 12px; }

/* ── Helpers ───────────────────────────────────────── */
.sm-text-muted { color:var(--vd-muted); }
.sm-vd-link { color:var(--vd-green); text-decoration:none; font-size:13px; font-weight:600; display:flex; align-items:center; gap:6px; }

/* ── Responsive ────────────────────────────────────── */
/* Sidebar overlay op mobiel */
.sm-vd-sidebar-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.5);
    z-index: 199;
}
.sm-vd-sidebar-overlay.open { display: block; }
.sm-vd-sidebar { transition: transform .3s ease; }

@media (max-width:900px) {
    .sm-vd-sidebar { transform:translateX(-100%); }
    .sm-vd-sidebar.open { transform:translateX(0); }
    .sm-vd-main { margin-left:0; }
    .sm-vd-topbar__toggle { display:block; }
    .sm-vd-form__grid { grid-template-columns:1fr; }
    .sm-vd-quick-actions { grid-template-columns:repeat(2,1fr); }
    .sm-vd-stats-grid { grid-template-columns:repeat(2,1fr); }
    .sm-vd-field-row { grid-template-columns:1fr; }
}
@media (max-width:480px) {
    .sm-vd-content { padding:16px; }
    .sm-vd-stats-grid { grid-template-columns:1fr; }
    .sm-vd-quick-actions { grid-template-columns:repeat(2,1fr); }
}

/* ══════════════════════════════════════════════════════
   RESPONSIVE FIXES – vendor dashboard compleet
   ══════════════════════════════════════════════════════ */

/* ── Tablet (max 900px) ─────────────────────────────── */
@media (max-width:900px) {
    /* Topbar */
    .sm-vd-topbar { padding:0 16px; }
    .sm-vd-topbar__store { max-width:140px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

    /* Tabel scroll op tablet */
    .sm-vd-table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
    .sm-vd-table { min-width:600px; }

    /* Bestellingen tabel */
    .sm-vd-table td, .sm-vd-table th { padding:10px 8px; font-size:13px; }

    /* Formulier */
    .sm-vd-form__grid { grid-template-columns:1fr; }
    .sm-vd-form__sidebar { order:-1; }
    .sm-vd-field-row { grid-template-columns:1fr; }

    /* Uitbetalingen kaarten */
    .sm-vd-payout-summary { grid-template-columns:1fr 1fr; }

    /* Rapporten */
    .sm-vd-stats-grid { grid-template-columns:repeat(2,1fr); }

    /* Snelacties */
    .sm-vd-quick-actions { grid-template-columns:repeat(3,1fr); }
}

/* ── Mobiel (max 600px) ─────────────────────────────── */
@media (max-width:600px) {
    /* Content padding */
    .sm-vd-content { padding:12px; }

    /* Topbar */
    .sm-vd-topbar { height:56px; gap:8px; }
    .sm-vd-topbar__store span { display:none; }

    /* Statistieken */
    .sm-vd-stats-grid { grid-template-columns:repeat(2,1fr); gap:10px; }
    .sm-vd-stat-card { padding:14px; }
    .sm-vd-stat-card__value { font-size:1.4rem; }
    .sm-vd-stat-card__label { font-size:11px; }

    /* Snelacties */
    .sm-vd-quick-actions { grid-template-columns:repeat(2,1fr); gap:8px; }
    .sm-vd-quick-card { padding:14px 10px; font-size:12px; }
    .sm-vd-quick-card i { font-size:20px; }

    /* Filters */
    .sm-vd-filters__row { flex-direction:column; }
    .sm-vd-filters__row .sm-vd-input,
    .sm-vd-filters__row .sm-vd-select,
    .sm-vd-filters__row .sm-vd-btn { width:100%; }

    /* Pagina header */
    .sm-vd-page-header { flex-direction:column; align-items:flex-start; gap:10px; }
    .sm-vd-page-header h2 { font-size:1.1rem; }

    /* Uitbetalingen */
    .sm-vd-payout-summary { grid-template-columns:1fr; }
    .sm-vd-payout-card { padding:16px; }

    /* Product kaarten aanmaken */
    .sm-vd-image-grid { grid-template-columns:repeat(3,1fr); }

    /* Tabellen: touch scroll */
    .sm-vd-table { min-width:500px; }
    .sm-vd-table th, .sm-vd-table td { padding:8px 6px; font-size:12px; }

    /* Rapport periode selector */
    .sm-vd-period-form select { width:100%; }

    /* Instellingen sidebar */
    .sm-vd-form__sidebar { order:0; }

    /* Productformulier */
    .sm-vd-checkbox-label { font-size:13px; }

    /* Modal */
    .sm-vd-modal__box { width:95vw; padding:20px 16px; }

    /* Wisselkoers grid */
    div[style*="repeat(auto-fill,minmax(260px"] { grid-template-columns:1fr !important; }

    /* Basis valuta knoppen */
    div[style*="display:flex;gap:10px"] label { width:100%; justify-content:flex-start; }
}

/* ── Klein mobiel (max 400px) ───────────────────────── */
@media (max-width:400px) {
    .sm-vd-stats-grid { grid-template-columns:1fr; }
    .sm-vd-quick-actions { grid-template-columns:repeat(2,1fr); }
    .sm-vd-badge { font-size:10px; padding:2px 6px; }
}
