/**
 * Thesi Church Central – frontend widget styles.
 * Scoped to #tcc-root / .tcc-root only. Do not target third-party classes
 * (.elfsight-*, .givewp-*, .donorbox-*, etc.).
 *
 * @package Thesi_Church_Central
 */

#tcc-root *,
.tcc-root * {
	box-sizing: border-box;
}

#tcc-root,
.tcc-root {
	position: fixed;
	inset: 0;
	pointer-events: none;
	z-index: 999999;
	--tcc-primary: #2563eb;
	--tcc-accent: #2563eb;
	--tcc-accent-soft: rgba(37, 99, 235, 0.12);
	--tcc-accent-contrast: #ffffff;
	--tcc-ease-spring: cubic-bezier(0.2, 0.8, 0.2, 1);
	--tcc-duration-view: 220ms;
}

#tcc-root .tcc-launcher-button,
#tcc-root .tcc-backdrop,
#tcc-root .tcc-panel,
#tcc-root .tcc-modal,
.tcc-root .tcc-launcher-button,
.tcc-root .tcc-backdrop,
.tcc-root .tcc-panel,
.tcc-root .tcc-modal {
	pointer-events: auto;
}

#tcc-root .tcc-hidden,
.tcc-root .tcc-hidden {
	display: none !important;
}

/* Backdrop overlay (only shown in modal; style from overlay_style) */
#tcc-root .tcc-backdrop {
	position: fixed;
	inset: 0;
	z-index: 999;
	background: transparent;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity var(--tcc-duration-view) var(--tcc-ease-spring), visibility var(--tcc-duration-view);
}

#tcc-root .tcc-backdrop.tcc-backdrop--visible {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

/* Overlay: dark translucent + blur (Nucleus-style) */
#tcc-root .tcc-backdrop--visible.tcc-backdrop--dark {
	background: rgba(0, 0, 0, var(--tcc-overlay-opacity, 0.4));
}

#tcc-root .tcc-backdrop--visible.tcc-backdrop--blur {
	background: rgba(0, 0, 0, var(--tcc-overlay-opacity, 0.4));
	backdrop-filter: blur(var(--tcc-blur-px, 6px));
	-webkit-backdrop-filter: blur(var(--tcc-blur-px, 6px));
}

/* A) Panel hidden by default (no flash before launcher click) */
#tcc-root #tcc-panel,
#tcc-root .tcc-panel {
	display: none !important;
}

/* B) Panel visible only when open (scoped under #tcc-root; no body class) */
#tcc-root .tcc-panel.tcc-panel--open,
#tcc-root #tcc-panel.tcc-panel--open,
#tcc-root .tcc-root--panel-open #tcc-panel,
#tcc-root .tcc-root--panel-open .tcc-panel,
#tcc-root .tcc-panel.is-open,
#tcc-root #tcc-panel.is-open,
#tcc-root .tcc-panel[aria-hidden="false"],
#tcc-root #tcc-panel[aria-hidden="false"] {
	display: flex !important;
}

#tcc-root .tcc-panel[aria-hidden="true"],
#tcc-root #tcc-panel[aria-hidden="true"] {
	display: none !important;
}

/* Panel: visibility + scale for open/close (no opacity on container so children stay fully visible) */
#tcc-root .tcc-panel {
	transform: scale(0.96);
	visibility: hidden;
	pointer-events: none;
	transition: transform var(--tcc-duration-view) var(--tcc-ease-spring), visibility var(--tcc-duration-view);
}

#tcc-root .tcc-panel.tcc-panel--open {
	transform: scale(1);
	visibility: visible;
	pointer-events: auto;
}

/* Launcher: same dark default as panel buttons; mode text = solo texto */
#tcc-root .tcc-launcher-button {
	position: fixed;
	bottom: 24px;
	right: 24px;
	left: auto;
	background: var(--tcc-primary, #1F1F1F);
	color: var(--tcc-launcher-text-color, #FFFFFF);
	border: 0 !important;
	outline: none !important;
	box-shadow: 0 14px 40px rgba(0, 0, 0, 0.18);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	font-weight: 600;
	line-height: 1;
	overflow: visible;
	transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease, opacity 0.3s ease;
	z-index: 1001;
	opacity: 0;
}

#tcc-root .tcc-launcher-button.tcc-launcher--mounted {
	opacity: 1;
}

#tcc-root .tcc-launcher-button::before,
#tcc-root .tcc-launcher-button::after {
	content: none !important;
}

#tcc-root .tcc-launcher-button:hover {
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
	filter: brightness(0.95);
}

#tcc-root .tcc-launcher-button:focus {
	outline: none !important;
}

#tcc-root .tcc-launcher-button:focus-visible {
	outline: 2px solid var(--tcc-accent-contrast, #fff);
	outline-offset: 2px;
}

/* Icons: one layer, 20px (md) / 22px (lg); smooth swap on open/close */
#tcc-root .tcc-launcher__icons {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	flex-shrink: 0;
}

#tcc-root .tcc-launcher--size-lg .tcc-launcher__icons {
	width: 22px;
	height: 22px;
}

/* When mode=text and closed: hide icons from layout so only text shows; when open, show X */
#tcc-root .tcc-launcher--mode-text:not(.tcc-launcher--open):not(.is-open) .tcc-launcher__icons {
	position: absolute;
	width: 0;
	height: 0;
	opacity: 0;
	pointer-events: none;
	overflow: hidden;
}

#tcc-root .tcc-launcher--open .tcc-launcher__icons,
#tcc-root .is-open .tcc-launcher__icons,
.tcc-root .is-open .tcc-launcher__icons {
	position: relative;
	width: 20px;
	height: 20px;
	opacity: 1;
	pointer-events: auto;
	overflow: visible;
}

#tcc-root .tcc-launcher--open.tcc-launcher--size-lg .tcc-launcher__icons,
#tcc-root .is-open.tcc-launcher--size-lg .tcc-launcher__icons,
.tcc-root .is-open.tcc-launcher--size-lg .tcc-launcher__icons {
	width: 22px;
	height: 22px;
}

