/**
 * Free Tool Builder frontend framework styles.
 * Scoped under .eftb-tool-wrapper to avoid affecting Divi or theme elements.
 */

.eftb-tool-wrapper,
.eftb-tool-wrapper * {
	box-sizing: border-box;
}

.eftb-tool-wrapper {
	--eftb-primary: #ff2d00;
	--eftb-secondary: #ff6f00;
	--eftb-button: #ff2d00;
	--eftb-button-text: #ffffff;
	--eftb-button-radius: 14px;
	--eftb-card-radius: 18px;
	width: 100%;
	max-width: 980px;
	margin: 24px auto;
	font-family: inherit;
	color: #1f2937;
}

.eftb-tool-card {
	background: #ffffff;
	border: 1px solid #eef0f4;
	border-radius: var(--eftb-card-radius);
	overflow: hidden;
}

.eftb-card--has-shadow .eftb-tool-card {
	box-shadow: 0 18px 45px rgba(17, 24, 39, 0.09);
}

.eftb-card--no-shadow .eftb-tool-card {
	box-shadow: none;
}

.eftb-tool-card__inner {
	padding: 28px;
}

.eftb-tool-header {
	margin: 0 0 22px;
}

.eftb-tool-header__eyebrow {
	margin: 0 0 8px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 1.4;
	text-transform: uppercase;
	color: var(--eftb-primary);
}

.eftb-tool-header__title {
	margin: 0;
	font-size: clamp(24px, 4vw, 34px);
	font-weight: 800;
	line-height: 1.16;
	color: #111827;
}

.eftb-tool-header__description {
	max-width: 720px;
	margin: 12px 0 0;
	font-size: 16px;
	line-height: 1.65;
	color: #4b5563;
}

.eftb-content-block,
.eftb-tool-note,
.eftb-cta-block,
.eftb-result-area,
.eftb-inline-message {
	border-radius: calc(var(--eftb-card-radius) * 0.72);
}

.eftb-content-block {
	margin: 0 0 22px;
	padding: 18px 20px;
	border: 1px solid #f0f2f5;
}

.eftb-content-block h4,
.eftb-cta-block h4,
.eftb-result-area h4 {
	margin: 0 0 8px;
	font-size: 18px;
	font-weight: 750;
	line-height: 1.35;
	color: #111827;
}

.eftb-content-block p,
.eftb-cta-block p,
.eftb-result-area p,
.eftb-field__helper {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: #5b6472;
}

.eftb-block-style--soft_panel,
.eftb-tool-note {
	background: #fff7f2;
	border-color: rgba(255, 111, 0, 0.17);
}

.eftb-block-style--outline_panel {
	background: #ffffff;
	border: 1px solid rgba(255, 45, 0, 0.23);
}

.eftb-block-style--highlight_panel,
.eftb-cta-block {
	background: linear-gradient(135deg, rgba(255, 45, 0, 0.08), rgba(255, 111, 0, 0.12));
	border: 1px solid rgba(255, 45, 0, 0.15);
}

.eftb-block-style--minimal_text {
	padding: 0;
	background: transparent;
	border: 0;
}

.eftb-text-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 12px;
	font-size: 14px;
	font-weight: 700;
	color: var(--eftb-primary);
	text-decoration: none;
}

.eftb-text-link:hover,
.eftb-text-link:focus {
	text-decoration: underline;
}

.eftb-tool-note {
	margin: 0 0 22px;
	padding: 13px 16px;
	font-size: 14px;
	line-height: 1.55;
	color: #4b5563;
}

.eftb-tool-form {
	margin: 0;
}

.eftb-form-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
	margin: 0 0 20px;
}

.eftb-form-grid--qr_url,
.eftb-form-grid--whatsapp_link {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.eftb-field--wide {
	grid-column: 1 / -1;
}

.eftb-field__label {
	display: block;
	margin: 0 0 7px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.4;
	color: #1f2937;
}

.eftb-field__required {
	color: var(--eftb-primary);
}

.eftb-field__control {
	display: block;
	width: 100%;
	min-height: 48px;
	padding: 12px 14px;
	border: 1px solid #d9dee8;
	border-radius: 12px;
	background: #ffffff;
	box-shadow: none;
	font: inherit;
	font-size: 15px;
	line-height: 1.45;
	color: #111827;
	transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.eftb-field__control:focus {
	outline: none;
	border-color: var(--eftb-primary);
	box-shadow: 0 0 0 3px rgba(255, 45, 0, 0.13);
}

.eftb-field__control[aria-invalid="true"] {
	border-color: #dc2626;
	box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.10);
}

.eftb-field textarea.eftb-field__control {
	min-height: 112px;
	resize: vertical;
}

.eftb-field__helper {
	margin-top: 7px;
	font-size: 13px;
	color: #6b7280;
}

.eftb-tool-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
}

