/* Pantallas nuevas: Usuarios (correo), Asistente (devolver al asistente), Reportes (costo de WhatsApp) y Supresión de datos. Solo tokens canon. */
.data-table .user-email { display: block; overflow-wrap: anywhere; }
.data-table .user-email.is-empty { color: var(--text-subtle); }
.data-table .user-owner-tag { margin-inline-start: var(--sp-2); }
.pt-switch-row { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-3); }
.pt-switch-copy { display: grid; min-width: 0; gap: var(--sp-1); }
.pt-switch-copy .cv-note { margin: 0; }

/* Configuración › Asistente › Devolver al asistente */
.pt-form { display: grid; gap: var(--sp-4); max-width: 640px; }
.pt-minutes { display: grid; gap: var(--sp-3); }
.pt-minutes .ui-input { max-width: 160px; }
.pt-summary { margin: 0; padding: var(--sp-3) var(--sp-4); border-radius: var(--r-md); background: var(--brand-soft); color: var(--brand-strong); font-size: var(--fs-body); }
.pt-actions { display: flex; justify-content: flex-end; gap: var(--sp-2); }

/* Reportes › Costo de WhatsApp (Meta) */
.report-wide { grid-column: 1 / -1; }
.meta-costs { display: grid; gap: var(--sp-3); }
.meta-costs-head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3); }
.meta-costs-head h2 { margin: 0; }
.meta-costs-period { margin-left: auto; }
.meta-costs .alert { display: flex; align-items: flex-start; gap: var(--sp-2); margin: 0; }
.meta-costs-split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-6); }
.meta-costs-split h3 { margin: 0 0 var(--sp-2); }
.meta-costs-list { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.meta-costs-list li { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); padding: var(--sp-2) 0; border-top: var(--border-w) solid var(--border-soft); font-size: var(--fs-body); }
.meta-costs-list li > span { display: grid; min-width: 0; }
.meta-costs-list small { color: var(--text-muted); font-size: var(--fs-meta); }
.meta-free { display: grid; gap: var(--sp-3); padding: var(--sp-3) var(--sp-4); border: var(--border-w) solid var(--border-default); border-radius: var(--r-md); background: var(--surface-2); }
.meta-free-row { display: grid; gap: var(--sp-2); }
.meta-free-line { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--sp-1) var(--sp-3); margin: 0; }
.meta-free-bar { block-size: var(--sp-2); border-radius: var(--r-full); background: var(--border-default); overflow: hidden; }
.meta-free-bar > i { display: block; block-size: 100%; border-radius: var(--r-full); background: var(--brand); }
.meta-free-bar.is-full > i { background: var(--warning-solid); }
.meta-free .t-note { margin: 0; }
.meta-costs-days { display: flex; align-items: flex-end; gap: var(--sp-1); height: var(--row-h); padding-top: var(--sp-1); }
.meta-costs-days i { flex: 1 1 0; min-width: 2px; border-radius: var(--r-sm) var(--r-sm) 0 0; background: var(--brand); opacity: .75; }
/* Reportes › Anuncios */
.ad-arrivals { display: grid; gap: var(--sp-3); }
.ad-sentence { margin: 0; color: var(--text-primary); line-height: var(--lh-snug); }
.ad-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: var(--sp-3); margin: 0; padding: 0; list-style: none; }
.ad-item { display: grid; align-content: start; gap: var(--sp-1); padding: var(--sp-3) var(--sp-4); border: var(--border-w) solid var(--border-strong); border-radius: var(--r-md); }
.ad-item p { margin: 0; }
.ad-name span, .ad-count { color: var(--text-muted); }
.ad-stats { display: flex; flex-wrap: wrap; gap: var(--sp-1) var(--sp-3); font-weight: var(--fw-medium); }
.ad-stats > span, .ad-stats > a { display: inline-flex; align-items: center; gap: var(--sp-1); }
.ad-ok { color: var(--success-ink); }
.ad-lost { color: var(--danger-ink); font-weight: var(--fw-bold); }
.ad-dot { width: var(--sp-2); aspect-ratio: 1; border-radius: var(--r-full); background: var(--danger-solid); }
.ad-wait { color: var(--warning-solid); }
/* «N esperan respuesta»: enlace a la bandeja (vista «Anuncios sin responder»); se ve como enlace, no como botón, y conserva el naranja de siempre. */
.ad-link { color: var(--warning-solid); text-decoration: underline; cursor: pointer; }
.ad-link:hover { text-decoration-thickness: 2px; }

