/**
 * Handles CAPTCHA widget styling and overflow prevention
 * 
 * @package GuardDog
 * @since 1.8.0
 */

/* CAPTCHA Container Styling */
.guard-dog-captcha-container {
    width: fit-content;
    margin: 20px 0;
    text-align: center;
    overflow: visible;
    min-height: 80px;
}

.guard-dog-captcha-container .g-recaptcha,
.guard-dog-captcha-container .h-captcha,
.guard-dog-captcha-container .cf-turnstile {
    display: inline-block;
    max-width: 100%;
    overflow: visible;
}

#login.captcha-enabled {
    min-height: auto;
    width: fit-content;
}

#login.captcha-turnstile {
    width: fit-content;
    max-width: 350px;
}

#login.captcha-recaptcha-v2 {
    width: fit-content;
    max-width: 350px;
}

#login.captcha-hcaptcha {
    width: fit-content;
    max-width: 350px;
}

#login.captcha-recaptcha-v3 {
    width: fit-content;
    max-width: 350px;
}

.guard-dog-captcha-container .g-recaptcha {
    transform-origin: 0 0;
    transform: scale(1);
}

.guard-dog-captcha-container .h-captcha {
    transform-origin: 0 0;
    transform: scale(1);
}

.guard-dog-captcha-container .cf-turnstile {
    transform-origin: 0 0;
    transform: scale(1);
}

/* Error message styling */
.guard-dog-captcha-error {
    color: #d63638;
    background-color: #fcf0f1;
    border: 1px solid #d63638;
    border-radius: 4px;
    padding: 10px;
    margin: 10px 0;
    font-size: 14px;
}

/* reCAPTCHA v3 notice styling */
.guard-dog-recaptcha-notice {
    font-size: 12px;
    color: #646970;
    margin: 10px 0;
    line-height: 1.4;
}

.guard-dog-recaptcha-notice a {
    color: #0073aa;
    text-decoration: none;
}

.guard-dog-recaptcha-notice a:hover {
    text-decoration: underline;
}

/* Responsive adjustments for smaller screens */
@media (max-width: 480px) {
    .guard-dog-captcha-container .g-recaptcha,
    .guard-dog-captcha-container .h-captcha,
    .guard-dog-captcha-container .cf-turnstile {
        transform: scale(0.9);
    }
    
    #login.captcha-enabled {
        max-width: 100%;
        padding: 0 20px;
    }
}

@media (max-width: 360px) {
    .guard-dog-captcha-container .g-recaptcha,
    .guard-dog-captcha-container .h-captcha,
    .guard-dog-captcha-container .cf-turnstile {
        transform: scale(0.8);
    }
    
    #login.captcha-enabled {
        max-width: 100%;
        padding: 0 15px;
    }
}