/* /WhatsApp/Comunes/Avatar.razor.rz.scp.css */
.avatar[b-h6bb4bbntc] {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    overflow: hidden;
    border-radius: 50%;
    background: var(--wa-color-avatar-bg);
    color: var(--wa-color-avatar-text);
    font-family: var(--wa-font-heading);
    font-weight: 800;
    line-height: 1;
}

.avatar--small[b-h6bb4bbntc] {
    width: var(--wa-avatar-size-sm);
    height: var(--wa-avatar-size-sm);
    font-size: var(--wa-font-size-sm);
    --wa-icon-size: 20px;
}

.avatar--medium[b-h6bb4bbntc] {
    width: var(--wa-avatar-size);
    height: var(--wa-avatar-size);
    font-size: var(--wa-font-size-md);
    --wa-icon-size: 22px;
}

.avatar--large[b-h6bb4bbntc] {
    width: var(--wa-avatar-size-lg);
    height: var(--wa-avatar-size-lg);
    font-size: var(--wa-font-size-xl);
    --wa-icon-size: 34px;
}

.avatar img[b-h6bb4bbntc] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* /WhatsApp/Comunes/Button.razor.rz.scp.css */
.button[b-t3qcxpdaga] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--wa-space-2);
    min-height: var(--wa-control-height);
    padding: 0 var(--wa-space-3);
    border: 1px solid transparent;
    border-radius: var(--wa-radius-sm);
    font-size: var(--wa-font-size-sm);
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
}

.button:disabled[b-t3qcxpdaga] {
    cursor: default;
    opacity: 0.55;
}

.button--primary[b-t3qcxpdaga] {
    background: var(--wa-color-accent-strong);
    color: var(--wa-color-on-accent);
}

.button--primary:hover:not(:disabled)[b-t3qcxpdaga] {
    filter: brightness(1.08);
}

.button--secondary[b-t3qcxpdaga] {
    border-color: var(--wa-color-border);
    background: var(--wa-color-surface);
    color: var(--wa-color-text);
}

.button--secondary:hover:not(:disabled)[b-t3qcxpdaga] {
    background: var(--wa-color-surface-hover);
}

.button--danger[b-t3qcxpdaga] {
    border-color: var(--wa-color-danger);
    background: var(--wa-color-surface);
    color: var(--wa-color-danger);
}

.button--danger:hover:not(:disabled)[b-t3qcxpdaga] {
    background: var(--wa-color-surface-hover);
}
/* /WhatsApp/Comunes/ConfirmDialog.razor.rz.scp.css */
.dialog-backdrop[b-7u30xf1jjk] {
    position: fixed;
    inset: 0;
    z-index: 40;
    display: grid;
    place-items: center;
    padding: var(--wa-space-4);
    background: var(--wa-color-backdrop);
}

.dialog[b-7u30xf1jjk] {
    width: min(420px, 100%);
    padding: var(--wa-space-5);
    border: 1px solid var(--wa-color-border);
    border-radius: var(--wa-radius-md);
    background: var(--wa-color-surface);
    box-shadow: var(--wa-shadow-overlay);
    color: var(--wa-color-text);
}

.title[b-7u30xf1jjk] {
    font-family: var(--wa-font-heading);
    font-size: var(--wa-font-size-lg);
    font-weight: 700;
    line-height: 1.3;
}

.text[b-7u30xf1jjk] {
    margin-top: var(--wa-space-2);
    color: var(--wa-color-text-muted);
    font-size: var(--wa-font-size-sm);
    line-height: 1.5;
}

.error[b-7u30xf1jjk] {
    display: flex;
    gap: var(--wa-space-2);
    align-items: flex-start;
    margin-top: var(--wa-space-3);
    color: var(--wa-color-danger);
    font-size: var(--wa-font-size-sm);
    font-weight: 600;
}

.buttons[b-7u30xf1jjk] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--wa-space-2);
    margin-top: var(--wa-space-5);
}

.focus-guard[b-7u30xf1jjk] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
}
/* /WhatsApp/Comunes/DeliveryStatus.razor.rz.scp.css */
.delivery[b-blulolggw5] {
    display: inline-flex;
    align-items: center;
    color: var(--wa-color-bubble-meta);
    font-size: var(--wa-font-size-xs);
    line-height: 1;
}

.delivery--sent[b-blulolggw5] {
    color: var(--wa-color-accent-strong);
}

/* Entregado y leído: doble tilde; gris al entregarse y en el color de acento al leerse. */
.delivery--delivered[b-blulolggw5] {
    color: var(--wa-color-bubble-meta);
}

.delivery--read[b-blulolggw5] {
    color: var(--wa-color-accent-strong);
}

