/**
 * Botones primarios: solo variables semánticas del tema activo.
 */
.btn-primary {
    --bs-btn-bg: var(--color-granate);
    --bs-btn-border-color: var(--color-granate);
    --bs-btn-hover-bg: var(--color-granate-hover);
    --bs-btn-hover-border-color: var(--color-granate-hover);
    --bs-btn-active-bg: var(--color-granate-active);
    --bs-btn-active-border-color: var(--color-granate-active);
}

.btn-burbuja-rojo,
.btn-burbuja-blanco {
    width: var(--btn-burbuja-w, auto);
    height: var(--btn-burbuja-h, 36px);
    border-radius: 5px;
    border: 1px solid;
    padding: 0 var(--btn-burbuja-px, 0.75rem);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    line-height: 1;
}

.btn-burbuja-rojo {
    --btn-burbuja-w: 110px;
    background-color: #7a1919;
    border-color: #7a1919;
    color: #ffffff;
}

.btn.btn-burbuja-rojo {
    --bs-btn-bg: #7a1919;
    --bs-btn-border-color: #7a1919;
    --bs-btn-color: #fff;
    --bs-btn-hover-bg: var(--color-granate-deep, #661414);
    --bs-btn-hover-border-color: var(--color-granate-deep, #661414);
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: var(--color-granate-deep, #661414);
    --bs-btn-active-border-color: var(--color-granate-deep, #661414);
    --bs-btn-active-color: #fff;
    --bs-btn-disabled-bg: #7a1919;
    --bs-btn-disabled-border-color: #7a1919;
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-opacity: 0.55;
}

.btn.btn-burbuja-rojo:hover,
.btn.btn-burbuja-rojo:focus,
.btn.btn-burbuja-rojo:active {
    background-color: var(--color-granate-deep, #661414);
    border-color: var(--color-granate-deep, #661414);
    color: #fff;
}

.btn.btn-burbuja-rojo:disabled,
.btn.btn-burbuja-rojo.disabled {
    background-color: #7a1919;
    border-color: #7a1919;
    color: #fff;
    opacity: 0.55;
}

.btn.btn-burbuja-rojo:focus-visible {
    box-shadow: 0 0 0 0.2rem rgba(var(--color-granate-rgb, 102, 20, 20), 0.35);
}

.btn-burbuja-rojo--ancho-contenido {
    --btn-burbuja-w: auto;
    gap: 0.4rem;
    min-width: 6.875rem;
    white-space: nowrap;
}

.btn-burbuja-blanco {
    --btn-burbuja-w: 110px;
    background-color: rgba(255, 255, 255, 0.25);
    border-color: #5c4a3d;
    color: #727272;
    text-decoration: none;
}

.btn-burbuja-blanco--ancho-contenido {
    --btn-burbuja-w: auto;
    gap: 0.4rem;
    min-width: 6.875rem;
    white-space: nowrap;
}

.btn.btn-burbuja-blanco,
a.btn-burbuja-blanco {
    --bs-btn-bg: rgba(255, 255, 255, 0.25);
    --bs-btn-border-color: #5c4a3d;
    --bs-btn-color: #727272;
    --bs-btn-hover-bg: rgba(255, 255, 255, 0.42);
    --bs-btn-hover-border-color: #5c4a3d;
    --bs-btn-hover-color: #5c4a3d;
    --bs-btn-active-bg: rgba(255, 255, 255, 0.5);
    --bs-btn-active-border-color: #5c4a3d;
    --bs-btn-active-color: #5c4a3d;
}

.btn.btn-burbuja-blanco:hover,
.btn.btn-burbuja-blanco:focus,
.btn.btn-burbuja-blanco:active,
a.btn-burbuja-blanco:hover,
a.btn-burbuja-blanco:focus,
a.btn-burbuja-blanco:active {
    background-color: rgba(255, 255, 255, 0.42);
    border-color: #5c4a3d;
    color: #5c4a3d;
    text-decoration: none;
    box-shadow: none;
}

.btn.btn-burbuja-blanco:focus-visible,
a.btn-burbuja-blanco:focus-visible {
    box-shadow: 0 0 0 0.2rem rgba(92, 74, 61, 0.25);
}

.btn.btn--cargando {
    pointer-events: none;
    opacity: 0.88;
}

/**
 * Relleno liquido con superficie senoidal (ola) que se desplaza L→R en bucle.
 * Variables: --btn-progreso (% altura), --btn-progreso-fill, --btn-progreso-track.
 * Marcado inyectado por window.BotonCargando (ola + etiqueta).
 */
:is(.btn, .btn-accion-pill).btn--progreso-lineal.btn--cargando {
    --btn-progreso: 0%;
    --btn-progreso-fill: var(--color-granate-deep, #661414);
    --btn-progreso-track: rgba(154, 45, 45, 0.38);
    --btn-progreso-track: color-mix(in srgb, var(--color-granate-active, #9a2d2d) 48%, #f5ebe8);
    --btn-progreso-ola-h: 0.85rem;
    --btn-progreso-ola-dur: 2.6s;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    pointer-events: none;
    opacity: 1;
    width: auto;
    color: var(--color-blanco, #fff) !important;
    border-color: var(--btn-progreso-fill) !important;
    background-color: var(--btn-progreso-track) !important;
    background-image: none !important;
    box-shadow: none !important;
    transition: none;
    white-space: nowrap;
}

:is(.btn, .btn-accion-pill).btn--progreso-lineal.btn--cargando:hover,
:is(.btn, .btn-accion-pill).btn--progreso-lineal.btn--cargando:focus,
:is(.btn, .btn-accion-pill).btn--progreso-lineal.btn--cargando:active,
:is(.btn, .btn-accion-pill).btn--progreso-lineal.btn--cargando:disabled {
    color: var(--color-blanco, #fff) !important;
    border-color: var(--btn-progreso-fill) !important;
    background-color: var(--btn-progreso-track) !important;
    background-image: none !important;
    opacity: 1;
}

:is(.btn, .btn-accion-pill).btn--progreso-lineal.btn--cargando .btn-progreso-ola {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

:is(.btn, .btn-accion-pill).btn--progreso-lineal.btn--cargando .btn-progreso-ola__liquido {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: var(--btn-progreso);
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    color: var(--btn-progreso-fill);
}

:is(.btn, .btn-accion-pill).btn--progreso-lineal.btn--cargando .btn-progreso-ola__cuerpo {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    background-color: currentColor;
}

:is(.btn, .btn-accion-pill).btn--progreso-lineal.btn--cargando .btn-progreso-ola__superficie {
    position: absolute;
    left: 0;
    bottom: calc(var(--btn-progreso) - (var(--btn-progreso-ola-h) * 0.42));
    width: 200%;
    height: var(--btn-progreso-ola-h);
    display: flex;
    flex-direction: row;
    color: var(--btn-progreso-fill);
    will-change: transform;
    animation: btn-progreso-ola-desplazar var(--btn-progreso-ola-dur) linear infinite;
}

:is(.btn, .btn-accion-pill).btn--progreso-lineal.btn--cargando .btn-progreso-ola__superficie--lenta {
    opacity: 0.55;
    height: calc(var(--btn-progreso-ola-h) * 1.15);
    bottom: calc(var(--btn-progreso) - (var(--btn-progreso-ola-h) * 0.55));
    animation-duration: calc(var(--btn-progreso-ola-dur) * 1.35);
    animation-direction: reverse;
}

:is(.btn, .btn-accion-pill).btn--progreso-lineal.btn--cargando .btn-progreso-ola__superficie svg {
    display: block;
    flex: 0 0 50%;
    width: 50%;
    height: 100%;
}

:is(.btn, .btn-accion-pill).btn--progreso-lineal.btn--cargando .btn-progreso-ola__etiqueta {
    position: relative;
    z-index: 1;
    display: inline-block;
    color: inherit;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

@keyframes btn-progreso-ola-desplazar {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}

.panel-drawer .drawer-form__acciones .btn-burbuja-rojo.btn--progreso-lineal.btn--cargando,
.panel-drawer .drawer-form__acciones .btn-primary.btn--progreso-lineal.btn--cargando {
    --btn-progreso-fill: var(--panel-category-bg, var(--color-granate-deep, #661414));
    --btn-progreso-track: rgba(154, 45, 45, 0.36);
    --btn-progreso-track: color-mix(in srgb, var(--panel-category-bg, var(--color-granate-active, #9a2d2d)) 42%, #f7efee);
}

.btn.btn-danger.btn--progreso-lineal.btn--cargando {
    --btn-progreso-fill: var(--color-granate-deep, #661414);
    --btn-progreso-track: rgba(154, 45, 45, 0.34);
    --btn-progreso-track: color-mix(in srgb, var(--color-granate-active, #9a2d2d) 40%, #f8ecec);
}

[data-theme="dark"] :is(.btn, .btn-accion-pill).btn--progreso-lineal.btn--cargando {
    --btn-progreso-fill: var(--color-granate, #7a2525);
    --btn-progreso-track: rgba(var(--color-granate-rgb, 122, 37, 37), 0.38);
}

[data-theme="dark"] .panel-drawer .drawer-form__acciones .btn-burbuja-rojo.btn--progreso-lineal.btn--cargando,
[data-theme="dark"] .panel-drawer .drawer-form__acciones .btn-primary.btn--progreso-lineal.btn--cargando {
    --btn-progreso-fill: var(--color-granate, #7a2525);
    --btn-progreso-track: rgba(var(--color-granate-rgb, 122, 37, 37), 0.32);
    border-color: var(--color-dorado, #e0b070) !important;
}

@media (prefers-reduced-motion: reduce) {
    :is(.btn, .btn-accion-pill).btn--progreso-lineal.btn--cargando {
        --btn-progreso: 100%;
    }

    :is(.btn, .btn-accion-pill).btn--progreso-lineal.btn--cargando .btn-progreso-ola__superficie {
        animation: none;
    }
}

/* Enlaces tipo boton: paleta granate (no azul Bootstrap) y subrayado para distinguirlos del texto */
.btn.btn-link:not(.text-white):not(.text-danger) {
    --bs-btn-color: var(--bs-link-color);
    --bs-btn-hover-color: var(--bs-link-hover-color);
    --bs-btn-active-color: var(--bs-link-hover-color);
    font-weight: 600;
}

.btn.btn-link:not(.text-white):not(.text-danger):not(.text-decoration-none) {
    text-decoration: underline;
    text-underline-offset: 0.14em;
}