/* app/public/css/admin.css — lote admin (admin.html).
   Sobre base.css (kit). Solo lo específico del panel (.adm-…); .confirm-inline
   vive ya en base.css (transversal § 6.8: para toda la app). */

.adm-page { max-width: 1200px; padding-top: 28px; }
/* Contiene los .sr-only y los thead ocultos de las tarjetas: sin esto escapan
   del scroll y alargan el documento en móvil. */
.app-main { position: relative; }

/* ---- Puerta ---- */
.adm-gate-wrap { min-height: 100vh; min-height: 100dvh; display: grid; place-items: center; padding: 24px var(--gutter); }
.adm-gate { width: 100%; max-width: 400px; }
.adm-gate .appbar__mark { margin-bottom: 14px; }
.adm-gate__msg { margin: 8px 0 16px; }

/* ---- Barra: marca + «Admin», anclas, actualizado, email, volver, salir ---- */
.adm-bar { column-gap: 20px; }
.adm-bar .appbar__tabs a.appbar__tab { font-size: 14px; padding-inline: 10px; }
.adm-tagline {
  font: 600 var(--fs-label) / 1 var(--font-sans); letter-spacing: .1em; text-transform: uppercase;
  color: rgb(var(--c-muted)); border: 1px solid var(--line-2); border-radius: 999px; padding: 5px 8px;
}
.adm-updated { color: rgb(var(--c-muted)); font-size: var(--fs-xs); white-space: nowrap; font-variant-numeric: tabular-nums; }
.adm-bar .appbar__email { display: block; max-width: 22ch; font-size: var(--fs-xs); color: rgb(var(--c-soft)); }
.adm-bar .adm-menu { display: none; }
.adm-menu .menu { left: auto; right: 0; }
.adm-menu .menu__head .appbar__email { max-width: 100%; font-size: var(--fs-small); color: rgb(var(--c-text)); }
.adm-menu .menu__head > span:last-child { color: rgb(var(--c-muted)); font-size: var(--fs-xs); }
@media (max-width: 1239.98px) {
  .adm-bar .adm-email-bar { display: none; }
  .adm-bar .adm-menu { display: inline-flex; }
}
@media (max-width: 1099.98px) {
  .adm-bar { grid-template-columns: auto minmax(0, 1fr) auto; }
  .adm-bar .appbar__tabs { display: none; }
  .adm-back-txt { display: none; }
  .adm-bar .adm-back { width: var(--tap); padding-inline: 0; justify-content: center; }
}
@media (max-width: 719.98px) {
  .adm-bar .appbar__end > .adm-refresh, .adm-bar .appbar__end > .adm-updated { display: inline-flex; }
  .adm-updated { font-size: 12px; }
}

/* ---- Tira de estado (sticky en el scroll de .app-main) + banda de sesión ---- */
.adm-top { position: sticky; top: 0; z-index: 10; }
.adm-strip {
  display: flex; align-items: stretch; gap: 0; overflow-x: auto; scrollbar-width: none;
  background: rgb(var(--c-sink)); border-bottom: 1px solid var(--line);
  padding-inline: max(16px, calc((100% - 1200px) / 2 + var(--gutter)));
}
.adm-strip::-webkit-scrollbar { display: none; }
.adm-si {
  flex: none; display: flex; flex-direction: column; justify-content: center; gap: 3px;
  min-height: 52px; padding: 6px 18px 6px 0; margin-right: 18px; border-right: 1px solid var(--line);
  color: rgb(var(--c-text)); text-decoration: none; font-size: var(--fs-small); white-space: nowrap; font-variant-numeric: tabular-nums;
}
.adm-si:last-child, .adm-si.is-last { border-right: 0; margin-right: 0; }
a.adm-si:hover .adm-si__v { text-decoration: underline; text-decoration-color: rgb(var(--c-coral) / .7); text-underline-offset: 3px; }
.adm-si:focus-visible { outline-offset: -3px; box-shadow: none; }
.adm-si__l { font: 600 var(--fs-label) / 1 var(--font-sans); letter-spacing: .1em; text-transform: uppercase; color: rgb(var(--c-muted)); }
.adm-si__v { display: inline-flex; align-items: center; gap: 8px; }
.adm-si__v small { color: rgb(var(--c-muted)); font-size: var(--fs-xs); }
.adm-si--coral .adm-si__v { color: rgb(var(--c-coral)); }
.adm-si--warn .adm-si__v { color: rgb(var(--c-warn)); }
.adm-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; background: rgb(var(--c-live)); }
.adm-dot--coral { background: rgb(var(--c-coral)); }
.adm-dot--warn { width: 7px; height: 7px; border-radius: 1px; transform: rotate(45deg); background: rgb(var(--c-warn)); }
.adm-dot--off { background: none; border: 1.5px solid rgb(var(--c-muted)); }

