/*
 * RID COD — Form UX: accent outline, optional submit button sway, mobile input sizing (no iOS zoom)
 */

/* Thin outline around order form — optional; uses Accent Color from Appearance settings */
.rid-cod-form-container.rid-cod-form-outline #rid-cod-checkout {
    outline: 2px solid var(--rid-cod-accent-color, #6a3de8);
    outline-offset: 0;
    box-shadow: 0 0 0 1px var(--rid-cod-accent-color, #6a3de8);
}

.rid-cod-form-container.rid-cod-form-outline .rid-cod-form-sixth #rid-cod-checkout {
    box-shadow: 0 0 0 2px var(--rid-cod-accent-color, #6a3de8);
}

@keyframes ridCodSubmitSway {
    0%,
    100% {
        transform: translateX(0);
    }
    25% {
        transform: translateX(-5px);
    }
    75% {
        transform: translateX(5px);
    }
}

.rid-cod-form-container.rid-cod-submit-sway #rid-cod-submit-btn,
.rid-cod-form-container.rid-cod-submit-sway #rid-cod-submit-btn-third,
.rid-cod-form-container.rid-cod-submit-sway .order-btn,
.rid-cod-form-container.rid-cod-submit-sway .btn-submit,
.rid-cod-form-container.rid-cod-submit-sway .sixth-btn-order {
    animation: ridCodSubmitSway 2s ease-in-out infinite;
}

.rid-cod-form-container.rid-cod-submit-sway #rid-cod-submit-btn:hover,
.rid-cod-form-container.rid-cod-submit-sway #rid-cod-submit-btn-third:hover,
.rid-cod-form-container.rid-cod-submit-sway .order-btn:hover,
.rid-cod-form-container.rid-cod-submit-sway .btn-submit:hover,
.rid-cod-form-container.rid-cod-submit-sway .sixth-btn-order:hover {
    transform: translateX(0);
}

@media (max-width: 768px) {
    #rid-cod-checkout input,
    #rid-cod-checkout select,
    #rid-cod-checkout textarea {
        font-size: 16px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .rid-cod-form-container.rid-cod-submit-sway #rid-cod-submit-btn,
    .rid-cod-form-container.rid-cod-submit-sway #rid-cod-submit-btn-third,
    .rid-cod-form-container.rid-cod-submit-sway .order-btn,
    .rid-cod-form-container.rid-cod-submit-sway .btn-submit,
    .rid-cod-form-container.rid-cod-submit-sway .sixth-btn-order {
        animation: none;
    }
}