/* TemplateIt Core: block output. Uses the theme's preset colors when available. */

.tit-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.8em 1.35em;
	border: 1px solid var(--wp--preset--color--primary, #214c95);
	border-radius: 6px;
	background: var(--wp--preset--color--primary, #214c95);
	color: #fff !important;
	font-weight: 600;
	font-size: 0.9375rem;
	line-height: 1.2;
	text-decoration: none !important;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}
.tit-button:hover,
.tit-button:focus-visible { background: var(--wp--preset--color--primary-dark, #183a75); border-color: var(--wp--preset--color--primary-dark, #183a75); }
.tit-button--block { display: flex; width: 100%; }
.tit-button--light { background: #fff; border-color: #fff; color: var(--wp--preset--color--ink, #0d2741) !important; }
.tit-button--light:hover { background: #edf2fa; border-color: #edf2fa; }

.tit-muted { color: var(--wp--preset--color--muted, #55637a); }

.tit-placeholder {
	padding: 1rem 1.2rem;
	border: 1px dashed var(--wp--preset--color--line, #e2e7ef);
	border-radius: 8px;
	color: var(--wp--preset--color--muted, #55637a);
	font-size: 0.9rem;
	background: var(--wp--preset--color--surface, #f5f7fa);
}

/* Template details: badges */
.tit-badges { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0; }
.tit-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.3em 0.75em;
	border: 1px solid var(--wp--preset--color--line, #e2e7ef);
	border-radius: 999px;
	background: #fff;
	color: var(--wp--preset--color--body, #27324a);
	font-size: 0.8125rem;
	font-weight: 500;
	text-decoration: none !important;
}
a.tit-badge:hover { border-color: #bfcde6; color: var(--wp--preset--color--primary, #214c95); }
.tit-badge--platform { background: var(--wp--preset--color--tint, #edf2fa); border-color: #d3deef; color: var(--wp--preset--color--primary, #214c95); font-weight: 600; }
.tit-requirements {
	margin-top: 1rem;
	padding: 0.9rem 1.1rem;
	border: 1px solid var(--wp--preset--color--line, #e2e7ef);
	border-left: 3px solid var(--wp--preset--color--accent, #138b81);
	border-radius: 6px;
	background: #fff;
	font-size: 0.9375rem;
}

/* Template details: specification list */
.tit-spec { margin: 0; font-size: 0.9375rem; }
.tit-spec__row {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.65rem 0;
	border-bottom: 1px solid var(--wp--preset--color--line, #e2e7ef);
}
.tit-spec__row:last-child { border-bottom: 0; padding-bottom: 0; }
.tit-spec dt { color: var(--wp--preset--color--muted, #55637a); }
.tit-spec dd { margin: 0; text-align: right; font-weight: 600; color: var(--wp--preset--color--ink, #0d2741); }
.tit-spec dd a { color: inherit; }

/* Video */
.tit-video { margin: 0; }
.tit-video iframe { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; border-radius: 12px; }

/* Download */
.tit-download__eyebrow { margin: 0 0 0.35rem; font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--wp--preset--color--accent, #138b81); }
.tit-download__title { margin: 0 0 0.5rem; font-size: 1.25rem; }
.tit-download__note { margin: 0.75rem 0 0; font-size: 0.8125rem; color: var(--wp--preset--color--muted, #55637a); text-align: center; }
.tit-files { margin-top: 1.1rem; padding-top: 1rem; border-top: 1px solid var(--wp--preset--color--line, #e2e7ef); font-size: 0.9rem; }
.tit-files summary { cursor: pointer; font-weight: 600; color: var(--wp--preset--color--ink, #0d2741); }
.tit-files ul { margin: 0.75rem 0 0; padding-left: 1.1rem; }
.tit-files li { margin-bottom: 0.3rem; }
.tit-files code { font-size: 0.8125rem; }

/* Customization CTA */
.tit-cta {
	padding: 1.75rem;
	border-radius: 12px;
	background:
		radial-gradient(400px 200px at 100% 0%, rgba(33, 76, 149, 0.6), transparent 60%),
		var(--wp--preset--color--night, #0a1d33);
	color: #c3ccdd;
}
.tit-cta__title { margin: 0 0 0.5rem; color: #fff; font-size: 1.25rem; }
.tit-cta p { margin: 0 0 1.1rem; font-size: 0.9375rem; }
.tit-cta p:last-child { margin-bottom: 0; }

/* Cards / grid */
.tit-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1.5rem; }
.tit-card {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: 1.5rem;
	border: 1px solid var(--wp--preset--color--line, #e2e7ef);
	border-radius: 12px;
	background: #fff;
	transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}
.tit-card:hover { border-color: #bfcde6; box-shadow: 0 1px 2px rgba(13, 39, 65, 0.04), 0 4px 16px rgba(13, 39, 65, 0.06); transform: translateY(-2px); }
.tit-card__image { width: 100%; height: auto; border-radius: 8px; margin-bottom: 0.5rem; aspect-ratio: 16 / 9; object-fit: cover; }
.tit-card__platform { align-self: flex-start; padding: 0.2rem 0.6rem; border-radius: 999px; background: var(--wp--preset--color--tint, #edf2fa); color: var(--wp--preset--color--primary, #214c95); font-size: 0.8125rem; font-weight: 600; }
.tit-card__title { margin: 0; font-size: 1.15rem; }
.tit-card__title a { color: var(--wp--preset--color--ink, #0d2741); text-decoration: none; }
.tit-card__title a:hover { color: var(--wp--preset--color--primary, #214c95); }
.tit-card__excerpt { margin: 0; color: var(--wp--preset--color--muted, #55637a); font-size: 0.9375rem; }
.tit-related > h2 { margin: 0 0 1.75rem; }

/* Catalog filters */
.tit-filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 1rem 1.25rem; }
.tit-filters__field { display: flex; flex-direction: column; gap: 0.35rem; font-size: 0.8125rem; font-weight: 600; color: var(--wp--preset--color--ink, #0d2741); }
.tit-filters select {
	min-width: 190px;
	padding: 0.6rem 2.2rem 0.6rem 0.75rem;
	border: 1px solid var(--wp--preset--color--line, #e2e7ef);
	border-radius: 6px;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%2355637A'%3E%3Cpath d='M5.3 7.3a1 1 0 0 1 1.4 0L10 10.6l3.3-3.3a1 1 0 1 1 1.4 1.4l-4 4a1 1 0 0 1-1.4 0l-4-4a1 1 0 0 1 0-1.4Z'/%3E%3C/svg%3E") right 0.6rem center / 1rem no-repeat;
	-webkit-appearance: none;
	appearance: none;
	font: inherit;
	font-weight: 400;
	font-size: 0.9375rem;
	color: var(--wp--preset--color--body, #27324a);
}
.tit-filters select:focus { outline: 2px solid var(--wp--preset--color--primary, #214c95); outline-offset: 1px; }
.tit-filters__reset { padding-bottom: 0.65rem; font-size: 0.875rem; }

/* Forms */
.tit-form { display: flex; flex-direction: column; gap: 1.1rem; }
.tit-form__row { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.1rem; }
.tit-form label { display: flex; flex-direction: column; gap: 0.4rem; font-weight: 600; font-size: 0.875rem; color: var(--wp--preset--color--ink, #0d2741); }
.tit-form label > span[aria-hidden] { display: none; }
.tit-form input,
.tit-form select,
.tit-form textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 0.7rem 0.85rem;
	border: 1px solid var(--wp--preset--color--line, #e2e7ef);
	border-radius: 6px;
	background: #fff;
	font: inherit;
	font-weight: 400;
	font-size: 0.9375rem;
	color: var(--wp--preset--color--body, #27324a);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.tit-form input:focus,
.tit-form select:focus,
.tit-form textarea:focus { outline: none; border-color: var(--wp--preset--color--primary, #214c95); box-shadow: 0 0 0 3px rgba(33, 76, 149, 0.15); }
.tit-form__privacy { margin: 0; font-size: 0.8125rem; color: var(--wp--preset--color--muted, #55637a); }
.tit-form__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; margin: 0.25rem 0 0; }
.tit-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.tit-notice { padding: 1rem 1.2rem; border-radius: 8px; margin-bottom: 1rem; font-size: 0.9375rem; }
.tit-notice--ok { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.tit-notice--error { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }