/* HTMX transition styles */
.htmx-swapping {
    opacity: 0;
    transition: opacity 0.15s ease-out;
}

.htmx-settling {
    opacity: 1;
    transition: opacity 0.15s ease-in;
}

/* Success fade animation */
.fade-success {
    animation: fadeSuccess 2s ease-out forwards;
}

@keyframes fadeSuccess {
    0% { opacity: 1; }
    70% { opacity: 1; }
    100% { opacity: 0; }
}

/* Loading spinner */
.htmx-indicator {
    display: none !important;
}

.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator {
    display: flex !important;
}

.spinner {
    width: 24px;
    height: 24px;
    border: 3px solid #e5e7eb;
    border-top-color: #3b82f6;
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Ensure number inputs don't show spinners on mobile */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type="number"] {
    -moz-appearance: textfield;
}