/*
 * Admin (Super Admin console) — shell + componentes fiéis aos mockups
 * `docs/screens/admin-*.html`.
 *
 * Visual diferente do painel do lojista (cor azul) e da onboarding pública —
 * usa ROSE como accent pra deixar claro que é contexto interno/operacional.
 * Slate como neutros (afinado com a paleta admin do Bunto DS).
 *
 * Classes prefixadas `.adm-*`. Layout horizontal com header sticky em vez
 * de sidebar (admin não tem mobile-first; é desktop-first interno).
 */

/* Tokens admin globais — admin migra view a view; até lá o header partial
 * precisa renderizar corretamente fora do `.adm-shell`. Prefixo `--adm-*`
 * evita colisão. */
:root {
  --adm-rose-50:  #FFF1F2;
  --adm-rose-100: #FFE4E6;
  --adm-rose-200: #FECDD3;
  --adm-rose-500: #F43F5E;
  --adm-rose-600: #E11D48;
  --adm-rose-700: #BE123C;

  --adm-slate-50:  #F8FAFC;
  --adm-slate-100: #F1F5F9;
  --adm-slate-200: #E2E8F0;
  --adm-slate-300: #CBD5E1;
  --adm-slate-400: #94A3B8;
  --adm-slate-500: #64748B;
  --adm-slate-600: #475569;
  --adm-slate-700: #334155;
  --adm-slate-800: #1E293B;
  --adm-slate-900: #0F172A;

  --adm-green-50:  #F0FDF4;
  --adm-green-200: #BBF7D0;
  --adm-green-700: #15803D;
  --adm-amber-50:  #FFFBEB;
  --adm-amber-100: #FEF3C7;
  --adm-amber-200: #FDE68A;
  --adm-amber-600: #D97706;
  --adm-amber-700: #B45309;
  --adm-emerald-50:  #ECFDF5;
  --adm-emerald-100: #D1FAE5;
  --adm-emerald-200: #A7F3D0;
  --adm-emerald-300: #6EE7B7;
  --adm-emerald-600: #059669;
  --adm-emerald-700: #047857;

  --adm-border: rgba(15, 23, 42, .08);
}

.adm-shell {
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.55;
  color: var(--adm-slate-800);
  background: var(--adm-slate-50);
  min-height: 100vh;
  min-height: 100dvh;
  -webkit-font-smoothing: antialiased;
}

/* ============================================================================
 * HEADER (sticky, 2 linhas: nav + título)
 * ========================================================================== */
.adm-header {
  background: #fff;
  border-bottom: 1px solid var(--adm-slate-200);
  position: sticky;
  top: 0;
  z-index: 30;
}

.adm-header-top {
  max-width: 1024px;
  margin: 0 auto;
  padding: 0 24px;
  height: 56px;
  display: flex;
  align-items: center;
  gap: 32px;
}

.adm-header-brand {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 17px;
  letter-spacing: -.03em;
  color: var(--adm-slate-900);
  white-space: nowrap;
  flex-shrink: 0;
  text-decoration: none;
}
.adm-header-brand em {
  font-style: normal;
  color: var(--adm-rose-600);
}

.adm-header-nav {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 1;
}
.adm-nav-link {
  padding: 6px 12px;
  border-radius: var(--radius-md);
  font-size: 14px;
  font-weight: 500;
  color: var(--adm-slate-500);
  text-decoration: none;
  transition: background 120ms var(--ease-out), color 120ms var(--ease-out);
  white-space: nowrap;
}
.adm-nav-link:hover { background: var(--adm-slate-100); color: var(--adm-slate-800); }
.adm-nav-link.is-active {
  background: var(--adm-rose-50);
  color: var(--adm-rose-600);
  font-weight: 600;
}

.adm-header-right {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}
.adm-header-email {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--adm-slate-400);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 200px;
}
.adm-btn-signout {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding: 0 12px;
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 500;
  color: var(--adm-slate-500);
  border: 1px solid var(--adm-slate-200);
  background: transparent;
  cursor: pointer;
  transition: background 120ms var(--ease-out), color 120ms var(--ease-out);
  white-space: nowrap;
}
.adm-btn-signout:hover { background: var(--adm-slate-100); color: var(--adm-slate-800); }