.delivery--unconfirmed[b-blulolggw5],
.delivery--not-saved[b-blulolggw5] {
    gap: 3px;
    color: var(--wa-color-warning-text);
    font-weight: 600;
}
/* /WhatsApp/Comunes/Icon.razor.rz.scp.css */
.wa-icon[b-l9kkfdze7s] {
    display: inline-block;
    flex: 0 0 auto;
    width: var(--wa-icon-size);
    height: var(--wa-icon-size);
    stroke-width: var(--wa-icon-stroke);
    vertical-align: middle;
}
/* /WhatsApp/Comunes/IconButton.razor.rz.scp.css */
.icon-button[b-ir2v6qyyrp] {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: var(--wa-control-height);
    height: var(--wa-control-height);
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--wa-color-text-muted);
    text-decoration: none;
    cursor: pointer;
}

.icon-button:hover:not(:disabled)[b-ir2v6qyyrp] {
    background: var(--wa-color-surface-hover);
    color: var(--wa-color-text);
}

.icon-button:disabled[b-ir2v6qyyrp] {
    cursor: default;
    opacity: 0.5;
}
/* /WhatsApp/Comunes/StatusBadge.razor.rz.scp.css */
.status[b-xtn3su1h0m] {
    display: inline-flex;
    align-items: center;
    gap: var(--wa-space-1);
    min-height: 24px;
    padding: 0 var(--wa-space-2);
    border-radius: var(--wa-radius-pill);
    background: var(--wa-color-badge-bg);
    color: var(--wa-color-text);
    font-size: var(--wa-font-size-xs);
    font-weight: 600;
    white-space: nowrap;
}

.label[b-xtn3su1h0m] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.status--compact[b-xtn3su1h0m] {
    min-height: auto;
    padding: 0;
    background: none;
}

.dot[b-xtn3su1h0m] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--status-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--status-color) 15%, transparent);
}

.status--bot[b-xtn3su1h0m] {
    --status-color: var(--wa-color-status-bot);
}

.status--manual[b-xtn3su1h0m] {
    --status-color: var(--wa-color-status-manual);
}

.status--closed[b-xtn3su1h0m] {
    --status-color: var(--wa-color-status-closed);
}

/*
 * Estado desconocido: neutro y con borde punteado, para que no se confunda con ninguno conocido.
 * «Estado desconocido: paused» entra entero; un valor más largo se corta con «…» y el título lo
 * muestra completo.
 */
.status--unknown[b-xtn3su1h0m] {
    --status-color: var(--wa-color-text-muted);
    min-width: 0;
    max-width: 15rem;
    outline: 1px dashed var(--wa-color-border);
    outline-offset: -1px;
}

.status--compact.status--unknown[b-xtn3su1h0m] {
    outline: 0;
}
/* /WhatsApp/Conversaciones/ChatActions.razor.rz.scp.css */
.chat-actions[b-408tvp1eus] {
    position: relative;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
}

/* Variables en breakpoints.css: botones en pantallas anchas y menú de tres puntos en las demás. */
.actions--full[b-408tvp1eus] {
    display: var(--wa-actions-full-display);
    align-items: center;
    gap: var(--wa-space-2);
}

.actions--compact[b-408tvp1eus] {
    display: var(--wa-actions-compact-display);
}

.chat-actions--menu-only .actions--compact[b-408tvp1eus] {
    display: inline-flex;
}

.chat-actions[b-408tvp1eus]  .pin[aria-pressed="true"] {
    color: var(--wa-color-accent-strong);
}

.chat-actions[b-408tvp1eus]  .menu-button {
    margin-right: calc(-1 * var(--wa-space-2));
    color: var(--wa-color-text-muted);
}

.menu-backdrop[b-408tvp1eus] {
    position: fixed;
    inset: 0;
    z-index: 29;
}

.menu[b-408tvp1eus] {
    position: absolute;
    top: calc(100% + var(--wa-space-1));
    right: 0;
    z-index: 30;
    width: max-content;
    min-width: 232px;
    max-width: calc(100vw - 2 * var(--wa-space-4));
    padding: var(--wa-space-1) 0;
    border: 1px solid var(--wa-color-border);
    border-radius: var(--wa-radius-md);
    background: var(--wa-color-surface);
    box-shadow: var(--wa-shadow-overlay);
}

.menu-status[b-408tvp1eus] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--wa-space-3);
    padding: var(--wa-space-2) var(--wa-space-4) var(--wa-space-3);
    border-bottom: 1px solid var(--wa-color-border-soft);
    margin-bottom: var(--wa-space-1);
    flex-wrap: wrap;
    color: var(--wa-color-text-muted);
    font-size: var(--wa-font-size-xs);
    font-weight: 600;
    white-space: nowrap;
}