#tcc-root .tcc-launcher__icon {
	position: absolute;
	inset: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	transition: opacity 0.22s var(--tcc-ease-spring), transform 0.22s var(--tcc-ease-spring);
}

#tcc-root .tcc-launcher__icon svg {
	width: 100%;
	height: 100%;
	fill: currentColor;
}

#tcc-root .tcc-launcher__icon--closed {
	opacity: 1;
	transform: rotate(0);
}

#tcc-root .tcc-launcher__icon--open {
	opacity: 0;
	transform: rotate(-135deg);
	pointer-events: none;
}

#tcc-root .tcc-launcher--open .tcc-launcher__icon--closed,
#tcc-root .is-open .tcc-launcher__icon--closed,
.tcc-root .is-open .tcc-launcher__icon--closed {
	opacity: 0;
	transform: rotate(135deg);
	pointer-events: none;
	display: none;
}

#tcc-root .tcc-launcher--open .tcc-launcher__icon--open,
#tcc-root .is-open .tcc-launcher__icon--open,
.tcc-root .is-open .tcc-launcher__icon--open {
	opacity: 1;
	transform: rotate(0);
	pointer-events: auto;
	display: inline-flex;
}

/* Text container: flex column center; fit inside circle via padding + line-height + font-size */
#tcc-root .tcc-launcher__text {
	display: flex;
	flex-direction: column;
	gap: 2px;
	align-items: center;
	justify-content: center;
	text-align: center;
	max-width: 100%;
	white-space: normal;
	word-break: break-word;
}

#tcc-root .tcc-launcher__line {
	display: block;
	line-height: 1.05;
	font-weight: 700;
	letter-spacing: 0.02em;
	max-width: 100%;
	overflow-wrap: anywhere;
}

/* Size-dependent font for lines */
#tcc-root .tcc-launcher-button.tcc-launcher--size-md .tcc-launcher__line {
	font-size: 11px;
}
#tcc-root .tcc-launcher-button.tcc-launcher--size-lg .tcc-launcher__line {
	font-size: 12px;
}

/* Circle: enough inner space for 2 lines; no clipping */
#tcc-root .tcc-launcher-button.tcc-launcher--shape-circle {
	overflow: visible;
}

#tcc-root .tcc-launcher--shape-circle .tcc-launcher__text {
	padding: 0 4px;
	max-width: 100%;
	overflow: visible;
}

#tcc-root .tcc-launcher--shape-circle .tcc-launcher__line {
	white-space: normal;
	overflow-wrap: anywhere;
}

/* When open: show X, hide text cleanly (never blank) */
#tcc-root .tcc-launcher--open .tcc-launcher__text,
#tcc-root .is-open .tcc-launcher__text,
.tcc-root .is-open .tcc-launcher__text {
	display: none;
}

/* Pill: single line */
#tcc-root .tcc-launcher--shape-pill .tcc-launcher__text {
	flex-direction: row;
	gap: 6px;
}

#tcc-root .tcc-launcher--shape-pill .tcc-launcher__line {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 100%;
}

#tcc-root .tcc-launcher--shape-circle {
	border-radius: 50%;
	overflow: visible;
}

#tcc-root .tcc-launcher--shape-pill {
	height: 52px;
	padding: 0 20px;
	border-radius: 999px;
}

#tcc-root .tcc-launcher--shape-pill.tcc-launcher--mode-icon {
	width: 52px;
	padding: 0;
}

/* Circle sizing: enough inner space for 2 lines */
#tcc-root .tcc-launcher-button.tcc-launcher--shape-circle.tcc-launcher--size-md {
	width: 60px;
	height: 60px;
	padding: 8px;
}
#tcc-root .tcc-launcher-button.tcc-launcher--shape-circle.tcc-launcher--size-lg {
	width: 72px;
	height: 72px;
	padding: 10px;
}

/* When launcher has text AND circle, make it bigger */
#tcc-root .tcc-launcher-button.tcc-launcher--shape-circle.has-text {
	width: 92px !important;
	height: 92px !important;
	padding: 10px !important;
	border: 0 !important;
	box-shadow: 0 14px 40px rgba(0, 0, 0, 0.18);
}

/* Keep each line as a whole word (prevents Siguie / ntes) */
#tcc-root .tcc-launcher-button.tcc-launcher--shape-circle.has-text .tcc-launcher__line {
	white-space: nowrap !important;
	font-size: 12px !important;
	line-height: 1.05 !important;
}

#tcc-root .tcc-launcher-button.tcc-launcher--shape-circle.has-text.tcc-launcher--size-md .tcc-launcher__line {
	font-size: 11px !important;
}

#tcc-root .tcc-launcher--shape-circle.tcc-launcher--mode-icon_text {
	flex-direction: column;
	gap: 2px;
}

#tcc-root .tcc-launcher--size-lg .tcc-launcher__icon,
#tcc-root .tcc-launcher--size-lg .tcc-launcher__icons { width: 22px; height: 22px; }
#tcc-root .tcc-launcher--size-md.tcc-launcher--shape-pill { height: 52px; }
#tcc-root .tcc-launcher--size-lg.tcc-launcher--shape-pill { height: 58px; }

#tcc-root .tcc-launcher-button:hover {
	transform: scale(1.02);
}

#tcc-root .tcc-launcher--anim-bounce.tcc-launcher--open { animation: tcc-launcher-bounce 0.4s ease-out; }
@keyframes tcc-launcher-bounce {
	0% { transform: scale(1); }
	50% { transform: scale(1.08); }
	100% { transform: scale(1); }
}

#tcc-root .tcc-root--left .tcc-launcher-button {
	right: auto;
	left: 24px;
}

#tcc-root .tcc-root[data-open-behavior="modal"] .tcc-panel {
	left: 50%;
	top: 50%;
	right: auto;
	bottom: auto;
	width: 100%;
	max-width: 420px;
	transform: translate(-50%, -50%) scale(0.98);
}

#tcc-root .tcc-root[data-open-behavior="modal"] .tcc-panel.tcc-panel--open {
	transform: translate(-50%, -50%) scale(1);
}