.adm-shell-band {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px;
  padding: 10px max(16px, calc((100% - 1200px) / 2 + var(--gutter)));
  border-bottom: 1px solid rgb(var(--c-warn) / .45); background: rgb(var(--c-bg));
  box-shadow: inset 0 0 0 999px rgb(var(--c-warn) / .06); font-size: var(--fs-small);
}
.adm-shell-band > .icon { color: rgb(var(--c-warn)); }
.adm-shell-band > .grow { flex: 1 1 14rem; }

/* ---- Cabecera de sección con acciones a la derecha ---- */
.adm-sh { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 8px 16px; margin-bottom: 14px; }
.adm-sh .sect-sub { margin-bottom: 0; }
.adm-count {
  display: inline-grid; place-items: center; min-width: 26px; height: 22px; margin-left: 8px; padding-inline: 7px;
  border-radius: 999px; background: rgb(var(--c-coral) / .14); color: rgb(var(--c-coral));
  font: 600 var(--fs-xs) / 1 var(--font-sans); vertical-align: 3px; font-variant-numeric: tabular-nums;
}
.adm-count--zero { background: rgb(var(--c-line) / .08); color: rgb(var(--c-muted)); }
.adm-page section[id] { scroll-margin-top: 64px; }

/* ---- Backend de imágenes ---- */
.adm-gen-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.adm-gen-cell { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.adm-gen-v { font: 600 1.375rem / 1.15 var(--font-serif); color: rgb(var(--c-text)); overflow-wrap: anywhere; }
.adm-gen-v .mono { font-size: 0.95rem; font-weight: 400; color: rgb(var(--c-soft)); }
.adm-gen-meta { color: rgb(var(--c-muted)); font-size: var(--fs-xs); line-height: 1.5; overflow-wrap: anywhere; }
.adm-gen-meta b { color: rgb(var(--c-soft)); font-weight: 500; }
.adm-gen-view > * + * { margin-top: 12px; }
.adm-q { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 12px; margin-top: 16px; align-items: stretch; }
.adm-q .table-wrap { background: rgb(var(--c-panel)); }
.adm-q .kv { align-content: center; grid-template-columns: max-content minmax(0, 1fr); gap: 8px 20px; }
.adm-q .kv > dd + dt { margin-top: 0; }
.adm-price .mono { margin-left: 8px; font-size: var(--fs-xs); }
.adm-act { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 16px; }
.adm-act .menu { right: auto; left: 0; min-width: 260px; }
.adm-hint { color: rgb(var(--c-muted)); font-size: var(--fs-xs); line-height: 1.45; }
.adm-events { margin-top: 16px; }
.adm-events > summary, .adm-fold > summary {
  display: inline-flex; align-items: center; gap: 8px; min-height: var(--tap); cursor: pointer; list-style: none;
  color: rgb(var(--c-soft)); font: 500 var(--fs-small) / 1.2 var(--font-sans); border-radius: var(--r-sm);
}
.adm-events > summary::-webkit-details-marker, .adm-fold > summary::-webkit-details-marker { display: none; }
.adm-events > summary .icon, .adm-fold > summary .icon { transition: transform var(--dur) ease; color: rgb(var(--c-muted)); }
.adm-events[open] > summary .icon, .adm-fold[open] > summary .icon { transform: rotate(180deg); }
.adm-events > summary:hover, .adm-fold > summary:hover { color: rgb(var(--c-text)); }
.adm-events .table td.wrap-cell { min-width: 22rem; white-space: normal; }
.adm-notice-list { display: flex; flex-direction: column; gap: 6px; }
.adm-notice-list b { color: rgb(var(--c-text)); }
.adm-notice-list .adm-shout { color: rgb(var(--c-warn)); }
.adm-reap { margin-top: 0; }
.adm-reap > summary { min-height: 32px; }
.adm-reap > .adm-notice-list { margin-top: 4px; }
.adm-err-detail { margin-top: 4px; overflow-wrap: anywhere; }
.adm-handover .spread { flex-wrap: wrap; }
.adm-handover .adm-pod-line { margin-top: 12px; }

/* ---- Relevo: pasos numerados ---- */
.adm-steps { list-style: none; margin: 12px 0 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.adm-steps > li {
  display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; border-radius: var(--r-sm);
  border: 1px solid var(--line); background: rgb(var(--c-panel)); font-size: var(--fs-small); color: rgb(var(--c-muted)); min-width: 0;
}
.adm-step__n { font: 600 var(--fs-xs) / 1 var(--font-sans); color: rgb(var(--c-muted)); }
.adm-steps > li[data-state='done'] { color: rgb(var(--c-soft)); }
.adm-steps > li[data-state='done'] .adm-step__n { color: rgb(var(--c-live)); }
.adm-steps > li[aria-current='step'] { color: rgb(var(--c-text)); border-color: rgb(var(--c-coral) / .6); box-shadow: inset 0 2px 0 rgb(var(--c-coral)); }
.adm-steps > li[aria-current='step'] .adm-step__n { color: rgb(var(--c-coral)); }
.adm-steps > li[data-state='failed'] { color: rgb(var(--c-text)); border-color: rgb(var(--c-warn) / .6); }
.adm-steps > li[data-state='failed'] .adm-step__n { color: rgb(var(--c-warn)); }
.adm-steps code { display: block; margin-top: 2px; font: 400 11.5px / 1.3 var(--font-mono); color: rgb(var(--c-muted)); }

/* ---- Pendiente: dos columnas ---- */
.adm-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.adm-two > * { min-width: 0; }
.adm-block-t { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; font: 600 var(--fs-ui) / 1.3 var(--font-sans); }
.rows > li.adm-row-confirm { display: block; background: rgb(var(--c-panel-2)); border-left: 3px solid rgb(var(--c-coral)); }
.rows > li.adm-row-confirm .confirm-inline__text { margin: 0; }
.rows .adm-row-act { display: flex; flex-wrap: wrap; gap: 6px; flex: none; }
.rows .rows__meta .chip { vertical-align: 1px; }
.adm-fold { margin-top: 8px; }
.adm-fold .rows { margin-top: 4px; }
.adm-empty { color: rgb(var(--c-muted)); font-size: var(--fs-small); }

/* ---- Tablas (bloqueos, usuarios, invitaciones) ---- */
.table .adm-acts { text-align: right; }
.adm-cards .table th, .adm-cards .table td { padding-inline: 10px; }
.table .adm-acts > div { display: inline-flex; gap: 6px; }
.table .adm-email .chip { margin-left: 6px; vertical-align: 1px; }
.table .adm-sub.mono { font-family: var(--font-mono); font-size: 12px; }
.table .adm-sub { display: block; color: rgb(var(--c-muted)); font-size: var(--fs-xs); }
.table td .chip + .chip { margin-left: 4px; }
.table tr.adm-dormant > td:not(.adm-acts) { color: rgb(var(--c-muted)); }
.adm-cases > td { padding: 0 !important; background: rgb(var(--c-sink)); white-space: normal; }
.adm-cases .table { font-size: var(--fs-xs); }
.adm-cases .table th { background: rgb(var(--c-sink)); }
.adm-cases__head { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 10px 14px 6px 28px; color: rgb(var(--c-muted)); font-size: var(--fs-xs); }
.adm-cases .table-wrap { border: 0; border-radius: 0; background: none; }
.adm-cases .table td:first-child, .adm-cases .table th:first-child { padding-left: 28px; }
.adm-casetext { padding: 10px 14px 12px 28px !important; white-space: normal; }
.adm-casetext .code-block { white-space: pre-wrap; overflow-wrap: anywhere; margin-top: 6px; }
.adm-casetext .adm-hint + .code-block { margin-bottom: 8px; }
.adm-summary { margin-bottom: 10px; }
.adm-summary b { color: rgb(var(--c-text)); }

/* ---- Usuarios: filtro y chips ---- */
.adm-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; margin-bottom: 12px; }
.adm-search { position: relative; flex: 0 1 320px; min-width: 0; }
.adm-search .field { padding-left: 34px; width: 100%; }
.adm-search .icon { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: rgb(var(--c-muted)); pointer-events: none; }
.adm-more { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--line); color: rgb(var(--c-muted)); font-size: var(--fs-xs); }
.adm-noresult { padding: 16px 14px; color: rgb(var(--c-muted)); font-size: var(--fs-small); }