.menu-item[b-408tvp1eus] {
    display: flex;
    align-items: center;
    gap: var(--wa-space-3);
    width: 100%;
    min-height: 44px;
    padding: 0 var(--wa-space-4);
    border: 0;
    background: transparent;
    color: var(--wa-color-text);
    font-size: var(--wa-font-size-sm);
    font-weight: 600;
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
}

.menu-item:hover:not([aria-disabled="true"])[b-408tvp1eus],
.menu-item:focus-visible[b-408tvp1eus] {
    background: var(--wa-color-surface-hover);
    box-shadow: none;
    outline: 2px solid var(--wa-color-accent);
    outline-offset: -2px;
}

.menu-item:hover:not([aria-disabled="true"])[b-408tvp1eus] {
    outline: none;
}

.menu-item--danger[b-408tvp1eus] {
    color: var(--wa-color-danger);
}

.menu-item[aria-disabled="true"][b-408tvp1eus] {
    cursor: default;
    opacity: 0.5;
}

.action-error[b-408tvp1eus] {
    position: absolute;
    top: calc(100% + var(--wa-space-2));
    right: 0;
    z-index: 30;
    width: max-content;
    max-width: min(320px, calc(100vw - 2 * var(--wa-space-4)));
    padding: var(--wa-space-2) var(--wa-space-3);
    border: 1px solid var(--wa-color-danger);
    border-radius: var(--wa-radius-sm);
    background: var(--wa-color-surface);
    color: var(--wa-color-danger);
    font-size: var(--wa-font-size-sm);
    font-weight: 600;
}
/* /WhatsApp/Conversaciones/ChatHeader.razor.rz.scp.css */
.chat-header[b-qexpsmkero] {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: var(--wa-space-3);
    min-height: var(--wa-header-height);
    padding: var(--wa-space-2) var(--wa-space-4);
    background: var(--wa-color-surface);
    border-bottom: 1px solid var(--wa-color-border);
}

.chat-header[b-qexpsmkero]  .back {
    display: var(--wa-back-display);
    margin-left: calc(-1 * var(--wa-space-2));
    color: var(--wa-color-text);
}

.who[b-qexpsmkero] {
    position: relative;
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    gap: var(--wa-space-3);
    min-width: 0;
}

.identity[b-qexpsmkero] {
    flex: 1 1 auto;
    min-width: 0;
}

/* El botón del nombre extiende su área clicable a todo el bloque (avatar incluido). */
.profile-link[b-qexpsmkero] {
    max-width: 100%;
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
    font: inherit;
    overflow: hidden;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
}

.profile-link[b-qexpsmkero]::after {
    content: "";
    position: absolute;
    inset: calc(-1 * var(--wa-space-1));
    border-radius: var(--wa-radius-sm);
}