/* Panel container: Nucleus-style, soft shadow, no border */
#tcc-root .tcc-panel {
	position: fixed;
	bottom: 92px;
	right: 24px;
	left: auto;
	width: 380px;
	max-width: 380px;
	max-height: min(90vh, 800px);
	background: transparent;
	border: 0;
	border-radius: 28px;
	box-shadow: 0 24px 56px rgba(0, 0, 0, 0.14), 0 8px 24px rgba(0, 0, 0, 0.08);
	display: flex;
	flex-direction: column;
	z-index: 1000;
	overflow: hidden;
	color: var(--tcc-panel-text-color, #111);
	transform: scale(0.98);
	transition: transform 180ms ease-out;
}

/* Background on ::before so panel container has no opacity and children stay fully visible */
#tcc-root .tcc-panel::before {
	content: '';
	position: absolute;
	inset: 0;
	background: var(--tcc-panel-bg, #fff);
	border-radius: inherit;
	z-index: 0;
	pointer-events: none;
}

#tcc-root .tcc-panel.tcc-panel--open {
	transform: scale(1);
}

#tcc-root .tcc-panel > .tcc-panel__header,
#tcc-root .tcc-panel > .tcc-panel__body,
#tcc-root .tcc-panel > .tcc-panel__footer {
	position: relative;
	z-index: 1;
}

@media (max-width: 480px) {
	#tcc-root .tcc-panel {
		left: 4vw;
		right: 4vw;
		width: 92vw;
		max-width: 92vw;
		bottom: 88px;
		max-height: 95vh;
	}
}

#tcc-root .tcc-root[data-open-behavior="modal"] .tcc-panel.tcc-panel--open {
	transform: translate(-50%, -50%) scale(1);
}

#tcc-root .tcc-root--left .tcc-panel {
	right: auto;
	left: 24px;
}

/* Panel side (when open_behavior=panel): left or right */
#tcc-root .tcc-panel.tcc-panel--side-right {
	right: 24px;
	left: auto;
}
#tcc-root .tcc-panel.tcc-panel--side-left {
	left: 24px;
	right: auto;
}

/* Panel height mode: tall gives more space for content */
#tcc-root .tcc-panel.tcc-panel--height-tall {
	max-height: min(90vh, 900px);
}
#tcc-root .tcc-panel.tcc-panel--height-tall .tcc-panel__body {
	min-height: 50vh;
}

/* Header: back (left), logo centered, close (right) */
#tcc-root .tcc-panel__header {
	position: relative;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding: 12px 48px 8px;
	flex-shrink: 0;
	min-height: 52px;
	box-sizing: border-box;
}

#tcc-root .tcc-panel__back {
	position: absolute;
	left: 12px;
	top: 12px;
	width: 40px;
	height: 40px;
	border: 0;
	border-radius: 50%;
	background: var(--tcc-circle-bg);
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
	color: var(--tcc-btn-text);
	cursor: pointer;
	font-size: 1.25rem;
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: filter 150ms ease, box-shadow 0.15s ease, color 0.15s ease;
	z-index: 2;
}

#tcc-root .tcc-panel__back:hover {
	filter: brightness(0.92);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

#tcc-root .tcc-panel__back:active {
	filter: brightness(0.88);
	transform: scale(0.98);
	transition-duration: 120ms;
}

#tcc-root .tcc-panel__back--hidden {
	display: none !important;
}

#tcc-root .tcc-panel__back-icon {
	display: block;
	font-weight: 600;
	color: inherit;
}

#tcc-root .tcc-panel__back svg,
#tcc-root .tcc-panel__close svg {
	color: inherit;
	fill: currentColor;
}

#tcc-root .tcc-header {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	padding: 0;
}

#tcc-root .tcc-logo {
	max-width: 120px;
	max-height: 34px;
	width: auto;
	height: auto;
	display: block;
}

#tcc-root .tcc-panel .tcc-logo svg {
	fill: var(--tcc-logo-tint, currentColor);
}

#tcc-root .tcc-subtext {
	font-size: 13px;
	opacity: 0.7;
	text-align: center;
	margin: 0;
	line-height: 1.4;
	color: inherit;
}

#tcc-root .tcc-panel__counter {
	margin: 0;
	font-size: 0.8125rem;
	line-height: 1.35;
	color: var(--tcc-primary, #2563eb);
	font-weight: 500;
	text-align: center;
}

#tcc-root .tcc-panel__close {
	position: absolute;
	top: 12px;
	right: 12px;
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	border: 0;
	border-radius: 50%;
	background: var(--tcc-circle-bg);
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
	color: var(--tcc-btn-text);
	cursor: pointer;
	font-size: 1.35rem;
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: filter 150ms ease, box-shadow 0.15s ease, color 0.15s ease;
	z-index: 2;
}

#tcc-root .tcc-panel__close:hover {
	filter: brightness(0.92);
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

#tcc-root .tcc-panel__close:active {
	filter: brightness(0.88);
	transform: scale(0.98);
	transition-duration: 120ms;
}

#tcc-root .tcc-panel__body {
	padding: 20px 20px 24px;
	overflow-y: auto;
	opacity: 1 !important;
	overflow-x: hidden;
	flex: 1;
	min-height: 0;
	-webkit-overflow-scrolling: touch;
}

/* Legacy panel logo wrapper (kept for any inline usage) */
#tcc-root .tcc-panel__logo {
	text-align: center;
	margin-bottom: 16px;
}

#tcc-root .tcc-panel__logo img {
	display: inline-block;
	height: auto;
	max-width: 100%;
	vertical-align: top;
}

#tcc-root .tcc-panel__actions {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

/* Ver más: pill, centered, opens secondary list screen */
#tcc-root .tcc-panel__show-more {
	display: flex;
	justify-content: center;
	margin-top: 4px;
}

#tcc-root .tcc-show-more-btn {
	align-self: center;
	min-width: 120px;
	padding: 10px 20px;
	border-radius: 999px;
	font-size: 0.875rem;
	background: rgba(0, 0, 0, 0.06);
	color: #333;
}

#tcc-root .tcc-show-more-btn:hover {
	background: rgba(0, 0, 0, 0.1);
}