.adm-header-title-bar {
  border-top: 1px solid var(--adm-border);
  background: #fff;
}
.adm-header-title-inner {
  max-width: 1024px;
  margin: 0 auto;
  padding: 14px 24px;
}
.adm-header-title-inner h1 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 22px;
  letter-spacing: -.03em;
  color: var(--adm-slate-900);
  margin: 0;
}

/* Wrapper de form_button — Rails enrola button_to em form */
.adm-shell form.button_to { margin: 0; padding: 0; display: inline-block; }

/* ============================================================================
 * MAIN
 * ========================================================================== */
.adm-main {
  max-width: 1024px;
  margin: 0 auto;
  padding: 28px 24px 60px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.adm-main--narrow { max-width: 672px; padding-top: 36px; }

/* ============================================================================
 * FLASH
 * ========================================================================== */
.adm-flash-success {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 16px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--adm-green-200);
  background: var(--adm-green-50);
  color: var(--adm-green-700);
  font-size: 14px;
}
.adm-flash-danger {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 16px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--adm-rose-200);
  background: var(--adm-rose-50);
  color: var(--adm-rose-700);
  font-size: 14px;
}
.adm-flash-success svg, .adm-flash-danger svg { flex-shrink: 0; margin-top: 1px; }

/* ============================================================================
 * SECTION HEADER
 * ========================================================================== */
.adm-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: -8px;
}
.adm-section-title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 18px;
  letter-spacing: -.02em;
  color: var(--adm-slate-900);
  margin: 0;
}

/* ============================================================================
 * BUTTONS
 * ========================================================================== */
.adm-btn-dark {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 38px;
  padding: 0 16px;
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 13px;
  background: var(--adm-slate-900);
  color: #fff;
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition: background 120ms var(--ease-out);
  white-space: nowrap;
}
.adm-btn-dark:hover { background: var(--adm-slate-700); }

.adm-btn-rose {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding: 0 12px;
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 13px;
  background: var(--adm-rose-50);
  color: var(--adm-rose-600);
  border: 1px solid var(--adm-rose-200);
  cursor: pointer;
  text-decoration: none;
  transition: background 120ms var(--ease-out), color 120ms var(--ease-out);
  white-space: nowrap;
}
.adm-btn-rose:hover { background: var(--adm-rose-100); color: var(--adm-rose-700); }

.adm-btn-cancel {
  display: inline-flex;
  align-items: center;
  height: 40px;
  padding: 0 16px;
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-weight: 500;
  font-size: 14px;
  color: var(--adm-slate-500);
  border: 1px solid var(--adm-slate-200);
  background: transparent;
  cursor: pointer;
  text-decoration: none;
  transition: background 120ms var(--ease-out), color 120ms var(--ease-out);
}
.adm-btn-cancel:hover { background: var(--adm-slate-100); color: var(--adm-slate-800); }

/* ============================================================================
 * TABLE CARD
 * ========================================================================== */
