/**
 * Smart Address Form Styles
 * Methodology: BEM (Block Element Modifier)
 */

/* Container for keyframes to avoid pollution */
@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/* ─── Section-level loading indicator ─── */
.address-loading-indicator {
    display: none;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1rem;
    margin-bottom: 1rem;
    border-radius: var(--radius-md, 0.5rem);
    background: var(--info-light, #dbeafe);
    color: var(--info, #3b82f6);
    font-size: 0.875rem;
    font-weight: 500;
}

.address-loading-indicator__spinner {
    width: 1rem;
    height: 1rem;
    border: 2px solid var(--info, #3b82f6);
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin 0.7s linear infinite;
    flex-shrink: 0;
}

.address-form--loading .address-loading-indicator {
    display: flex;
}

.address-form__input--success {
    border-color: var(--success, #10b981) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2310b981' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M5 13l4 4L19 7'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 1.25rem;
}

.address-form__input--error {
    border-color: var(--error, #ef4444) !important;
    animation: shake 0.5s cubic-bezier(.36, .07, .19, .97) both;
}

@keyframes shake {

    10%,
    90% {
        transform: translate3d(-1px, 0, 0);
    }

    20%,
    80% {
        transform: translate3d(2px, 0, 0);
    }

    30%,
    50%,
    70% {
        transform: translate3d(-4px, 0, 0);
    }

    40%,
    60% {
        transform: translate3d(4px, 0, 0);
    }
}

.address-form__message {
    font-size: 0.875rem;
    margin-top: 0.25rem;
    display: none;
}

.address-form__message--error {
    color: var(--error, #ef4444);
    display: block;
}

.address-form__message--success {
    color: var(--success, #10b981);
    display: block;
}

/* Utility to visually disable fields during loading */
.address-form--loading .form-input,
.address-form--loading .form-select {
    opacity: 0.6;
    pointer-events: none;
    cursor: wait;
}