#tcc-root .tcc-panel__empty {
	padding: 32px 16px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
}

#tcc-root .tcc-panel__empty-icon {
	display: block;
	color: rgba(0, 0, 0, 0.2);
	line-height: 0;
}

#tcc-root .tcc-panel__empty-icon svg {
	width: 48px;
	height: 48px;
}

#tcc-root .tcc-panel__empty-text {
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.5;
	color: #666;
	max-width: 260px;
}

/* Skeleton: soft gray blocks + shimmer */
#tcc-root .tcc-skeleton {
	background: rgba(0, 0, 0, 0.06);
	border-radius: 8px;
	overflow: hidden;
	position: relative;
}

#tcc-root .tcc-skeleton::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.4) 50%, transparent 100%);
	animation: tcc-skeleton-shimmer 1.4s ease-in-out infinite;
	pointer-events: none;
}

@keyframes tcc-skeleton-shimmer {
	0% { transform: translateX(-100%); }
	100% { transform: translateX(100%); }
}

#tcc-root .tcc-skeleton__line {
	height: 12px;
	border-radius: 6px;
	background: rgba(0, 0, 0, 0.08);
	margin-bottom: 10px;
}

#tcc-root .tcc-skeleton__line:last-child {
	margin-bottom: 0;
}

#tcc-root .tcc-skeleton__block {
	height: 80px;
	border-radius: 8px;
	background: rgba(0, 0, 0, 0.08);
	margin-bottom: 12px;
}

#tcc-root .tcc-view__skeleton {
	padding: 16px 0;
}

#tcc-root .tcc-view__skeleton .tcc-skeleton__line { width: 100%; }
#tcc-root .tcc-view__skeleton .tcc-skeleton__line:nth-child(1) { width: 90%; }
#tcc-root .tcc-view__skeleton .tcc-skeleton__line:nth-child(2) { width: 70%; }
#tcc-root .tcc-view__skeleton .tcc-skeleton__line:nth-child(3) { width: 85%; }

#tcc-root .tcc-iframe-skeleton {
	position: absolute;
	inset: 0;
	background: #f5f5f5;
	border-radius: 12px;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: center;
	padding: 20px;
	pointer-events: none;
}

#tcc-root .tcc-iframe-skeleton .tcc-skeleton__block {
	height: 60px;
	margin-bottom: 12px;
}

#tcc-root .tcc-iframe-skeleton .tcc-skeleton__line {
	margin-bottom: 8px;
}

#tcc-root .tcc-view__iframe-wrap {
	position: relative;
	min-height: 200px;
}

#tcc-root .tcc-view__iframe-wrap .tcc-iframe-skeleton.tcc-hidden {
	display: none;
}

/* View transition: slide left when entering detail, slide right when back; easing cubic-bezier(.2,.8,.2,1) */
#tcc-root .tcc-panel__body > .tcc-view-leaving.tcc-view-direction--forward {
	opacity: 0;
	transform: translateX(-24px);
	transition: opacity var(--tcc-duration-view) var(--tcc-ease-spring), transform var(--tcc-duration-view) var(--tcc-ease-spring);
}

#tcc-root .tcc-panel__body > .tcc-view-leaving.tcc-view-direction--back {
	opacity: 0;
	transform: translateX(24px);
	transition: opacity var(--tcc-duration-view) var(--tcc-ease-spring), transform var(--tcc-duration-view) var(--tcc-ease-spring);
}

#tcc-root .tcc-view-transition-wrap.tcc-view-leaving.tcc-view-direction--forward {
	opacity: 0;
	transform: translateX(-24px);
	transition: opacity var(--tcc-duration-view) var(--tcc-ease-spring), transform var(--tcc-duration-view) var(--tcc-ease-spring);
}

#tcc-root .tcc-view-transition-wrap.tcc-view-leaving.tcc-view-direction--back {
	opacity: 0;
	transform: translateX(24px);
	transition: opacity var(--tcc-duration-view) var(--tcc-ease-spring), transform var(--tcc-duration-view) var(--tcc-ease-spring);
}

#tcc-root .tcc-view-transition-wrap.tcc-view-entering.tcc-view-direction--forward {
	opacity: 0;
	transform: translateX(24px);
	transition: opacity var(--tcc-duration-view) var(--tcc-ease-spring), transform var(--tcc-duration-view) var(--tcc-ease-spring);
}

#tcc-root .tcc-view-transition-wrap.tcc-view-entering.tcc-view-direction--back {
	opacity: 0;
	transform: translateX(-24px);
	transition: opacity var(--tcc-duration-view) var(--tcc-ease-spring), transform var(--tcc-duration-view) var(--tcc-ease-spring);
}

#tcc-root .tcc-view-transition-wrap.tcc-view-entered {
	opacity: 1 !important;
	transform: translateX(0);
}

/* Cards: hover lift, slight darken, pressed scale(0.98) */
#tcc-root .tcc-card,
#tcc-root .tcc-action-card {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	text-align: left;
	height: auto;
	min-height: 52px;
	padding: 0;
	overflow: hidden;
	border-radius: 20px;
	border: 0;
	cursor: pointer;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
	transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease;
}

#tcc-root .tcc-card:hover,
#tcc-root .tcc-action-card:hover {
	transform: translateY(-1px);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
	filter: brightness(0.95);
}

#tcc-root .tcc-card:active,
#tcc-root .tcc-action-card:active {
	transform: scale(0.98);
	transition-duration: 120ms;
}

/* Card image: fixed height, cover, rounded */
#tcc-root .tcc-card__img,
#tcc-root .tcc-action-card__img {
	display: block;
	width: 100%;
	height: 120px;
	overflow: hidden;
	background: rgba(0, 0, 0, 0.06);
	flex-shrink: 0;
	position: relative;
	border-radius: 16px;
	margin: 0 0 10px;
}

#tcc-root .tcc-card > .tcc-card__img:first-child,
#tcc-root .tcc-card > .tcc-action-card__img:first-child,
#tcc-root .tcc-action-card > .tcc-card__img:first-child,
#tcc-root .tcc-action-card > .tcc-action-card__img:first-child {
	border-radius: 20px 20px 16px 16px;
}