.adm-table-card {
  background: #fff;
  border: 1px solid var(--adm-slate-200);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.adm-table-card-head {
  padding: 12px 16px;
  border-bottom: 1px solid var(--adm-slate-200);
  background: var(--adm-slate-50);
}
.adm-table-card-head h3 {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  color: var(--adm-slate-500);
  text-transform: uppercase;
  letter-spacing: .08em;
  margin: 0;
}

.adm-table {
  width: 100%;
  border-collapse: collapse;
}
.adm-table thead th {
  padding: 10px 16px;
  text-align: left;
  font-size: 11px;
  font-weight: 600;
  color: var(--adm-slate-400);
  letter-spacing: .06em;
  text-transform: uppercase;
  white-space: nowrap;
  background: var(--adm-slate-50);
  border-bottom: 1px solid var(--adm-slate-200);
}
.adm-table thead th:last-child { text-align: right; }
.adm-table tbody tr {
  border-bottom: 1px solid var(--adm-slate-200);
  transition: background 100ms var(--ease-out);
}
.adm-table tbody tr:last-child { border-bottom: none; }
.adm-table tbody tr:hover { background: var(--adm-slate-50); }
.adm-table tbody td {
  padding: 12px 16px;
  font-size: 14px;
  color: var(--adm-slate-700);
  vertical-align: middle;
}
.adm-table tbody td:last-child { text-align: right; }

.adm-td-mono  { font-family: var(--font-mono); font-size: 12px; color: var(--adm-slate-500); }
.adm-td-label { font-weight: 500; color: var(--adm-slate-800); }
.adm-td-date  { font-family: var(--font-mono); font-size: 12px; color: var(--adm-slate-500); white-space: nowrap; }
.adm-td-empty {
  padding: 28px 16px !important;
  text-align: center !important;
  font-size: 14px;
  color: var(--adm-slate-400);
  font-style: italic;
}

/* ============================================================================
 * BADGES de status
 * ========================================================================== */
.adm-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  padding: 2px 8px;
  border-radius: 9999px;
  border: 1px solid;
  white-space: nowrap;
}
.adm-badge--pending  { background: var(--adm-amber-50); border-color: var(--adm-amber-200);  color: var(--adm-amber-700); }
.adm-badge--consumed { background: var(--adm-green-50); border-color: var(--adm-green-200);  color: var(--adm-green-700); }
.adm-badge--expired  { background: var(--adm-slate-100); border-color: var(--adm-slate-200); color: var(--adm-slate-500); }

/* ============================================================================
 * FORM CARD (admin-convite-novo modo form)
 * ========================================================================== */
.adm-card-form {
  background: #fff;
  border: 1px solid var(--adm-slate-200);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.adm-card-form-head { padding: 20px 24px 0; }
.adm-card-form-head h2 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 18px;
  letter-spacing: -.02em;
  color: var(--adm-slate-900);
  margin-bottom: 4px;
}
.adm-card-form-head p {
  font-size: 13px;
  color: var(--adm-slate-500);
  line-height: 1.5;
  margin-bottom: 20px;
}
.adm-form-body {
  padding: 0 24px 24px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.adm-form-divider {
  height: 1px;
  background: var(--adm-slate-200);
  margin: 0 -24px;
}
.adm-form-foot {
  padding: 16px 24px;
  border-top: 1px solid var(--adm-slate-200);
  background: var(--adm-slate-50);
  display: flex;
  align-items: center;
  gap: 10px;
}

.adm-field { display: flex; flex-direction: column; gap: 5px; }
.adm-field-label {
  font-weight: 500;
  font-size: 13px;
  color: var(--adm-slate-700);
}
.adm-field-opt {
  font-size: 11px;
  font-weight: 400;
  color: var(--adm-slate-400);
  margin-left: 4px;
}
.adm-field-hint {
  font-size: 12px;
  color: var(--adm-slate-400);
  line-height: 1.4;
  margin-top: 3px;
}

.adm-input {
  width: 100%;
  height: 42px;
  padding: 0 12px;
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--adm-slate-800);
  background: #fff;
  border: 1px solid var(--adm-slate-300);
  border-radius: var(--radius-md);
  outline: none;
  transition: border-color 120ms var(--ease-out), box-shadow 120ms var(--ease-out);
  -webkit-appearance: none;
  appearance: none;
}
.adm-input::placeholder { color: var(--adm-slate-400); }
.adm-input:hover { border-color: var(--adm-slate-400); }
.adm-input:focus {
  border-color: var(--adm-slate-700);
  box-shadow: 0 0 0 3px rgba(15, 23, 42, .08);
}

/* ============================================================================
 * SUCCESS CARD (admin-convite-novo modo gerado)
 * ========================================================================== */
.adm-card-success {
  background: var(--adm-emerald-50);
  border: 1px solid var(--adm-emerald-300);
  border-radius: var(--radius-lg);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.adm-success-head { display: flex; align-items: center; gap: 10px; }
.adm-success-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--adm-emerald-600);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.adm-success-h2 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 20px;
  letter-spacing: -.02em;
  color: var(--adm-emerald-700);
  margin: 0;
}
.adm-success-text {
  font-size: 14px;
  color: var(--adm-emerald-700);
  line-height: 1.6;
  margin: 0;
}
.adm-success-text strong { font-weight: 600; }

