/**
 * Institute Library page layout. Shared tokens/nav/card/button styles live
 * in tri-sp-student-shell.css (loaded first as a dependency).
 */

.tri-sp-institute-library__title {
	font-family: var(--tri-sp-font-heading);
	color: var(--tri-sp-text);
	font-size: 40px;
	font-weight: 400;
	margin: 0 0 12px;
}

.tri-sp-institute-library__subtitle {
	color: var(--tri-sp-text-muted);
	margin: 0 0 32px;
	max-width: 640px;
}

.tri-sp-institute-library__filters {
	margin-bottom: 24px;
}

.tri-sp-library-filter-form {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 12px;
}

.tri-sp-library-filter-form label {
	display: block;
	font-size: 12px;
	color: var(--tri-sp-text-muted);
	margin-bottom: 6px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.tri-sp-library-filter-form select,
.tri-sp-library-filter-form input[type="search"] {
	width: 100%;
	background: var(--tri-sp-bg);
	border: 1px solid var(--tri-sp-border);
	border-radius: 4px;
	color: var(--tri-sp-text);
	padding: 10px 12px;
	font-family: var(--tri-sp-font-body);
	font-size: 14px;
}

/* Chunk 6.6 — same Elementor Global Kit `input[type="search"]` collision
   fixed on My Notes (see tri-sp-my-notes.css for the full specificity
   analysis); re-declared here at (0,4,1) via the real ancestor classes
   already present around this field. */
.tri-sp-institute-library .tri-sp-card .tri-sp-library-filter-form input[type="search"] {
	background: var(--tri-sp-bg);
	padding: 10px 12px;
	font-size: 14px;
	line-height: normal;
}

.tri-sp-library-filter-form select:focus,
.tri-sp-library-filter-form input:focus {
	border-color: var(--tri-sp-gold);
	outline: none;
}

.tri-sp-library-filter-form > * {
	flex: 1 1 200px;
}

.tri-sp-library-filter-form button {
	flex: 0 0 auto;
}

.tri-sp-library-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 18px;
}

.tri-sp-library-card {
	background: var(--tri-sp-card-bg);
	border: 1px solid var(--tri-sp-border);
	border-radius: var(--tri-sp-card-radius-sm);
	padding: 20px;
	transition: border-color 0.25s ease;
}

.tri-sp-library-card:hover {
	border-color: var(--tri-sp-border-hover);
}

.tri-sp-library-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 10px;
	margin-bottom: 10px;
}

.tri-sp-library-card__type {
	color: var(--tri-sp-gold-strong);
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.tri-sp-library-card__context {
	color: var(--tri-sp-text-muted);
	font-size: 11px;
}

.tri-sp-library-card__title {
	font-family: var(--tri-sp-font-heading);
	color: var(--tri-sp-text);
	font-size: 18px;
	font-weight: 400;
	margin: 0 0 12px;
}

@media (max-width: 768px) {
	.tri-sp-library-filter-form > * {
		flex-basis: 100%;
	}
}