/* Botones (EasyComponentes/Botones): EasyBoton, EasyMenuBoton y EasyNavegadorRegistros.
   Solo tokens --easy-* con valores por omisión. Esquinas: ningún radio fijo, todo sale de --easy-radio-base con la escala de la librería (ver easygrid.css). */

.easy-btn {
    --easy-btn-radio: var(--easy-radio-base, 8px);
    --easy-btn-alto: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: var(--easy-btn-alto);
    padding: 0 12px;
    font-family: var(--easy-fuente-base, inherit);
    font-size: calc(13px * var(--easy-escala-fuente, 1));
    font-weight: var(--easy-boton-peso, 600);
    line-height: 1;
    white-space: nowrap;
    /* Estilo de botón (Apariencia > Botones): la aplicación define --easy-boton-*; sin ellos, el botón sobrio de siempre.
       Primario, plano y peligro fijan su propio color más abajo. */
    color: var(--easy-boton-texto, var(--easy-color-texto, #1f2430));
    background: var(--easy-boton-fondo, var(--easy-color-superficie, #fff));
    border: 1px solid var(--easy-boton-borde, var(--easy-color-borde, #e5e7eb));
    border-radius: var(--easy-btn-radio);
    box-shadow: var(--easy-boton-sombra, none);
    cursor: pointer;
    user-select: none;
    transition: background-color .12s, border-color .12s, color .12s, box-shadow .12s;
}
/* La aplicación puede reiniciar la fuente de todos los button (shell.css: ".shell-shell button { font: inherit }", especificidad 0,1,1),
   que le ganaba a .easy-btn y dejaba el peso en el del cuerpo; con el elemento en el selector (0,1,1, y esta hoja carga después) vale el token */
button.easy-btn { font-weight: var(--easy-boton-peso, 600); }
.easy-btn:hover:not(:disabled), .easy-btn.activo {
    background: var(--easy-boton-fondo-hover, var(--easy-color-hover, #f3f4f6));
    border-color: var(--easy-boton-borde-hover, var(--easy-boton-borde, var(--easy-color-borde, #e5e7eb)));
}
.easy-btn:active:not(:disabled) { transform: translateY(.5px); }
.easy-btn:focus-visible { outline: 0; box-shadow: 0 0 0 3px var(--easy-color-foco, rgba(148, 4, 4, .25)); }
.easy-btn:disabled { opacity: .55; cursor: default; }
.easy-btn[aria-busy="true"] { cursor: progress; }
.easy-btn .easy-grid-ico { flex: none; }

.easy-btn-sm { --easy-btn-alto: 28px; padding: 0 9px; font-size: calc(12px * var(--easy-escala-fuente, 1)); }
.easy-btn-icono { width: var(--easy-btn-alto); padding: 0; }
.easy-btn-redondo { border-radius: calc(var(--easy-radio-base, 8px) * 2); }

.easy-btn-primario { color: var(--easy-color-sobre-primario, #fff); background: var(--easy-color-primario, #940404); border-color: var(--easy-color-primario, #940404); }
.easy-btn-primario:hover:not(:disabled), .easy-btn-primario.activo {
    background: var(--easy-color-primario-fuerte, #6f0303);
    border-color: var(--easy-color-primario-fuerte, #6f0303);
}

.easy-btn-plano { color: var(--easy-color-texto, #1f2430); background: transparent; border-color: transparent; box-shadow: none; }
.easy-btn-plano:hover:not(:disabled), .easy-btn-plano.activo { background: var(--easy-color-hover, #f3f4f6); border-color: transparent; }

.easy-btn-peligro {
    color: var(--easy-color-peligro, #b42318);
    background: transparent;
    border-color: color-mix(in srgb, var(--easy-color-peligro, #b42318) 35%, transparent);
}
.easy-btn-peligro:hover:not(:disabled) {
    background: color-mix(in srgb, var(--easy-color-peligro, #b42318) 10%, var(--easy-color-superficie, #fff));
    border-color: var(--easy-color-peligro, #b42318);
}
.easy-btn-peligro:focus-visible { box-shadow: 0 0 0 3px color-mix(in srgb, var(--easy-color-peligro, #b42318) 25%, transparent); }

.easy-btn-flecha { opacity: .6; margin-left: -2px; }

.easy-btn-giro {
    flex: none;
    width: 14px;
    height: 14px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: easy-btn-gira .7s linear infinite;
}
@keyframes easy-btn-gira { to { transform: rotate(360deg); } }

/* ---------- Menú desplegable ---------- */
.easy-menu { position: relative; display: inline-flex; }
.easy-menu-fondo { position: fixed; inset: 0; z-index: 1040; }
.easy-menu-lista {
    /* fixed: la coloca easycombo.js (debajo o encima del botón, dentro de la ventana) y no la recorta el scroll del grid */
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1050;
    display: flex;
    flex-direction: column;
    min-width: 200px;
    max-height: min(360px, 60vh);
    overflow-y: auto;
    padding: 6px;
    background: var(--easy-color-popup, #fff);
    color: var(--easy-color-texto, #1f2430);
    border: 1px solid var(--easy-color-borde, #e5e7eb);
    border-radius: calc(var(--easy-radio-base, 8px) * 1.25);
    box-shadow: var(--easy-sombra-popup, 0 10px 28px rgba(0, 0, 0, .18));
    font-family: var(--easy-fuente-base, inherit);
}
.easy-menu-lista:not([data-listo]) { visibility: hidden; }
.easy-menu-encabezado {
    padding: 6px 10px 4px;
    font-size: calc(11px * var(--easy-escala-fuente, 1));
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--easy-color-texto-tenue, #6b7280);
}
.easy-menu-buscar {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 2px 2px 6px;
    padding: 0 8px;
    color: var(--easy-color-texto-tenue, #6b7280);
    background: var(--easy-color-campo, #fff);
    border: 1px solid var(--easy-color-campo-borde, #ced4da);
    border-radius: calc(var(--easy-radio-base, 8px) * .75);
}
.easy-menu-buscar:focus-within { border-color: var(--easy-color-primario, #940404); box-shadow: 0 0 0 3px var(--easy-color-foco, rgba(148, 4, 4, .25)); }
.easy-menu-buscar input {
    flex: 1;
    min-width: 0;
    height: 30px;
    font: inherit;
    font-size: calc(13px * var(--easy-escala-fuente, 1));
    color: var(--easy-color-campo-texto, #1f2430);
    background: transparent;
    border: 0;
    outline: 0;
}
.easy-menu-item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 8px 10px;
    font: inherit;
    font-size: calc(13px * var(--easy-escala-fuente, 1));
    text-align: left;
    color: var(--easy-color-texto, #1f2430);
    background: transparent;
    border: 0;
    border-radius: calc(var(--easy-radio-base, 8px) * .75);
    cursor: pointer;
}
.easy-menu-item:hover, .easy-menu-item:focus-visible { outline: 0; background: var(--easy-color-seleccion, var(--easy-color-hover, #f3f4f6)); }
.easy-menu-item .easy-grid-ico { flex: none; color: var(--easy-color-texto-tenue, #6b7280); }
.easy-menu-vacio { padding: 10px; font-size: calc(13px * var(--easy-escala-fuente, 1)); text-align: center; color: var(--easy-color-texto-tenue, #6b7280); }

/* ---------- Navegador de registros ---------- */
.easy-nav {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 2px;
    background: var(--easy-color-superficie-alterna, #f9fafb);
    border: 1px solid var(--easy-color-borde, #e5e7eb);
    border-radius: var(--easy-radio-base, 8px);
}
.easy-nav .easy-btn { --easy-btn-alto: 30px; border-radius: calc(var(--easy-radio-base, 8px) * .75); }
.easy-nav-posicion {
    min-width: 74px;
    padding: 0 4px;
    font-size: calc(12.5px * var(--easy-escala-fuente, 1));
    text-align: center;
    white-space: nowrap;
    color: var(--easy-color-texto-tenue, #6b7280);
}
.easy-nav-posicion strong { color: var(--easy-color-texto, #1f2430); }

@media (prefers-reduced-motion: reduce) {
    .easy-btn { transition: none; }
    .easy-btn-giro { animation-duration: 1.6s; }
}