.adm-url-box {
  background: #fff;
  border: 1px solid var(--adm-emerald-200);
  border-radius: var(--radius-md);
  padding: 14px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.adm-url-code {
  flex: 1;
  font-family: var(--font-mono);
  font-size: 13px;
  color: var(--adm-slate-800);
  word-break: break-all;
  line-height: 1.5;
  user-select: all;
  cursor: text;
  min-width: 0;
}
.adm-btn-copy {
  flex-shrink: 0;
  height: 36px;
  padding: 0 14px;
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  background: var(--adm-emerald-600);
  border: none;
  cursor: pointer;
  white-space: nowrap;
  transition: background 120ms var(--ease-out);
}
.adm-btn-copy:hover { background: var(--adm-emerald-700); }
.adm-btn-copy.is-copied { background: var(--adm-emerald-700); }

.adm-back-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 500;
  color: var(--adm-slate-500);
  text-decoration: none;
  transition: color 120ms var(--ease-out);
  align-self: flex-start;
}
.adm-back-link:hover { color: var(--adm-slate-800); }

@media (max-width: 768px) {
  .adm-header-top   { padding: 0 16px; gap: 16px; }
  .adm-header-email { display: none; }
  .adm-main         { padding: 20px 16px 48px; }
  .adm-table-card   { overflow-x: auto; }
  .adm-table        { min-width: 640px; }
  .adm-url-box      { flex-direction: column; align-items: stretch; }
  .adm-btn-copy     { width: 100%; }
}

/* ============================================================================
 * BREADCRUMB (no header title bar)
 * ========================================================================== */
.adm-breadcrumb {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--adm-slate-400);
}
.adm-breadcrumb a {
  color: var(--adm-slate-400);
  text-decoration: none;
  transition: color 120ms var(--ease-out);
}
.adm-breadcrumb a:hover     { color: var(--adm-rose-600); }
.adm-breadcrumb-sep         { color: var(--adm-slate-300); }
.adm-breadcrumb-current     { color: var(--adm-slate-600); font-weight: 500; }

/* ============================================================================
 * FILTER CHIPS (admin-lojas)
 * ========================================================================== */
.adm-filters {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.adm-filter-chip {
  display: inline-flex;
  align-items: center;
  height: 34px;
  padding: 0 14px;
  border-radius: 9999px;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 500;
  border: 1px solid var(--adm-slate-300);
  background: #fff;
  color: var(--adm-slate-600);
  text-decoration: none;
  cursor: pointer;
  transition: background 120ms var(--ease-out),
              color 120ms var(--ease-out),
              border-color 120ms var(--ease-out);
  white-space: nowrap;
}
.adm-filter-chip:hover { border-color: var(--adm-slate-400); color: var(--adm-slate-800); }
.adm-filter-chip.is-active {
  background: var(--adm-slate-900);
  color: #fff;
  border-color: var(--adm-slate-900);
}
.adm-filter-count {
  font-family: var(--font-mono);
  font-size: 11px;
  margin-left: 6px;
  opacity: .65;
}

/* ============================================================================
 * TABLE — extensões pro index de lojas
 * ========================================================================== */
.adm-table-meta {
  font-size: 13px;
  color: var(--adm-slate-400);
  padding: 10px 16px;
  border-bottom: 1px solid var(--adm-slate-200);
  background: var(--adm-slate-50);
}
.adm-table-meta strong { color: var(--adm-slate-600); font-weight: 600; }

.adm-td-name  { font-weight: 600; color: var(--adm-slate-900); }
.adm-td-slug  { font-family: var(--font-mono); font-size: 12px; color: var(--adm-slate-500); }
.adm-td-email { font-family: var(--font-mono); font-size: 13px; font-weight: 500; color: var(--adm-slate-800); }
.adm-td-store { font-size: 13px; color: var(--adm-slate-600); }
.adm-td-store.is-none { color: var(--adm-slate-300); font-style: italic; }

.adm-link-details {
  font-size: 13px;
  font-weight: 500;
  color: var(--adm-slate-500);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 10px;
  border-radius: var(--radius-md);
  text-decoration: none;
  transition: background 120ms var(--ease-out), color 120ms var(--ease-out);
}
.adm-link-details:hover { background: var(--adm-slate-100); color: var(--adm-slate-800); }

/* ============================================================================
 * BADGES de Loja (estados active / suspended / soft_deleted)
 * ========================================================================== */
.adm-badge--active       { background: var(--adm-emerald-100); color: var(--adm-emerald-700); }
.adm-badge--suspended    { background: var(--adm-amber-100);   color: var(--adm-amber-700); }
.adm-badge--soft-deleted { background: var(--adm-rose-100);    color: var(--adm-rose-700); }
.adm-badge-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
  background: currentColor;
}
.adm-badge-since {
  font-size: 11px;
  font-family: var(--font-mono);
  color: var(--adm-slate-400);
  margin-left: 4px;
}

