/**
 * jquery-confirm — visual alinhado ao padrão .formulariomautic (WhatsApp / Resistente)
 * Depende de jquery-confirm.min.css (sobrescreve tema modern + type-green)
 */

.jconfirm .jconfirm-bg {
	background-color: rgba(15, 23, 42, 0.48) !important;
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}

.jconfirm .jconfirm-box {
	font-family: inherit;
	-webkit-font-smoothing: antialiased;
	background: #fff !important;
	border-radius: 16px !important;
	border: 1px solid rgba(15, 23, 42, 0.06) !important;
	box-shadow:
		0 4px 6px -1px rgba(15, 23, 42, 0.06),
		0 24px 48px -12px rgba(15, 23, 42, 0.18) !important;
	overflow: hidden;
	max-width: min(400px, calc(100vw - 32px));
	box-sizing: border-box;
}

.jconfirm .jconfirm-box.jconfirm-type-green {
	border-top: none !important;
}

.jconfirm .jconfirm-box.jconfirm-type-green .jconfirm-title-c,
.jconfirm .jconfirm-box.jconfirm-type-green .jconfirm-content-pane {
	border-color: rgba(15, 23, 42, 0.06) !important;
}

.jconfirm .jconfirm-box .jconfirm-closeIcon {
	top: 14px !important;
	right: 14px !important;
	width: 32px !important;
	height: 32px !important;
	line-height: 30px !important;
	font-size: 22px !important;
	color: #64748b !important;
	opacity: 1 !important;
	border-radius: 10px !important;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.jconfirm .jconfirm-box .jconfirm-closeIcon:hover {
	background-color: rgba(15, 23, 42, 0.06) !important;
	color: #0f172a !important;
}

.jconfirm .jconfirm-box .jconfirm-title-c {
	padding: 18px 48px 14px 18px !important;
	margin: 0 !important;
	height: auto !important;
	align-items: flex-start !important;
	gap: 10px !important;
	background: linear-gradient(
		135deg,
		rgba(248, 231, 28, 0.35) 0%,
		rgba(4, 94, 158, 0.08) 100%
	) !important;
	border-bottom: 1px solid rgba(15, 23, 42, 0.06) !important;
	border-radius: 0 !important;
}

.jconfirm .jconfirm-box .jconfirm-icon-c {
	margin: 0 !important;
	padding: 0 !important;
	color: #045e9e !important;
	font-size: 18px !important;
	line-height: 1.2 !important;
}

.jconfirm .jconfirm-box .jconfirm-icon-c:empty {
	display: none !important;
}

.jconfirm .jconfirm-box .jconfirm-title {
	font-size: 15px !important;
	font-weight: 700 !important;
	color: #0f172a !important;
	line-height: 1.35 !important;
	padding: 0 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
}

.jconfirm .jconfirm-box .jconfirm-content-pane {
	margin-bottom: 0 !important;
	padding: 0 !important;
	max-height: none !important;
}

.jconfirm .jconfirm-box .jconfirm-content {
	font-size: 14px !important;
	line-height: 1.5 !important;
	color: #334155 !important;
	padding: 16px 18px 18px !important;
}

.jconfirm .jconfirm-box .jconfirm-buttons {
	padding: 0 18px 18px !important;
	float: none !important;
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: wrap !important;
	gap: 10px !important;
	justify-content: flex-end !important;
}

.jconfirm .jconfirm-box .jconfirm-buttons button {
	float: none !important;
	min-width: 0 !important;
	flex: 1 1 auto !important;
	margin: 0 !important;
	padding: 12px 16px !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	border-radius: 10px !important;
	transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease,
		color 0.15s ease !important;
	text-transform: none !important;
	border: 1px solid #e2e8f0 !important;
	background: #fff !important;
	color: #334155 !important;
	box-shadow: none !important;
}

/* Segundo botão no DOM = ação principal (ex.: Sim), alinhado ao botão do formulário Mautic */
.jconfirm .jconfirm-box .jconfirm-buttons button + button {
	background-color: #045e9e !important;
	border-color: #045e9e !important;
	color: #fff !important;
}

.jconfirm .jconfirm-box .jconfirm-buttons button + button:hover {
	filter: brightness(1.05);
}

.jconfirm .jconfirm-box .jconfirm-buttons button:first-child:not(:only-child) {
	background: #fff !important;
	border: 1px solid #e2e8f0 !important;
	color: #334155 !important;
}

.jconfirm .jconfirm-box .jconfirm-buttons button:first-child:not(:only-child):hover {
	border-color: #cbd5e1 !important;
	background: #f8fafc !important;
}

.jconfirm .jconfirm-box .jconfirm-buttons button:focus {
	outline: none !important;
	box-shadow: 0 0 0 3px rgba(4, 94, 158, 0.18) !important;
}

.jconfirm .jconfirm-box .jconfirm-buttons button + button:focus {
	box-shadow: 0 0 0 3px rgba(4, 94, 158, 0.28) !important;
}

.jconfirm .jconfirm-clear {
	display: none !important;
}

@media (max-width: 480px) {
	.jconfirm .jconfirm-holder {
		padding: 24px 12px !important;
	}

	.jconfirm .jconfirm-box .jconfirm-title-c {
		padding-right: 44px !important;
	}

	.jconfirm .jconfirm-box .jconfirm-buttons {
		flex-direction: column !important;
		align-items: stretch !important;
	}

	.jconfirm .jconfirm-box .jconfirm-buttons button,
	.jconfirm .jconfirm-box .jconfirm-buttons button + button {
		width: 100% !important;
		flex: 1 1 100% !important;
	}
}