/**
 * Boton de accion solo icono: capsula horizontal alargada, esquinas suavemente redondeadas (no circulo), borde grueso.
 * Variantes: blanco (fondo claro, borde gris, icono granate), rojo (relleno granate), rojo-traslucido (borde granate, relleno granate muy suave).
 */
.btn-accion-pill {
    /* Contenedor mas compacto; icono SVG grande respecto al boton (referencia segunda imagen). */
    --btn-accion-pill-h: 32px;
    --btn-accion-pill-px: 10px;
    --btn-accion-pill-min-w: 42px;
    --btn-accion-pill-radius: 8px;
    --btn-accion-pill-border: 2px;
    --btn-accion-pill-icon: 1.05rem;
    --btn-accion-pill-svg: 1.375rem;
    box-sizing: border-box;
    width: auto;
    min-width: var(--btn-accion-pill-min-w);
    height: var(--btn-accion-pill-h);
    min-height: var(--btn-accion-pill-h);
    padding: 0 var(--btn-accion-pill-px);
    margin: 0;
    border-radius: var(--btn-accion-pill-radius);
    border-style: solid;
    border-width: var(--btn-accion-pill-border);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    cursor: pointer;
    line-height: 1;
    text-decoration: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.15s ease;
}

a.btn-accion-pill:hover,
a.btn-accion-pill:focus,
a.btn-accion-pill:focus-visible,
a.btn-accion-pill:active {
    text-decoration: none;
}

.btn-accion-pill i {
    font-size: var(--btn-accion-pill-icon);
    line-height: 1;
    pointer-events: none;
}

.btn-accion-pill svg {
    width: var(--btn-accion-pill-svg);
    height: var(--btn-accion-pill-svg);
    flex-shrink: 0;
    display: block;
}

/**
 * Variante compacta (tablas densas, tarjetas estrechas). Mismos tokens que .editor-filas-tiempo-celda-aula-accion .btn-accion-pill.
 */
.btn-accion-pill.btn-accion-pill--compacto {
    flex-shrink: 0;
    --btn-accion-pill-h: 30px;
    --btn-accion-pill-min-w: 38px;
    --btn-accion-pill-px: 8px;
    --btn-accion-pill-svg: 1.15rem;
    --btn-accion-pill-icon: 0.95rem;
}