.profile-link:hover[b-qexpsmkero] {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.profile-link:focus-visible[b-qexpsmkero] {
    box-shadow: none;
}

.profile-link:focus-visible[b-qexpsmkero]::after {
    box-shadow: var(--wa-focus-ring);
}

.name[b-qexpsmkero] {
    overflow: hidden;
    color: var(--wa-color-text);
    font-size: var(--wa-font-size-md);
    font-weight: 700;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.details[b-qexpsmkero] {
    display: flex;
    gap: var(--wa-space-2);
    min-width: 0;
    color: var(--wa-color-text-muted);
    font-size: var(--wa-font-size-xs);
    white-space: nowrap;
}

.company[b-qexpsmkero] {
    overflow: hidden;
    text-overflow: ellipsis;
}

.wa-id[b-qexpsmkero] {
    display: var(--wa-header-waid-display);
    flex: 0 0 auto;
}

/* Variables en breakpoints.css: en móvil el estado se reduce al punto para dejar sitio al nombre. */
.status-full[b-qexpsmkero] {
    display: var(--wa-header-status-full-display);
    flex: 0 0 auto;
}

.status-compact[b-qexpsmkero] {
    display: var(--wa-header-status-compact-display);
    flex: 0 0 auto;
}

/*
 * Con un estado desconocido (insignia más larga) el estado cede espacio antes que el nombre y la
 * empresa: se corta con «…» y se consulta completo en su título o en el menú (brief §13).
 */
.chat-header--unknown .who[b-qexpsmkero] {
    flex: 1 0 auto;
    max-width: calc(100% - 10rem); /* deja al menos 6rem para el estado y el menú */
}

.chat-header--unknown .status-full[b-qexpsmkero] {
    flex: 0 1 auto;
    min-width: 6rem;
}
/* /WhatsApp/Conversaciones/ConversationList.razor.rz.scp.css */
.search[b-5oqb383zcj] {
    display: flex;
    align-items: center;
    gap: var(--wa-space-2);
    padding: var(--wa-space-3) var(--wa-space-4);
}

.search-field[b-5oqb383zcj] {
    position: relative;
    display: block;
    flex: 1 1 auto;
    min-width: 0;
    color: var(--wa-color-text-muted);
}

.search[b-5oqb383zcj]  .refresh {
    flex: 0 0 auto;
    color: var(--wa-color-text-muted);
}

.search[b-5oqb383zcj]  .refresh[aria-busy="true"] .wa-icon {
    animation: lk-spin-b-5oqb383zcj 1s linear infinite;
}

@keyframes lk-spin-b-5oqb383zcj {
    to {
        transform: rotate(360deg);
    }
}

.sync-problem[b-5oqb383zcj] {
    margin: calc(-1 * var(--wa-space-1)) var(--wa-space-4) var(--wa-space-2);
    color: var(--wa-color-warning-text);
    font-size: var(--wa-font-size-xs);
    font-weight: 600;
}

.search-field[b-5oqb383zcj]  .wa-icon {
    position: absolute;
    top: 50%;
    left: var(--wa-space-4);
    transform: translateY(-50%);
    pointer-events: none;
}

.search input[b-5oqb383zcj] {
    width: 100%;
    min-height: 40px;
    padding: 0 var(--wa-space-4) 0 calc(var(--wa-space-4) + 26px);
    border: 1px solid var(--wa-color-border);
    border-radius: var(--wa-radius-pill);
    background: var(--wa-color-surface-muted);
    color: var(--wa-color-text);
}

.search input[b-5oqb383zcj]::placeholder {
    color: var(--wa-color-text-muted);
}

.search input:focus-visible[b-5oqb383zcj] {
    border-color: var(--wa-color-accent);
}

.conversation-list[b-5oqb383zcj] {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.group-label[b-5oqb383zcj] {
    padding: var(--wa-space-3) var(--wa-space-4) var(--wa-space-1);
    color: var(--wa-color-text-muted);
    font-family: var(--wa-font-body);
    font-size: var(--wa-font-size-xs);
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.items[b-5oqb383zcj] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.message[b-5oqb383zcj] {
    padding: var(--wa-space-6) var(--wa-space-4);
    color: var(--wa-color-text-muted);
    text-align: center;
}
/* /WhatsApp/Conversaciones/ConversationListItem.razor.rz.scp.css */
.conversation-item[b-r0ugj8oqhs] {
    display: flex;
    align-items: center;
    gap: var(--wa-space-3);
    min-height: var(--wa-list-row-min-height);
    padding: var(--wa-space-3) var(--wa-space-4);
    border-left: 3px solid transparent;
    border-bottom: 1px solid var(--wa-color-border-soft);
    color: inherit;
    text-decoration: none;
}

.conversation-item:hover[b-r0ugj8oqhs] {
    background: var(--wa-color-surface-hover);
}

.conversation-item--selected[b-r0ugj8oqhs],
.conversation-item--selected:hover[b-r0ugj8oqhs] {
    border-left-color: var(--wa-color-accent);
    background: var(--wa-color-surface-selected);
}

.body[b-r0ugj8oqhs] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: var(--wa-space-1);
    min-width: 0;
}

.line[b-r0ugj8oqhs] {
    display: flex;
    align-items: center;
    gap: var(--wa-space-2);
    min-width: 0;
}

.name[b-r0ugj8oqhs],
.company[b-r0ugj8oqhs] {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.name[b-r0ugj8oqhs] {
    color: var(--wa-color-text);
    font-size: var(--wa-font-size-md);
    font-weight: 600;
}

.company[b-r0ugj8oqhs] {
    color: var(--wa-color-text-muted);
    font-size: var(--wa-font-size-sm);
}

.meta[b-r0ugj8oqhs] {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: var(--wa-space-1);
}

.time[b-r0ugj8oqhs] {
    color: var(--wa-color-text-muted);
    font-size: var(--wa-font-size-xs);
}

.meta[b-r0ugj8oqhs]  .pin {
    color: var(--wa-color-accent-strong);
}
/* /WhatsApp/Conversaciones/CustomerInfoPanel.razor.rz.scp.css */
/*
 * Posición y ancho según el tramo (breakpoints.css): columna junto al chat en pantallas anchas,
 * capa sobre el chat en las intermedias y vista completa en celular.
 */
.profile-panel[b-8ydcohqi5n] {
    position: var(--wa-profile-position);
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 20;
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    width: var(--wa-profile-width);
    min-height: 0;
    border-left: var(--wa-profile-border-left);
    background: var(--wa-color-surface);
    box-shadow: var(--wa-profile-shadow);
}

.panel-header[b-8ydcohqi5n] {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: var(--wa-space-2);
    min-height: var(--wa-header-height);
    padding: var(--wa-space-2) var(--wa-space-4);
    border-bottom: 1px solid var(--wa-color-border);
}

.panel-header[b-8ydcohqi5n]  .panel-back {
    display: var(--wa-profile-back-display);
    margin-left: calc(-1 * var(--wa-space-2));
    color: var(--wa-color-text);
}

.panel-header[b-8ydcohqi5n]  .panel-close {
    display: var(--wa-profile-close-display);
    margin-right: calc(-1 * var(--wa-space-2));
    color: var(--wa-color-text-muted);
}

.panel-title[b-8ydcohqi5n] {
    flex: 1 1 auto;
    min-width: 0;
    font-family: var(--wa-font-heading);
    font-size: var(--wa-font-size-md);
    font-weight: 700;
}

.panel-body[b-8ydcohqi5n] {
    flex: 1 1 auto;
    min-height: 0;
    padding: var(--wa-space-5) var(--wa-space-5) calc(var(--wa-space-6) + env(safe-area-inset-bottom));
    overflow-y: auto;
    overscroll-behavior: contain;
    scroll-padding-bottom: var(--wa-space-6);
}

.hero[b-8ydcohqi5n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--wa-space-1);
    padding-bottom: var(--wa-space-5);
    border-bottom: 1px solid var(--wa-color-border-soft);
    text-align: center;
}

.hero[b-8ydcohqi5n]  .avatar {
    margin-bottom: var(--wa-space-2);
}

.hero-name[b-8ydcohqi5n] {
    max-width: 100%;
    color: var(--wa-color-text);
    font-family: var(--wa-font-heading);
    font-size: var(--wa-font-size-lg);
    font-weight: 700;
    overflow-wrap: anywhere;
}

.hero-company[b-8ydcohqi5n] {
    max-width: 100%;
    margin-bottom: var(--wa-space-2);
    color: var(--wa-color-text-muted);
    font-size: var(--wa-font-size-sm);
    overflow-wrap: anywhere;
}

.fields[b-8ydcohqi5n] {
    display: grid;
    gap: var(--wa-space-4);
    margin: var(--wa-space-5) 0 0;
}

.field dt[b-8ydcohqi5n],
.input-field label[b-8ydcohqi5n],
.input-field .label[b-8ydcohqi5n] {
    display: block;
    margin-bottom: var(--wa-space-1);
    color: var(--wa-color-text-muted);
    font-size: var(--wa-font-size-xs);
    font-weight: 700;
    letter-spacing: 0.02em;
}

.field dd[b-8ydcohqi5n] {
    margin: 0;
    color: var(--wa-color-text);
    font-size: var(--wa-font-size-sm);
    overflow-wrap: anywhere;
}

.field dd.empty[b-8ydcohqi5n] {
    color: var(--wa-color-text-muted);
    font-style: italic;
}

.readonly[b-8ydcohqi5n] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    margin-left: var(--wa-space-2);
    padding: 1px var(--wa-space-2);
    border-radius: var(--wa-radius-pill);
    background: var(--wa-color-badge-bg);
    color: var(--wa-color-text-muted);
    font-size: var(--wa-font-size-xs);
    font-style: normal;
    font-weight: 600;
    white-space: nowrap;
}

.saved[b-8ydcohqi5n] {
    display: flex;
    align-items: center;
    gap: var(--wa-space-2);
    min-height: 1.5em;
    margin: var(--wa-space-4) 0 var(--wa-space-2);
    color: var(--wa-color-accent-strong);
    font-size: var(--wa-font-size-sm);
    font-weight: 600;
}

.profile-panel[b-8ydcohqi5n]  .edit,
.form-buttons[b-8ydcohqi5n]  .button {
    min-height: 44px;
}

.profile-panel[b-8ydcohqi5n]  .edit {
    width: 100%;
}

.profile-form[b-8ydcohqi5n] {
    display: grid;
    gap: var(--wa-space-4);
    margin-top: var(--wa-space-5);
}

.help[b-8ydcohqi5n] {
    color: var(--wa-color-text-muted);
    font-size: var(--wa-font-size-sm);
    line-height: 1.5;
}

.input-field input[b-8ydcohqi5n] {
    width: 100%;
    min-height: 44px;
    padding: var(--wa-space-2) var(--wa-space-3);
    border: 1px solid var(--wa-color-border);
    border-radius: var(--wa-radius-sm);
    background: var(--wa-color-surface);
    color: var(--wa-color-text);
    font-size: var(--wa-font-size-md); /* 16 px: evita el zoom automático de iOS al enfocar */
}

.input-field input[b-8ydcohqi5n]::placeholder {
    color: var(--wa-color-text-muted);
}

.input-field input:focus-visible[b-8ydcohqi5n] {
    border-color: var(--wa-color-accent);
}

.input-field input[aria-invalid="true"][b-8ydcohqi5n] {
    border-color: var(--wa-color-danger);
}

.readonly-value[b-8ydcohqi5n] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--wa-space-1);
    min-height: 44px;
    padding: var(--wa-space-2) var(--wa-space-3);
    border: 1px dashed var(--wa-color-border);
    border-radius: var(--wa-radius-sm);
    background: var(--wa-color-surface-muted);
    color: var(--wa-color-text);
    font-size: var(--wa-font-size-sm);
}