#tcc-root .tcc-card__img img,
#tcc-root .tcc-action-card__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

#tcc-root .tcc-card__img:first-child,
#tcc-root .tcc-action-card__img:first-child {
	margin-top: 0;
}

#tcc-root .tcc-action-card__label-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	line-height: normal;
}

#tcc-root .tcc-action-card__wa-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	color: inherit;
}

#tcc-root .tcc-action-card__wa-icon svg {
	display: block;
	width: 18px;
	height: 18px;
}

#tcc-root .tcc-card:not(:has(.tcc-card__img)) .tcc-card__title,
#tcc-root .tcc-action-card:not(:has(.tcc-action-card__img)) .tcc-card__title,
#tcc-root .tcc-action-card:not(:has(.tcc-action-card__img)) .tcc-action-card__title {
	padding-top: 14px;
}

#tcc-root .tcc-card__title,
#tcc-root .tcc-action-card__title {
	display: block;
	padding: 0 16px;
	margin: 0;
	font-size: 1.0625rem;
	font-weight: 650;
	line-height: 1.35;
}

#tcc-root .tcc-btn-title {
	font-weight: 600;
}

#tcc-root .tcc-btn-subtitle {
	display: block;
	font-size: 0.8125rem;
	font-weight: 400;
	opacity: 0.85;
	margin-top: 2px;
	padding: 0 16px 14px;
	line-height: 1.3;
}

#tcc-root .tcc-action-card:not(:has(.tcc-btn-subtitle)) .tcc-card__title,
#tcc-root .tcc-action-card:not(:has(.tcc-btn-subtitle)) .tcc-btn-title {
	padding-bottom: 14px;
}

#tcc-root .tcc-btn-subtitle {
	display: block;
	font-size: 12px;
	opacity: 0.8;
	margin-top: 4px;
	line-height: 1.35;
	padding: 0 16px 12px;
	margin-left: 0;
	margin-right: 0;
}

#tcc-root .tcc-card__subtitle {
	display: block;
	padding: 2px 16px 12px;
	margin: 0;
	font-size: 0.8125rem;
	line-height: 1.4;
	opacity: 0.8;
}

#tcc-root .tcc-card__desc,
#tcc-root .tcc-action-card__desc {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	padding: 6px 16px 14px;
	margin: 0;
	font-size: 0.8125rem;
	line-height: 1.45;
	opacity: 0.75;
}

/* Card styles: solid (primary + auto-contrast), soft (tint), outline */
#tcc-root .tcc-card--solid,
#tcc-root .tcc-action-card--solid {
	background: var(--tcc-primary, #2563eb);
	color: var(--tcc-panel-btn-text-color, #fff);
}

#tcc-root .tcc-card--soft,
#tcc-root .tcc-action-card--soft {
	background: rgba(37, 99, 235, 0.12);
	background: color-mix(in srgb, var(--tcc-primary, #2563eb) 12%, transparent);
	color: var(--tcc-primary, #2563eb);
}

#tcc-root .tcc-panel .tcc-card--soft,
#tcc-root .tcc-panel .tcc-action-card--soft {
	color: var(--tcc-primary, #2563eb);
}

#tcc-root .tcc-card--outline,
#tcc-root .tcc-action-card--outline {
	background: transparent;
	border: 1px solid rgba(37, 99, 235, 0.25);
	border: 1px solid color-mix(in srgb, var(--tcc-primary, #2563eb) 22%, transparent);
	color: var(--tcc-primary, #2563eb);
}

#tcc-root .tcc-panel .tcc-card--outline,
#tcc-root .tcc-panel .tcc-action-card--outline {
	color: var(--tcc-primary, #2563eb);
}

/* Featured card: taller, larger image, gradient overlay, soft glow (primary color) */
#tcc-root .tcc-card--featured,
#tcc-root .tcc-action-card--featured {
	min-height: 72px;
	border-radius: 22px;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.04), 0 0 20px var(--tcc-primary-glow, rgba(37, 99, 235, 0.14));
}

#tcc-root .tcc-card--featured:hover,
#tcc-root .tcc-action-card--featured:hover {
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(0, 0, 0, 0.06), 0 0 28px var(--tcc-primary-glow-hover, rgba(37, 99, 235, 0.22));
}

#tcc-root .tcc-card--featured .tcc-card__img,
#tcc-root .tcc-action-card--featured .tcc-action-card__img {
	height: 140px;
	border-radius: 18px;
}

#tcc-root .tcc-card--featured > .tcc-card__img:first-child,
#tcc-root .tcc-card--featured > .tcc-action-card__img:first-child,
#tcc-root .tcc-action-card--featured > .tcc-card__img:first-child,
#tcc-root .tcc-action-card--featured > .tcc-action-card__img:first-child {
	border-radius: 22px 22px 18px 18px;
}

#tcc-root .tcc-card--featured .tcc-card__img::after,
#tcc-root .tcc-action-card--featured .tcc-action-card__img::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: linear-gradient(to bottom, transparent 30%, rgba(0, 0, 0, 0.15) 85%, rgba(0, 0, 0, 0.25) 100%);
	pointer-events: none;
}

#tcc-root .tcc-card--featured .tcc-card__title,
#tcc-root .tcc-action-card--featured .tcc-action-card__title {
	padding: 0 18px;
	font-size: 1.125rem;
}

#tcc-root .tcc-card--featured .tcc-card__desc,
#tcc-root .tcc-action-card--featured .tcc-action-card__desc {
	padding: 6px 18px 18px;
	font-size: 0.875rem;
}

@media (max-width: 480px) {
	#tcc-root .tcc-card__img,
	#tcc-root .tcc-action-card__img {
		height: 96px;
	}
	#tcc-root .tcc-card--featured .tcc-card__img,
	#tcc-root .tcc-action-card--featured .tcc-action-card__img {
		height: 120px;
	}
}

/* Panel buttons: primary use contrast color; others use panel_text_color */
#tcc-root .tcc-panel button,
#tcc-root .tcc-panel .tcc-panel__btn {
	color: var(--tcc-panel-text-color, #ffffff);
}

