/* ============================================================================
   UDRINK · Auth Login · estilos específicos del modal de login.
   - Botón "X" de cerrar: posición absoluta arriba-derecha, tamaño fijo,
     hover acotado al círculo (no a todo el ancho).
   - Shim mínimo de utilities Tailwind no incluidas en tailwind-udrink.css.
   ============================================================================ */

.ud-login-close-btn {
    position: absolute;
    top: 0.75rem;            /* 12px */
    right: 0.75rem;
    width: 2.25rem;          /* 36px */
    height: 2.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    border-radius: 9999px;
    color: var(--ud-color-neutral-600, #475569);
    cursor: pointer;
    padding: 0;
    transition: background-color 0.18s ease, color 0.18s ease;
    z-index: 10;
}

.ud-login-close-btn:hover,
.ud-login-close-btn:focus-visible {
    background: var(--ud-color-neutral-100, #F1F5F9);
    color: var(--ud-color-neutral-900, #0F172A);
    outline: none;
}

.ud-login-close-btn .material-symbols-outlined {
    font-size: 20px;
    line-height: 1;
}

/* ============================================================================
   Botón cerrar reutilizable para cualquier modal.
   Diferencias con .ud-login-close-btn: ninguna — ambas comparten el mismo contrato.
   Se mantienen como alias para no tocar otros componentes que ya usan la variante login.
   ============================================================================ */

.ud-modal-close-btn {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    width: 2.25rem;
    height: 2.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    border-radius: 9999px;
    color: var(--ud-color-neutral-600, #475569);
    cursor: pointer;
    padding: 0;
    transition: background-color 0.18s ease, color 0.18s ease;
    z-index: 10;
    flex-shrink: 0;
}

.ud-modal-close-btn:hover,
.ud-modal-close-btn:focus-visible {
    background: var(--ud-color-neutral-100, #F1F5F9);
    color: var(--ud-color-neutral-900, #0F172A);
    outline: none;
}

.ud-modal-close-btn .material-symbols-outlined {
    font-size: 20px;
    line-height: 1;
}

/* Shim Tailwind utilities no precompiladas. */
.pr-14 { padding-right: 3.5rem; }
.pr-16 { padding-right: 4rem; }
