/* #1905 — Admin → Delivery methods styles.
   Theme tokens only, no colour literals. Badges follow the opaque chip
   convention (admin-coding-svc / admin-ai-roles). */
.dm-root { display: flex; flex-direction: column; gap: 24px; margin-top: 24px; font-size: 14px; color: var(--text); }
.dm-root h3 { margin: 0; font-size: 16px; }

/* Table --------------------------------------------------------------- */
.dm-root .dm-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.dm-root .dm-table caption { caption-side: top; text-align: left; padding: 0 0 8px; font-weight: 700; color: var(--text); }
.dm-root .dm-table th,
.dm-root .dm-table td { padding: 8px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: middle; }
.dm-root .dm-table thead th { color: var(--text-dim); font-weight: 600; white-space: nowrap; }

/* Cells --------------------------------------------------------------- */
.dm-root .dm-pb-name { display: block; font-weight: 600; color: var(--text); }
.dm-root .dm-pb-id { display: block; font-family: var(--font-mono); font-size: 12px; color: var(--text-dim); margin-top: 2px; overflow-wrap: anywhere; }
.dm-root .dm-mono { font-family: var(--font-mono); font-size: 12px; color: var(--text-dim); overflow-wrap: anywhere; }

/* Badges -------------------------------------------------------------- */
.dm-root .dm-badge { display: inline-block; padding: 1px 7px; border-radius: 999px; font-size: 11px; font-weight: 600; line-height: 1.5; border: 1px solid var(--line); background: var(--bg-2); color: var(--text); }
.dm-root .dm-badge-on { border-color: var(--success); color: var(--success); }
.dm-root .dm-badge-off { color: var(--text-dim); border-color: var(--line); }
.dm-root .dm-badge-edited { border-color: var(--warning); color: var(--warning); background: var(--bg-3); }
.dm-root .dm-badge-business { border-color: var(--accent); color: var(--accent); }

/* Sections ------------------------------------------------------------ */
.dm-root .dm-org-panel,
.dm-root .dm-templates,
.dm-root .dm-classes,
.dm-root .dm-agents,
.dm-root .dm-seed,
.dm-root .dm-editor { padding-top: 16px; border-top: 1px solid var(--line); margin-top: 24px; display: flex; flex-direction: column; gap: 12px; }

/* Choices / fields ----------------------------------------------------- */
.dm-root .dm-org-choice,
.dm-root .dm-choice { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 8px; min-height: 44px; color: var(--text); font-weight: 500; }
.dm-root .dm-org-choice-name { overflow-wrap: anywhere; }
.dm-root .dm-org-disabled-reason { color: var(--text-dim); font-size: 12px; }
.dm-root .disabled-reason,
.dm-root .dm-hint,
.dm-root .dm-asof { color: var(--text-dim); font-size: 12px; margin: 0; }

/* Errors / warnings / receipts ---------------------------------------- */
.dm-root .dm-error { margin: 0; color: var(--danger); font-size: 13px; }
.dm-root .dm-warning { margin: 0; padding: 8px 12px; border-left: 3px solid var(--warning); border-radius: var(--radius-sm); background: var(--bg-3); color: var(--text); }
.dm-root .dm-receipt { margin: 0; color: var(--success); font-weight: 600; }

/* Fields -------------------------------------------------------------- */
.dm-root .dm-field { display: flex; flex-direction: column; gap: 4px; }
.dm-root .dm-label { color: var(--text); font-weight: 600; }
/* A checkbox in a field keeps its own size at the start of the row (the shared input rule would stretch and centre it). */
.dm-root .dm-field input[type="checkbox"] { width: auto; align-self: flex-start; }
.dm-root .dm-templates input[type="text"] { min-height: 44px; }

/* Gates / actions ----------------------------------------------------- */
.dm-root .dm-gate-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; }
.dm-root .dm-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.dm-root .dm-actions button { min-height: 44px; }

/* Conflict banner ----------------------------------------------------- */
.dm-root .dm-conflict { padding: 12px; border: 2px solid var(--warning); border-radius: var(--radius-sm); background: var(--bg-2); display: flex; flex-direction: column; gap: 8px; }
.dm-root .dm-conflict p { margin: 0; }
.dm-root .dm-conflict-actions { display: flex; flex-wrap: wrap; gap: 8px; }

/* Phone: let the table scroll inside itself; stack rows and inputs ----- */
@media (max-width: 640px) {
  .dm-root .dm-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .dm-root .dm-gate-row,
  .dm-root .dm-actions { flex-direction: column; align-items: stretch; }
  .dm-root .dm-field input,
  .dm-root .dm-field select,
  .dm-root .dm-gate-row input,
  .dm-root .dm-gate-row select,
  .dm-root .dm-templates input[type="text"],
  .dm-root .dm-templates select { width: 100%; }
  .dm-root .dm-templates .dm-table,
  .dm-root .dm-templates .dm-table tbody,
  .dm-root .dm-templates .dm-table tr,
  .dm-root .dm-templates .dm-table td { display: block; width: 100%; }
  .dm-root .dm-templates .dm-table thead { display: none; }
  .dm-root .dm-templates .dm-table tr { border-bottom: 1px solid var(--line); padding: 8px 0; }
  .dm-root .dm-templates .dm-table td { border-bottom: none; padding: 4px 0; }
  .dm-root .dm-templates .dm-table td::before { content: attr(data-label); display: block; font-size: 12px; color: var(--text-dim); }
}

/* Respect user's motion preference ------------------------------------ */
@media (prefers-reduced-motion: reduce) {
  .dm-root,
  .dm-root .dm-table,
  .dm-root .dm-conflict { transition: none; }
}