#tcc-root .tcc-panel .tcc-panel__btn:not(.tcc-panel__btn--secondary):not(.tcc-panel__btn--link) {
	color: var(--tcc-panel-btn-text-color, #ffffff);
}

/* Cards are .tcc-panel__btn but use their own layout (no fixed height/padding) */
#tcc-root .tcc-panel .tcc-card.tcc-panel__btn,
#tcc-root .tcc-panel .tcc-action-card.tcc-panel__btn {
	height: auto;
	min-height: 52px;
	padding: 0;
}

#tcc-root .tcc-panel__btn {
	display: block;
	width: 100%;
	height: 52px;
	padding: 0 24px;
	border: 0;
	border-radius: 999px;
	background: var(--tcc-accent, #1F1F1F);
	font-size: 1rem;
	font-weight: 600;
	text-align: center;
	cursor: pointer;
	transition: filter 160ms ease, transform 120ms ease;
}

#tcc-root .tcc-panel__btn:hover {
	filter: brightness(0.94);
	transform: translateY(-1px);
}

/* Professional dark default: primary buttons and action cards (.tcc-button) */
#tcc-root .tcc-button,
.tcc-root .tcc-button {
	background-color: var(--tcc-accent, #1F1F1F);
	color: var(--tcc-panel-btn-text-color, #FFFFFF);
	border-radius: 14px;
	font-weight: 600;
}

#tcc-root .tcc-button:hover,
.tcc-root .tcc-button:hover {
	/* Slightly darker on hover; brightness works for any primary color */
	filter: brightness(0.88);
}

#tcc-root .tcc-panel__btn:active {
	transform: scale(0.98);
	transition-duration: 120ms;
}

#tcc-root .tcc-panel__btn:focus {
	outline: 2px solid var(--tcc-accent, #2563eb);
	outline-offset: 2px;
}

#tcc-root .tcc-panel__btn--secondary {
	height: 52px;
	background: rgba(0, 0, 0, 0.06);
	color: #222;
	border: 0;
	border-radius: 999px;
	transition: filter 160ms ease, transform 120ms ease;
}

#tcc-root .tcc-panel__btn--secondary:hover {
	background: rgba(0, 0, 0, 0.1);
	filter: brightness(0.97);
	transform: translateY(-1px);
}

#tcc-root .tcc-panel__btn--secondary:active {
	transform: scale(0.98);
	transition-duration: 120ms;
}

#tcc-root .tcc-panel__footer {
	padding: 20px 32px 28px;
	font-size: 0.75rem;
	color: #666;
	text-align: center;
	opacity: 0.75;
	flex-shrink: 0;
}

#tcc-root .tcc-panel .tcc-panel__footer a {
	color: inherit;
	text-decoration: none;
}

#tcc-root .tcc-panel .tcc-panel__footer a:hover {
	text-decoration: underline;
}

/* View (placeholder / success / error) */
#tcc-root .tcc-view {
	margin: 0;
	animation: tcc-view-in 0.25s ease-out;
}

@keyframes tcc-view-in {
	from {
		opacity: 0;
		transform: translateX(8px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

#tcc-root .tcc-view__title {
	margin: 0 0 20px;
	font-size: 1.0625rem;
	font-weight: 600;
	color: #111;
	letter-spacing: -0.01em;
	line-height: 1.35;
}

#tcc-root .tcc-view__text {
	margin: 0 0 24px;
	font-size: 0.9375rem;
	color: #555;
	line-height: 1.55;
}

#tcc-root .tcc-view__text--error {
	color: #dc2626;
}

#tcc-root .tcc-view__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 24px;
}

/* Nucleus-style white card: content hierarchy (panel bg → white card → text) */
#tcc-root .tcc-view__card {
	background: #fff;
	border-radius: 24px;
	padding: 20px;
	box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06);
	margin: 0;
	overflow: hidden;
}

#tcc-root .tcc-view__card .tcc-view__title:first-child {
	margin-top: 0;
}

#tcc-root .tcc-view__card .tcc-view__text:last-child {
	margin-bottom: 0;
}

/* Detail view: content image at top of card, scrolls with text; rounded, full width, margin below */
#tcc-root .tcc-view--detail {
	margin: 0;
	padding-bottom: 16px;
}

#tcc-root .tcc-view__card > .tcc-detail__img:first-child {
	display: block;
	width: calc(100% + 40px);
	max-width: none;
	margin: -20px -20px 16px -20px;
	border-radius: 24px 24px 0 0;
	overflow: hidden;
	background: rgba(0, 0, 0, 0.06);
}

#tcc-root .tcc-view__card > .tcc-detail__img:first-child img {
	width: 100%;
	height: auto;
	max-height: 280px;
	object-fit: cover;
	vertical-align: top;
	display: block;
}

/* Legacy: detail image as sibling of card (no longer used; keep for backward compat) */
#tcc-root .tcc-detail__img {
	display: block;
	width: 100%;
	overflow: hidden;
	border-radius: 20px;
	margin: 0 0 16px;
	background: rgba(0, 0, 0, 0.06);
	flex-shrink: 0;
}

#tcc-root .tcc-detail__img img {
	width: 100%;
	height: auto;
	max-height: 220px;
	object-fit: cover;
	vertical-align: top;
	border-radius: inherit;
}

#tcc-root .tcc-detail__title {
	margin: 0 0 12px;
	font-size: 1.125rem;
	font-weight: 650;
	line-height: 1.35;
	color: #111;
}

#tcc-root .tcc-detail__body {
	margin: 0;
	font-size: 0.9375rem;
	line-height: 1.55;
	color: #555;
}

#tcc-root .tcc-detail__body p {
	margin: 0 0 0.75em;
}

#tcc-root .tcc-detail__body p:last-child {
	margin-bottom: 0;
}

#tcc-root .tcc-detail__body strong {
	font-weight: 650;
}

#tcc-root .tcc-detail__body a {
	color: var(--tcc-accent, #2563eb);
	text-decoration: underline;
}

#tcc-root .tcc-detail__body ul,
#tcc-root .tcc-detail__body ol {
	margin: 0.5em 0 0.75em;
	padding-left: 1.4em;
}