.btn-accion-pill:focus-visible {
    outline: 3px solid var(--color-dorado, #d99a56);
    outline-offset: 2px;
}

.btn-accion-pill:disabled,
.btn-accion-pill[aria-disabled="true"] {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

/* Blanco: fondo blanco, borde gris claro, icono mismo rojo de acciones (--color-granate-active) */
.btn-accion-pill--blanco {
    background-color: var(--color-blanco, #ffffff);
    border-color: #c8c4c0;
    color: var(--color-granate-active, #9a2d2d);
}

button.btn-accion-pill.btn-accion-pill--blanco:is(:disabled, [aria-disabled="true"]) {
    color: var(--color-text-muted, #727272);
    border-color: #d5d1cc;
    background-color: #f3f1ee;
    opacity: 1;
    cursor: not-allowed;
}

.btn-accion-pill--blanco:hover:not(:disabled):not([aria-disabled="true"]) {
    background-color: #faf8f5;
    border-color: #b8b4af;
    color: var(--color-granate-deep, #5c1212);
}

.btn-accion-pill--blanco:active:not(:disabled):not([aria-disabled="true"]) {
    transform: scale(0.97);
}

/* Texto sobre --blanco (Firmar): mismos colores que Eliminar, capsula ovalada como --rojo con texto.
   Eliminar no lleva <span> y conserva el radio 8px del icono. */
button.btn-accion-pill.btn-accion-pill--blanco:has(span),
a.btn-accion-pill.btn-accion-pill--blanco:has(span),
label.btn-accion-pill.btn-accion-pill--blanco:has(span) {
    --btn-accion-pill-radius: 999px;
    --btn-accion-pill-min-w: auto;
    border-radius: 999px;
}

/* Rojo: colores dedicados en tema (--btn-accion-pill-rojo-*) + especificidad para ganar a Bootstrap u otras reglas.
   Misma forma/medidas que --rojo-traslucido (pill completa): solo cambia relleno solido + texto blanco. */
button.btn-accion-pill.btn-accion-pill--rojo,
a.btn-accion-pill.btn-accion-pill--rojo,
label.btn-accion-pill.btn-accion-pill--rojo {
    --btn-accion-pill-radius: 999px;
    --btn-accion-pill-px: 1.25rem;
    --btn-accion-pill-h: 1.95rem;
    --btn-accion-pill-min-w: auto;
    gap: 0.35rem;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.2;
    background-color: #9a2d2d;
    background-color: var(--btn-accion-pill-rojo-bg, #9a2d2d);
    border-color: #5c1212;
    border-color: var(--btn-accion-pill-rojo-border, #5c1212);
    color: var(--color-blanco, #ffffff);
}

/* Icon-only (sin <span> de texto: editar/ver en filas de listados, drawers, etc.): misma forma
   que --blanco/Eliminar (radio 8px, mismo alto/ancho). --rojo con texto sigue siendo pastilla completa. */
button.btn-accion-pill.btn-accion-pill--rojo:not(:has(span)),
a.btn-accion-pill.btn-accion-pill--rojo:not(:has(span)) {
    --btn-accion-pill-radius: 8px;
    --btn-accion-pill-h: 32px;
    --btn-accion-pill-min-w: 42px;
    --btn-accion-pill-px: 10px;
    width: auto;
}

/* Ancho de dos iconos (el propio y el hueco del que se quitó), misma altura y radio. */
button.btn-accion-pill.btn-accion-pill--rojo.btn-accion-pill--doble,
a.btn-accion-pill.btn-accion-pill--rojo.btn-accion-pill--doble {
    --btn-accion-pill-radius: 8px;
    --btn-accion-pill-h: 32px;
    --btn-accion-pill-px: 8px;
    flex: 0 0 calc(42px + 8px + 42px);
    width: calc(42px + 8px + 42px);
    min-width: calc(42px + 8px + 42px);
    height: 32px;
    border-radius: 8px;
    padding: 0 8px;
    gap: 0.3rem;
    font-size: 0.75rem;
    font-weight: 600;
}

button.btn-accion-pill.btn-accion-pill--rojo:hover:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--rojo:hover:not(:disabled):not([aria-disabled="true"]),
label.btn-accion-pill.btn-accion-pill--rojo:hover {
    background-color: var(--btn-accion-pill-rojo-bg-hover, #7a1919);
    border-color: var(--btn-accion-pill-rojo-border-hover, #661414);
    color: var(--color-blanco, #ffffff);
}

button.btn-accion-pill.btn-accion-pill--rojo:active:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--rojo:active:not(:disabled):not([aria-disabled="true"]),
label.btn-accion-pill.btn-accion-pill--rojo:active {
    transform: scale(0.97);
}

/* Exito: verde solido para acciones positivas (mismo diseño que el rojo) */
button.btn-accion-pill.btn-accion-pill--exito,
a.btn-accion-pill.btn-accion-pill--exito,
label.btn-accion-pill.btn-accion-pill--exito {
    background-color: #2e7d32;
    border-color: #1b5e20;
    color: var(--color-blanco, #ffffff);
}

button.btn-accion-pill.btn-accion-pill--exito:hover:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--exito:hover:not(:disabled):not([aria-disabled="true"]),
label.btn-accion-pill.btn-accion-pill--exito:hover {
    background-color: #1b5e20;
    border-color: #144918;
    color: var(--color-blanco, #ffffff);
}

button.btn-accion-pill.btn-accion-pill--exito:active:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--exito:active:not(:disabled):not([aria-disabled="true"]),
label.btn-accion-pill.btn-accion-pill--exito:active {
    transform: scale(0.97);
}


button.btn-accion-pill.btn-accion-pill--rojo-traslucido,
a.btn-accion-pill.btn-accion-pill--rojo-traslucido,
span.btn-accion-pill.btn-accion-pill--rojo-traslucido,
label.btn-accion-pill.btn-accion-pill--rojo-traslucido {
    --btn-accion-pill-radius: 999px;
    --btn-accion-pill-px: 1.25rem;
    --btn-accion-pill-h: 1.95rem;
    --btn-accion-pill-min-w: auto;
    gap: 0.35rem;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.2;
    background-color: rgba(102, 20, 20, 0.12);
    border-color: var(--color-granate, #661414);
    color: var(--color-granate-deep, #5c1212);
}

button.btn-accion-pill.btn-accion-pill--rojo-traslucido:hover:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--rojo-traslucido:hover:not(:disabled):not([aria-disabled="true"]),
label.btn-accion-pill.btn-accion-pill--rojo-traslucido:hover {
    background-color: rgba(102, 20, 20, 0.2);
    border-color: var(--color-granate-deep, #5c1212);
    color: var(--color-granate-deep, #5c1212);
}

span.btn-accion-pill.btn-accion-pill--rojo-traslucido {
    --btn-accion-pill-radius: 999px;
    --btn-accion-pill-px: 1.25rem;
    --btn-accion-pill-h: 2.375rem;
    --btn-accion-pill-min-w: auto;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.2;
    cursor: default;
    pointer-events: none;
}

button.btn-accion-pill.btn-accion-pill--rojo-traslucido:active:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--rojo-traslucido:active:not(:disabled):not([aria-disabled="true"]),
label.btn-accion-pill.btn-accion-pill--rojo-traslucido:active {
    transform: scale(0.97);
}

/**
 * --compacto sobre --rojo-traslucido: una línea y misma altura (si no, el texto largo envuelve y la pill crece).
 * Misma medida que pills de estado en tabla (--btn-accion-pill-h: 1.625rem).
 */
button.btn-accion-pill.btn-accion-pill--rojo-traslucido.btn-accion-pill--compacto,
a.btn-accion-pill.btn-accion-pill--rojo-traslucido.btn-accion-pill--compacto,
button.btn-accion-pill.btn-accion-pill--rojo.btn-accion-pill--compacto,
a.btn-accion-pill.btn-accion-pill--rojo.btn-accion-pill--compacto,
button.btn-accion-pill.btn-accion-pill--blanco.btn-accion-pill--compacto,
a.btn-accion-pill.btn-accion-pill--blanco.btn-accion-pill--compacto,
label.btn-accion-pill.btn-accion-pill--blanco.btn-accion-pill--compacto {
    --btn-accion-pill-h: 1.625rem;
    --btn-accion-pill-px: 0.85rem;
    --btn-accion-pill-min-w: 0;
    --btn-accion-pill-icon: 0.7rem;
    --btn-accion-pill-border: 1.5px;
    --btn-accion-pill-radius: 999px;
    height: var(--btn-accion-pill-h);
    min-height: var(--btn-accion-pill-h);
    max-height: var(--btn-accion-pill-h);
    padding: 0 var(--btn-accion-pill-px);
    border-radius: var(--btn-accion-pill-radius);
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    flex-shrink: 0;
}

/* label.btn-accion-pill--rojo ya hereda forma/medidas del bloque de arriba (button/a/label compartido); solo el cursor es propio del label. */
label.btn-accion-pill.btn-accion-pill--rojo {
    cursor: pointer;
}

/**
 * Texto en listados (ej. Permisos): capsula ovalada, borde gris, relleno crema del panel; misma altura que pills de icono.
 */
button.btn-accion-pill.btn-accion-pill--neutro,
a.btn-accion-pill.btn-accion-pill--neutro,
span.btn-accion-pill.btn-accion-pill--neutro,
label.btn-accion-pill.btn-accion-pill--neutro {
    --btn-accion-pill-px: 0.875rem;
    --btn-accion-pill-min-w: auto;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1;
    gap: 0.35rem;
    background-color: var(--color-crema, #f7f3e8);
    border-color: #c8c4c0;
    color: var(--color-text-muted, #727272);
}

button.btn-accion-pill.btn-accion-pill--neutro:hover:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--neutro:hover:not(:disabled):not([aria-disabled="true"]),
label.btn-accion-pill.btn-accion-pill--neutro:hover {
    background-color: var(--color-crema, #f7f3e8);
    border-color: #a8a4a0;
    color: var(--color-text-default, #2d2d2d);
}

button.btn-accion-pill.btn-accion-pill--neutro:active:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--neutro:active:not(:disabled):not([aria-disabled="true"]),
label.btn-accion-pill.btn-accion-pill--neutro:active {
    transform: scale(0.97);
}

span.btn-accion-pill.btn-accion-pill--neutro {
    cursor: default;
    pointer-events: none;
}

button.btn-accion-pill.btn-accion-pill--neutro-exito,
a.btn-accion-pill.btn-accion-pill--neutro-exito {
    --btn-accion-pill-px: 0.875rem;
    --btn-accion-pill-min-w: auto;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1;
    background-color: var(--color-crema, #f7f3e8);
    border-color: #2e7d32;
    color: #2e7d32;
}

button.btn-accion-pill.btn-accion-pill--neutro-exito:hover:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--neutro-exito:hover:not(:disabled):not([aria-disabled="true"]) {
    background-color: var(--color-crema, #f7f3e8);
    border-color: #1b5e20;
    color: #1b5e20;
}

button.btn-accion-pill.btn-accion-pill--neutro-exito:active:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--neutro-exito:active:not(:disabled):not([aria-disabled="true"]) {
    transform: scale(0.97);
}

/**
 * Etiqueta de estado en tarjetas (capsula con texto, solo lectura). Misma geometria que --rojo-traslucido.
 */
:is(span, button, a, label).btn-accion-pill.btn-accion-pill--exito-traslucido,
:is(span, button, a, label).btn-accion-pill.btn-accion-pill--info-traslucido,
:is(span, button, a, label).btn-accion-pill.btn-accion-pill--pendiente-traslucido,
:is(span, button, a, label).btn-accion-pill.btn-accion-pill--plomo-traslucido,
:is(span, button, a, label).btn-accion-pill.btn-accion-pill--neutro-traslucido,
:is(span, button, a, label).btn-accion-pill.btn-accion-pill--rechazo-traslucido {
    --btn-accion-pill-radius: 999px;
    --btn-accion-pill-px: 1.25rem;
    --btn-accion-pill-h: 1.95rem;
    --btn-accion-pill-min-w: auto;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.2;
}

:is(span, button, a, label).btn-accion-pill.btn-accion-pill--plomo-traslucido {
    background-color: #ececec;
    border-color: #1a1a1a;
    color: #1a1a1a;
}

[data-theme="dark"] :is(span, button, a, label).btn-accion-pill.btn-accion-pill--plomo-traslucido {
    background-color: color-mix(in srgb, var(--color-blanco, #ffffff) 14%, transparent);
    border-color: var(--color-text-default, #f0ebe0);
    color: var(--color-text-default, #f0ebe0);
}

:is(span, button, a, label).btn-accion-pill.btn-accion-pill--neutro-traslucido {
    background-color: var(--panel-main-bg, var(--color-crema, #f7f3e8));
    border-color: #6c757d;
    color: #495057;
}

[data-theme="dark"] :is(span, button, a, label).btn-accion-pill.btn-accion-pill--neutro-traslucido {
    background-color: color-mix(in srgb, var(--color-blanco, #ffffff) 10%, transparent);
    border-color: rgba(var(--color-blanco-rgb), 0.45);
    color: var(--panel-main-text-muted, rgba(240, 235, 224, 0.78));
}

:is(span, button, a).btn-accion-pill.btn-accion-pill--exito-traslucido {
    background-color: var(--panel-main-bg, var(--color-crema, #f7f3e8));
    border-color: #2e7d32;
    color: #2e7d32;
}

:is(span, button, a).btn-accion-pill.btn-accion-pill--info-traslucido {
    background-color: var(--panel-main-bg, var(--color-crema, #f7f3e8));
    border-color: var(--color-info, #1565c0);
    color: var(--color-info, #1565c0);
}

:is(span, button, a).btn-accion-pill.btn-accion-pill--pendiente-traslucido {
    background-color: var(--panel-main-bg, var(--color-crema, #f7f3e8));
    border-color: #b8860b;
    color: #8a6914;
}

:is(span, button, a).btn-accion-pill.btn-accion-pill--rechazo-traslucido {
    background-color: rgba(102, 20, 20, 0.08);
    border-color: var(--color-granate-active, #9a2d2d);
    color: var(--color-granate-active, #9a2d2d);
}

span.btn-accion-pill.btn-accion-pill--exito-traslucido,
span.btn-accion-pill.btn-accion-pill--info-traslucido,
span.btn-accion-pill.btn-accion-pill--pendiente-traslucido,
span.btn-accion-pill.btn-accion-pill--plomo-traslucido,
span.btn-accion-pill.btn-accion-pill--neutro-traslucido,
span.btn-accion-pill.btn-accion-pill--rechazo-traslucido {
    cursor: default;
    pointer-events: none;
}

/**
 * Etiqueta de estado compacta en tarjetas y drawers (solo lectura).
 * Combinar con --exito-traslucido, --pendiente-traslucido, --plomo-traslucido, --neutro-traslucido o --rechazo-traslucido.
 */
:is(span, button, a).btn-accion-pill.btn-accion-pill--etiqueta-compacta:is(
    .btn-accion-pill--exito-traslucido,
    .btn-accion-pill--info-traslucido,
    .btn-accion-pill--pendiente-traslucido,
    .btn-accion-pill--plomo-traslucido,
    .btn-accion-pill--neutro-traslucido,
    .btn-accion-pill--rechazo-traslucido,
    .btn-accion-pill--morado-traslucido
) {
    --btn-accion-pill-h: 1.5rem;
    --btn-accion-pill-px: 0.5rem;
    --btn-accion-pill-min-w: 0;
    --btn-accion-pill-border: 1.5px;
    height: var(--btn-accion-pill-h);
    min-height: var(--btn-accion-pill-h);
    font-size: 0.68rem;
    line-height: 1.1;
}

/* En celda, el texto largo («No la recogerá») no se parte: la pastilla mide el texto y la tabla se desplaza. */
.datatable-panel :is(td, th) :is(span, button, a).btn-accion-pill.btn-accion-pill--etiqueta-compacta {
    width: max-content;
    max-width: none;
    min-width: max-content;
    white-space: nowrap;
    flex-shrink: 0;
}

/* Etiqueta compacta que conserva el grosor (2px) de la pastilla normal, sin agrandar la cápsula. */
:is(span, button, a).btn-accion-pill.btn-accion-pill--etiqueta-compacta.btn-accion-pill--borde-grueso:is(
    .btn-accion-pill--exito-traslucido,
    .btn-accion-pill--info-traslucido,
    .btn-accion-pill--pendiente-traslucido,
    .btn-accion-pill--plomo-traslucido,
    .btn-accion-pill--neutro-traslucido,
    .btn-accion-pill--rechazo-traslucido,
    .btn-accion-pill--morado-traslucido
),
#tituloResumenPendientes > .btn-accion-pill.btn-accion-pill--etiqueta-compacta {
    --btn-accion-pill-border: 2px;
}

/**
 * Etiqueta de estado en celdas de tabla (solo lectura): ancho según texto, una línea.
 * Combinar con --*-traslucido y $pillEstiloTabla (frontend/03-panel-listados-drawer.mdc).
 */
span.btn-accion-pill.btn-accion-pill--etiqueta-tabla:is(
    .btn-accion-pill--exito-traslucido,
    .btn-accion-pill--info-traslucido,
    .btn-accion-pill--pendiente-traslucido,
    .btn-accion-pill--plomo-traslucido,
    .btn-accion-pill--neutro-traslucido,
    .btn-accion-pill--rechazo-traslucido,
    .btn-accion-pill--rojo-traslucido
) {
    --btn-accion-pill-min-w: 0;
    width: max-content;
    max-width: 100%;
    height: auto;
    min-height: var(--btn-accion-pill-h, 1.625rem);
    white-space: nowrap;
    line-height: 1.2;
}

:is(span, button, a).btn-accion-pill.btn-accion-pill--exito-traslucido.btn-accion-pill--exito-relleno-suave {
    background-color: rgba(46, 125, 50, 0.1);
}

/**
 * Misma idea que --exito-relleno-suave: intensifica el plomo al estar seleccionado (toggle Entrada/Salida).
 */
:is(span, button, a).btn-accion-pill.btn-accion-pill--plomo-traslucido.btn-accion-pill--plomo-relleno-suave {
    background-color: rgba(26, 26, 26, 0.14);
    font-weight: 700;
}

[data-theme="dark"] :is(span, button, a).btn-accion-pill.btn-accion-pill--plomo-traslucido.btn-accion-pill--plomo-relleno-suave {
    background-color: color-mix(in srgb, var(--color-blanco, #ffffff) 22%, transparent);
}

/**
 * Descarga de boleta/recibo en ventas recepción: relleno dorado suave, borde y texto oliva.
 */
button.btn-accion-pill.btn-accion-pill--documento-boleta,
a.btn-accion-pill.btn-accion-pill--documento-boleta,
span.btn-accion-pill.btn-accion-pill--documento-boleta,
button.btn-accion-pill.btn-accion-pill--documento-recibo,
a.btn-accion-pill.btn-accion-pill--documento-recibo,
span.btn-accion-pill.btn-accion-pill--documento-recibo {
    --btn-accion-pill-radius: 999px;
    --btn-accion-pill-px: 1rem;
    --btn-accion-pill-min-w: auto;
    --btn-accion-pill-h: 2.125rem;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1;
    gap: 0.4rem;
    background-color: #e6d59a;
    border-color: rgba(109, 96, 40, 0.38);
    color: #5a4f1f;
}

button.btn-accion-pill.btn-accion-pill--documento-boleta:hover:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--documento-boleta:hover:not(:disabled):not([aria-disabled="true"]),
button.btn-accion-pill.btn-accion-pill--documento-recibo:hover:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--documento-recibo:hover:not(:disabled):not([aria-disabled="true"]) {
    background-color: #dcc989;
    border-color: rgba(90, 79, 31, 0.52);
    color: #4a4018;
}

button.btn-accion-pill.btn-accion-pill--documento-boleta:active:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--documento-boleta:active:not(:disabled):not([aria-disabled="true"]),
button.btn-accion-pill.btn-accion-pill--documento-recibo:active:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--documento-recibo:active:not(:disabled):not([aria-disabled="true"]) {
    transform: scale(0.97);
}

span.btn-accion-pill.btn-accion-pill--documento-boleta,
span.btn-accion-pill.btn-accion-pill--documento-recibo {
    cursor: default;
    pointer-events: none;
}

/**
 * Pastilla "+ Agregar" en tarjetas de calendario (horarios citas). Borde suave, fondo transparente.
 */
button.btn-accion-pill.btn-accion-pill--agregar-horario,
a.btn-accion-pill.btn-accion-pill--agregar-horario {
    --btn-accion-pill-h: auto;
    --btn-accion-pill-min-w: auto;
    --btn-accion-pill-px: 0.75rem;
    --btn-accion-pill-radius: 999px;
    min-height: 1.75rem;
    padding: 0.28rem 0.75rem;
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.2;
    background-color: transparent;
    border-color: color-mix(in srgb, var(--color-granate, #661414) 34%, var(--color-crema, #f7f3e8));
    color: var(--color-text-default, #2d2d2d);
}

button.btn-accion-pill.btn-accion-pill--agregar-horario.btn-accion-pill--compacto,
a.btn-accion-pill.btn-accion-pill--agregar-horario.btn-accion-pill--compacto {
    --btn-accion-pill-h: 30px;
    --btn-accion-pill-min-w: 0;
    --btn-accion-pill-px: 0.5rem;
    font-size: 0.7rem;
    line-height: 1.15;
}

button.btn-accion-pill.btn-accion-pill--agregar-horario:hover:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--agregar-horario:hover:not(:disabled):not([aria-disabled="true"]) {
    background-color: color-mix(in srgb, var(--color-crema, #f7f3e8) 55%, transparent);
    border-color: color-mix(in srgb, var(--color-granate, #661414) 48%, var(--color-crema, #f7f3e8));
    color: var(--color-text-default, #2d2d2d);
}

@supports not (background: color-mix(in srgb, red 50%, blue 50%)) {
    button.btn-accion-pill.btn-accion-pill--agregar-horario,
    a.btn-accion-pill.btn-accion-pill--agregar-horario {
        border-color: rgba(var(--color-granate-rgb, 102, 20, 20), 0.28);
    }
}

/**
 * Pastilla de texto alineada a la altura de campos del contenedor (--floating-control-height).
 * Apilar sobre btn-accion-pill--agregar-horario; también se aplica en editor-filas-tiempo-pie y paso-nav.
 */
button.btn-accion-pill.btn-accion-pill--agregar-horario.btn-accion-pill--tamano-campo,
a.btn-accion-pill.btn-accion-pill--agregar-horario.btn-accion-pill--tamano-campo,
.editor-filas-tiempo-pie .btn-accion-pill.btn-accion-pill--agregar-horario,
.plantilla-informe-paso-nav .btn-accion-pill.btn-accion-pill--agregar-horario {
    --btn-accion-pill-h: var(--floating-control-height, calc(2.15rem + 2px));
    min-height: var(--btn-accion-pill-h);
    height: var(--btn-accion-pill-h);
    padding: 0 1.1rem;
    font-size: 0.8125rem;
    line-height: 1.2;
}

.panel-drawer .plantilla-informe-paso-nav .btn-accion-pill.btn-accion-pill--agregar-horario {
    --btn-accion-pill-h: var(--floating-control-height, calc(3.2rem + 2px));
    font-size: 0.875rem;
    padding: 0 1.25rem;
}

.panel-drawer .editor-filas-tiempo-pie .btn-accion-pill.btn-accion-pill--agregar-horario {
    --btn-accion-pill-h: calc(2.15rem + 2px);
    font-size: 0.8125rem;
    padding: 0 1.1rem;
}

/**
 * Icono circular (revision contrato, acciones binarias en tabla).
 * Par base gris + modificadores --revision-aceptar / --revision-rechazar pintan al hover o foco.
 */
.btn-accion-pill.btn-accion-pill--circulo {
    --btn-accion-pill-h: 2rem;
    --btn-accion-pill-min-w: 2rem;
    --btn-accion-pill-px: 0;
    --btn-accion-pill-icon: 0.95rem;
    width: var(--btn-accion-pill-h);
    min-width: var(--btn-accion-pill-h);
    max-width: var(--btn-accion-pill-h);
    border-radius: 50%;
    padding: 0;
    flex-shrink: 0;
}

button.btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-aceptar,
a.btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-aceptar,
button.btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-rechazar,
a.btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-rechazar {
    background-color: var(--panel-main-bg, var(--color-crema, #f7f3e8));
    border-color: #d4d0cb;
    color: #b0aca6;
}

button.btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-aceptar:hover:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-aceptar:hover:not(:disabled):not([aria-disabled="true"]),
button.btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-aceptar:focus-visible,
a.btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-aceptar:focus-visible,
button.btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-aceptar:active:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-aceptar:active:not(:disabled):not([aria-disabled="true"]) {
    background-color: var(--panel-main-bg, var(--color-crema, #f7f3e8));
    border-color: #2e7d32;
    color: #2e7d32;
}

button.btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-rechazar:hover:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-rechazar:hover:not(:disabled):not([aria-disabled="true"]),
button.btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-rechazar:focus-visible,
a.btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-rechazar:focus-visible,
button.btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-rechazar:active:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-rechazar:active:not(:disabled):not([aria-disabled="true"]) {
    background-color: var(--panel-main-bg, var(--color-crema, #f7f3e8));
    border-color: var(--color-granate-active, #9a2d2d);
    color: var(--color-granate-active, #9a2d2d);
}

/**
 * Circular pill aligned to filtros-listado combobox height (select all en drawer, etc.).
 * Apilar: btn-accion-pill btn-accion-pill--blanco btn-accion-pill--circulo btn-accion-pill--filtro-seleccion
 * Estados JS: .is-active (todos), .is-indeterminate (parcial).
 */
.btn-accion-pill.btn-accion-pill--filtro-seleccion {
    --btn-accion-pill-h: calc(2.15rem + 2px);
    --btn-accion-pill-min-w: calc(2.15rem + 2px);
    --btn-accion-pill-icon: 1.15rem;
    border-color: var(--panel-filtro-border, rgba(114, 114, 114, .25));
    background-color: var(--panel-filtro-field-bg, var(--color-blanco, #fff));
}

.btn-accion-pill.btn-accion-pill--filtro-seleccion i {
    pointer-events: none;
    opacity: 1;
    color: var(--color-granate-active, #9a2d2d);
}

.btn-accion-pill.btn-accion-pill--filtro-seleccion.is-active {
    background-color: var(--color-granate-active, #9a2d2d);
    border-color: var(--color-granate-active, #9a2d2d);
    color: var(--color-blanco, #fff);
}

.btn-accion-pill.btn-accion-pill--filtro-seleccion.is-active i {
    color: var(--color-blanco, #fff);
}

.btn-accion-pill.btn-accion-pill--filtro-seleccion.is-indeterminate:not(.is-active) {
    border-color: var(--color-granate, #7a1f1f);
    background-color: rgba(var(--color-granate-rgb, 122, 31, 31), .1);
}

.btn-accion-pill.btn-accion-pill--filtro-seleccion.is-indeterminate:not(.is-active) i {
    color: var(--color-granate-active, #9a2d2d);
}

.btn-accion-pill.btn-accion-pill--filtro-seleccion:hover:not(:disabled):not(.is-active):not(.is-indeterminate) {
    border-color: var(--panel-filtro-border-hover, rgba(114, 114, 114, .4));
    background-color: rgba(var(--color-granate-rgb, 122, 31, 31), .05);
}

.btn-accion-pill.btn-accion-pill--filtro-seleccion.is-active:hover:not(:disabled),
.btn-accion-pill.btn-accion-pill--filtro-seleccion.is-active:active:not(:disabled) {
    background-color: var(--color-granate-hover, #7a1919);
    border-color: var(--color-granate-hover, #7a1919);
    color: var(--color-blanco, #fff);
}

.btn-accion-pill.btn-accion-pill--filtro-seleccion.is-active:hover:not(:disabled) i,
.btn-accion-pill.btn-accion-pill--filtro-seleccion.is-active:active:not(:disabled) i {
    color: var(--color-blanco, #fff);
    opacity: 1;
}

.btn-accion-pill.btn-accion-pill--filtro-seleccion.is-indeterminate:not(.is-active):hover:not(:disabled) {
    border-color: var(--color-granate, #7a1f1f);
    background-color: rgba(var(--color-granate-rgb, 122, 31, 31), .14);
}

button.btn-accion-pill.btn-accion-pill--filtro-seleccion:disabled {
    cursor: wait;
    opacity: 1;
}

button.btn-accion-pill.btn-accion-pill--filtro-seleccion:disabled i {
    opacity: 1;
}

[data-theme="dark"] .btn-accion-pill.btn-accion-pill--filtro-seleccion {
    background-color: rgba(255, 255, 255, .06);
    border-color: rgba(255, 255, 255, .18);
    color: var(--color-dorado, #e0b070);
}

[data-theme="dark"] .btn-accion-pill.btn-accion-pill--filtro-seleccion i {
    color: var(--color-dorado, #e0b070);
}

[data-theme="dark"] .btn-accion-pill.btn-accion-pill--filtro-seleccion.is-active {
    background-color: rgba(var(--color-dorado-rgb, 224, 176, 112), .22);
    border-color: rgba(var(--color-dorado-rgb, 224, 176, 112), .45);
    color: var(--color-dorado, #e0b070);
}

[data-theme="dark"] .btn-accion-pill.btn-accion-pill--filtro-seleccion.is-active i {
    color: var(--color-dorado, #e0b070);
}

[data-theme="dark"] .btn-accion-pill.btn-accion-pill--filtro-seleccion.is-active:hover:not(:disabled),
[data-theme="dark"] .btn-accion-pill.btn-accion-pill--filtro-seleccion.is-active:active:not(:disabled) {
    background-color: rgba(var(--color-dorado-rgb, 224, 176, 112), .32);
    border-color: rgba(var(--color-dorado-rgb, 224, 176, 112), .55);
    color: var(--color-dorado, #e0b070);
}

/** Solo icono granate (ej. imprimir en cabecera de ver horario por clase). */
button.btn-accion-pill.btn-accion-pill--solo-icono-granate,
a.btn-accion-pill.btn-accion-pill--solo-icono-granate {
    --btn-accion-pill-h: auto;
    --btn-accion-pill-min-w: auto;
    --btn-accion-pill-px: 0.25rem;
    --btn-accion-pill-icon: 1.25rem;
    min-height: 0;
    padding: 0.15rem 0.25rem;
    background-color: transparent;
    border: none;
    color: var(--color-granate-active, #9a2d2d);
}

button.btn-accion-pill.btn-accion-pill--solo-icono-granate:hover:not(:disabled):not([aria-disabled="true"]),
a.btn-accion-pill.btn-accion-pill--solo-icono-granate:hover:not(:disabled):not([aria-disabled="true"]) {
    background-color: transparent;
    color: var(--color-granate-deep, #5c1212);
}

button.btn-accion-pill.btn-accion-pill--solo-icono-granate:focus-visible,
a.btn-accion-pill.btn-accion-pill--solo-icono-granate:focus-visible {
    outline: 3px solid var(--color-dorado, #d99a56);
    outline-offset: 2px;
}

/** Mismo tamaño que iconos importar/exportar del panel (1.8rem). */
button.btn-accion-pill.btn-accion-pill--solo-icono-granate.btn-accion-pill--solo-icono-granate-lg,
a.btn-accion-pill.btn-accion-pill--solo-icono-granate.btn-accion-pill--solo-icono-granate-lg {
    --btn-accion-pill-icon: 1.8rem;
    padding: 0.1rem 0.2rem;
}

[data-theme="dark"] .btn-accion-pill--blanco {
    background-color: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.28);
    color: var(--color-dorado, #e0b070);
}

[data-theme="dark"] button.btn-accion-pill.btn-accion-pill--blanco:is(:disabled, [aria-disabled="true"]) {
    color: var(--color-text-muted, #9a948c);
    border-color: rgba(255, 255, 255, 0.18);
    background-color: rgba(255, 255, 255, 0.04);
}

[data-theme="dark"] .btn-accion-pill--blanco:hover:not(:disabled):not([aria-disabled="true"]) {
    background-color: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.4);
}

[data-theme="dark"] button.btn-accion-pill.btn-accion-pill--rojo,
[data-theme="dark"] a.btn-accion-pill.btn-accion-pill--rojo {
    background-color: var(--btn-accion-pill-rojo-bg, #9a2d2d);
    border-color: var(--btn-accion-pill-rojo-border, #4a1010);
    color: var(--color-blanco, #f0ebe0);
}

[data-theme="dark"] button.btn-accion-pill.btn-accion-pill--rojo:hover:not(:disabled):not([aria-disabled="true"]),
[data-theme="dark"] a.btn-accion-pill.btn-accion-pill--rojo:hover:not(:disabled):not([aria-disabled="true"]) {
    background-color: var(--btn-accion-pill-rojo-bg-hover, #7a2525);
    border-color: var(--btn-accion-pill-rojo-border-hover, #5c1515);
    color: var(--color-blanco, #f0ebe0);
}

[data-theme="dark"] button.btn-accion-pill.btn-accion-pill--rojo-traslucido,
[data-theme="dark"] a.btn-accion-pill.btn-accion-pill--rojo-traslucido,
[data-theme="dark"] span.btn-accion-pill.btn-accion-pill--rojo-traslucido,
[data-theme="dark"] label.btn-accion-pill.btn-accion-pill--rojo-traslucido {
    background-color: rgba(var(--color-granate-rgb, 122, 37, 37), 0.28);
    border-color: #ef9a9a;
    /* Texto crema/blanco: granate-deep (#4a1010) sobre carbón es ilegible. */
    color: var(--color-blanco, #f0ebe0);
}

[data-theme="dark"] button.btn-accion-pill.btn-accion-pill--rojo-traslucido:hover:not(:disabled):not([aria-disabled="true"]),
[data-theme="dark"] a.btn-accion-pill.btn-accion-pill--rojo-traslucido:hover:not(:disabled):not([aria-disabled="true"]),
[data-theme="dark"] label.btn-accion-pill.btn-accion-pill--rojo-traslucido:hover {
    background-color: rgba(var(--color-granate-rgb, 122, 37, 37), 0.4);
    border-color: #ffcdd2;
    color: var(--color-blanco, #f0ebe0);
}

[data-theme="dark"] button.btn-accion-pill.btn-accion-pill--neutro,
[data-theme="dark"] a.btn-accion-pill.btn-accion-pill--neutro {
    background-color: var(--panel-main-bg, var(--color-crema));
    border-color: rgba(255, 255, 255, 0.28);
    color: var(--panel-main-text-muted, rgba(247, 243, 232, 0.7));
}

[data-theme="dark"] button.btn-accion-pill.btn-accion-pill--neutro:hover:not(:disabled):not([aria-disabled="true"]),
[data-theme="dark"] a.btn-accion-pill.btn-accion-pill--neutro:hover:not(:disabled):not([aria-disabled="true"]) {
    background-color: var(--panel-main-bg, var(--color-crema));
    border-color: rgba(255, 255, 255, 0.4);
    color: var(--panel-main-text, rgba(247, 243, 232, 0.92));
}

[data-theme="dark"] :is(span, button, a).btn-accion-pill.btn-accion-pill--exito-traslucido {
    background-color: var(--panel-main-bg, var(--color-crema));
    border-color: #66bb6a;
    color: #a5d6a7;
}

[data-theme="dark"] :is(span, button, a).btn-accion-pill.btn-accion-pill--info-traslucido {
    background-color: var(--panel-main-bg, var(--color-crema));
    border-color: var(--color-info, #90caf9);
    color: var(--color-info, #90caf9);
}

[data-theme="dark"] :is(span, button, a).btn-accion-pill.btn-accion-pill--exito-traslucido.btn-accion-pill--exito-relleno-suave {
    background-color: rgba(102, 187, 106, 0.15);
}

/* Rechazada/Pendiente: granate-active en oscuro es casi negro; texto crema/blanco. */
[data-theme="dark"] :is(span, button, a).btn-accion-pill.btn-accion-pill--rechazo-traslucido {
    background-color: rgba(var(--color-granate-rgb, 122, 37, 37), 0.28);
    border-color: #ef9a9a;
    color: #ffcdd2;
}

[data-theme="dark"] :is(span, button, a).btn-accion-pill.btn-accion-pill--pendiente-traslucido {
    background-color: rgba(var(--color-dorado-rgb, 224, 176, 112), 0.16);
    border-color: var(--color-dorado, #e0b070);
    color: var(--color-dorado, #e0b070);
}

[data-theme="dark"] :is(button, a, span).btn-accion-pill.btn-accion-pill--documento-boleta,
[data-theme="dark"] :is(button, a, span).btn-accion-pill.btn-accion-pill--documento-recibo {
    background-color: rgba(217, 154, 86, 0.22);
    border-color: var(--color-dorado, #d99a56);
    color: var(--color-dorado, #e0b070);
}

[data-theme="dark"] :is(button, a).btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-aceptar,
[data-theme="dark"] :is(button, a).btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-rechazar {
    background-color: var(--panel-main-bg, var(--color-crema, #f7f3e8));
    border-color: rgba(255, 255, 255, 0.22);
    color: rgba(255, 255, 255, 0.45);
}

[data-theme="dark"] :is(button, a).btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-aceptar:hover:not(:disabled):not([aria-disabled="true"]),
[data-theme="dark"] :is(button, a).btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-aceptar:focus-visible,
[data-theme="dark"] :is(button, a).btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-aceptar:active:not(:disabled):not([aria-disabled="true"]) {
    background-color: var(--panel-main-bg, var(--color-crema, #f7f3e8));
    border-color: #66bb6a;
    color: #a5d6a7;
}

[data-theme="dark"] :is(button, a).btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-rechazar:hover:not(:disabled):not([aria-disabled="true"]),
[data-theme="dark"] :is(button, a).btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-rechazar:focus-visible,
[data-theme="dark"] :is(button, a).btn-accion-pill.btn-accion-pill--circulo.btn-accion-pill--revision-rechazar:active:not(:disabled):not([aria-disabled="true"]) {
    background-color: var(--panel-main-bg, var(--color-crema, #f7f3e8));
    border-color: var(--color-granate-active, #9a2d2d);
    color: var(--color-dorado, #e0b070);
}