/* ============================================================================
 * GENERIC CARD (admin show) — distinto de .adm-table-card e .adm-card-form
 * ========================================================================== */
.adm-card {
  background: #fff;
  border: 1px solid var(--adm-slate-200);
  border-radius: var(--radius-2xl);
  overflow: hidden;
}
.adm-card-head {
  padding: 16px 20px;
  border-bottom: 1px solid var(--adm-slate-200);
  background: var(--adm-slate-50);
}
.adm-card-head h2 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 16px;
  letter-spacing: -.02em;
  color: var(--adm-slate-900);
  margin: 0;
}
.adm-card-body { padding: 20px; }
.adm-card-foot {
  padding: 14px 20px;
  border-top: 1px solid var(--adm-slate-200);
  background: var(--adm-slate-50);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

/* DL (Loja#show) — 1 col mobile, 2 col desktop ≥640px */
.adm-dl { display: grid; grid-template-columns: 1fr; gap: 0; margin: 0; padding: 0; }
.adm-dl-row {
  display: flex;
  align-items: baseline;
  gap: 16px;
  padding: 10px 0;
  border-bottom: 1px solid var(--adm-slate-100);
}
.adm-dl-row:first-child { padding-top: 0; }
.adm-dl-row:last-child  { padding-bottom: 0; border-bottom: none; }

.adm-dt {
  font-size: 12px;
  font-weight: 600;
  color: var(--adm-slate-400);
  flex-shrink: 0;
  min-width: 130px;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.adm-dd {
  font-size: 14px;
  color: var(--adm-slate-700);
  word-break: break-word;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin: 0;
}
.adm-dd.is-mono   { font-family: var(--font-mono); font-size: 13px; }
.adm-dd.is-italic { font-style: italic; color: var(--adm-slate-500); }
.adm-dd.is-muted  { color: var(--adm-slate-300); }
.adm-dd a {
  color: var(--adm-rose-600);
  font-weight: 500;
  text-decoration: none;
  transition: color 120ms var(--ease-out);
}
.adm-dd a:hover { color: var(--adm-rose-700); text-decoration: underline; }

.adm-link-edit {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 13px;
  font-weight: 500;
  color: var(--adm-slate-500);
  padding: 5px 10px;
  border-radius: var(--radius-md);
  border: 1px solid var(--adm-slate-200);
  text-decoration: none;
  transition: background 120ms var(--ease-out), color 120ms var(--ease-out);
}
.adm-link-edit:hover { background: var(--adm-slate-100); color: var(--adm-slate-800); }

@media (min-width: 640px) {
  .adm-dl { grid-template-columns: 1fr 1fr; }
  .adm-dl-row.adm-dl-row--span2 { grid-column: span 2; }
}

/* ============================================================================
 * STATS GRID (Loja#show — métricas operacionais + financeiras)
 * ========================================================================== */
.adm-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
.adm-stat {
  border: 1px solid var(--adm-slate-200);
  border-radius: var(--radius-lg);
  background: var(--adm-slate-50);
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.adm-stat-label {
  font-size: 11px;
  font-weight: 600;
  color: var(--adm-slate-400);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.adm-stat-value {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 20px;
  letter-spacing: -.02em;
  color: var(--adm-slate-900);
}
.adm-stat-value small {
  font-size: 13px;
  font-weight: 600;
  color: var(--adm-slate-400);
}
.adm-stat-value.adm-stat--loss { color: var(--adm-rose-600); }
.adm-stat-sub {
  font-size: 12px;
  color: var(--adm-slate-400);
}

@media (min-width: 640px) {
  .adm-stats { grid-template-columns: repeat(4, 1fr); }
}

/* ============================================================================
 * STATE ACTIONS (Loja#show — suspend/unsuspend/soft_delete/recover)
 * ========================================================================== */
.adm-state-section {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.adm-state-action {
  border: 1px solid var(--adm-slate-200);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.adm-reason-block {
  padding: 14px 16px;
  border-bottom: 1px solid var(--adm-slate-200);
  background: var(--adm-slate-50);
}
.adm-reason-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--adm-slate-500);
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-bottom: 6px;
}
.adm-reason-input {
  width: 100%;
  height: 40px;
  padding: 0 12px;
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--adm-slate-800);
  background: #fff;
  border: 1px solid var(--adm-slate-300);
  border-radius: var(--radius-md);
  outline: none;
  transition: border-color 120ms var(--ease-out), box-shadow 120ms var(--ease-out);
}
.adm-reason-input::placeholder { color: var(--adm-slate-400); }
.adm-reason-input:focus {
  border-color: var(--adm-slate-700);
  box-shadow: 0 0 0 3px rgba(15, 23, 42, .08);
}
.adm-reason-input.is-err { border-color: var(--adm-rose-600); }

.adm-action-foot {
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.adm-action-desc {
  font-size: 13px;
  color: var(--adm-slate-500);
  line-height: 1.4;
  flex: 1;
  margin: 0;
}

/* Botões coloridos das ações de estado */
.adm-btn-amber {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 36px;
  padding: 0 16px;
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  background: var(--adm-amber-100);
  color: var(--adm-amber-700);
  border: 1px solid var(--adm-amber-200);
  cursor: pointer;
  text-decoration: none;
  transition: background 120ms var(--ease-out);
  white-space: nowrap;
}
.adm-btn-amber:hover { background: var(--adm-amber-200); }

.adm-btn-green {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 36px;
  padding: 0 16px;
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  background: var(--adm-emerald-100);
  color: var(--adm-emerald-700);
  border: 1px solid var(--adm-emerald-200);
  cursor: pointer;
  text-decoration: none;
  transition: background 120ms var(--ease-out);
  white-space: nowrap;
}
.adm-btn-green:hover { background: var(--adm-emerald-200); }

.adm-btn-rose-solid {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 36px;
  padding: 0 16px;
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  background: var(--adm-rose-600);
  color: #fff;
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition: background 120ms var(--ease-out);
  white-space: nowrap;
}
.adm-btn-rose-solid:hover { background: var(--adm-rose-700); }

/* ============================================================================
 * BACK LINK (lojas show/edit)
 * ========================================================================== */
.adm-back-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 500;
  color: var(--adm-slate-400);
  text-decoration: none;
  transition: color 120ms var(--ease-out);
  align-self: flex-start;
}
.adm-back-link:hover { color: var(--adm-slate-700); }

/* ============================================================================
 * ADR NOTICE (banner amarelo "apenas Super Admin pode alterar...")
 * ========================================================================== */
.adm-adr-notice {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 16px;
  background: var(--adm-amber-50);
  border: 1px solid var(--adm-amber-200);
  border-left: 4px solid var(--adm-amber-700);
  border-radius: var(--radius-lg);
  font-size: 14px;
  color: var(--adm-amber-700);
  line-height: 1.55;
}
.adm-adr-notice svg { flex-shrink: 0; margin-top: 1px; }
.adm-adr-notice strong { font-weight: 600; }
.adm-adr-notice code {
  font-family: var(--font-mono);
  font-size: 12px;
  background: var(--adm-amber-100);
  border: 1px solid var(--adm-amber-200);
  border-radius: 4px;
  padding: 1px 6px;
}

/* ============================================================================
 * ERR BANNER (no edit — lista de erros do model)
 * ========================================================================== */
.adm-err-banner {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--adm-rose-200);
  background: var(--adm-rose-50);
  color: var(--adm-rose-700);
  font-size: 14px;
  line-height: 1.6;
}
.adm-err-banner svg { flex-shrink: 0; margin-top: 2px; }
.adm-err-banner ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin-top: 4px;
  padding: 0;
}
.adm-err-banner ul li::before { content: "· "; font-weight: 700; }

/* ============================================================================
 * EDIT — input modifier + frozen rows + audit hint
 * ========================================================================== */
.adm-input.is-mono { font-family: var(--font-mono); font-size: 14px; }

.adm-frozen-block { display: flex; flex-direction: column; gap: 12px; }
.adm-frozen-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--adm-slate-400);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-bottom: 2px;
}
.adm-frozen-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 12px;
  background: var(--adm-slate-50);
  border: 1px solid var(--adm-slate-200);
  border-radius: var(--radius-md);
}
.adm-frozen-val {
  font-family: var(--font-mono);
  font-size: 13px;
  color: var(--adm-slate-500);
  flex: 1;
}
.adm-frozen-lock { color: var(--adm-slate-300); flex-shrink: 0; }
.adm-frozen-note {
  font-size: 12px;
  color: var(--adm-slate-400);
  margin-top: 4px;
  font-style: italic;
}