#tcc-root .tcc-detail__cta-wrap {
	flex-shrink: 0;
	padding-top: 16px;
	margin-top: 8px;
	border-top: 1px solid rgba(0, 0, 0, 0.08);
}

#tcc-root .tcc-detail__cta-wrap .tcc-panel__btn {
	width: 100%;
	justify-content: center;
}

#tcc-root .tcc-view--embed-fallback .tcc-view__text {
	margin-bottom: 12px;
}

#tcc-root .tcc-iframe-fallback-link {
	margin: 8px 0 0;
	font-size: 0.875rem;
}

#tcc-root .tcc-panel__btn--link {
	height: auto;
	padding: 8px 0;
	background: transparent;
	border: 0;
	border-radius: 0;
	color: var(--tcc-accent, #2563eb);
	font-weight: 500;
	text-decoration: underline;
}

#tcc-root .tcc-panel__btn--link:hover {
	background: transparent;
	border: 0;
	opacity: 0.85;
	filter: none;
}

#tcc-root .tcc-panel__btn--link:active {
	transform: scale(0.98);
}

#tcc-root .tcc-view--shortcode {
	display: flex;
	flex-direction: column;
	min-height: 0;
}

/* Loading state (spinner + text) */
#tcc-root .tcc-loading {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	padding: 20px 0;
}

#tcc-root .tcc-loading__spinner {
	display: block;
	width: 28px;
	height: 28px;
	border: 2px solid rgba(0, 0, 0, 0.08);
	border-top-color: var(--tcc-accent, #2563eb);
	border-radius: 50%;
	animation: tcc-spin 0.7s linear infinite;
}

@keyframes tcc-spin {
	to { transform: rotate(360deg); }
}

#tcc-root .tcc-loading__text {
	font-size: 0.875rem;
	color: #555;
	margin: 0;
}

#tcc-root .tcc-view__shortcode-loading {
	font-size: 0.875rem;
	color: #6b7280;
	margin-bottom: 12px;
}

#tcc-root .tcc-view__shortcode-loading.tcc-loading,
#tcc-root .tcc-view__embed-loading.tcc-loading {
	margin-bottom: 12px;
}

#tcc-root .tcc-view__shortcode-content {
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	max-height: 360px;
	margin-bottom: 12px;
}

/* Wizard */
#tcc-root .tcc-wizard .tcc-detail-back {
	margin-bottom: 12px;
}

#tcc-root .tcc-wizard__intro {
	margin: 0 0 16px;
	font-size: 0.9375rem;
	line-height: 1.55;
	color: #555;
}

#tcc-root .tcc-wizard__intro p {
	margin: 0 0 0.5em;
}

#tcc-root .tcc-wizard__intro p:last-child {
	margin-bottom: 0;
}

#tcc-root .tcc-wizard__help {
	margin: 0 0 6px;
	font-size: 0.8125rem;
	line-height: 1.4;
	color: #6b7280;
}

#tcc-root .tcc-wizard__progress-text {
	margin: 0 0 8px;
	font-size: 0.8125rem;
	color: #6b7280;
}

#tcc-root .tcc-wizard__progress-bar {
	height: 4px;
	background: #e5e7eb;
	border-radius: 2px;
	overflow: hidden;
	margin-bottom: 20px;
}

#tcc-root .tcc-wizard__progress-fill {
	display: block;
	height: 100%;
	background: var(--tcc-accent, #2563eb);
	border-radius: 2px;
	transition: width 0.35s var(--tcc-ease-spring);
}

/* Step dots: animated progress indicator */
#tcc-root .tcc-wizard__dots {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-bottom: 20px;
}

#tcc-root .tcc-wizard__dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #e5e7eb;
	transition: transform 0.25s var(--tcc-ease-spring), background 0.25s var(--tcc-ease-spring), box-shadow 0.25s var(--tcc-ease-spring);
}

#tcc-root .tcc-wizard__dot--done {
	background: var(--tcc-accent, #2563eb);
	transform: scale(1);
}

#tcc-root .tcc-wizard__dot--current {
	background: var(--tcc-accent, #2563eb);
	transform: scale(1.35);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2);
}

#tcc-root .tcc-wizard__content {
	margin: 0;
}

#tcc-root .tcc-wizard__field {
	margin-bottom: 16px;
}

#tcc-root .tcc-wizard__label {
	display: block;
	margin-bottom: 6px;
	font-size: 0.875rem;
	font-weight: 500;
	color: #374151;
}

#tcc-root .tcc-wizard__input {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	font-size: 0.9375rem;
	box-sizing: border-box;
}

#tcc-root .tcc-wizard__input:focus {
	outline: none;
	border-color: var(--tcc-accent, #2563eb);
	box-shadow: 0 0 0 2px var(--tcc-accent-soft, rgba(37, 99, 235, 0.12));
}

#tcc-root .tcc-wizard__error {
	margin: 6px 0 0;
	font-size: 0.8125rem;
	color: #dc2626;
}

#tcc-root .tcc-wizard__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 24px;
}

#tcc-root .tcc-wizard__actions .tcc-panel__btn {
	flex: 1;
	min-width: 0;
}

#tcc-root .tcc-wizard__actions .tcc-panel__btn--secondary {
	background: rgba(0, 0, 0, 0.06);
	color: #222;
}

#tcc-root .tcc-wizard__confirm {
	margin-bottom: 8px;
	font-size: 0.875rem;
	color: #374151;
}

#tcc-root .tcc-wizard__confirm-row {
	margin: 0 0 8px;
	line-height: 1.4;
}

#tcc-root .tcc-wizard__confirm-row:last-child {
	margin-bottom: 0;
}

/* B) Panel scope: inputs/textarea/select always readable (no transparent, no parent opacity) */
#tcc-root .tcc-panel input,
#tcc-root .tcc-panel textarea,
#tcc-root .tcc-panel select {
	background: #fff !important;
	color: #111 !important;
	-webkit-text-fill-color: #111 !important;
	opacity: 1 !important;
	visibility: visible !important;
}