.readonly-value .readonly[b-8ydcohqi5n] {
    margin-left: auto;
}

.hint[b-8ydcohqi5n] {
    margin-top: var(--wa-space-1);
    color: var(--wa-color-text-muted);
    font-size: var(--wa-font-size-xs);
    text-align: right;
}

.hint--error[b-8ydcohqi5n] {
    color: var(--wa-color-danger);
    font-weight: 600;
    text-align: left;
}

.error[b-8ydcohqi5n] {
    display: flex;
    gap: var(--wa-space-2);
    align-items: flex-start;
    color: var(--wa-color-danger);
    font-size: var(--wa-font-size-sm);
    font-weight: 600;
}

.form-buttons[b-8ydcohqi5n] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--wa-space-2);
}

.discard[b-8ydcohqi5n] {
    display: contents;
}
/* /WhatsApp/Conversaciones/EmptyChatPlaceholder.razor.rz.scp.css */
.empty[b-qopn5q3u4e] {
    display: grid;
    flex: 1 1 auto;
    place-content: center;
    justify-items: center;
    gap: var(--wa-space-3);
    padding: var(--wa-space-6);
    text-align: center;
    color: var(--wa-color-text-muted);
}

.mark[b-qopn5q3u4e] {
    display: grid;
    place-items: center;
    width: 64px;
    height: 64px;
    border-radius: var(--wa-radius-md);
    background: var(--wa-color-accent-strong);
    color: var(--wa-color-on-accent);
    font-family: var(--wa-font-heading);
    font-size: var(--wa-font-size-lg);
    font-weight: 800;
}

