/**
 * (PREGNORF ✅) DMXR4 — V4 UI Kit (Tokens + Components + Flows)
 * File: factory/studio/assets/css/dmxr4-v4-ui.css
 * Version: 10.4.8
 *
 * Scope
 *  - Shared visual language for BOTH admin UI and visitor UI.
 *  - Uses a light reset + component primitives inside .dmxr4-v4 only.
 *  - Skinning: override CSS variables (brand, radius, shadow, ink, etc).
 */


:root{
  /* Safe defaults (used only if a design kit/skin does not define tokens). */
  --dmxr4-brand-default:#ff2d55;
  --dmxr4-ink-default:#0f172a;
  --dmxr4-muted-default:#475569;
  --dmxr4-bg-default:#ffffff;
  --dmxr4-soft-default:#f8fafc;
  --dmxr4-card-default:#ffffff;
  --dmxr4-border-default:rgba(15,23,42,.12);
  --dmxr4-on-brand-default:#ffffff;
  --v4-info:#2563eb;
}


.dmxr4-v4{
  /* ---- Tokens (inherit from design kit / skin when present) ---- */
  --v4-ink: var(--dmxr4-ink, var(--dmxr4-ink-default));
  --v4-muted: var(--dmxr4-muted, var(--dmxr4-muted-default));
  --v4-bg: var(--dmxr4-bg, var(--dmxr4-bg-default));
  --v4-card: var(--dmxr4-card, var(--dmxr4-card-default));
  --v4-soft: var(--dmxr4-soft, var(--dmxr4-soft-default));
  --v4-border: var(--dmxr4-border, var(--dmxr4-border-default));
  --v4-border-strong: color-mix(in srgb, var(--v4-ink) 18%, transparent);

  /* Alias tokens used by some app shells (avoid "missing var" styling) */
  --v4-line: var(--v4-border);
  --v4-paper: var(--v4-card);
  --v4-ring: color-mix(in srgb, var(--v4-info) 25%, transparent);

  --v4-brand: var(--dmxr4-brand, var(--dmxr4-brand-default));
  --v4-brand-ink: var(--dmxr4-on-brand, var(--dmxr4-on-brand-default));

  /* Status tokens */
  --v4-success: var(--dmxr4-success, var(--v4-success, #16a34a));
  --v4-warning: var(--dmxr4-warning, var(--v4-warning, #f59e0b));
  --v4-danger:  var(--dmxr4-danger,  var(--v4-danger,  #ef4444));

  /* Typography */
  --v4-font-sans: var(--dmxr4-font-sans, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");
  --v4-font-mono: var(--dmxr4-font-mono, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
  --v4-font-size: var(--dmxr4-font-size, 16px);
  --v4-line-height: var(--dmxr4-line-height, 1.55);

  --v4-radius: 14px;
  --v4-radius-sm: 10px;
  --v4-shadow: 0 8px 24px color-mix(in srgb, var(--v4-ink) 8%, transparent);
  --v4-shadow-sm: 0 6px 18px color-mix(in srgb, var(--v4-ink) 10%, transparent);

  --v4-gap: 14px;
  --v4-pad: 14px;
  --v4-pad-lg: 18px;

  color: var(--v4-ink);

  /* Base type */
  font-family: var(--v4-font-sans);
  font-size: var(--v4-font-size);
  line-height: var(--v4-line-height);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  /* Avoid theme inheritance surprises */
  font-weight: 500;
}


/* Light reset inside v4 scope */
.dmxr4-v4 :where(*, *::before, *::after){ box-sizing:border-box; }
.dmxr4-v4 :where(button,input,select,textarea){ font: inherit; color: inherit; }
.dmxr4-v4 :where(a){ color:inherit; text-decoration:none; }
.dmxr4-v4 :where(p){ margin:0 0 .8rem; color:var(--v4-ink); }
.dmxr4-v4 :where(small){ color:var(--v4-muted); }
.dmxr4-v4 :where(h1,h2,h3){ margin:0 0 .5rem; letter-spacing:-.01em; }
.dmxr4-v4 :where(code){ font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }

/** (PREGNORF ✅) ------------------------------------------------
    Base form controls (fallback)
    Purpose: keep modules polished even if they output plain <input>/<button>
    Scope: .dmxr4-v4 only (no theme bleed)
-------------------------------------------------------------- */
.dmxr4-v4 :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),
                 textarea,
                 select){
  width:100%;
  min-width:0;
  border-radius:12px;
  border:1px solid var(--v4-border);
  background:var(--v4-card);
  padding:10px 12px;
  line-height:1.35;
  color:var(--v4-ink);
  outline:none;
  box-shadow: inset 0 1px 0 color-mix(in srgb, var(--v4-card) 65%, transparent);
}
.dmxr4-v4 :where(textarea){ min-height:120px; resize:vertical; }
.dmxr4-v4 :where(input::placeholder, textarea::placeholder){ color:var(--v4-muted); opacity:.85; }
.dmxr4-v4 :where(input:focus, textarea:focus, select:focus){
  border-color: color-mix(in srgb, var(--v4-brand) 55%, var(--v4-border));
  box-shadow: 0 0 0 4px var(--v4-ring), inset 0 1px 0 color-mix(in srgb, var(--v4-card) 65%, transparent);
}
.dmxr4-v4 :where(button:not(.v4-btn),
                 input[type="submit"],
                 input[type="button"],
                 input[type="reset"]){
  appearance:none;
  border-radius:12px;
  border:1px solid var(--v4-border);
  background:var(--v4-card);
  color:var(--v4-ink);
  padding:10px 12px;
  font-weight:800;
  line-height:1;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}
.dmxr4-v4 :where(button:not(.v4-btn):hover,
                 input[type="submit"]:hover,
                 input[type="button"]:hover,
                 input[type="reset"]:hover){
  border-color: color-mix(in srgb, var(--v4-ink) 22%, var(--v4-border));
  box-shadow: var(--v4-shadow-sm);
  transform: translateY(-.5px);
}
.dmxr4-v4 :where(button:not(.v4-btn):active,
                 input[type="submit"]:active,
                 input[type="button"]:active,
                 input[type="reset"]:active){
  transform: translateY(0);
  box-shadow:none;
}

/* <details>/<summary> fallback (FAQ-style without requiring module CSS) */
.dmxr4-v4 details{
  border:1px solid var(--v4-border);
  border-radius:14px;
  background:var(--v4-card);
  padding:10px 12px;
}
.dmxr4-v4 details + details{ margin-top:10px; }
.dmxr4-v4 summary{
  cursor:pointer;
  font-weight:850;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.dmxr4-v4 summary::-webkit-details-marker{ display:none; }
.dmxr4-v4 details[open] summary{ margin-bottom:8px; }


/* ---- Components ---- */
.dmxr4-v4 .v4-card{
  background: var(--v4-card);
  border: 1px solid var(--v4-border);
  border-radius: var(--v4-radius);
  box-shadow: var(--v4-shadow-sm);
}

.dmxr4-v4 .v4-card--soft{
  background: var(--v4-soft);
  border-color: var(--v4-border);
  box-shadow: none;
}

.dmxr4-v4 .v4-card__hd{ padding: var(--v4-pad-lg) var(--v4-pad-lg) 10px; border-bottom:1px solid var(--v4-border); }
.dmxr4-v4 .v4-card__bd{ padding: var(--v4-pad-lg); }
.dmxr4-v4 .v4-card__ft{ padding: 10px var(--v4-pad-lg) var(--v4-pad-lg); border-top:1px solid var(--v4-border); }

.dmxr4-v4 .v4-btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:8px;
  border-radius: 12px;
  padding: 10px 12px;
  border: 1px solid var(--v4-border);
  background: var(--v4-soft);
  color: var(--v4-ink);
  font-weight: 800;
  cursor: pointer;
  user-select: none;
}
.dmxr4-v4 .v4-btn:hover{ border-color: var(--v4-border-strong); }
.dmxr4-v4 .v4-btn:hover{ color: var(--v4-ink); }
.dmxr4-v4 .v4-btn:active{ color: var(--v4-ink); }
.dmxr4-v4 .v4-btn:disabled{ opacity:.55; cursor:not-allowed; }
.dmxr4-v4 .v4-btn--primary{
  background: var(--v4-brand);
  border-color: color-mix(in srgb, var(--v4-brand) 75%, transparent);
  color: var(--v4-brand-ink);
}
.dmxr4-v4 .v4-btn--ghost{ background: transparent; }
.dmxr4-v4 .v4-btn--sm{ padding: 8px 10px; border-radius: 10px; font-weight: 800; }

.dmxr4-v4 .v4-input,
.dmxr4-v4 .v4-select,
.dmxr4-v4 .v4-textarea{
  width:100%;
  border-radius: 12px;
  border: 1px solid var(--v4-border);
  background: var(--v4-card);
  color: var(--v4-ink);
  padding: 10px 12px;
  outline: none;
}
.dmxr4-v4 .v4-textarea{ min-height: 110px; resize: vertical; }
.dmxr4-v4 :where(.v4-input,.v4-select,.v4-textarea):focus{
  border-color: color-mix(in srgb, var(--v4-brand) 35%, var(--v4-border));
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--v4-brand) 18%, transparent);
}

.dmxr4-v4 .v4-chip{
  display:inline-flex; align-items:center; gap:8px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid var(--v4-border);
  background: var(--v4-soft);
  color: var(--v4-ink);
  font-weight: 800;
  font-size: .88rem;
}

/* ---- Status chips (Health, diagnostics) ---- */
.dmxr4-v4 .v4-chip.dmxr4-chip--status{
  position: relative;
}
.dmxr4-v4 .v4-chip.dmxr4-chip--status::before{
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: currentColor;
}
.dmxr4-v4 .v4-chip.dmxr4-chip--pass{
  border-color: color-mix(in srgb, var(--v4-success) 45%, var(--v4-border));
  background: color-mix(in srgb, var(--v4-success) 12%, var(--v4-soft));
  color: var(--v4-success);
}
.dmxr4-v4 .v4-chip.dmxr4-chip--warn{
  border-color: color-mix(in srgb, var(--v4-warn) 55%, var(--v4-border));
  background: color-mix(in srgb, var(--v4-warn) 12%, var(--v4-soft));
  color: var(--v4-danger);
}
.dmxr4-v4 .v4-chip.dmxr4-chip--fail{
  border-color: color-mix(in srgb, var(--v4-brand) 50%, var(--v4-border));
  background: color-mix(in srgb, var(--v4-brand) 12%, var(--v4-soft));
  color: var(--v4-brand);
}
.dmxr4-v4 .v4-chip.dmxr4-chip--info{
  border-color: color-mix(in srgb, var(--v4-info) 45%, var(--v4-border));
  background: color-mix(in srgb, var(--v4-info) 10%, var(--v4-soft));
  color: var(--v4-info);
}

/* ---- Flows: stepper + progress ---- */
.dmxr4-v4 .v4-stepper{
  display:flex; flex-direction:column; gap: 10px;
}
.dmxr4-v4 .v4-stepper__progress{
  display:flex; align-items:center; gap:10px;
}
.dmxr4-v4 .v4-progress{
  flex:1;
  height: 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--v4-border) 55%, var(--v4-card));
  overflow:hidden;
  border: 1px solid var(--v4-border);
}
.dmxr4-v4 .v4-progress__bar{
  height: 100%;
  width: 0%;
  background: var(--v4-brand);
  border-radius: 999px;
  transition: width .18s ease;
}
.dmxr4-v4 .v4-stepper__meta{
  font-weight: 800;
  color: var(--v4-muted);
  font-size: .92rem;
  white-space: nowrap;
}
.dmxr4-v4 .v4-stepper__actions{
  display:flex; gap:10px; justify-content:flex-end;
}

/* Mobile polish */
@media (max-width: 920px){
  .dmxr4-v4 .v4-stepper__actions{ justify-content: space-between; }
}


/* DMXR4 embed form control color fix */

/* Prevent iOS/WebKit from rendering form control text as transparent when themes override colors. */
:where(.dmxr4-embed-only, .dmxr4pv2-shell, .dmxr4-factory-app-shell, .dmxr4-app-shell) :where(input, select, textarea, button) {
  -webkit-text-fill-color: currentColor;
}


/* ---- Empty states ---- */

.dmxr4-v4 .v4-empty{
  display:flex;
  gap:14px;
  align-items:flex-start;
  padding: 16px;
  border-radius: var(--v4-radius);
  border: 1px dashed color-mix(in srgb, var(--v4-border) 70%, var(--v4-card));
  background: color-mix(in srgb, var(--v4-soft) 78%, var(--v4-card));
}
.dmxr4-v4 .v4-empty__icon{
  width:40px;
  height:40px;
  border-radius: 14px;
  display:grid;
  place-items:center;
  background: var(--v4-card);
  border: 1px solid var(--v4-border);
  box-shadow: var(--v4-shadow-sm);
  flex: 0 0 auto;
}
.dmxr4-v4 .v4-empty__icon svg{ width:20px; height:20px; opacity:.92; }
.dmxr4-v4 .v4-empty__body{ flex:1 1 auto; min-width: 220px; }
.dmxr4-v4 .v4-empty__title{ margin:0; font-weight:900; letter-spacing:.2px; }
.dmxr4-v4 .v4-empty__text{ margin:6px 0 0; color: var(--v4-muted); }
.dmxr4-v4 .v4-empty__actions{ margin-top: 12px; display:flex; gap:10px; flex-wrap:wrap; }

/* Hard-stop theme hover overrides inside Kadence/other themes */
.dmxr4-v4 .v4-btn.is-primary:hover,
.dmxr4-v4 .v4-btn.is-primary:active{
  color: var(--v4-brand-ink);
}



/* =========================================================
   Inbox (Owner Dashboard) — SSOT / V4 runtime styles
   Ensures Inbox + Automation screens are styled in the public
   owner dashboard (app.settings.css is not guaranteed here).
   ========================================================= */

/* (Copied from app.settings.css — Inbox UI) */
.dmxr4-inboxFilters{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:end;
}
.dmxr4-inboxFilters label{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:12px;
  opacity:.85;
}
.dmxr4-inboxFilters input[type="text"],
.dmxr4-inboxFilters select{
  min-height:38px;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 12%, transparent);
  background:var(--v4-card, #fff);
  color:var(--v4-ink, #111);
}

/* Card grid */
.dmxr4-inboxGrid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
}
@media (max-width: 980px){
  .dmxr4-inboxGrid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px){
  .dmxr4-inboxGrid{ grid-template-columns:1fr; }
}

.dmxr4-inboxCard{
  border-radius:18px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 10%, transparent);
  background:var(--v4-card, #fff);
  padding:12px 12px 10px;
  box-shadow:0 10px 30px rgba(0,0,0,.06);
  cursor:pointer;
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.dmxr4-inboxCard:hover{
  transform:translateY(-1px);
  box-shadow:0 14px 40px rgba(0,0,0,.10);
  border-color:color-mix(in srgb, var(--v4-ink, #111) 18%, transparent);
}
.dmxr4-inboxCard.is-unread,
.dmxr4-inboxCard[data-unread="1"]{
  border-color:color-mix(in srgb, var(--v4-brand, #4f46e5) 55%, transparent);
  background:color-mix(in srgb, var(--v4-card, #fff) 85%, var(--v4-brand, #4f46e5) 15%);
}
.dmxr4-inboxCard__top{
  display:flex;
  gap:10px;
  align-items:flex-start;
  justify-content:space-between;
}
.dmxr4-inboxCard__name{
  font-weight:700;
  font-size:14px;
  line-height:1.2;
}
.dmxr4-inboxCard__meta{
  font-size:12px;
  opacity:.7;
  margin-top:2px;
}
.dmxr4-inboxCard__msg{
  margin-top:10px;
  font-size:13px;
  line-height:1.35;
  opacity:.92;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.dmxr4-inboxChips{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}
.dmxr4-inboxChip{
  font-size:11px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 12%, transparent);
  background:color-mix(in srgb, var(--v4-card, #fff) 92%, var(--v4-ink, #111) 8%);
}
.dmxr4-inboxBadge{
  font-size:11px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 14%, transparent);
  background:color-mix(in srgb, var(--v4-card, #fff) 88%, var(--v4-ink, #111) 12%);
}
.dmxr4-inboxBadge.is-unread{
  border-color:color-mix(in srgb, var(--v4-brand, #4f46e5) 65%, transparent);
  background:color-mix(in srgb, var(--v4-brand, #4f46e5) 16%, var(--v4-card, #fff) 84%);
}

/* Card bottom row */
.dmxr4-inboxCard__btm{
  margin-top:10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.dmxr4-inboxSelWrap{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  opacity:.8;
}

/* Drawer + backdrop */
.dmxr4-inboxBackdrop{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.38);
  backdrop-filter:blur(2px);
  z-index:99998;
}
.dmxr4-inboxDrawer{
  position:fixed;
  top:12px;
  right:12px;
  bottom:12px;
  width:440px;
  max-width:calc(100vw - 24px);
  border-radius:22px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 14%, transparent);
  background:var(--v4-card, #fff);
  box-shadow:0 22px 70px rgba(0,0,0,.25);
  z-index:99999;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.dmxr4-inboxDrawer[hidden],
.dmxr4-inboxBackdrop[hidden]{ display:none !important; }

.dmxr4-inboxDrawer__hd{
  padding:14px 14px 12px;
  border-bottom:1px solid color-mix(in srgb, var(--v4-ink, #111) 10%, transparent);
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.dmxr4-inboxDrawer__hd h3{
  margin:0;
  font-size:16px;
  line-height:1.2;
}
.dmxr4-inboxDrawer__hdMeta{
  margin-top:4px;
  font-size:12px;
  opacity:.7;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}
.dmxr4-inboxDrawer__hdActions{
  display:flex;
  gap:8px;
  align-items:center;
}

.dmxr4-inboxDrawer__bd{
  padding:14px;
  overflow:auto;
}
.dmxr4-inboxDrawer__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
@media (max-width: 520px){
  .dmxr4-inboxDrawer__grid{ grid-template-columns:1fr; }
}
.dmxr4-inboxDrawer__field label{
  display:block;
  font-size:12px;
  opacity:.8;
  margin-bottom:6px;
}
.dmxr4-inboxDrawer__field input[type="text"],
.dmxr4-inboxDrawer__field textarea,
.dmxr4-inboxDrawer__field select{
  width:100%;
  min-height:38px;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 12%, transparent);
  background:var(--v4-card, #fff);
  color:var(--v4-ink, #111);
}
.dmxr4-inboxDrawer__pre{
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size:12px;
  line-height:1.4;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 10%, transparent);
  background:color-mix(in srgb, var(--v4-card, #fff) 92%, var(--v4-ink, #111) 8%);
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
.dmxr4-inboxInlineLabel{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:10px;
  font-size:12px;
  opacity:.85;
}

.dmxr4-inboxPipe{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:12px 0 2px;
}
.dmxr4-inboxPipeBtn{
  border-radius:999px;
  padding:8px 10px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 12%, transparent);
  background:color-mix(in srgb, var(--v4-card, #fff) 92%, var(--v4-ink, #111) 8%);
  font-size:12px;
  cursor:pointer;
}
.dmxr4-inboxPipeBtn.is-active{
  border-color:color-mix(in srgb, var(--v4-brand, #4f46e5) 55%, transparent);
  background:color-mix(in srgb, var(--v4-brand, #4f46e5) 16%, var(--v4-card, #fff) 84%);
}

.dmxr4-inboxDrawer__actions{
  padding:12px 14px 14px;
  border-top:1px solid color-mix(in srgb, var(--v4-ink, #111) 10%, transparent);
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
}

/* Bulk bar */
.dmxr4-inboxBulk{
  position:sticky;
  bottom:0;
  margin-top:14px;
  padding:12px;
  border-radius:18px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 12%, transparent);
  background:color-mix(in srgb, var(--v4-card, #fff) 92%, var(--v4-ink, #111) 8%);
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
}
.dmxr4-inboxBulk strong{ font-size:13px; }
.dmxr4-inboxBulk select,
.dmxr4-inboxBulk input[type="text"]{
  min-height:38px;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 12%, transparent);
  background:var(--v4-card, #fff);
  color:var(--v4-ink, #111);
}

/* Fallback: style WP admin ".button" used inside inbox when shell CSS isn't present */
.dmxr4-inboxActions .button,
.dmxr4-inboxDrawer .button,
.dmxr4-inboxBulk .button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:36px;
  padding:8px 12px;
  border-radius:12px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 14%, transparent);
  background:var(--v4-card, #fff);
  color:var(--v4-ink, #111);
  text-decoration:none;
  cursor:pointer;
}
.dmxr4-inboxActions .button.button-primary,
.dmxr4-inboxDrawer .button.button-primary,
.dmxr4-inboxBulk .button.button-primary{
  background:color-mix(in srgb, var(--v4-brand, #4f46e5) 16%, var(--v4-card, #fff) 84%);
  border-color:color-mix(in srgb, var(--v4-brand, #4f46e5) 55%, transparent);
}

/* Automation */
.dmxr4-inboxAutomation{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.dmxr4-inboxAutomation .dmxr4-inboxSummary{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:12px;
}
@media (max-width: 820px){
  .dmxr4-inboxAutomation .dmxr4-inboxSummary{ grid-template-columns:1fr; }
}
.dmxr4-inboxSummaryCard{
  border-radius:18px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 10%, transparent);
  background:var(--v4-card, #fff);
  padding:14px;
  box-shadow:0 10px 30px rgba(0,0,0,.06);
}
.dmxr4-inboxSummaryCard h4{ margin:0 0 6px; font-size:14px; }
.dmxr4-inboxSummaryCard p{ margin:0; font-size:12px; opacity:.8; }

.dmxr4-inboxSection{
  border-radius:20px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 10%, transparent);
  background:var(--v4-card, #fff);
  padding:14px;
}
.dmxr4-inboxSection h3{ margin:0 0 10px; font-size:14px; }
.dmxr4-inboxSection .description{ margin:0 0 12px; opacity:.8; font-size:12px; }

.dmxr4-inboxNotify__row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  justify-content:space-between;
}
.dmxr4-inboxNotify__toggle{
  display:flex;
  align-items:center;
  gap:10px;
}
.dmxr4-inboxNotify__toggle input{ transform:scale(1.1); }
.dmxr4-inboxNotify__fields{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:12px;
}
@media (max-width: 720px){
  .dmxr4-inboxNotify__fields{ grid-template-columns:1fr; }
}
.dmxr4-inboxNotify__fields input[type="text"],
.dmxr4-inboxNotify__fields input[type="email"],
.dmxr4-inboxNotify__fields select,
.dmxr4-inboxTriage input[type="text"],
.dmxr4-inboxTriage select{
  min-height:38px;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 12%, transparent);
  background:var(--v4-card, #fff);
  color:var(--v4-ink, #111);
}

.dmxr4-inboxTriage__rules{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  overflow:hidden;
  border-radius:14px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 10%, transparent);
}
.dmxr4-inboxTriage__rules th,
.dmxr4-inboxTriage__rules td{
  padding:10px;
  font-size:12px;
  text-align:left;
  border-bottom:1px solid color-mix(in srgb, var(--v4-ink, #111) 8%, transparent);
}
.dmxr4-inboxTriage__rules th{ opacity:.85; }
.dmxr4-inboxTriage__rules tr:last-child td{ border-bottom:0; }


/* --------------------------------------------------------------------------
   Inbox / Automation UI (owner dashboard) — v2 markup (grid + div-table)
   Fixes: broken / unstyled Notifications + Triage forms
   -------------------------------------------------------------------------- */

.dmxr4 .dmxr4-inboxNotify,
.dmxr4 .dmxr4-inboxTriage{
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 10%, transparent);
  border-radius:16px;
  background:var(--v4-card, #fff);
  padding:14px;
}

.dmxr4 .dmxr4-inboxNotify__hd,
.dmxr4 .dmxr4-inboxTriage__hd{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}

.dmxr4 .dmxr4-inboxNotify__title,
.dmxr4 .dmxr4-inboxTriage__title{
  font-weight:800;
  font-size:16px;
  letter-spacing:-0.01em;
}

.dmxr4 .dmxr4-inboxNotify__meta,
.dmxr4 .dmxr4-inboxTriage__meta{
  margin-top:2px;
  font-size:12px;
  opacity:.72;
}

.dmxr4 .dmxr4-inboxNotify__form,
.dmxr4 .dmxr4-inboxTriage__form,
.dmxr4 .dmxr4-inboxTriage__run{
  margin:0;
}

.dmxr4 .dmxr4-inboxNotify__grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.dmxr4 .dmxr4-inboxNotify__toggle,
.dmxr4 .dmxr4-inboxTriage__toggle{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:10px 12px;
  border-radius:14px;
  background:color-mix(in srgb, var(--v4-ink, #111) 3%, transparent);
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 8%, transparent);
  font-size:13px;
}

.dmxr4 .dmxr4-inboxNotify__toggle{ grid-column:1 / -1; }

.dmxr4 .dmxr4-inboxNotify__toggle input,
.dmxr4 .dmxr4-inboxTriage__toggle input{
  margin-top:2px;
}

.dmxr4 .dmxr4-inboxNotify__field label,
.dmxr4 .dmxr4-inboxTriage__field label{
  display:block;
  font-size:12px;
  opacity:.75;
  margin-bottom:6px;
}

.dmxr4 .dmxr4-inboxNotify__field input,
.dmxr4 .dmxr4-inboxNotify__field textarea,
.dmxr4 .dmxr4-inboxNotify__field select,
.dmxr4 .dmxr4-inboxTriage__cell input,
.dmxr4 .dmxr4-inboxTriage__cell select,
.dmxr4 .dmxr4-inboxTriage__cell textarea{
  width:100%;
  min-height:40px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 12%, transparent);
  background:var(--v4-card, #fff);
  color:var(--v4-ink, #111);
}

.dmxr4 .dmxr4-inboxNotify__field textarea,
.dmxr4 .dmxr4-inboxTriage__cell textarea{
  min-height:120px;
  resize:vertical;
}

.dmxr4 .dmxr4-inboxNotify__details{
  margin-top:12px;
  border-top:1px solid color-mix(in srgb, var(--v4-ink, #111) 8%, transparent);
  padding-top:12px;
}

.dmxr4 .dmxr4-inboxNotify__details > summary{
  cursor:pointer;
  list-style:none;
  user-select:none;
  font-weight:800;
  font-size:13px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 10%, transparent);
  background:color-mix(in srgb, var(--v4-ink, #111) 2%, transparent);
}

.dmxr4 .dmxr4-inboxNotify__details[open] > summary{
  background:color-mix(in srgb, var(--v4-ink, #111) 3%, transparent);
}

.dmxr4 .dmxr4-inboxNotify__tokens{
  margin-top:10px;
  font-size:12px;
  opacity:.70;
  padding:10px 12px;
  border-radius:14px;
  border:1px dashed color-mix(in srgb, var(--v4-ink, #111) 18%, transparent);
  background:color-mix(in srgb, var(--v4-ink, #111) 1.5%, transparent);
}

.dmxr4 .dmxr4-inboxNotify__actions,
.dmxr4 .dmxr4-inboxTriage__actions{
  margin-top:12px;
  display:flex;
  justify-content:flex-end;
  gap:10px;
}

/* Triage div-table */
.dmxr4 .dmxr4-inboxTriage__table{
  margin-top:10px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 10%, transparent);
  border-radius:16px;
  overflow:hidden;
}

.dmxr4 .dmxr4-inboxTriage__thead,
.dmxr4 .dmxr4-inboxTriage__row{
  display:grid;
  grid-template-columns: 1.1fr 2.4fr 1fr 1.1fr;
}

.dmxr4 .dmxr4-inboxTriage__thead{
  background:color-mix(in srgb, var(--v4-ink, #111) 3%, transparent);
}

.dmxr4 .dmxr4-inboxTriage__th{
  padding:10px 12px;
  font-size:12px;
  font-weight:800;
  opacity:.78;
  border-right:1px solid color-mix(in srgb, var(--v4-ink, #111) 7%, transparent);
}
.dmxr4 .dmxr4-inboxTriage__th:last-child{ border-right:0; }

.dmxr4 .dmxr4-inboxTriage__cell{
  padding:10px 12px;
  border-top:1px solid color-mix(in srgb, var(--v4-ink, #111) 7%, transparent);
  border-right:1px solid color-mix(in srgb, var(--v4-ink, #111) 7%, transparent);
}
.dmxr4 .dmxr4-inboxTriage__row .dmxr4-inboxTriage__cell:last-child{ border-right:0; }

.dmxr4 .dmxr4-inboxTriage__hint{
  margin-top:10px;
  font-size:12px;
  opacity:.72;
}

.dmxr4 .dmxr4-inboxTriage__runRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 10%, transparent);
  border-radius:16px;
  background:color-mix(in srgb, var(--v4-ink, #111) 1.5%, transparent);
}

.dmxr4 .dmxr4-inboxTriage__runText{ font-size:13px; opacity:.85; }

/* Make legacy WP "button" classes look like v4 buttons inside the DMXR4 shell */
.dmxr4 .button,
.dmxr4 a.button,
.dmxr4 button.button,
.dmxr4 input[type="submit"].button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:9px 12px;
  border-radius:999px;
  border:1px solid color-mix(in srgb, var(--v4-ink, #111) 14%, transparent);
  background:color-mix(in srgb, var(--v4-ink, #111) 2%, transparent);
  color:var(--v4-ink, #111);
  font-weight:800;
  font-size:12px;
  text-decoration:none;
  cursor:pointer;
  box-shadow:none;
}

.dmxr4 .button.button-primary{
  background:var(--v4-brand, #2563eb);
  border-color:color-mix(in srgb, var(--v4-brand, #2563eb) 70%, #000);
  color:var(--v4-brand-ink, #fff);
}

.dmxr4 .button.disabled,
.dmxr4 .button:disabled{
  opacity:.55;
  cursor:not-allowed;
  pointer-events:none;
}

@media (max-width: 780px){
  .dmxr4 .dmxr4-inboxNotify__grid{ grid-template-columns:1fr; }
  .dmxr4 .dmxr4-inboxTriage__thead{ display:none; }
  .dmxr4 .dmxr4-inboxTriage__row{
    grid-template-columns:1fr;
  }
  .dmxr4 .dmxr4-inboxTriage__cell{
    border-right:0;
    padding:10px 12px;
  }
  .dmxr4 .dmxr4-inboxTriage__cell[data-label]:before{
    content:attr(data-label);
    display:block;
    font-size:11px;
    font-weight:800;
    opacity:.65;
    margin-bottom:6px;
  }
}

.dmxr4 .dmxr4-inboxNotify__details > summary::-webkit-details-marker{ display:none; }
.dmxr4 .dmxr4-inboxNotify__details > summary::marker{ content:""; }


/* --- Inbox Notify (Automation tab) - current markup compatibility --- */
.dmxr4-inboxNotify{
  background: var(--v4-card, #fff);
  border: 1px solid var(--v4-border, rgba(0,0,0,.10));
  border-radius: var(--v4-radius, 16px);
  box-shadow: var(--v4-shadow-sm, 0 6px 18px rgba(0,0,0,.06));
  padding: 14px;
}
.dmxr4-inboxNotify__hd{
  display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
  margin-bottom:10px;
}
.dmxr4-inboxNotify__title{
  font-weight: 750;
  letter-spacing: -0.01em;
}
.dmxr4-inboxNotify__meta{
  font-size: 12px;
  opacity: .7;
  margin-top: 2px;
}
.dmxr4-inboxNotify__form{ margin: 0; }
.dmxr4-inboxNotify__grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 12px;
  margin-top: 10px;
}
@media (max-width: 900px){
  .dmxr4-inboxNotify__grid{ grid-template-columns: 1fr; }
}
.dmxr4-inboxNotify__toggle{
  grid-column: 1 / -1;
  display:flex;
  gap: 10px;
  align-items:center;
  padding: 10px 12px;
  border: 1px solid var(--v4-border, rgba(0,0,0,.10));
  border-radius: 14px;
  background: var(--v4-soft, rgba(0,0,0,.03));
}
.dmxr4-inboxNotify__toggle input[type="checkbox"]{
  width: 16px; height: 16px;
}
.dmxr4-inboxNotify__field label{
  display:block;
  font-size: 12px;
  opacity: .75;
  margin: 0 0 6px;
}
.dmxr4-inboxNotify__field input[type="text"],
.dmxr4-inboxNotify__field input[type="email"],
.dmxr4-inboxNotify__field textarea{
  width: 100%;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--v4-border, rgba(0,0,0,.12));
  background: var(--v4-card, #fff);
  color: inherit;
  outline: none;
}
.dmxr4-inboxNotify__field textarea{ min-height: 140px; resize: vertical; }
.dmxr4-inboxNotify__field input:focus,
.dmxr4-inboxNotify__field textarea:focus{
  border-color: rgba(99,102,241,.55);
  box-shadow: 0 0 0 3px rgba(99,102,241,.16);
}
.dmxr4-inboxNotify__details{
  margin-top: 12px;
  border: 1px solid var(--v4-border, rgba(0,0,0,.10));
  border-radius: 14px;
  overflow: hidden;
  background: var(--v4-card, #fff);
}
.dmxr4-inboxNotify__details > summary{
  list-style: none;
  cursor: pointer;
  padding: 10px 12px;
  font-weight: 650;
  background: var(--v4-soft, rgba(0,0,0,.03));
  border-bottom: 1px solid var(--v4-border, rgba(0,0,0,.08));
}
.dmxr4-inboxNotify__details > summary::-webkit-details-marker{ display:none; }
.dmxr4-inboxNotify__details[open] > summary{
  background: rgba(99,102,241,.07);
}
.dmxr4-inboxNotify__details .dmxr4-inboxNotify__field{
  padding: 10px 12px;
}
.dmxr4-inboxNotify__details .dmxr4-inboxNotify__field + .dmxr4-inboxNotify__field{
  border-top: 1px solid var(--v4-border, rgba(0,0,0,.08));
}
.dmxr4-inboxNotify__tokens{
  font-size: 12px;
  opacity: .7;
  padding: 10px 12px;
  border-top: 1px dashed var(--v4-border, rgba(0,0,0,.12));
}
.dmxr4-inboxNotify__actions{
  display:flex;
  justify-content:flex-end;
  gap: 10px;
  margin-top: 12px;
}

/* --- Minor polish for Inbox cards in Owner dashboard --- */
.dmxr4-inboxCard{
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.dmxr4-inboxCard:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 26px rgba(0,0,0,.10);
}
.dmxr4-inboxCard:focus{
  outline: none;
  box-shadow: 0 0 0 4px rgba(99,102,241,.18), 0 10px 26px rgba(0,0,0,.10);
}

/* Ensure WP-admin style buttons inside owner dashboard don't leak */
.dmxr4 .dmxr4-inboxTriage__actions .button,
.dmxr4 .dmxr4-inboxTriage__actions .button-secondary{
  all: unset;
}

/* --- Inbox: bulk row layout (owner-grade) --- */
.dmxr4-inboxBulk__row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}