.eftb-tool-actions--primary {
	margin-top: 8px;
}

.eftb-tool-actions--placeholder {
	margin-top: 18px;
}

.eftb-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 12px 20px;
	border: 1px solid transparent;
	border-radius: var(--eftb-button-radius);
	background: var(--eftb-button);
	box-shadow: 0 10px 22px rgba(255, 45, 0, 0.16);
	color: var(--eftb-button-text);
	font: inherit;
	font-size: 15px;
	font-weight: 750;
	line-height: 1.25;
	text-align: center;
	text-decoration: none !important;
	cursor: pointer;
	transition: transform 0.16s ease, box-shadow 0.16s ease, opacity 0.16s ease;
}

.eftb-button:hover,
.eftb-button:focus {
	transform: translateY(-1px);
	box-shadow: 0 14px 28px rgba(255, 45, 0, 0.20);
	color: var(--eftb-button-text);
}

.eftb-button:disabled,
.eftb-button[disabled] {
	cursor: not-allowed;
	opacity: 0.58;
	transform: none;
	box-shadow: none;
}

.eftb-button-style--outline {
	background: #ffffff;
	border-color: var(--eftb-button);
	box-shadow: none;
	color: var(--eftb-button);
}

.eftb-button-style--outline:hover,
.eftb-button-style--outline:focus {
	color: var(--eftb-button);
}

.eftb-button-style--soft {
	background: rgba(255, 45, 0, 0.09);
	border-color: rgba(255, 45, 0, 0.13);
	box-shadow: none;
	color: var(--eftb-primary);
}

.eftb-button-style--soft:hover,
.eftb-button-style--soft:focus {
	color: var(--eftb-primary);
}

.eftb-button__loading {
	display: none;
}

.eftb-tool-wrapper.is-loading .eftb-button__idle {
	display: none;
}

.eftb-tool-wrapper.is-loading .eftb-button__loading {
	display: inline;
}

.eftb-message-area {
	margin-top: 18px;
}

.eftb-inline-message {
	padding: 14px 16px;
	border: 1px solid #e5e7eb;
	background: #f9fafb;
	font-size: 14px;
	font-weight: 650;
	line-height: 1.5;
	color: #374151;
}

.eftb-inline-message--success {
	border-color: #bbf7d0;
	background: #f0fdf4;
	color: #166534;
}

.eftb-inline-message--error,
.eftb-inline-message--validation {
	border-color: #fecaca;
	background: #fef2f2;
	color: #991b1b;
}

.eftb-inline-message--loading {
	border-color: rgba(255, 111, 0, 0.20);
	background: #fff7ed;
	color: #9a3412;
}

.eftb-inline-message--disabled {
	border-color: #e5e7eb;
	background: #f8fafc;
	color: #4b5563;
}

.eftb-result-area {
	margin-top: 18px;
	padding: 20px;
	border: 1px solid #e8edf5;
	background: #fbfcff;
}

.eftb-result-area[hidden] {
	display: none !important;
}

.eftb-result-area__header {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	margin-bottom: 16px;
}

.eftb-result-area__icon {
	display: inline-flex;
	flex: 0 0 34px;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 999px;
	background: var(--eftb-primary);
	color: #ffffff;
	font-weight: 800;
}

.eftb-result-placeholder {
	display: grid;
	grid-template-columns: 126px minmax(0, 1fr);
	gap: 18px;
	align-items: center;
	padding: 16px;
	border: 1px dashed #cdd5e1;
	border-radius: 16px;
	background: #ffffff;
}

.eftb-result-placeholder__preview {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 8px;
	width: 104px;
	height: 104px;
	padding: 10px;
	border-radius: 16px;
	background: #f3f4f6;
}

.eftb-result-placeholder__preview span {
	border-radius: 8px;
	background: linear-gradient(135deg, var(--eftb-primary), var(--eftb-secondary));
	opacity: 0.82;
}

.eftb-result-placeholder__content strong {
	display: block;
	margin-bottom: 6px;
	font-size: 16px;
	color: #111827;
}

.eftb-cta-block {
	display: flex;
	gap: 18px;
	align-items: center;
	justify-content: space-between;
	margin-top: 22px;
	padding: 20px;
}