.adm-divider {
  height: 1px;
  background: var(--adm-slate-100);
  margin: 4px 0;
}

.adm-audit-hint {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12px;
  color: var(--adm-slate-400);
  padding: 12px 16px;
  background: var(--adm-slate-50);
  border-radius: var(--radius-lg);
  border: 1px solid var(--adm-slate-200);
  line-height: 1.5;
}
.adm-audit-hint svg { flex-shrink: 0; margin-top: 1px; }
.adm-audit-hint strong { color: var(--adm-slate-600); font-weight: 600; }
.adm-audit-hint code {
  font-family: var(--font-mono);
  font-size: 11px;
  background: var(--adm-slate-100);
  border-radius: 4px;
  padding: 1px 5px;
}

/* ============================================================================
 * FIELD modifiers + reused for stores edit
 * ========================================================================== */
.adm-form-meta {
  margin: 0;
  padding: 12px 20px;
  font-size: 11px;
  line-height: 1.4;
  letter-spacing: .01em;
  color: var(--adm-slate-500);
  background: var(--adm-slate-50);
  border-bottom: 1px solid var(--adm-slate-200);
}
.adm-form-meta em {
  font-style: normal;
  font-weight: 600;
  color: var(--adm-slate-700);
}
.adm-field-err {
  font-size: 12px;
  color: var(--adm-rose-600);
  margin-top: 3px;
}
.adm-input.is-err {
  border-color: var(--adm-rose-600);
  box-shadow: 0 0 0 3px rgba(225, 29, 72, .08);
}