/* Supresión de datos */
.erasure-card { display: grid; gap: var(--sp-4); }
.erasure-scope { display: flex; align-items: flex-start; gap: var(--sp-3); padding: var(--sp-3) var(--sp-4); border: var(--border-w) solid color-mix(in srgb, var(--info-solid) 35%, transparent); border-radius: var(--r-md); background: var(--info-soft); color: var(--info-ink); font-size: var(--fs-body); }
.erasure-scope svg { flex: none; margin-top: 1px; }
.erasure-scope p { margin: 0; }
.erasure-scope p + p { margin-top: var(--sp-2); }
.erasure-form, .erasure-search { display: grid; gap: var(--sp-3); }
/* Dos columnas cuando hay ancho: el pedido de borrado a la izquierda y el registro a la derecha (el título ocupa todo el ancho). */
.erasure-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-4); align-content: start; }
.erasure-layout > :first-child { grid-column: 1 / -1; }
.erasure-card { align-self: start; min-width: 0; }
@media (min-width: 1280px) { .erasure-layout { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); } }
.erasure-picked { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); }
.erasure-picked > span { display: flex; align-items: center; gap: var(--sp-2); }

/* Aviso de advertencia (ámbar), común a las pantallas nuevas: .alert.is-warning */
.alert.is-warning { display: flex; align-items: flex-start; gap: var(--sp-2); border-color: color-mix(in srgb, var(--warning-solid) 35%, transparent); background: var(--warning-soft); color: var(--warning-ink); }
.alert.is-warning svg { flex: none; margin-top: 1px; }
/* Avisos al equipo (staff-alerts): sus estilos viven en staff-alerts.css. */

/* Sistema › Instalación: ficha y canales lado a lado cuando hay ancho; la retención ocupa todo el ancho. */
.system-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-4); align-content: start; }
.system-layout > :first-child, .system-layout > .is-wide, .system-layout > .ui-error { grid-column: 1 / -1; }
.system-layout > .ui-card { align-self: start; min-width: 0; }
.system-layout input[type="number"] { max-width: var(--field-w-sm); }
@media (min-width: 1280px) { .system-layout { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.system-layout .ui-row:not(:has(> .ui-row-end)) { grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; column-gap: var(--sp-4); }

/* Adelanto para reservar: reglas por servicio plegables y «Más acciones» de las formas de pago. */
.pay-rules { display: grid; gap: var(--sp-2); }
.pay-rule { border: var(--border-w) solid var(--border-default); border-radius: var(--r-md); background: var(--surface-1); }
.pay-rule-summary { display: flex; align-items: baseline; gap: var(--sp-3); padding: var(--sp-2) var(--sp-3); cursor: pointer; list-style: none; }
.pay-rule-chevron { margin-left: auto; align-self: center; color: var(--text-subtle); line-height: 1; transition: transform 120ms; }
.pay-rule[open] .pay-rule-chevron { transform: rotate(180deg); }
.pay-site-select { width: 100%; max-width: 320px; }
.alert.info { border-color: color-mix(in srgb, var(--info-solid) 35%, transparent); background: var(--info-soft); color: var(--info-ink); }
.pay-plan-note p { margin: 0; }
.pay-plan-actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-3); margin-top: var(--sp-2); }
.pay-load-error { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); }
.pay-load-error p { margin: 0; }
.pay-rule-summary::-webkit-details-marker { display: none; }
.pay-rule-summary small { color: var(--text-subtle); }
.pay-rule-form { padding: var(--sp-3); border-top: var(--border-w) solid var(--border-default); }
.pay-more > summary { cursor: pointer; list-style: none; }
.pay-more > summary::-webkit-details-marker { display: none; }
.pay-more-list { display: flex; flex-wrap: wrap; gap: var(--sp-1); margin-top: var(--sp-1); }