.eftb-cta-block__content {
	min-width: 0;
}

.eftb-cta-block__button-placeholder {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 11px 16px;
	border: 1px solid rgba(255, 45, 0, 0.18);
	border-radius: var(--eftb-button-radius);
	background: rgba(255, 255, 255, 0.62);
	font-size: 14px;
	font-weight: 750;
	color: var(--eftb-primary);
}

.eftb-powered-by {
	margin: 18px 0 0;
	font-size: 12px;
	line-height: 1.5;
	color: #8a94a6;
	text-align: center;
}

.eftb-layout--clean_minimal .eftb-tool-card {
	border-color: #e5e7eb;
	background: #ffffff;
}

.eftb-layout--clean_minimal.eftb-card--has-shadow .eftb-tool-card {
	box-shadow: 0 10px 26px rgba(17, 24, 39, 0.05);
}

.eftb-layout--clean_minimal .eftb-tool-card__inner {
	padding: 24px;
}

.eftb-layout--clean_minimal .eftb-tool-header__eyebrow {
	display: none;
}

.eftb-layout--clean_minimal .eftb-tool-header__title {
	font-size: clamp(22px, 3.4vw, 28px);
}

.eftb-layout--clean_minimal .eftb-content-block,
.eftb-layout--clean_minimal .eftb-cta-block,
.eftb-layout--clean_minimal .eftb-result-area {
	background: #ffffff;
	border-color: #e5e7eb;
}

@media (max-width: 782px) {
	.eftb-tool-wrapper {
		margin: 18px auto;
	}

	.eftb-tool-card__inner,
	.eftb-layout--clean_minimal .eftb-tool-card__inner {
		padding: 22px 18px;
	}

	.eftb-form-grid,
	.eftb-form-grid--qr_url,
	.eftb-form-grid--whatsapp_link {
		grid-template-columns: 1fr;
		gap: 14px;
	}

	.eftb-field--wide {
		grid-column: auto;
	}

	.eftb-tool-actions,
	.eftb-cta-block {
		align-items: stretch;
		flex-direction: column;
	}

	.eftb-button,
	.eftb-cta-block__button-placeholder {
		width: 100%;
	}

	.eftb-result-placeholder {
		grid-template-columns: 1fr;
	}

	.eftb-result-placeholder__preview {
		width: 96px;
		height: 96px;
	}
}

@media (max-width: 360px) {
	.eftb-tool-card__inner,
	.eftb-layout--clean_minimal .eftb-tool-card__inner {
		padding: 18px 14px;
	}

	.eftb-content-block,
	.eftb-cta-block,
	.eftb-result-area {
		padding: 16px;
	}

	.eftb-field__control,
	.eftb-button {
		min-height: 46px;
	}
}

/* older admin values kept for backward compatibility. */
.eftb-block-style--plain {
	padding: 0;
	background: transparent;
	border: 0;
}

.eftb-block-style--bordered {
	background: #ffffff;
	border: 1px solid rgba(255, 45, 0, 0.23);
}

.eftb-form-helper {
	margin: 0 0 16px;
	padding: 12px 14px;
	border-radius: 12px;
	background: #f8fafc;
	border: 1px solid #e5e7eb;
	font-size: 14px;
	line-height: 1.55;
	color: #4b5563;
}

/* v0.1.7 functional QR Code Generator result styles. */
.eftb-qr-result {
	display: grid;
	grid-template-columns: minmax(160px, 260px) minmax(0, 1fr);
	gap: 22px;
	align-items: center;
	padding: 18px;
	border: 1px solid #e5eaf2;
	border-radius: 18px;
	background: #ffffff;
}

.eftb-qr-preview {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 14px;
	border: 1px solid #eef2f7;
	border-radius: 16px;
	background: #ffffff;
}

.eftb-qr-preview canvas,
.eftb-qr-preview img,
.eftb-qr-preview svg {
	display: block;
	width: 100%;
	max-width: 232px;
	height: auto;
}

.eftb-qr-result__details strong {
	display: block;
	margin-bottom: 8px;
	font-size: 18px;
	line-height: 1.35;
	color: #111827;
}

.eftb-qr-url-line {
	margin-top: 10px !important;
	padding: 10px 12px;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	background: #f9fafb;
	font-size: 13px !important;
	line-height: 1.45 !important;
	color: #374151 !important;
	word-break: break-all;
}