/* ============================================================================
 * SELLERS — extensões pro admin/sellers (show)
 * ========================================================================== */

/* Badge "Terminada" (vendedor) — mesmo visual de --soft-deleted, mas nome
 * semântico próprio pra clareza no template. */
.adm-badge--terminated { background: var(--adm-rose-100); color: var(--adm-rose-700); }

/* Variantes coloridas do .adm-card (border + head/foot tintados). */
.adm-card--rose       { border-color: var(--adm-rose-200); }
.adm-card--emerald    { border-color: var(--adm-emerald-300); }
.adm-card-head--rose {
  background: var(--adm-rose-50);
  border-bottom-color: var(--adm-rose-200);
}
.adm-card-head--rose h2    { color: var(--adm-rose-700); }
.adm-card-head--emerald {
  background: var(--adm-emerald-50);
  border-bottom-color: var(--adm-emerald-200);
}
.adm-card-head--emerald h2 { color: var(--adm-emerald-700); }
.adm-card-foot--rose {
  background: var(--adm-rose-50);
  border-top-color: var(--adm-rose-200);
}
.adm-card-foot--emerald {
  background: var(--adm-emerald-50);
  border-top-color: var(--adm-emerald-200);
}

/* Card body com flex-column gap (pra empilhar notice + fields no terminate/revert) */
.adm-card-body--gap {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Subtitle do card-head (ex: "Terminar Lojista (LGPD art. 18 VI)") */
.adm-card-head-sub {
  font-size: 13px;
  font-weight: 500;
  opacity: .7;
  margin-left: 6px;
}

/* DD em coluna (seller show — badge + state-sub stacked verticalmente) */
.adm-dd--stack {
  flex-direction: column;
  align-items: flex-start;
}
.adm-dd.is-tiny { font-family: var(--font-mono); font-size: 11px; color: var(--adm-slate-400); }

/* State-sub — texto fininho abaixo do badge (motivo, janela aberta/fechada) */
.adm-state-sub {
  font-size: 12px;
  margin-top: 5px;
  line-height: 1.5;
}
.adm-state-sub--detail        { color: var(--adm-rose-700); }
.adm-state-sub--window-open   { color: var(--adm-emerald-700); }
.adm-state-sub--window-closed { color: var(--adm-slate-400); }

/* Notice blocks (3 variantes — rose, emerald, amber já existe em .adm-adr-notice) */
.adm-notice {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 13px 16px;
  border-radius: var(--radius-lg);
  font-size: 13px;
  line-height: 1.55;
}
.adm-notice svg { flex-shrink: 0; margin-top: 1px; }
.adm-notice strong { font-weight: 600; }
.adm-notice code {
  font-family: var(--font-mono);
  font-size: 11px;
  background: rgba(0, 0, 0, .06);
  border-radius: 4px;
  padding: 1px 5px;
}
.adm-notice--rose    { background: var(--adm-rose-50);    border: 1px solid var(--adm-rose-200);    color: var(--adm-rose-700); }
.adm-notice--emerald { background: var(--adm-emerald-50); border: 1px solid var(--adm-emerald-200); color: var(--adm-emerald-700); }
.adm-notice--amber {
  background: var(--adm-amber-50);
  border: 1px solid var(--adm-amber-200);
  color: var(--adm-amber-700);
  border-left: 4px solid var(--adm-amber-700);
}

/* Select com chevron + Textarea (variantes do form admin) */
.adm-select {
  width: 100%;
  height: 42px;
  padding: 0 32px 0 12px;
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--adm-slate-800);
  background: #fff;
  border: 1px solid var(--adm-slate-300);
  border-radius: var(--radius-md);
  outline: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='2' stroke-linecap='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  transition: border-color 120ms var(--ease-out), box-shadow 120ms var(--ease-out);
}
.adm-select:focus {
  border-color: var(--adm-slate-700);
  box-shadow: 0 0 0 3px rgba(15, 23, 42, .08);
}

