/* Trigger Row Image — standalone CSS
   Custom properties set inline by PHP:
   --tri-icon-size, --tri-num-size, --tri-title-size, --tri-desc-size,
   --tri-active-color, --tri-active-text, --tri-inactive-color, --tri-inactive-text,
   --tri-item-active-bg, --tri-item-inactive-bg */

.trigger-row-image {
	padding: 0;
}
.trigger-row-image .tri-section-desc {
	font-size:17px; 
	line-height: 1.8;
}
/* Trigger pill row */
.trigger-row-image .tri-row {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	gap: 0.5rem;
	list-style: none;
	margin: 0;
	padding: 0;
}
.trigger-row-image .tri-item {
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	background-color: var(--tri-item-inactive-bg, transparent);
	border: 3px solid color-mix(in srgb, var(--tri-item-active-bg, #dfdeda) 50%, transparent);
	border-bottom: none;
	border-radius: 6px 6px 0 0;
	cursor: pointer;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	gap: 0.8rem;
	padding: 0.75rem 1.75rem 0.65rem 0.75rem;
	-webkit-transition: background-color 0.18s ease;
	transition: background-color 0.18s ease;
}
.trigger-row-image .tri-item:hover {
	background-color: var(--tri-item-active-bg, #dfdeda);
}
.trigger-row-image .tri-item.is-active {
	background-color: var(--tri-item-active-bg, #dfdeda);
	border-color: var(--tri-item-active-bg, #dfdeda);
}
.trigger-row-image .tri-item.is-active .tri-num {
	background-color: var(--tri-item-active-bg, #dfdeda);
	color: var(--tri-active-text, #fff);
}
.trigger-row-image .tri-item.is-active .tri-num.has-icon {
	background-color: var(--tri-inactive-color, #d2d9de);
	-webkit-box-shadow: 0 0 0 2.5px var(--tri-item-active-bg, #dfdeda);
	        box-shadow: 0 0 0 2.5px var(--tri-item-active-bg, #dfdeda);
}

/* Number / icon circle */
.trigger-row-image .tri-num {
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	background-color: var(--tri-inactive-color, #d2d9de);
	border-radius: 50%;
	color: var(--tri-inactive-text, #07142a);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-negative: 0;
	    flex-shrink: 0;
	font-size: var(--tri-num-size, 0.75rem);
	font-weight: 700;
	height: var(--tri-icon-size, 2rem);
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	overflow: hidden;
	-webkit-transition: background-color 0.18s ease, color 0.18s ease, -webkit-box-shadow 0.18s ease;
	transition: background-color 0.18s ease, color 0.18s ease, -webkit-box-shadow 0.18s ease;
	transition: background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
	transition: background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease, -webkit-box-shadow 0.18s ease;
	width: var(--tri-icon-size, 2rem);
}
.trigger-row-image .tri-num img {
	border-radius: 0;
	display: block;
	height: 70%;
	margin: auto;
	-o-object-fit: contain;
	   object-fit: contain;
	width: 70%;
}

/* Trigger label */
.trigger-row-image .tri-item__body {
	min-width: 0;
}
.trigger-row-image .tri-item__title {
	color: #07142a;
	display: block;
	font-size: var(--tri-title-size, 0.975rem);
	font-weight: 700;
	line-height: 1.3;
	white-space: nowrap;
}
.trigger-row-image .tri-item__desc {
	color: #111;
	font-size: var(--tri-desc-size, 0.85rem);
	line-height: 1.4;
	margin: 0;
	opacity: 0.7;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Square icon variant */
.trigger-row-image.has-square .tri-num.has-icon { border-radius: 6px; }
.trigger-row-image.has-square .tri-num.has-icon img { border-radius: 4px; }

/* Stage */
.trigger-row-image .tri-stage {
	border-top: 2px solid color-mix(in srgb, var(--tri-item-active-bg, #dfdeda) 50%, transparent);
	width: 100%;
}

/* Tailwind utility replica */
.trigger-row-image .shadow-inner {
	-webkit-box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.05);
	        box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.05);
}

/* WYSIWYG content */
.trigger-row-image .tri-wysiwyg-content {
	border: 3px solid color-mix(in srgb, var(--tri-item-active-bg, #dfdeda) 50%, transparent);
	border-top: none;
	display: flow-root;
	color: #111;
	font-size: 17px;
	line-height: 1.8;
	padding: 1rem 1.5rem;
}
.trigger-row-image .tri-wysiwyg-content a {
	color: #f56a00;
	text-decoration: underline;
}
.trigger-row-image .tri-wysiwyg-content ul,
.trigger-row-image .tri-wysiwyg-content ol {
	margin: 0.5rem 0;
	padding-left: 1.5rem;
}
.trigger-row-image .tri-wysiwyg-content ul { list-style: disc; }
.trigger-row-image .tri-wysiwyg-content ol { list-style: decimal; }
.trigger-row-image .tri-wysiwyg-content p {
	font-size: 17px;
	line-height: 1.8;
	margin: 0 0 0.75rem;
}
.trigger-row-image .tri-wysiwyg-content p:last-child { margin-bottom: 0; }
.trigger-row-image .tri-wysiwyg-content h3.desc { display: none; }
.trigger-row-image .tri-wysiwyg-content strong,
.trigger-row-image .tri-wysiwyg-content b { font-weight: 700; }
.trigger-row-image .tri-wysiwyg-content img.alignleft {
	float: left;
	margin: 0.5rem 1.5rem 0.5rem 0.5rem;
}
.trigger-row-image .tri-wysiwyg-content img.alignright {
	float: right;
	margin: 0.5rem 0.5rem 0.5rem 1.5rem;
}

/* Lightbox */
.tri-lightbox {
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	background: rgba(0, 0, 0, 0.88);
	bottom: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	z-index: 9999;
}
.tri-lightbox[hidden] { display: none; }
.tri-lightbox__inner {
	max-height: 80vh;
	max-width: 85vw;
	position: relative;
}
.tri-lightbox__img {
	display: block;
	max-height: 80vh;
	max-width: 85vw;
	-o-object-fit: contain;
	   object-fit: contain;
}
.tri-lightbox__close {
	background: rgba(255, 255, 255, 0.15);
	border: none;
	border-radius: 50%;
	color: #fff;
	cursor: pointer;
	font-size: 1.5rem;
	height: 36px;
	line-height: 1;
	position: absolute;
	right: -14px;
	top: -14px;
	width: 36px;
}
.tri-lightbox__close:hover { background: rgba(255, 255, 255, 0.3); }
body.tri-lightbox-open { overflow: hidden; }

/* < 1240px: left-align row, hide desc */
@media (max-width: 1239px) {
	.trigger-row-image .tri-row {
		-webkit-box-pack: start;
		    -ms-flex-pack: start;
		        justify-content: flex-start;
	}
	.trigger-row-image .tri-item__desc { display: none; }
	.trigger-row-image .tri-wysiwyg-content h3.desc { display: block; }
}

/* < 768px: mobile */
@media (max-width: 767px) {
	.trigger-row-image .tri-row { gap: 0.75rem; }
	.trigger-row-image .tri-item {
		gap: 0.4rem;
		padding: 0.5rem 1rem 0.4rem 0.75rem;
	}
	.trigger-row-image .tri-item__desc { display: none; }
	.trigger-row-image .tri-num {
		height: 1.5rem;
		width: 1.5rem;
		font-size: 0.65rem;
	}
	.trigger-row-image .tri-wysiwyg-content p {
		font-size: 17px;
		line-height: 1.8;
	}
}