.eftb-result-actions {
	grid-column: 1 / -1;
	margin-top: 0;
}

.eftb-privacy-note {
	grid-column: 1 / -1;
	margin: 0 !important;
	padding: 12px 14px;
	border: 1px solid #dbeafe;
	border-radius: 12px;
	background: #eff6ff;
	font-size: 13px !important;
	line-height: 1.55 !important;
	color: #1e40af !important;
}

.eftb-result-area--has-qr {
	background: #fbfcff;
}

@media (max-width: 782px) {
	.eftb-qr-result {
		grid-template-columns: 1fr;
		gap: 16px;
		padding: 16px;
	}

	.eftb-qr-preview canvas,
	.eftb-qr-preview img,
	.eftb-qr-preview svg {
		max-width: min(100%, 260px);
	}

	.eftb-result-actions {
		flex-direction: column;
	}
}

/* v0.1.7 functional vCard QR Code and vCard File Generator result styles. */
.eftb-vcard-result {
	display: grid;
	grid-template-columns: minmax(160px, 260px) minmax(0, 1fr);
	gap: 22px;
	align-items: center;
	padding: 18px;
	border: 1px solid #e5eaf2;
	border-radius: 18px;
	background: #ffffff;
}

.eftb-vcard-result__details strong {
	display: block;
	margin-bottom: 8px;
	font-size: 18px;
	line-height: 1.35;
	color: #111827;
}

.eftb-vcard-result__details p {
	margin: 0 !important;
	font-size: 14px !important;
	line-height: 1.6 !important;
	color: #4b5563 !important;
}

.eftb-button--download-vcf {
	white-space: nowrap;
}

.eftb-result-area--has-vcard {
	background: #fbfcff;
}

@media (max-width: 782px) {
	.eftb-vcard-result {
		grid-template-columns: 1fr;
		gap: 16px;
		padding: 16px;
	}
}

/* v0.1.7 functional WhatsApp Link Generator result styles. */
.eftb-whatsapp-result {
	display: grid;
	grid-template-columns: minmax(160px, 260px) minmax(0, 1fr);
	gap: 22px;
	align-items: center;
	padding: 18px;
	border: 1px solid #e5eaf2;
	border-radius: 18px;
	background: #ffffff;
}

.eftb-whatsapp-result__details strong {
	display: block;
	margin-bottom: 8px;
	font-size: 18px;
	line-height: 1.35;
	color: #111827;
}

.eftb-whatsapp-result__details p {
	margin: 0 !important;
	font-size: 14px !important;
	line-height: 1.6 !important;
	color: #4b5563 !important;
}

.eftb-whatsapp-link-box {
	margin-top: 10px !important;
	padding: 10px 12px;
	border: 1px solid #dcfce7;
	border-radius: 12px;
	background: #f0fdf4;
	font-size: 13px !important;
	line-height: 1.45 !important;
	color: #166534 !important;
	word-break: break-all;
}

.eftb-result-area--has-whatsapp {
	background: #fbfcff;
}

@media (max-width: 782px) {
	.eftb-whatsapp-result {
		grid-template-columns: 1fr;
		gap: 16px;
		padding: 16px;
	}
}

/* v0.1.7 functional Email Signature Generator result styles. */
.eftb-email-signature-result {
	display: grid;
	gap: 16px;
	padding: 18px;
	border: 1px solid #e5eaf2;
	border-radius: 18px;
	background: #ffffff;
}

.eftb-signature-preview-wrap {
	display: grid;
	gap: 12px;
}

.eftb-signature-preview-wrap > strong {
	display: block;
	font-size: 16px;
	line-height: 1.35;
	color: #111827;
}

.eftb-signature-preview {
	overflow-x: auto;
	max-width: 100%;
	padding: 16px;
	border: 1px solid #eef2f7;
	border-radius: 14px;
	background: #f9fafb;
}

.eftb-signature-preview table {
	max-width: 100%;
}

.eftb-email-signature-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}

.eftb-usage-note,
.eftb-privacy-note {
	margin: 0 !important;
	font-size: 13px !important;
	line-height: 1.55 !important;
	color: #4b5563 !important;
}

.eftb-usage-note {
	padding: 10px 12px;
	border: 1px solid #dbeafe;
	border-radius: 12px;
	background: #eff6ff;
}

.eftb-result-area--has-email-signature {
	background: #fbfcff;
}

