/**
 * Empex Cloudflare Turnstile – Frontend Stylesheet
 *
 * Provides layout safety for Turnstile widget containers
 * across all form integrations.
 *
 * @package Empex_Cloudflare_Turnstile
 * @since   1.0.0
 */

/* ================================================================== */
/* Widget Wrapper                                                     */
/* ================================================================== */

.empex-ct-widget-wrap {
	margin: 10px 0;
	clear: both;
	min-height: 65px;
}

.empex-ct-widget-wrap .empex-ct-turnstile,
.empex-ct-widget-wrap .cf-turnstile {
	display: block;
}

.empex-ct-message {
	color: #b32d2e;
	font-size: 13px;
	line-height: 1.4;
	margin-top: 8px;
}

/* ================================================================== */
/* Flexible size — fluid width (Cloudflare native responsive mode)    */
/* Min width is 300px per Cloudflare; only fits containers >= 300px.  */
/* ================================================================== */

.empex-ct-widget-wrap .empex-ct-turnstile[data-size="flexible"],
.empex-ct-widget-wrap .cf-turnstile[data-size="flexible"] {
	width: 100%;
	min-height: 65px;
}

/* ================================================================== */
/* Compact size — fixed small footprint for very narrow sidebars      */
/* ================================================================== */

.empex-ct-widget-wrap .empex-ct-turnstile[data-size="compact"],
.empex-ct-widget-wrap .cf-turnstile[data-size="compact"] {
	width: 150px;
	max-width: 150px;
	min-height: 140px;
}

/* ================================================================== */
/* WordPress Login / Registration / Lost Password                     */
/*                                                                    */
/* The #login card is 320px wide while the #loginform content box is  */
/* only ~272px (320 - 2x24 padding). A fixed 300px "normal" widget    */
/* left-aligned to the content box runs past the card's right edge    */
/* and clips the Cloudflare logo. Seat it inside the wider card with  */
/* a small negative margin instead of resizing the widget.            */
/* ================================================================== */

.login .empex-ct-widget-wrap,
.empex-ct-widget-wrap--narrow {
	margin: 16px 0 10px;
}

.login .empex-ct-widget-wrap .empex-ct-turnstile[data-size="normal"],
.login .empex-ct-widget-wrap .cf-turnstile[data-size="normal"],
.empex-ct-widget-wrap--narrow .empex-ct-turnstile[data-size="normal"],
.empex-ct-widget-wrap--narrow .cf-turnstile[data-size="normal"] {
	margin-left: -15px;
}

/* ================================================================== */
/* WordPress Comments                                                 */
/* ================================================================== */

.comment-form .empex-ct-widget-wrap {
	margin: 12px 0;
}

/* ================================================================== */
/* WooCommerce Checkout                                               */
/* ================================================================== */

.woocommerce-checkout .empex-ct-widget-wrap {
	margin: 15px 0;
}

/* ================================================================== */
/* WooCommerce My Account                                             */
/* ================================================================== */

.woocommerce-account .empex-ct-widget-wrap {
	margin: 12px 0;
}

/* ================================================================== */
/* WooCommerce Blocks Checkout                                        */
/* ================================================================== */

.wc-block-checkout .empex-ct-widget-wrap {
	margin: 16px 0;
}

/* ================================================================== */
/* Hidden Token Input (accessibility)                                 */
/* ================================================================== */

.empex-ct-widget-wrap input[name="empex-ct-token"] {
	display: none !important;
	visibility: hidden !important;
	position: absolute !important;
	width: 0 !important;
	height: 0 !important;
	overflow: hidden !important;
}

/* ================================================================== */
/* RTL Support                                                        */
/* ================================================================== */

[dir="rtl"] .empex-ct-widget-wrap {
	text-align: right;
}

[dir="rtl"] .login .empex-ct-widget-wrap .empex-ct-turnstile[data-size="normal"],
[dir="rtl"] .login .empex-ct-widget-wrap .cf-turnstile[data-size="normal"],
[dir="rtl"] .empex-ct-widget-wrap--narrow .empex-ct-turnstile[data-size="normal"],
[dir="rtl"] .empex-ct-widget-wrap--narrow .cf-turnstile[data-size="normal"] {
	margin-left: 0;
	margin-right: -15px;
}