/* ---- Invitaciones ---- */
.adm-inv-new { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: end; max-width: 640px; }
.adm-inv-new .fgroup { margin: 0; }
.adm-inv-out { margin-top: 12px; max-width: 640px; }

/* ---- Métricas: una fila compacta ---- */
.adm-stats { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border: 1px solid var(--line-2); border-radius: var(--r-md); background: rgb(var(--c-panel)); }
.adm-stats .stat { padding: 14px 16px; border-right: 1px solid var(--line); min-width: 0; }
.adm-stats .stat:last-child { border-right: 0; }
.adm-stats .stat__value { font-size: 1.375rem; font-variant-numeric: tabular-nums; }

/* ---- Estados de sección ---- */
.adm-err .notice__actions { margin-top: 8px; }
.adm-sect-err { margin-bottom: 12px; }

@media (max-width: 1099.98px) {
  .adm-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .adm-stats .stat:nth-child(4) { border-right: 0; }
  .adm-stats .stat:nth-child(n+5) { border-top: 1px solid var(--line); }
}
@media (max-width: 899.98px) {
  .adm-gen-grid, .adm-q, .adm-two { grid-template-columns: minmax(0, 1fr); }
  .adm-steps { grid-template-columns: minmax(0, 1fr); }
  .adm-steps > li { flex-direction: row; align-items: baseline; gap: 10px; }
  .adm-step__n { min-width: 6.5em; }
}
@media (max-width: 719.98px) {
  .adm-page { padding-top: 16px; }
  .adm-act > .btn-coral, .adm-act > .btn-line[data-gen] { width: 100%; min-height: 48px; }
  .adm-act > .menu-anchor { width: 100%; }
  .confirm-inline__actions > .btn { flex: 1 1 100%; }
  .adm-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .adm-stats .stat { border-right: 0; border-top: 1px solid var(--line); }
  .adm-stats .stat:nth-child(odd) { border-right: 1px solid var(--line); }
  .adm-stats .stat:nth-child(-n+2) { border-top: 0; }
  .adm-stats .stat:last-child:nth-child(odd) { grid-column: 1 / -1; border-right: 0; }
  .adm-inv-new { grid-template-columns: minmax(0, 1fr); }
  .adm-search { flex: 1 1 100%; }
  .adm-tools .seg { flex-wrap: wrap; }
  .rows > li { flex-wrap: wrap; }
  .rows .adm-row-act { width: 100%; }

  /* Tabla a tarjetas de dos líneas: email arriba, meta en muted, acciones debajo */
  .table-wrap.adm-cards { overflow: visible; }
  .adm-cards .table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .adm-cards .table, .adm-cards .table tbody { display: block; }
  .adm-cards .table > tbody > tr { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 10px; padding: 10px 12px; border-top: 1px solid var(--line); }
  .adm-cards .table > tbody > tr:first-child { border-top: 0; }
  .adm-cards .table > tbody > tr > td { display: inline; padding: 0; border: 0; color: rgb(var(--c-muted)); font-size: var(--fs-xs); white-space: normal; overflow-wrap: anywhere; }
  .adm-cards .table > tbody > tr > td.adm-c-main { display: block; flex: 1 0 100%; color: rgb(var(--c-text)); font-size: var(--fs-small); max-width: none; }
  .adm-cards .table > tbody > tr > td[data-l]::before { content: attr(data-l) ' '; }
  .adm-cards .table > tbody > tr > td.adm-c-hide { display: none; }
  .adm-cards .table > tbody > tr > td.adm-acts { flex: 1 0 100%; text-align: left; margin-top: 6px; }
  .adm-cards .table > tbody > tr > td.adm-acts > div { display: flex; flex-wrap: wrap; }
  .adm-cards .table > tbody > tr.confirm-row { display: block; }
  .adm-cards .table > tbody > tr.confirm-row > td { display: block; font-size: var(--fs-small); color: rgb(var(--c-soft)); white-space: normal; border-left: 0; padding: 0; background: none; }
  .adm-cards .table > tbody > tr.confirm-row { background: rgb(var(--c-panel-2)); border-left: 3px solid rgb(var(--c-warn)); }
  .adm-cards .table > tbody > tr.confirm-row--coral { border-left-color: rgb(var(--c-coral)); }
  .adm-cards .table > tbody > tr.adm-cases { display: block; padding: 0; }
  .adm-cards .table > tbody > tr.adm-cases > td { display: block; }
  .adm-cards .adm-cases .table-wrap { border-radius: 0; border-inline: 0; }
  .adm-cards .table > tbody > tr > td.adm-casetext { display: block; flex: 1 0 100%; white-space: normal; padding: 8px 0 4px !important; }
  .adm-cards .adm-cases__head { padding-left: 12px; }
  .adm-cards .adm-casetext .code-block { font-size: 12px; }
  .adm-cards .adm-cases .table td:first-child { padding-left: 0; }
  .adm-cards .adm-email .chip { margin-left: 0; }
  .adm-price .mono { display: block; margin-left: 0; }
  .adm-price th:first-child, .adm-price td:first-child { display: none; }
  .adm-price th, .adm-price td { padding-inline: 10px; }
  .confirm-inline { padding: 14px 12px; }
}
@media (pointer: coarse) { .adm-si { min-height: var(--tap); } }

/* Pendiente vacío: «Nada pendiente.» y nada más (ni «Ninguna solicitud pendiente» ni
   «Nadie esperando» debajo); un bloque con resueltos/invitados plegados se queda. */
[data-pend-none] { margin-bottom: 16px; }
#pendiente.is-clear .adm-two .adm-empty { display: none; }
#pendiente.is-clear .adm-two > [data-testers]:not(:has(details)),
#pendiente.is-clear .adm-two > [data-waitlist]:not(:has(details)) { display: none; }