h2[b-qopn5q3u4e] {
    color: var(--wa-color-text);
    font-size: var(--wa-font-size-lg);
}
/* /WhatsApp/Conversaciones/MessageBubble.razor.rz.scp.css */
.bubble[b-smr1pzi1in] {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: var(--wa-space-1);
    min-width: 0;
    max-width: var(--wa-bubble-max-width);
    padding: var(--wa-space-2) var(--wa-space-3) var(--wa-space-1);
    border-radius: var(--wa-radius-bubble);
    box-shadow: var(--wa-shadow-bubble);
    color: var(--wa-color-bubble-text);
}

.bubble--in[b-smr1pzi1in] {
    align-self: flex-start;
    background: var(--wa-color-bubble-in);
}

.bubble--out[b-smr1pzi1in] {
    align-self: flex-end;
    background: var(--wa-color-bubble-out);
}

/* La «cola» (esquina menos redondeada) solo en la primera burbuja de cada grupo, como LkStock. */
.bubble--in.bubble--first[b-smr1pzi1in] {
    border-top-left-radius: var(--wa-radius-bubble-tail);
}

.bubble--out.bubble--first[b-smr1pzi1in] {
    border-top-right-radius: var(--wa-radius-bubble-tail);
}

.bubble--last[b-smr1pzi1in] {
    margin-bottom: var(--wa-space-2);
}

.text[b-smr1pzi1in] {
    font-size: var(--wa-font-size-sm);
    line-height: 1.45;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.text--empty[b-smr1pzi1in] {
    color: var(--wa-color-bubble-meta);
    font-style: italic;
}

.meta[b-smr1pzi1in] {
    display: inline-flex;
    align-items: center;
    align-self: flex-end;
    gap: var(--wa-space-1);
    color: var(--wa-color-bubble-meta);
    font-size: var(--wa-font-size-xs);
}

/* Respuesta propia sin confirmar o sin guardar: queda a la vista hasta que el historial la muestre o se descarte. */
.bubble--review[b-smr1pzi1in] {
    outline: 2px dashed var(--wa-color-warning-border);
    outline-offset: -2px;
}

.review[b-smr1pzi1in] {
    color: var(--wa-color-bubble-text);
    font-size: var(--wa-font-size-xs);
    font-weight: 600;
    line-height: 1.4;
}

.review-actions[b-smr1pzi1in] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--wa-space-2);
}

.review-actions button[b-smr1pzi1in] {
    min-height: 32px;
    padding: 0 var(--wa-space-3);
    border: 1px solid var(--wa-color-border);
    border-radius: var(--wa-radius-pill);
    background: var(--wa-color-surface);
    color: var(--wa-color-text);
    font-size: var(--wa-font-size-xs);
    font-weight: 600;
    cursor: pointer;
}