.adm-textarea {
  width: 100%;
  min-height: 72px;
  padding: 10px 12px;
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--adm-slate-800);
  background: #fff;
  border: 1px solid var(--adm-slate-300);
  border-radius: var(--radius-md);
  outline: none;
  resize: vertical;
  line-height: 1.5;
  -webkit-appearance: none;
  appearance: none;
  transition: border-color 120ms var(--ease-out), box-shadow 120ms var(--ease-out);
}
.adm-textarea::placeholder { color: var(--adm-slate-400); }
.adm-textarea:focus {
  border-color: var(--adm-slate-700);
  box-shadow: 0 0 0 3px rgba(15, 23, 42, .08);
}
.adm-textarea.is-err {
  border-color: var(--adm-rose-600);
  box-shadow: 0 0 0 3px rgba(225, 29, 72, .08);
}

/* Botão verde sólido (emerald-600) — pra "Reverter terminação".
 * Distinto do .adm-btn-green (que é claro/hover-tinted). */
.adm-btn-green-solid {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  height: 42px;
  padding: 0 18px;
  border-radius: var(--radius-md);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 14px;
  background: var(--adm-emerald-600);
  color: #fff;
  border: none;
  cursor: pointer;
  transition: background 120ms var(--ease-out), transform 100ms var(--ease-out);
  white-space: nowrap;
}
.adm-btn-green-solid:hover  { background: var(--adm-emerald-700); }
.adm-btn-green-solid:active { transform: scale(.98); }