#tcc-root .tcc-panel input::placeholder,
#tcc-root .tcc-panel textarea::placeholder {
	color: rgba(0, 0, 0, 0.45) !important;
	opacity: 1 !important;
}

#tcc-root .tcc-panel input:-webkit-autofill,
#tcc-root .tcc-panel textarea:-webkit-autofill,
#tcc-root .tcc-panel select:-webkit-autofill {
	-webkit-box-shadow: 0 0 0 1000px #fff inset !important;
	-webkit-text-fill-color: #111 !important;
}

/* C) Continuar / primary / submit button always visible; hover only darkens */
#tcc-root .tcc-panel .tcc-btn-continue,
#tcc-root .tcc-panel button[type="submit"],
#tcc-root .tcc-panel .tcc-primary-btn,
#tcc-root .tcc-panel .tcc-panel__btn:not(.tcc-panel__btn--secondary):not(.tcc-panel__btn--link),
#tcc-root .tcc-panel .tcc-wizard__actions .tcc-panel__btn:not(.tcc-panel__btn--secondary) {
	opacity: 1 !important;
	visibility: visible !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
}

#tcc-root .tcc-panel .tcc-btn-continue:hover,
#tcc-root .tcc-panel button[type="submit"]:hover,
#tcc-root .tcc-panel .tcc-primary-btn:hover,
#tcc-root .tcc-panel .tcc-panel__btn:not(.tcc-panel__btn--secondary):not(.tcc-panel__btn--link):hover,
#tcc-root .tcc-panel .tcc-wizard__actions .tcc-panel__btn:not(.tcc-panel__btn--secondary):hover {
	opacity: 1 !important;
	visibility: visible !important;
	filter: brightness(0.95);
}

/* Success view: checkmark animation + fade */
#tcc-root .tcc-view--success {
	text-align: center;
}

#tcc-root .tcc-success-checkmark-wrap {
	display: flex;
	justify-content: center;
	margin-bottom: 20px;
}

#tcc-root .tcc-success-checkmark {
	width: 56px;
	height: 56px;
	color: var(--tcc-accent, #2563eb);
}

#tcc-root .tcc-success-checkmark__circle {
	stroke-dasharray: 151;
	stroke-dashoffset: 151;
	animation: tcc-checkmark-circle 0.45s var(--tcc-ease-spring) 0.1s forwards;
}

#tcc-root .tcc-success-checkmark__path {
	stroke-dasharray: 50;
	stroke-dashoffset: 50;
	animation: tcc-checkmark-path 0.35s var(--tcc-ease-spring) 0.4s forwards;
}

@keyframes tcc-checkmark-circle {
	to { stroke-dashoffset: 0; }
}

@keyframes tcc-checkmark-path {
	to { stroke-dashoffset: 0; }
}

#tcc-root .tcc-success-title {
	margin-bottom: 8px;
	opacity: 0;
	animation: tcc-fade-in 0.4s var(--tcc-ease-spring) 0.5s forwards;
}

#tcc-root .tcc-success-message {
	opacity: 0;
	animation: tcc-fade-in 0.4s var(--tcc-ease-spring) 0.6s forwards;
}

@keyframes tcc-fade-in {
	to { opacity: 1; }
}

/* Iframe in panel */
#tcc-root .tcc-view--iframe {
	display: flex;
	flex-direction: column;
	gap: 12px;
	min-height: 0;
}

#tcc-root .tcc-view__iframe-wrap {
	flex: 1;
	min-height: 0;
	overflow: auto;
}

#tcc-root .tcc-iframe--panel {
	width: 100%;
	height: 320px;
	min-height: 200px;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
}

/* Modal overlay */
#tcc-root .tcc-modal {
	position: fixed;
	inset: 0;
	z-index: 100002;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	box-sizing: border-box;
}

#tcc-root .tcc-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.4);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}

#tcc-root .tcc-modal {
	opacity: 0;
	transition: opacity 240ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

#tcc-root .tcc-modal.tcc-modal--open {
	opacity: 1;
}

#tcc-root .tcc-modal__box {
	position: relative;
	width: 100%;
	max-width: 420px;
	max-height: 85vh;
	background: #fcfcfc;
	border: 0;
	border-radius: 28px;
	box-shadow: 0 32px 80px rgba(0, 0, 0, 0.12), 0 12px 32px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.04);
	overflow: hidden;
	transform: scale(0.94);
	transition: transform 240ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

#tcc-root .tcc-modal.tcc-modal--open .tcc-modal__box {
	transform: scale(1);
}

#tcc-root .tcc-modal__close {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 36px;
	height: 36px;
	border: 0;
	border-radius: 8px;
	background: #fff;
	color: #374151;
	font-size: 1.5rem;
	line-height: 1;
	cursor: pointer;
	z-index: 2;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}

#tcc-root .tcc-modal__close:hover {
	background: #f3f4f6;
}

#tcc-root .tcc-modal__fallback {
	padding: 24px;
}

#tcc-root .tcc-modal__fallback .tcc-view__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 16px;
}

#tcc-root .tcc-modal__iframe-wrap {
	overflow: auto;
	height: 80vh;
	min-height: 400px;
}

#tcc-root .tcc-iframe--modal {
	display: block;
	width: 100%;
	height: 80vh;
	min-height: 400px;
	border: 0;
}

/* Embed HTML (Donorbox etc.) */
#tcc-root .tcc-view--embed-html {
	display: flex;
	flex-direction: column;
	min-height: 0;
}

#tcc-root .tcc-view__embed-loading {
	font-size: 0.875rem;
	color: #6b7280;
	margin-bottom: 12px;
}

#tcc-root .tcc-view__embed-content {
	flex: 1;
	min-height: 0;
	overflow-y: auto;
	margin-bottom: 12px;
}

#tcc-root .tcc-view__embed-fallback .tcc-view__text {
	margin-bottom: 8px;
}

#tcc-root .tcc-modal__box--embed {
	display: flex;
	flex-direction: column;
	max-height: 85vh;
	overflow: hidden;
}

#tcc-root .tcc-modal__box--embed .tcc-view__embed-content {
	flex: 1;
	overflow-y: auto;
	min-height: 200px;
}