.review-actions button:focus-visible[b-smr1pzi1in] {
    box-shadow: var(--wa-focus-ring);
    outline: none;
}

/* LkStock: quién respondió (bot, operador o aviso automático), antes de la hora. */
.origin[b-smr1pzi1in] {
    font-weight: 600;
    margin-right: var(--wa-space-1);
}
/* /WhatsApp/Conversaciones/MessageComposer.razor.rz.scp.css */
.composer[b-05chhvv6yz] {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: var(--wa-space-1);
    min-height: var(--wa-composer-min-height);
    padding: var(--wa-space-2) var(--wa-chat-padding-inline) var(--wa-space-3);
    background: var(--wa-color-chat-bg);
}

.row[b-05chhvv6yz] {
    display: flex;
    align-items: flex-end;
    gap: var(--wa-space-2);
}

textarea[b-05chhvv6yz] {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 44px;
    max-height: 140px; /* provisional: unas 6 líneas */
    padding: var(--wa-space-3) var(--wa-space-4);
    border: 1px solid var(--wa-color-border);
    border-radius: 22px;
    background: var(--wa-color-surface);
    color: var(--wa-color-text);
    line-height: 1.4;
    overflow-y: auto;
    resize: none;
}

textarea[b-05chhvv6yz]::placeholder {
    color: var(--wa-color-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

textarea:focus-visible[b-05chhvv6yz] {
    border-color: var(--wa-color-accent);
}

textarea[aria-invalid="true"][b-05chhvv6yz] {
    border-color: var(--wa-color-danger);
}

.send[b-05chhvv6yz] {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 50%;
    background: var(--wa-color-accent-strong);
    color: var(--wa-color-on-accent);
    cursor: pointer;
}

.send:disabled[b-05chhvv6yz] {
    cursor: default;
    opacity: 0.5;
}

.feedback[b-05chhvv6yz] {
    padding: 0 var(--wa-space-2);
    color: var(--wa-color-text-muted);
    font-size: var(--wa-font-size-xs);
}

.feedback--error[b-05chhvv6yz] {
    color: var(--wa-color-danger);
    font-weight: 600;
}

.counter[b-05chhvv6yz] {
    align-self: flex-end;
    padding-right: calc(44px + var(--wa-space-2) + var(--wa-space-2));
    color: var(--wa-color-text-muted);
    font-size: var(--wa-font-size-xs);
}

.counter--over[b-05chhvv6yz] {
    color: var(--wa-color-danger);
    font-weight: 600;
}

/* Responder no está permitido (por ejemplo, estado del caso desconocido): el motivo queda visible. */
.feedback--blocked[b-05chhvv6yz] {
    color: var(--wa-color-text);
    font-weight: 600;
}

textarea:disabled[b-05chhvv6yz] {
    cursor: not-allowed;
    opacity: 0.6;
}

.feedback--warning[b-05chhvv6yz] {
    color: var(--wa-color-text);
    font-weight: 600;
}
/* /WhatsApp/Conversaciones/MessageTimeline.razor.rz.scp.css */
.timeline[b-4pze8guqun] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: var(--wa-space-1);
    min-height: 0;
    padding: var(--wa-space-4) var(--wa-chat-padding-inline);
    overflow-y: auto;
    overscroll-behavior: contain;
    /* Fondo de puntos propio de LkStock. */
    background-color: var(--wa-color-chat-bg);
    background-image: radial-gradient(var(--wa-color-chat-dot) 1px, transparent 1px);
    background-size: 18px 18px;
}

/* Sin position: sticky: al ser hermanos en el mismo contenedor, los separadores se apilarían arriba. */
.date[b-4pze8guqun] {
    display: flex;
    justify-content: center;
    margin: var(--wa-space-2) 0;
}

.date span[b-4pze8guqun] {
    padding: var(--wa-space-1) var(--wa-space-3);
    border-radius: var(--wa-radius-pill);
    background: var(--wa-color-surface);
    box-shadow: var(--wa-shadow-bubble);
    color: var(--wa-color-text-muted);
    font-size: var(--wa-font-size-xs);
    font-weight: 600;
}

.message[b-4pze8guqun] {
    margin: auto;
    color: var(--wa-color-text-muted);
}

/* «Cargar mensajes anteriores», al principio del historial. */
.older[b-4pze8guqun] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--wa-space-2);
    margin-bottom: var(--wa-space-2);
}

.load-older[b-4pze8guqun] {
    min-height: 36px;
    padding: 0 var(--wa-space-4);
    border: 1px solid var(--wa-color-border);
    border-radius: var(--wa-radius-pill);
    background: var(--wa-color-surface);
    box-shadow: var(--wa-shadow-bubble);
    color: var(--wa-color-accent-strong);
    font: inherit;
    font-size: var(--wa-font-size-xs);
    font-weight: 700;
    cursor: pointer;
}