.eftb-form-grid--email_signature {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 782px) {
	.eftb-form-grid--email_signature {
		grid-template-columns: 1fr;
	}

	.eftb-email-signature-result {
		padding: 16px;
	}

	.eftb-signature-preview {
		padding: 12px;
	}

	.eftb-email-signature-actions {
		flex-direction: column;
		align-items: stretch;
	}

	.eftb-email-signature-actions .eftb-button {
		width: 100%;
		justify-content: center;
	}
}

/* v0.1.7 spacing refinement: keep a clear gap between generated result output and the post-generation content block on desktop and mobile. */
.eftb-result-area > .eftb-content-block--post {
	margin-top: 22px;
}

@media (max-width: 782px) {
	.eftb-result-area > .eftb-content-block--post {
		margin-top: 18px;
	}
}

/* v0.1.7 spacing fix 2: force consistent separation between the generated output card and the post-generation content block. */
.eftb-result-area .eftb-qr-result,
.eftb-result-area .eftb-vcard-result,
.eftb-result-area .eftb-whatsapp-result,
.eftb-result-area .eftb-email-signature-result {
	margin-bottom: 22px !important;
}

.eftb-result-area .eftb-qr-result + .eftb-content-block--post,
.eftb-result-area .eftb-vcard-result + .eftb-content-block--post,
.eftb-result-area .eftb-whatsapp-result + .eftb-content-block--post,
.eftb-result-area .eftb-email-signature-result + .eftb-content-block--post,
.eftb-result-area > .eftb-content-block--post {
	margin-top: 22px !important;
}

@media (max-width: 782px) {
	.eftb-result-area .eftb-qr-result,
	.eftb-result-area .eftb-vcard-result,
	.eftb-result-area .eftb-whatsapp-result,
	.eftb-result-area .eftb-email-signature-result {
		margin-bottom: 18px !important;
	}

	.eftb-result-area .eftb-qr-result + .eftb-content-block--post,
	.eftb-result-area .eftb-vcard-result + .eftb-content-block--post,
	.eftb-result-area .eftb-whatsapp-result + .eftb-content-block--post,
	.eftb-result-area .eftb-email-signature-result + .eftb-content-block--post,
	.eftb-result-area > .eftb-content-block--post {
		margin-top: 18px !important;
	}
}


/* v0.1.7 mobile edge-to-edge repair: remove Divi/theme top and side gaps around shortcode tools on phones only. */
@media (max-width: 782px) {
	body.eftb-has-mobile-tool-gap-fix {
		overflow-x: hidden;
	}

	.eftb-tool-wrapper {
		width: 100vw !important;
		max-width: 100vw !important;
		margin-top: 0 !important;
		margin-bottom: 0 !important;
		margin-left: calc(50% - 50vw) !important;
		margin-right: calc(50% - 50vw) !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.eftb-tool-card {
		border-left: 0 !important;
		border-right: 0 !important;
		border-radius: 0 !important;
	}

	.eftb-card--has-shadow .eftb-tool-card,
	.eftb-layout--clean_minimal.eftb-card--has-shadow .eftb-tool-card {
		box-shadow: none !important;
	}

	.eftb-tool-card__inner,
	.eftb-layout--clean_minimal .eftb-tool-card__inner {
		padding: 14px 14px 18px !important;
	}

	.eftb-tool-header {
		margin-top: 0 !important;
	}

	.eftb-mobile-tool-section,
	.eftb-mobile-tool-row,
	.eftb-mobile-tool-column,
	.eftb-mobile-tool-module,
	.eftb-mobile-tool-code-inner {
		max-width: 100% !important;
		width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.eftb-mobile-tool-section,
	.eftb-mobile-tool-row {
		padding-top: 0 !important;
	}

	.eftb-mobile-tool-module,
	.eftb-mobile-tool-code-inner {
		margin-top: 0 !important;
	}

	.et_pb_section:has(.eftb-tool-wrapper),
	.et_pb_row:has(.eftb-tool-wrapper),
	.et_pb_column:has(.eftb-tool-wrapper),
	.et_pb_module:has(.eftb-tool-wrapper),
	.et_pb_code_inner:has(.eftb-tool-wrapper) {
		max-width: 100% !important;
		width: 100% !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.et_pb_section:has(.eftb-tool-wrapper),
	.et_pb_row:has(.eftb-tool-wrapper) {
		padding-top: 0 !important;
	}
}

@media (max-width: 360px) {
	.eftb-tool-card__inner,
	.eftb-layout--clean_minimal .eftb-tool-card__inner {
		padding-left: 12px !important;
		padding-right: 12px !important;
	}
}