.load-older:hover:not(:disabled)[b-4pze8guqun] {
    background: var(--wa-color-surface-hover);
}

.load-older:disabled[b-4pze8guqun] {
    color: var(--wa-color-text-muted);
    cursor: progress;
}

.older-error[b-4pze8guqun] {
    color: var(--wa-color-danger);
    font-size: var(--wa-font-size-xs);
    font-weight: 600;
    text-align: center;
}

/* «Mensajes nuevos ↓»: fijo abajo dentro del historial mientras se lee más arriba. */
.new-messages[b-4pze8guqun] {
    position: sticky;
    bottom: var(--wa-space-2);
    z-index: 2;
    align-self: center;
    min-height: 36px;
    margin-top: var(--wa-space-2);
    padding: 0 var(--wa-space-4);
    border: 0;
    border-radius: var(--wa-radius-pill);
    background: var(--wa-color-accent-strong);
    box-shadow: var(--wa-shadow-overlay);
    color: var(--wa-color-on-accent);
    font: inherit;
    font-size: var(--wa-font-size-xs);
    font-weight: 700;
    cursor: pointer;
}
/* /WhatsApp/Conversaciones/SupportChatPage.razor.rz.scp.css */
.shell[b-8fo1uu3im9] {
    display: grid;
    grid-template-columns: var(--wa-shell-columns);
    height: 100%; /* el resto de .app-frame (MainLayout): 100dvh sin el aviso de versión nueva */
    padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
    background: var(--wa-color-bg);
    overflow: hidden;
}

.list-pane[b-8fo1uu3im9],
.chat-pane[b-8fo1uu3im9] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

.list-pane[b-8fo1uu3im9] {
    background: var(--wa-color-surface);
    border-right: 1px solid var(--wa-color-border);
}

.chat-pane[b-8fo1uu3im9] {
    background: var(--wa-color-chat-bg);
}

/* Tramo estrecho: un solo panel según la ruta (variables en breakpoints.css). */
.shell--chat .list-pane[b-8fo1uu3im9] {
    display: var(--wa-list-display-when-chat);
}

.shell--list .chat-pane[b-8fo1uu3im9] {
    display: var(--wa-chat-display-when-empty);
}

/* Chat y ficha del cliente (CustomerInfoPanel); la ficha se coloca según breakpoints.css. */
.conversation[b-8fo1uu3im9] {
    position: relative;
    display: flex;
    flex: 1 1 auto;
    min-height: 0;
}

.chat-view[b-8fo1uu3im9] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
}

/* Con la ficha abierta el chat es más angosto: las acciones van al menú de tres puntos. En celular
   la ficha ocupa toda la pantalla y el chat se oculta sin desmontarse (conserva scroll y borrador). */
.conversation--profile[b-8fo1uu3im9] {
    --wa-actions-full-display: none;
    --wa-actions-compact-display: inline-flex;
}

.conversation--profile .chat-view[b-8fo1uu3im9] {
    visibility: var(--wa-chat-view-visibility-with-profile);
}

.list-header[b-8fo1uu3im9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--wa-space-3);
    min-height: var(--wa-header-height);
    padding: var(--wa-space-3) var(--wa-space-4);
    border-bottom: 1px solid var(--wa-color-border-soft);
}

.brand[b-8fo1uu3im9] {
    display: flex;
    align-items: center;
    gap: var(--wa-space-3);
    min-width: 0;
}

.brand-mark[b-8fo1uu3im9] {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    border-radius: var(--wa-radius-md);
    background: var(--wa-color-accent-strong);
    color: var(--wa-color-on-accent);
    font-family: var(--wa-font-heading);
    font-size: var(--wa-font-size-sm);
    font-weight: 800;
}

.eyebrow[b-8fo1uu3im9] {
    color: var(--wa-color-accent-strong);
    font-size: var(--wa-font-size-eyebrow);
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.list-title[b-8fo1uu3im9] {
    font-size: var(--wa-font-size-xl);
    font-weight: 700;
    line-height: 1.2;
}

/* Cabecera mínima cuando la conversación no existe: solo la flecha atrás (visible en móvil). */
.missing-header[b-8fo1uu3im9] {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    min-height: var(--wa-header-height);
    padding: var(--wa-space-2) var(--wa-space-4);
    background: var(--wa-color-surface);
    border-bottom: 1px solid var(--wa-color-border);
}

.missing-header[b-8fo1uu3im9]  .back {
    display: var(--wa-back-display);
    margin-left: calc(-1 * var(--wa-space-2));
    color: var(--wa-color-text);
}